broken commit. started improving commenting widget in .js

6 files changed, 477 insertions, 273 deletions

diff --git a/askbot/middleware/view_log.py b/askbot/middleware/view_log.py
index 25e9f37f..3dbbd4a8 100644
--- a/askbot/middleware/view_log.py
+++ b/askbot/middleware/view_log.py
@@ -3,14 +3,13 @@ from django.conf import settings
 from askbot.views.readers import questions as questions_view
 from askbot.views.commands import vote
 from django.views.static import serve
-from askbot.views.writers import delete_comment, question_comments, answer_comments
+from askbot.views.writers import delete_comment, post_comments, retag_question
 from askbot.views.readers import revisions
 
 #todo: the list is getting bigger and bigger - maybe there is a better way to
 #trigger reset of sarch state?
-IGNORED_VIEWS = (serve, vote, delete_comment, 
-                question_comments, answer_comments,
-                revisions)
+IGNORED_VIEWS = (serve, vote, delete_comment, post_comments,
+                retag_question, revisions)
 
 class ViewLog(object):
     """must be modified only in this middlware
diff --git a/askbot/skins/default/media/js/i18n.js b/askbot/skins/default/media/js/i18n.js
index 6f5616b1..22edd5bd 100644
--- a/askbot/skins/default/media/js/i18n.js
+++ b/askbot/skins/default/media/js/i18n.js
@@ -133,6 +133,8 @@ var i18nEn = {
     'title minchars':"please enter at least {0} characters",
     'characters':'characters left',
     'cannot flag message as offensive twice':'cannot flag message as offensive twice ',
+    'edit':'edit',
+    'click to edit this comment':'click to edit this comment',
 };
 
 var i18nFi = {
diff --git a/askbot/skins/default/media/js/post.js b/askbot/skins/default/media/js/post.js
index d21cc7cd..90680c01 100644
--- a/askbot/skins/default/media/js/post.js
+++ b/askbot/skins/default/media/js/post.js
@@ -28,8 +28,8 @@ var getUniqueWords = function(value){
     return $.unique($.trim(value).split(/\s+/));
 };
 
-function appendLoader(containerSelector) {
-    $(containerSelector).append('<img class="ajax-loader" ' +
+function appendLoader(element) {
+    element.append('<img class="ajax-loader" ' +
         'src="' + mediaUrl("media/images/indicator.gif") + '" title="' +
         $.i18n._('loading...') +
         '" alt="' +
@@ -145,6 +145,7 @@ var CPValidator = function(){
     };
 }();
 
+
 var Vote = function(){
     // All actions are related to a question
     var questionId;
@@ -812,254 +813,470 @@ var questionRetagger = function(){
     };
 }();
 
-var questionComments = createComments('question');
-var answerComments = createComments('answer');
-var commentsFactory = {'question' : questionComments, 'answer' : answerComments};
+inherits = function(childCtor, parentCtor) {
+  /** @constructor taken from google closure */
+    function tempCtor() {};
+    tempCtor.prototype = parentCtor.prototype;
+    childCtor.superClass_ = parentCtor.prototype;
+    childCtor.prototype = new tempCtor();
+    childCtor.prototype.constructor = childCtor;
+};
 
-// site comments
-function createComments(type) {
-    var objectType = type;
-    var jDivInit = function(id) {
-        return $("#comments-container-" + objectType + '-' + id);
-    };
+/* wrapper around jQuery object */
+var WrappedElement = function(){
+    this._element = null;
+};
+WrappedElement.prototype.setElement = function(element){
+    this._element = element;
+};
+WrappedElement.prototype.createDom = function(){
+    this._element = $('<div></div>');
+};
+WrappedElement.prototype.getElement = function(){
+    if (this._element === null){
+        this.createDom();
+    }
+    return this._element;
+};
+WrappedElement.prototype.dispose = function(){
+    this._element.remove();
+};
 
-    var appendLoaderImg = function(id) {
-        appendLoader("#comments-container-" + objectType + '-' + id);
-    };
+var EditLink = function(edit_handler){
+    WrappedElement.call(this)
+    this._edit_handler = edit_handler;
+};
+inherits(EditLink, WrappedElement);
+
+EditLink.prototype.createDom = function(){
+    this._element = $('<a></a>');
+    this._element.attr('title', $.i18n._('click to edit this comment'));
+    this._element.css('display', 'none');
+    this._element.html($.i18n._('edit'));
+    setupButtonEventHandlers(this._element, this._edit_handler);
+};
 
-    var canPostComments = function(id) {
-        var jHidden = $("#can-post-comments-" + objectType + '-' + id);
-        return jHidden.val().toLowerCase() == "true";
-    };
+var DeleteIcon = function(title, delete_handler){
+    WrappedElement.call(this);
+    this._title = title;
+    this._delete_handler = delete_handler;
+};
+inherits(DeleteIcon, WrappedElement);
+
+DeleteIcon.prototype.decorate = function(element){
+    this._element = element;
+    var img = mediaUrl("media/images/close-small.png");
+    var imgHover = mediaUrl("media/images/close-small-hover.png");
+    this._element.attr('class', 'delete-icon');
+    this._element.attr('src', img);
+    this._element.attr('title', this._title);
+    setupButtonEventHandlers(this._element, this._delete_handler);
+    this._element.mouseover(function(e){
+        $(this).attr('src', imgHover);
+    });
+    this._element.mouseout(function(e){
+        $(this).attr('src', img);
+    });
+};
 
-    var renderForm = function(id) {
-        var formId = "form-comments-" + objectType + "-" + id;
-        var jDiv = $('#comments-link-' + objectType + "-" + id).parent();
-        $(jDiv).css('background','none');
-        $(jDiv).css('padding-left',0);
-        if (canPostComments(id)) {
-            if (jDiv.find("#" + formId).length === 0) {
-                var form = '<form id="' + formId + '" class="post-comments"><div>';
-                form += '<textarea name="comment" cols="60" rows="5" ' +
-                        'maxlength="' + maxCommentLength + '" onblur="' +
-                        objectType +'Comments.updateTextCounter(this)" ';
-                form += 'onfocus="' + objectType +
-                        'Comments.updateTextCounter(this)" onkeyup="' + objectType +
-                        'Comments.updateTextCounter(this)"></textarea>';
-                form += '<input type="submit" value="' +
-                        $.i18n._('add comment') + '" /><br><span class="text-counter"></span>';
-                form += '<span class="form-error"></span></div></form>';
-
-                jDiv.append(form);
-
-                setupFormValidation("#" + formId,
-                    { comment: { required: true, minlength: 10} }, '',
-                    function() { postComment(id, formId); })
-                ;
-            }
-        }
-        else {
-            var divId = "comments-rep-needed-" + objectType + '-' + id;
-            if (jDiv.find("#" + divId).length === 0) {
-                jDiv.append(
-                        '<p id="' + divId + '" class="comment">' + 
-                        $.i18n._('to comment, need') + ' ' +
-                        repNeededForComments + ' ' + $.i18n._('community karma points') + 
-                        '<a href="' + scriptUrl + $.i18n._('faq/') + '" class="comment-user">' +
-                        $.i18n._('please see') + 'faq</a></span></p>'
-                    );
-            }
-        }
-    };
+DeleteIcon.prototype.createDom = function(){
+    this.decorate($('<img />'));
+};
 
-    var getComments = function(id, jDiv) {
-        //appendLoaderImg(id);
-        $.getJSON(scriptUrl + $.i18n._(objectType + "s/") + id + "/" + $.i18n._("comments/"),
-                function(json) { showComments(id, json); });
-    };
 
-    var showComments = function(id, json) {
-        var jDiv = jDivInit(id);
+//constructor for the form
+var EditCommentForm = function(){
+    WrappedElement.call(this);
+    this._comment = null;
+    this._text = '';
+    this._element = null;
+};
+inherits(EditCommentForm, WrappedElement);
 
-        //jDiv = jDiv.find("div.comments");   // this div should contain any fetched comments..
-        //jDiv.find("div[id^='comment-" + objectType + "-'" + "]").remove();  // clean previous calls..
-        jDiv.children().remove();
-        removeLoader();
-        if (json && json.length > 0) {
-            for (var i = 0; i < json.length; i++){
-                renderComment(jDiv, json[i]);
-            }
-            jDiv.children().show();
-        }
-        if (enableMathJax === true){
-            MathJax.Hub.Queue(['Typeset', MathJax.Hub]);
-        }
-    };
+EditCommentForm.prototype.setComment = function(comment, text){
+    self._comment = comment;
+    self._text = text || '';
+};
 
-    var renderDeleteCommentIcon = function(post_id, delete_url){
-        if (canPostComments(post_id)){
-            var html = '';
-            var img = mediaUrl("media/images/close-small.png");
-            var imgHover = mediaUrl("media/images/close-small-hover.png");
-            html += '<img class="delete-icon" onclick="' + objectType + 
-                    'Comments.deleteComment($(this), ' + post_id + ', \'' + 
-                    delete_url + '\')" src="' + img;
-            html += '" onmouseover="$(this).attr(\'src\', \'' + imgHover + 
-                    '\')" onmouseout="$(this).attr(\'src\', \'' + img;
-            html += '\')" title="' + $.i18n._('delete this comment') + '" />';
-            return html;
+EditCommentForm.prototype.makeCounterUpdater = function(){
+    //returns event handler
+    var counter = this._text_counter;
+    var handler = function(){
+        var text_area = $(this);
+        var length = text_area.val() ? textarea.val().length : 0;
+        var length1 = maxCommentLength - 100;
+        if (length1 < 0){
+            length1 = Math.round(0.7*maxCommentLength);
         }
-        else{
-            return '';
+        var length2 = maxCommentLength - 30;
+        if (length2 < 0){
+            length2 = Math.round(0.9*maxCommentLength);
         }
+        var color = length > length2 ? "#f00" : length > length1 ? "#f60" : "#999";
+        counter.html($.i18n._('can write') + ' ' + 
+                    (maxCommentLength - length) + ' ' +
+                    $.i18n._('characters')).css("color", color);
     };
+    return handler;
+};
 
-    // {"Id":6,"PostId":38589,"CreationDate":"an hour ago","Text":"hello there!","UserDisplayName":"Jarrod Dixon","UserUrl":"/users/3/jarrod-dixon","DeleteUrl":null}
-    var renderComment = function(jDiv, json) {
-        var html = '<div id="comment-' + json.id + '" class="comment" style="display:none">' + json.text;
-        html += json.user_url ? ' - <a href="' + json.user_url + '"' : '<span';
-        html += ' class="comment-user">' + json.user_display_name + (json.user_url ? '</a>' : '</span>');
-        html += ' (' + json.comment_age + ')';
+EditCommentForm.prototype.createDom = function(){
+    this._element = $('<form></form>');
+    this._element.attr('class', 'post-comments');
+
+    var div = $('<div></div>');
+    this._textarea = $('<textarea></textarea>');
+
+
+    this._element.append(div);
+    div.append(this._textarea);
+    this._submit_btn = $('<input type="submit" />');
+    div.append(this._submit_btn);
+    this._cancel_btn = $('<button></button>');
+    this._cancel_btn.html($.i18n._('cancel'));
+    div.append(this._cancel_btn);
+    div.append('<br />');
+    this._text_counter = $('<span></span>').attr('class', 'text-counter');
+    div.append(this._text_counter);
+    div.append('<span class="form-error"></span>');
+
+    var update_counter = this.makeCounterUpdater();
+    this._textarea.attr('name', 'comment')
+            .attr('cols', 60)
+            .attr('rows', 5)
+            .attr('maxlength', maxCommentLength)
+            .blur(update_counter)
+            .focus(update_counter)
+            .keyup(update_counter)
+
+    this.setId(post_id);
+    setupFormValidation(
+        "#" + this.getId(),
+        { comment: { required: true, minlength: 10} },
+        '',
+        this.save
+    );
+};
 
-        if (json.delete_url){
-            html += renderDeleteCommentIcon(json.object_id, json.delete_url);
-        }
+EditCommentForm.prototype.activate = function(){
+    this._text_area.focus();
+};
+
+EditCommentForm.prototype.enableButtons = function(){
+    this._submit_btn.attr('disabled', '');
+    this._cancel_btn.attr('disabled', '');
+};
+
+EditCommentForm.prototype.disableButtons = function(){
+    this._submit_btn.attr('disabled', 'disabled');
+    this._cancel_btn.attr('disabled', 'disabled');
+};
+
+EditCommentForm.prototype.set_submit_button_text = function(text){
+    this._submit_btn.val(text);
+};
+
+EditCommentForm.prototype.set_text = function(text){
+    this._textarea.html(text);
+};
+
+EditCommentForm.prototype.userConfirmAbandon = function(){
+    return confirm('want to abandon this comment?');
+};
+
+EditCommentForm.prototype.setId = function(post_id){
+    this._parent_post_id = post_id;
+    var id = 'form-comments-' + this._post_type + '-' + post_id;
+    this._element.attr('id', id);
+};
 
-        if (json.delete_url) {
+EditCommentForm.prototype.getCBoxElement = function(){
+    var post_type = this._parent_post_type;
+    var post_id = this._parent_post_id;
+    return $('#comments-link-' + post_type + "-" + post_id).parent();
+}
+
+EditCommentForm.prototype.getId = function(){
+    return this._element.attr('id');
+}
+
+EditCommentForm.prototype.save = function(){
+
+    var post_data = {comment: this._textarea.val()};
+
+    if (this._type == 'edit'){
+        var post_url = askbot['urls']['editComment'];
+        post_data['comment_id'] = this._comment_id;
+    }
+    else {
+        var post_url = askbot['urls']['addComment'];
+        post_data['parent_type'] = this._parent_post_type;
+        post_data['parent_id'] = this._parent_post_id;
+    }
+
+    this.disableButtons();
+
+    $.ajax({
+        type: "POST",
+        url: post_url,
+        dataType: "json",
+        data: post_data,
+        success: function(json) {
+            if (this._type == 'add'){
+                var comment = new Comment(json);
+                comment.setEditForm(this)
+                this.getCBoxElement.append(comment.getElement());
+            }
+            else {
+                this._comment.setContent(json);
+                this._comment.getElement.show();
+            }
+            this.detach();
+        },
+        error: function(xhr, textStatus, errorThrown) {
+            showMessage(this._element, xhr.responseText);
+            this.enableButtons();
         }
+    });
+};
+
+//a single instance to reuse
+var editCommentForm = new EditCommentForm();
+
+var Comment = function(data){
+    WrappedElement.call(this);
+    this._data = data;
+    this._blank = true;
+    this._delete_prompt = $.i18n._('delete this comment');
+    if (data && data['is_deletable']){
+        this._deletable = data['is_deletable'];
+        this._editable = data['is_deletable'];
+    }
+    else {
+        this._deletable = false;
+        this._editable = false;
+    }
+};
+inherits(Comment, WrappedElement);
+
+Comment.prototype.decorate = function(element){
+    this._element = element;
+    var parent_type = element.parent().attr('id').split('-')[2];
+    var comment_id = element.attr('id').replace('comment-','');
+    this._data = {id: comment_id};
+    var delete_img = element.find('img.delete-icon');
+    if (delete_img.length > 0){
+        this._deletable = true;
+        this._editable = true;
+
+        var del = new DeleteIcon(this.deletePrompt, this.getDeleteHandler());
+        del.decorate(delete_img);
+
+        var edit_link = new EditLink(this.getEditHandler());
+        this._element.append(edit_link.getElement());
+        this._element.mouseover(function(){edit_link.getElement().show()});
+        this._element.mouseout(function(){edit_link.getElement().hide()});
+    }
+};
 
-        html += '</div>';
+Comment.prototype.setContent = function(data){
+    this._data = data;
+    this._element.html('');
+    this._element.attr('class', 'comment').css('display:none');
+    this._element.attr('id', 'comment-' + this._data['id']);
+
+    this._element.append(data['text']);
+    this._element.append(' - ');
+
+    this._user_link = $('<a></a>').attr('class', 'comment-user');
+    this._user_link.attr('href', this._data['user_url']);
+    this._user_link.html(this._data['user_display_name']);
+    this._element.append(this._user_link);
+
+    this._element.append(' (');
+    this._comment_age = $('<span></span>');
+    this._comment_age.html(this._data['comment_age']);
+    this._element.append(this._comment_age);
+    this._element.append(')');
+
+    if (this._deletable){
+        this._delete_icon = new DeleteIcon(this._delete_prompt, this.getDeleteHandler);
+        this._element.append(this._delete_icon.getElement());
+    }
+    if (this._editable){
+        this._edit_link = new EditLink(this.getEditHandler());
+        this._element.append(this._edit_link.getElement());
+        this._element.mouseover(function(){this._edit_link.getElement().show()});
+        this._element.mouseout(function(){this._edit_link.getElement().hide()});
+    }
+    this._blank = false;
+};
 
-        jDiv.append(html);
-    };
+Comment.prototype.dispose = function(){
+    this._user_link.remove();
+    this._comment_age.remove();
+    if (this._delete_icon){
+        this._delete_icon.dispose();
+    }
+    if (this._edit_link){
+        this._edit_link.dispose();
+    }
+    this._data = null;
+    Comment.superClass_.dispose.call(this);
+};
 
-    var postComment = function(id, formId) {
-        //appendLoaderImg(id);
+Comment.prototype.getElement = function(){
+    Comment.superClass_.getElement.call(this);
+    if (this._blank && this._data){
+        this.setContent(this._data);
+        if (enableMathJax === true){
+            MathJax.Hub.Queue(['Typeset', MathJax.Hub]);
+        }
+    }
+    return this._element;
+};
 
-        var formSelector = "#" + formId;
-        var textarea = $(formSelector + " textarea");
+Comment.prototype.loadText = function(on_load_handler){
+    $.ajax({
+        type: "GET",
+        url: askbot['urls']['commentGetText'],
+        data: {id: this._data['id']},
+        success: on_load_handler
+    });
+};
 
-        $.ajax({
-            type: "POST",
-            url: scriptUrl + $.i18n._(objectType + "s/") + id + "/" + $.i18n._("comments/"),
-            dataType: "json",
-            data: { comment: textarea.val() },
-            success: function(json) {
-                showComments(id, json);
-                textarea.val("");
-                commentsFactory[objectType].updateTextCounter(textarea);
-                enableSubmitButton(formSelector);
-            },
-            error: function(xhr, textStatus, errorThrown) {
-                removeLoader();
-                showMessage($(formSelector), xhr.responseText);
-                enableSubmitButton(formSelector);
+Comment.prototype.getEditHandler = function(){
+    var comment_id = this._data['id'];
+    var parent_post_id = this._data['post_id'];
+    var comment = this;
+    return function(){
+        comment.loadText(
+            function(text){
+                if (editCommentForm.isFree()){
+                    editCommentForm.setComment(comment, text);
+                    comment.getElement().after(editCommentForm.getElement());
+                    comment.getElement().hide();
+                    editCommentForm.activate();
+                }
+                else {
+                    editCommentForm.getElement().focus();
+                }
             }
-        });
+        );
     };
+};
 
-    // public methods..
-    return {
-
-        init: function() {
-            // Setup "show comments" clicks..
-            $("a[id^='comments-link-" + objectType + "-" + "']").unbind("click").click(function() { 
-                commentsFactory[objectType].show($(this).attr("id").substr(("comments-link-" + objectType + "-").length)); 
-                });
-
-            var cBox = $("[id^='comments-container-" + objectType + "']");
-            cBox.each( function(i){
-                var post_id = $(this).attr('id').replace('comments-container-' + objectType + '-', '');
-
-                $(this).children().each(
-                    function(i){
-                        var comment_id = $(this).attr('id').replace('comment-','');
-                        var delete_url = scriptUrl + $.i18n._(objectType + 's/') + post_id + '/' +
-                                        $.i18n._('comments/') + comment_id + '/' + $.i18n._('delete/');
-                        var html = $(this).html();
-                        var CommentsClass;
-                        if (objectType == 'question'){
-                            CommentsClass = questionComments;
-                        }
-                        else if (objectType == 'answer') {
-                            CommentsClass = answerComments;
-                        }
-                        var delete_icon = $(this).find('img.delete-icon');
-                        delete_icon.click(function(){CommentsClass.deleteComment($(this),comment_id,delete_url);});
-                        delete_icon.unbind('mouseover').bind('mouseover',
-                            function(){
-                                $(this).attr('src',mediaUrl('media/images/close-small-hover.png'));
-                            }
-                        );
-                        delete_icon.unbind('mouseout').bind('mouseout',
-                            function(){
-                                $(this).attr('src',mediaUrl('media/images/close-small.png'));
-                            }
-                        );
-                    }
-                );
+Comment.prototype.getDeleteHandler = function(){
+    var comment = this;
+    return function(){
+        if (confirm($.i18n._('confirm delete comment'))){
+            $(this).hide();
+            $.ajax({
+                type: 'POST',
+                url: askbot['urls']['deleteComment'], 
+                data: { comment_id: comment._data['id'] }, 
+                success: function(json, textStatus, xhr) {
+                    comment.dispose();
+                }, 
+                error: function(xhr, textStatus, exception) {
+                    $(this).show();
+                    showMessage(me._delete_icon, xhr.responseText);
+                },
+                dataType: "json"
             });
-        },
+        }
+    };
+};
 
-        show: function(id) {
-            var jDiv = jDivInit(id);
-            getComments(id, jDiv);
-            renderForm(id);
-            jDiv.show();
+var PostCommentsWidget = function(){
+    WrappedElement.call(this);
+    this._denied = false;
+};
+inherits(PostCommentsWidget, WrappedElement);
 
-            var link = $('#comments-link-' + objectType + '-' + id);
-            if (canPostComments(id)) { link.parent().find("textarea").get(0).focus(); }
-            link.remove();
-        },
+var PostCommentsWidget.prototype.decorate = function(element){
+    var can_post_input = element.find('[id^="can-post-comments"]') + objectType + '-' + id);
+    this._user_can_post = (can_post_input.val().toLowerCase() == 'true');
+    this._activate_button = element.find('a[id^="comments-link"]');
 
-        hide: function(id) {
-            var jDiv = jDivInit(id);
-            var len = jDiv.children("div.comments").children().length;
-            var anchorText = len === 0 ? $.i18n._('add a comment') : $.i18n._('comments') + ' (<b>' + len + "</b>)";
+    if (this.user_can_post == false){
+        setupButtonEventHandlers(this._activate_button, this.getDenyHandler());
+    }
 
-            jDiv.hide();
-            jDiv.siblings("a").unbind("click").click(function() { commentsFactory[objectType].show(id); }).html(anchorText);
-            jDiv.children("div.comments").children().hide();
-        },
+    this._element = element;
+    var id = element.attr('id');
+    this._post_type = id.split('-')[2];
+    setupButtonEventHandlers(this._activate_button, this.getActivateHandler());
+
+    this._cbox = element.find('[id^="comments-container"]');
+    var comments = new Array();
+    this._cbox.each(function(index, element)){
+        var comment = new Comment();
+        comments.push(comment)
+        comment.decorate(element);
+    });
+    this._comments = comments;
+};
 
-        deleteComment: function(jImg, id, deleteUrl) {
-            if (confirm($.i18n._('confirm delete comment'))) {
-                jImg.hide();
-                $.ajax({
-                    type: 'POST',
-                    url: deleteUrl, 
-                    data: { dataNeeded: "forIIS7" }, 
-                    success: function(json, textStatus, xhr) {
-                        var par = jImg.parent();
-                        par.remove();
-                    }, 
-                    error: function(xhr, textStatus, exception) {
-                        jImg.show();
-                        showMessage(jImg, xhr.responseText);
-                    },
-                    dataType: "json"
-                });
-            }
-        },
+var PostCommentsWidget.prototype.getActivateHandler = function(){
+    var me = this;
+    return function() {
+        if (editCommentForm.isFree()){
+            me.reloadAllComments(function(json){
+                me.reRenderComments(json);
+                var comment = new Comment();
+                var form = editCommentForm.setComment(comment);
+                me._cbox.append(form.getElement());
+                me._activate_button.hide();
+                editCommentForm.getElement().focus();
+            });
+        }
+        else {
+            editCommentForm.getElement().focus();
+        }
+    };
+};
 
-        updateTextCounter: function(textarea) {
-            var length = textarea.value ? textarea.value.length : 0;
-            var length1 = maxCommentLength - 100;
-            if (length1 < 0){
-                length1 = Math.round(0.7*maxCommentLength);
-            }
-            var length2 = maxCommentLength - 30;
-            if (length2 < 0){
-                length2 = Math.round(0.9*maxCommentLength);
-            }
-            var color = length > length2 ? "#f00" : length > length1 ? "#f60" : "#999";
-            var jSpan = $(textarea).siblings("span.text-counter");
-            jSpan.html($.i18n._('can write') + ' ' + 
-                        (maxCommentLength - length) + ' ' +
-                        $.i18n._('characters')).css("color", color);
+var PostCommentsWidget.prototype.getDenyHandler = function(){
+    var me = this;
+    return function(){
+        if (me._denied == false){
+            var denial = $('<p id="denial" class="comment"></p>');
+            denial.html($.i18n._('to comment, need') + ' ' +
+                repNeededForComments + ' ' + $.i18n._('community karma points') + 
+                '<a href="' + scriptUrl + $.i18n._('faq/') + '" class="comment-user">' +
+                $.i18n._('please see') + 'faq</a></span>'
+            );
+            me._cbox.append(denial);
         }
+        me._denied = true;
     };
-}
+};
+
+
+var PostCommentsWidget.prototype.reloadAllComments = function(callback){
+    var post_data = {post_id: this._post_id, post_type: this._post_type};
+    $.ajax({
+        type: "GET",
+        url: askbot['urls']['post_comments'],
+        data: post_data,
+        success: callback,
+        dataType: "json"
+    });
+};
+
+var PostCommentsWidget.prototype.reRenderComments = function(json){
+    $.each(this._comments, function(i, item){
+        item.dispose();
+    });
+    this._comments = new Array();
+    $.each(json, function(i, item){
+        var comment = new Comment(item);
+        this._comments.push(comment);
+        this._element.prepend(comment.getElement());
+    });
+};
+
 
 var socialSharing = function(){
 
@@ -1104,9 +1321,11 @@ var socialSharing = function(){
 }(); 
 
 $(document).ready(function() {
-    questionComments.init();
+    $('id^=comments-container-').each(function(index, element){
+        var comments = new PostCommentsWidget();
+        comments.decorate(element);
+    });
     questionRetagger.init();
-    answerComments.init();
     socialSharing.init();
 });
 
diff --git a/askbot/skins/default/templates/base.html b/askbot/skins/default/templates/base.html
index d9ca2dea..24fbfdcd 100644
--- a/askbot/skins/default/templates/base.html
+++ b/askbot/skins/default/templates/base.html
@@ -42,6 +42,18 @@
             var scriptUrl = '/{{settings.ASKBOT_URL}}'
             var askbotSkin = '{{settings.ASKBOT_DEFAULT_SKIN}}';
             var enableMathJax = {% if settings.ENABLE_MATHJAX %}true{% else %}false{% endif %};
+            var askbot = askbot || {};
+            askbot['data'] = askbot['data'] || {};
+            {% if request.user.is_authenticated() %}
+                askbot['data']['userIsAuthenticated'] = true;
+                askbot['data']['userId'] = {{request.user.id}};
+                askbot['data']['userIsAdminOrMod'] = {% if 
+                                                        request.user.is_administrator()
+                                                        or request.user.is_moderator()
+                                                    %}true{% else %}false{% endif %};
+            {% else %}
+                askbot['data']['userIsAuthenticated'] = false;
+            {% endif %}
         </script>
         <script 
             type="text/javascript"
diff --git a/askbot/urls.py b/askbot/urls.py
index 321010d1..3decdfdb 100644
--- a/askbot/urls.py
+++ b/askbot/urls.py
@@ -45,11 +45,6 @@ urlpatterns = patterns('',
     url(r'^%s$' % _('privacy/'), app.meta.privacy, name='privacy'),
     url(r'^%s$' % _('logout/'), app.meta.logout, name='logout'),
     url(
-        r'^%s(?P<id>\d+)/%s$' % (_('answers/'), _('comments/')), 
-        app.writers.answer_comments, 
-        name='answer_comments'
-    ),
-    url(
         r'^%s(?P<id>\d+)/%s$' % (_('answers/'), _('edit/')), 
         app.writers.edit_answer, 
         name='edit_answer'
@@ -107,9 +102,9 @@ urlpatterns = patterns('',
         name='question_revisions'
     ),
     url(
-        r'^%s(?P<id>\d+)/%s$' % (_('questions/'), _('comments/')), 
-        app.writers.question_comments, 
-        name='question_comments'
+        r'^post_comments/$', 
+        app.writers.post_comments, 
+        name='post_comments'
     ),
     url(
         r'^%s$' % _('command/'), 
@@ -117,18 +112,14 @@ urlpatterns = patterns('',
         name='call_ajax'
     ),
     url(
-        r'^%s(?P<object_id>\d+)/%s(?P<comment_id>\d+)/%s$'\
-            % (_('questions/'), _('comments/'),_('delete/')), 
+        r'^comment/delete/$',
         app.writers.delete_comment, 
-        kwargs={'commented_object_type':'question'}, 
-        name='delete_question_comment'
+        name='delete_comment'
     ),
     url(
-        r'^%s(?P<object_id>\d+)/%s(?P<comment_id>\d+)/%s$'\
-        % (_('answers/'), _('comments/'),_('delete/')), 
-        app.writers.delete_comment, 
-        kwargs={'commented_object_type':'answer'}, 
-        name='delete_answer_comment'
+        r'^comment/get_text/$',
+        app.commands.get_comment_text, 
+        name='get_comment_text'
     ),
     #place general question item in the end of other operations
     url(
diff --git a/askbot/views/writers.py b/askbot/views/writers.py
index aca11b63..42ac4ca3 100644
--- a/askbot/views/writers.py
+++ b/askbot/views/writers.py
@@ -404,29 +404,21 @@ def __generate_comments_json(obj, user):#non-view generates json data for the po
                 user.assert_can_delete_comment(comment)
                 #/posts/392845/comments/219852/delete
                 #todo translate this url
-                if isinstance(comment.content_object, models.Answer):
-                    delete_comment_view = 'delete_answer_comment'
-                elif isinstance(comment.content_object, models.Question):
-                    delete_comment_view = 'delete_question_comment'
-                delete_url = reverse(
-                                delete_comment_view,
-                                kwargs = {
-                                        'object_id': obj.id, 
-                                        'comment_id': comment.id
-                                    }
-                            )
+                is_deletable = True
             except exceptions.PermissionDenied:
-                delete_url = ''
+                is_deletable = False
         else:
-            delete_url = ''
+            is_deletable = False
 
+        comment_owner = comment.get_owner()
         json_comments.append({'id' : comment.id,
-            'object_id' : obj.id,
-            'comment_age' : diff_date(comment.added_at),
-            'text' : comment.html,
-            'user_display_name' : comment.get_owner().username,
-            'user_url' : comment.get_owner().get_profile_url(),
-            'delete_url' : delete_url
+            'object_id': obj.id,
+            'comment_age': diff_date(comment.added_at),
+            'text': comment.html,
+            'user_display_name': comment_owner.username,
+            'user_url': comment_owner.get_profile_url(),
+            'user_id': comment_owner.id,
+            'is_deletable': is_deletable,
         })
 
     data = simplejson.dumps(json_comments)
@@ -470,20 +462,9 @@ def __comments(request, obj):#non-view generic ajax handler to load comments to
     else:
         raise Http404
 
-def delete_comment(
-                request, 
-                object_id='', 
-                comment_id='', 
-                commented_object_type=None):
+def delete_comment(request, object_id='', comment_id=''):
     """ajax handler to delete comment
     """
-
-    commented_object = None
-    if commented_object_type == 'question':
-        commented_object = models.Question
-    elif commented_object_type == 'answer':
-        commented_object = models.Answer
-
     try:
         if request.user.is_anonymous():
             msg = _('Sorry, you appear to be logged out and '
@@ -496,7 +477,7 @@ def delete_comment(
 
             request.user.assert_can_delete_comment(comment)
 
-            obj = get_object_or_404(commented_object, id=object_id)
+            obj = comment.content_object
             #todo: are the removed comments actually deleted?
             obj.comments.remove(comment)
             #attn: recalc denormalized field