@jsonify

        comm = ChangesetCommentsModel().create(

            text=request.POST.get('text'),

            repo_id=c.rhodecode_db_repo.repo_id,

            user_id=c.rhodecode_user.user_id,

            revision=revision,

            f_path=request.POST.get('f_path'),

            line_no=request.POST.get('line')

        )

        data = {

           'target_id': h.safeid(h.safe_unicode(request.POST.get('f_path'))),

        }

        if comm:

            c.co = comm

            data.update(comm.get_dict())

            data.update({'rendered_text': render('changeset/changeset_comment_block.html')})

        return data

            .filter(ChangesetComment.f_path != None)\

            .order_by(ChangesetComment.comment_id.asc())\

            .all()

	padding:2px 2px 0px 0px;

.comment-inline-form .overlay{

	display: none;

}

.comment-inline-form .overlay.submitting{

	display:block;

    background: none repeat scroll 0 0 white;

    font-size: 16px;

    opacity: 0.5;

    position: absolute;

    text-align: center;

    vertical-align: top;

}

.comment-inline-form .overlay.submitting .overlay-text{

	width:100%;

	margin-top:5%;

}

.inline-comments .add-comment {

	padding: 2px 4px 8px 5px;

}

	margin:2px 0px 8px 5px !important

var ajaxPOST = function(url,postData,success) {

	var toQueryString = function(o) {

	    if(typeof o !== 'object') {

	        return false;

	    }

	    var _p, _qs = [];

	    for(_p in o) {

	        _qs.push(encodeURIComponent(_p) + '=' + encodeURIComponent(o[_p]));

	    }

	    return _qs.join('&');

	};

    var sUrl = url;

    var callback = {

        success: success,

        failure: function (o) {

            alert("error");

        },

    };

    var postData = toQueryString(postData);

    var request = YAHOO.util.Connect.asyncRequest('POST', sUrl, callback, postData);

    return request;

};

