review/static/comments.js @ 431b3e74013f
web: use underscore.js for templating
author |
Steve Losh <steve@stevelosh.com> |
date |
Sat, 03 Jul 2010 11:08:03 -0400 |
parents |
014df093430e |
children |
83b866324067 |
_.templateSettings = {
start : '{{',
end : '}}',
interpolate : /\{\{(.+?)\}\}/g
};
var comment_form = _.template(
'<tr class="comment-form">' +
'<td colspan="3">' +
'<form id="id_comment-line-form_{{ currNum }}" method="POST" action="">' +
'<span class="lastlinenumber disabled">{{ currNum }}</span>' +
'<div class="field">' +
'<label class="infield" for="id_comment-line-form_{{ currNum }}_body">Comment</label>' +
'<textarea id="id_comment-line-form_{{ currNum }}_body"' +
'name="new-comment-body"></textarea>' +
'</div>' +
'<div class="field cuddly">' +
'<input type="checkbox" class="checkbox" name="comment-markdown" id="id_comment-line-form_{{ currNum }}_markdown" checked="checked" />' +
'<label for="id_comment-line-form_{{ currNum }}_markdown">Use Markdown to format this comment.</label>' +
'</div>' +
'<a class="submit button"><span>Post Comment</span></a>' +
'<a class="cancel-line button"><span>Cancel</span></a>' +
'<input type="hidden" name="filename" value="{{ filename }}" />' +
'<input class="lines" type="hidden" name="lines" value="{{ currNum }}" />' +
'</form>' +
'</td>' +
'</tr>'
);
function RenderLineCommentForm(line, currNum) {
var filename = line.closest(".file").find(".filename h3 a .name").html();
return comment_form({ filename: filename, currNum: currNum });
}
$(function() {
$(".activate a").click(function(event) {
$(event.target).closest(".activate").hide();
$(event.target).closest("div").children("form").fadeIn("fast");
return false;
});
$(".activate-edit a").click(function(event) {
$(event.target).closest(".activate-edit").hide();
$(event.target).closest(".comment").find(".message").hide();
$(event.target).closest("div").children("form").fadeIn("fast");
return false;
});
$("a.cancel").click(function(event) {
$(event.target).closest(".togglebox").children(".activate").show();
$(event.target).parents("form").hide();
return false;
});
$("a.cancel-edit").click(function(event) {
$(event.target).closest(".toggleinline").children(".activate-edit").show();
$(event.target).closest(".comment").find(".message").show();
$(event.target).parents("form").hide();
return false;
});
$("a.cancel-line").live('click', function(event) {
$(event.target).closest(".diff").find(".chosen").removeClass("chosen");
$(event.target).closest("tr.comment-form").remove();
return false;
});
$("tr.comment").hover(function(event) {
var diff = $(event.target).closest(".diff");
var lines = $(event.target).find(".commentlines").html().split(",");
for (i=0; i < lines.length; i++) {
diff.find(".line-" + lines[i]).addClass("viewing");
}
}, function(event) {
$(".viewing").removeClass("viewing");
});
var lastSelected = null;
$(".commentable").click(function(event) {
var currNum = parseInt($(this).find(".linenumber").html());
var diff = $(this).closest(".diff");
if ($(this).hasClass("chosen")) {
$(this).removeClass("chosen");
var newLines = "";
jQuery.each(diff.find(".chosen .linenumber"), function() {
newLines += $(this).html() + ",";
});
diff.find(".comment-form form .lines").val(newLines);
lastSelected = null;
return false;
}
if (event.shiftKey && lastSelected) {
if (lastSelected && jQuery.contains(diff.get(0), lastSelected.get(0))) {
var lastNum = parseInt(lastSelected.find(".linenumber").html());
if (lastNum > currNum) {
for (i = currNum; i < lastNum; i++) {
diff.find(".line-" + i).addClass("chosen");
}
} else {
for (i = currNum; i > lastNum; i--) {
diff.find(".line-" + i).addClass("chosen");
}
}
}
} else {
$(this).addClass("chosen");
}
lastSelected = $(this);
var lines_chosen = diff.find(".chosen");
var last_line = lines_chosen.last();
var existing_forms = diff.find(".comment-form");
if (existing_forms.length) {
var existing_form = existing_forms.last();
var existing_form_line_number = parseInt(existing_form.find(".lastlinenumber").html());
if (existing_form_line_number < currNum) {
existing_forms.remove();
var comment_form = RenderLineCommentForm($(this), currNum);
$(this).after(comment_form);
diff.find("label").inFieldLabels();
}
var newLines = "";
jQuery.each(diff.find(".chosen .linenumber"), function() {
newLines += $(this).html() + ",";
});
diff.find(".comment-form form .lines").val(newLines);
} else {
var comment_form = RenderLineCommentForm($(this), currNum);
$(this).after(comment_form);
diff.find("label").inFieldLabels();
}
return false;
});
$("label.infield").inFieldLabels();
});