var tableTr = function(cls,body){

	var tr = document.createElement('tr');

	YUD.addClass(tr, cls);

	var cont = new YAHOO.util.Element(body);

	var comment_id = fromHTML(body).children[0].id.split('comment-')[1];

	tr.id = 'comment-tr-{0}'.format(comment_id);

	tr.innerHTML = '<td class="lineno-inline new-inline"></td>'+

    				 '<td class="lineno-inline old-inline"></td>'+ 

                     '<td>{0}</td>'.format(body);

	return tr;

		if(YUD.hasClass(newtr.nextElementSibling,'inline-comments-button')){

			YUD.setStyle(newtr.nextElementSibling,'display','');

		}

/**

 * Inject inline comment for on given TR this tr should be always an .line

 * tr containing the line. Code will detect comment, and always put the comment

 * block at the very bottom

 */

	  if(!YUD.hasClass(tr, 'line')){

		  return

	  }

	  var submit_url = AJAX_COMMENT_URL;

	  var form = createInlineForm(tr, f_path, lineno, submit_url);

	  var parent = tr;

	  while (1){

		  var n = parent.nextElementSibling;

		  // next element are comments !

		  if(YUD.hasClass(n,'inline-comments')){

			  parent = n;

		  }

		  else{

			  break;

		  }

	  }	  

	  YUD.insertAfter(form,parent);

	  var f = YUD.get(form);

	  var overlay = f.getElementsByClassName('overlay')[0];

	  var _form = f.getElementsByClassName('inline-form')[0];

	  form.on('submit',function(e){

		  YUE.preventDefault(e);

		  //ajax submit

		  var text = YUD.get('text_'+lineno).value;

		  var postData = {

	            'text':text,

	            'f_path':f_path,

	            'line':lineno

		  };

		  if(lineno === undefined){

			  alert('missing line !');

			  return

		  }

		  if(f_path === undefined){

			  alert('missing file path !');

			  return

		  }

		  var success = function(o){

			  YUD.removeClass(tr, 'form-open');

			  removeInlineForm(f);			  

			  var json_data = JSON.parse(o.responseText);

	          renderInlineComment(json_data);

		  };

		  if (YUD.hasClass(overlay,'overlay')){

			  var w = _form.offsetWidth;

			  var h = _form.offsetHeight;

			  YUD.setStyle(overlay,'width',w+'px');

			  YUD.setStyle(overlay,'height',h+'px');

		  }		  

		  YUD.addClass(overlay, 'submitting');		  

		  ajaxPOST(submit_url, postData, success);

	  });

var deleteComment = function(comment_id){

	var url = AJAX_COMMENT_DELETE_URL.replace('__COMMENT_ID__',comment_id);

    var postData = {'_method':'delete'};

    var success = function(o){

        var n = YUD.get('comment-tr-'+comment_id);

        var root = n.previousElementSibling.previousElementSibling;

        n.parentNode.removeChild(n);

        // scann nodes, and attach add button to last one

        placeAddButton(root);        

    }

    ajaxPOST(url,postData,success);

}

var createInlineAddButton = function(tr){

	var label = TRANSLATION_MAP['add another comment'];

	var html_el = document.createElement('div');

	YUD.addClass(html_el, 'add-comment');

	html_el.innerHTML = '<span class="ui-btn">{0}</span>'.format(label);

	var add = new YAHOO.util.Element(html_el);

var placeAddButton = function(target_tr){

	if(!target_tr){

		return

	}

	var last_node = target_tr;

    //scann	

	  while (1){

		  var n = last_node.nextElementSibling;

		  // next element are comments !

		  if(YUD.hasClass(n,'inline-comments')){

			  last_node = n;

			  //also remove the comment button from previos

			  var comment_add_buttons = last_node.getElementsByClassName('add-comment');

			  for(var i=0;i<comment_add_buttons.length;i++){

				  var b = comment_add_buttons[i];

				  b.parentNode.removeChild(b);

			  }

		  }

		  else{

			  break;

		  }

	  }

    var add = createInlineAddButton(target_tr);

    // get the comment div

    var comment_block = last_node.getElementsByClassName('comment')[0];

    // attach add button

    YUD.insertAfter(add,comment_block);	

}

/**

 * Places the inline comment into the changeset block in proper line position

 */

var placeInline = function(target_container,lineno,html){

	  var lineid = "{0}_{1}".format(target_container,lineno);

	  var target_line = YUD.get(lineid);

	  var comment = new YAHOO.util.Element(tableTr('inline-comments',html))

	  // check if there are comments already !

	  var parent = target_line.parentNode;

	  var root_parent = parent;

	  while (1){

		  var n = parent.nextElementSibling;

		  // next element are comments !

		  if(YUD.hasClass(n,'inline-comments')){

			  parent = n;

		  }

		  else{

			  break;

		  }

	  }

	  // put in the comment at the bottom

	  YUD.insertAfter(comment,parent);

	  // scann nodes, and attach add button to last one

      placeAddButton(root_parent);

	  return target_line;

}

/**

 * make a single inline comment and place it inside

 */

var renderInlineComment = function(json_data){

    try{

	  var html =  json_data['rendered_text'];

	  var lineno = json_data['line_no'];

	  var target_id = json_data['target_id'];

	  placeInline(target_id, lineno, html);

    }catch(e){

  	  console.log(e);

    }

}

/**

 * Iterates over all the inlines, and places them inside proper blocks of data

 */

var renderInlineComments = function(file_comments){

	for (f in file_comments){

        // holding all comments for a FILE

		var box = file_comments[f];

		var target_id = YUD.getAttribute(box,'target_id');

		// actually comments with line numbers

        var comments = box.children;

        for(var i=0; i<comments.length; i++){

        	var data = {

        		'rendered_text': comments[i].outerHTML,

        		'line_no': YUD.getAttribute(comments[i],'line'),

        		'target_id': target_id

        	}

        	renderInlineComment(data);

        }

    }	

}

            //JS translations map

            var TRANSLATION_MAP = {

            	'add another comment':'${_("add another comment")}',

                'Stop following this repository':"${_('Stop following this repository')}",

                'Start following this repository':"${_('Start following this repository')}",

            };

                    f.setAttribute('title',TRANSLATION_MAP['Stop following this repository']);

                    f.setAttribute('title',TRANSLATION_MAP['Start following this repository']);

    ## render comments

    	  AJAX_COMMENT_URL = "${url('changeset_comment',repo_name=c.repo_name,revision=c.changeset.raw_id)}";

    	  AJAX_COMMENT_DELETE_URL = "${url('changeset_comment_delete',repo_name=c.repo_name,comment_id='__COMMENT_ID__')}"

          renderInlineComments(file_comments);

<%namespace name="comment" file="/changeset/changeset_file_comment.html"/>

${comment.comment_block(c.co)}

  <div class="comment" id="comment-${co.comment_id}" line="${co.line_no}">

    <div class="overlay"><div class="overlay-text">${_('Submitting...')}</div></div>

      ${h.form(h.url('changeset_comment', repo_name=c.repo_name, revision=changeset.raw_id),class_='inline-form')}

      ${h.submit('save', _('Comment'), class_='ui-btn save-inline-form')}

<%def name="inlines(changeset)">

            <div style="display:none" class="inline-comment-placeholder" path="${path}" target_id="${h.safeid(h.safe_unicode(path))}">

</%def>

<%def name="comments(changeset)">

<div class="comments">

    <div id="inline-comments-container">

     ${inlines(changeset)}

    </div>