Use a more consistent style in the websupport js

This commit is contained in:
Daniel Neuhäuser 2010-08-13 15:10:48 +02:00
parent 4dc41e5293
commit 1509c0d3d3

View File

@ -1,19 +1,19 @@
(function($) { (function($) {
$.fn.autogrow = function(){ $.fn.autogrow = function(){
return this.each(function(){ return this.each(function(){
var textarea = this; var textarea = this;
$.fn.autogrow.resize(textarea); $.fn.autogrow.resize(textarea);
$(textarea) $(textarea)
.focus(function() { .focus(function() {
textarea.interval = setInterval(function() { textarea.interval = setInterval(function() {
$.fn.autogrow.resize(textarea); $.fn.autogrow.resize(textarea);
}, 500); }, 500);
}) })
.blur(function() { .blur(function() {
clearInterval(textarea.interval); clearInterval(textarea.interval);
}); });
}); });
}; };
@ -31,7 +31,7 @@
})(jQuery); })(jQuery);
(function($) { (function($) {
var commentListEmpty, popup, comp, commentTemplate, replyTemplate; var commentListEmpty, popup, comp, commentTemplate, replyTemplate;
function init() { function init() {
initTemplates(); initTemplates();
@ -98,9 +98,9 @@
$.get(templateURL, function(data) { $.get(templateURL, function(data) {
var templates = $(data); var templates = $(data);
function loadTemplate(id) { function loadTemplate(id) {
var html = templates.find('#' + id).html(); var html = templates.find('#' + id).html();
html = html.replace(/(&lt;)|(%3C)/g, "<"); html = html.replace(/(&lt;)|(%3C)/g, "<");
html = html.replace(/(&gt;)|(%3E)/g, ">"); html = html.replace(/(&gt;)|(%3E)/g, ">");
return html; return html;
}; };
// Create our popup div, the same div is recycled each time comments // Create our popup div, the same div is recycled each time comments
@ -117,110 +117,109 @@
}); });
}; };
/** /*
* Create a comp function. If the user has preferences stored in Create a comp function. If the user has preferences stored in
* the sortBy cookie, use those, otherwise use the default. the sortBy cookie, use those, otherwise use the default.
*/ */
function initComparator() { function initComparator() {
var by = 'rating'; // Default to sort by rating. var by = 'rating'; // Default to sort by rating.
// If the sortBy cookie is set, use that instead. // If the sortBy cookie is set, use that instead.
if (document.cookie.length > 0) { if (document.cookie.length > 0) {
var start = document.cookie.indexOf('sortBy='); var start = document.cookie.indexOf('sortBy=');
if (start != -1) { if (start != -1) {
start = start + 7; start = start + 7;
var end = document.cookie.indexOf(";", start); var end = document.cookie.indexOf(";", start);
if (end == -1) if (end == -1)
end = document.cookie.length; end = document.cookie.length;
by = unescape(document.cookie.substring(start, end)); by = unescape(document.cookie.substring(start, end));
} }
} }
setComparator(by); setComparator(by);
}; };
/** /*
* Show the comments popup window. Show the comments popup window.
*/ */
function show(nodeId) { function show(nodeId) {
var id = nodeId.substring(1); var id = nodeId.substring(1);
// Reset the main comment form, and set the value of the parent input. // Reset the main comment form, and set the value of the parent input.
$('form#comment_form') $('form#comment_form')
.find('textarea,input') .find('textarea,input')
.removeAttr('disabled').end() .removeAttr('disabled').end()
.find('input[name="node"]') .find('input[name="node"]')
.val(id).end() .val(id).end()
.find('textarea[name="proposal"]') .find('textarea[name="proposal"]')
.val('') .val('')
.hide(); .hide();
// Position the popup and show it. // Position the popup and show it.
var clientWidth = document.documentElement.clientWidth; var clientWidth = document.documentElement.clientWidth;
var popupWidth = $('div.popup_comment').width(); var popupWidth = $('div.popup_comment').width();
$('div.popup_comment') $('div.popup_comment')
.css({ .css({
'top': 100+$(window).scrollTop(), 'top': 100+$(window).scrollTop(),
'left': clientWidth/2-popupWidth/2, 'left': clientWidth/2-popupWidth/2,
'position': 'absolute' 'position': 'absolute'
}) })
.fadeIn('fast', function() { .fadeIn('fast', function() {
getComments(id); getComments(id);
}); });
}; };
/** /*
* Hide the comments popup window. Hide the comments popup window.
*/ */
function hide() { function hide() {
$('div.popup_comment').fadeOut('fast', function() { $('div.popup_comment').fadeOut('fast', function() {
$('ul#comment_ul').empty(); $('ul#comment_ul').empty();
$('h3#comment_notification').show(); $('h3#comment_notification').show();
$('form#comment_form').find('textarea') $('form#comment_form').find('textarea')
.val('').end() .val('').end()
.find('textarea, input') .find('textarea, input')
.removeAttr('disabled'); .removeAttr('disabled');
}); });
}; };
/** /*
* Perform an ajax request to get comments for a node Perform an ajax request to get comments for a node
* and insert the comments into the comments tree. and insert the comments into the comments tree.
*/ */
function getComments(id) { function getComments(id) {
$.ajax({ $.ajax({
type: 'GET', type: 'GET',
url: opts.getCommentsURL, url: opts.getCommentsURL,
data: {node: id}, data: {node: id},
success: function(data, textStatus, request) { success: function(data, textStatus, request) {
var ul = $('ul#comment_ul').hide(); var ul = $('ul#comment_ul').hide();
$('form#comment_form') $('form#comment_form')
.find('textarea[name="proposal"]') .find('textarea[name="proposal"]')
.data('source', data.source); .data('source', data.source);
if (data.comments.length == 0) { if (data.comments.length == 0) {
ul.html('<li>No comments yet.</li>'); ul.html('<li>No comments yet.</li>');
commentListEmpty = true; commentListEmpty = true;
var speed = 100; var speed = 100;
} } else {
else { // If there are comments, sort them and put them in the list.
// If there are comments, sort them and put them in the list. var comments = sortComments(data.comments);
var comments = sortComments(data.comments); var speed = data.comments.length * 100;
var speed = data.comments.length * 100; appendComments(comments, ul);
appendComments(comments, ul); commentListEmpty = false;
commentListEmpty = false; }
} $('h3#comment_notification').slideUp(speed+200);
$('h3#comment_notification').slideUp(speed+200); ul.slideDown(speed);
ul.slideDown(speed); },
}, error: function(request, textStatus, error) {
error: function(request, textStatus, error) { showError('Oops, there was a problem retrieving the comments.');
showError('Oops, there was a problem retrieving the comments.'); },
}, dataType: 'json'
dataType: 'json'
}); });
}; };
/** /*
* Add a comment via ajax and insert the comment into the comment tree. Add a comment via ajax and insert the comment into the comment tree.
*/ */
function addComment(form) { function addComment(form) {
// Disable the form that is being submitted. // Disable the form that is being submitted.
form.find('textarea,input').attr('disabled', 'disabled'); form.find('textarea,input').attr('disabled', 'disabled');
@ -231,36 +230,38 @@
type: "POST", type: "POST",
url: opts.addCommentURL, url: opts.addCommentURL,
dataType: 'json', dataType: 'json',
data: {node: node_id, data: {
parent: form.find('input[name="parent"]').val(), node: node_id,
text: form.find('textarea[name="comment"]').val(), parent: form.find('input[name="parent"]').val(),
proposal: form.find('textarea[name="proposal"]').val()}, text: form.find('textarea[name="comment"]').val(),
proposal: form.find('textarea[name="proposal"]').val()
},
success: function(data, textStatus, error) { success: function(data, textStatus, error) {
// Reset the form. // Reset the form.
if (node_id) { if (node_id) {
hideProposeChange(node_id); hideProposeChange(node_id);
} }
form.find('textarea') form.find('textarea')
.val('') .val('')
.add(form.find('input')) .add(form.find('input'))
.removeAttr('disabled'); .removeAttr('disabled');
if (commentListEmpty) { if (commentListEmpty) {
$('ul#comment_ul').empty(); $('ul#comment_ul').empty();
commentListEmpty = false; commentListEmpty = false;
} }
insertComment(data.comment); insertComment(data.comment);
}, },
error: function(request, textStatus, error) { error: function(request, textStatus, error) {
form.find('textarea,input').removeAttr('disabled'); form.find('textarea,input').removeAttr('disabled');
showError('Oops, there was a problem adding the comment.'); showError('Oops, there was a problem adding the comment.');
} }
}); });
}; };
/** /*
* Recursively append comments to the main comment list and children Recursively append comments to the main comment list and children
* lists, creating the comment tree. lists, creating the comment tree.
*/ */
function appendComments(comments, ul) { function appendComments(comments, ul) {
$.each(comments, function() { $.each(comments, function() {
var div = createCommentDiv(this); var div = createCommentDiv(this);
@ -272,10 +273,10 @@
}); });
}; };
/** /*
* After adding a new comment, it must be inserted in the correct After adding a new comment, it must be inserted in the correct
* location in the comment tree. location in the comment tree.
*/ */
function insertComment(comment) { function insertComment(comment) {
var div = createCommentDiv(comment); var div = createCommentDiv(comment);
@ -286,8 +287,7 @@
if (comment.node != null) { if (comment.node != null) {
var ul = $('ul#comment_ul'); var ul = $('ul#comment_ul');
var siblings = getChildren(ul); var siblings = getChildren(ul);
} } else {
else {
var ul = $('#cl' + comment.parent); var ul = $('#cl' + comment.parent);
var siblings = getChildren(ul); var siblings = getChildren(ul);
} }
@ -298,11 +298,11 @@
// Determine where in the parents children list to insert this comment. // Determine where in the parents children list to insert this comment.
for(i=0; i < siblings.length; i++) { for(i=0; i < siblings.length; i++) {
if (comp(comment, siblings[i]) <= 0) { if (comp(comment, siblings[i]) <= 0) {
$('#cd' + siblings[i].id) $('#cd' + siblings[i].id)
.parent() .parent()
.before(li.html(div)); .before(li.html(div));
li.slideDown('fast'); li.slideDown('fast');
return; return;
} }
} }
@ -318,10 +318,10 @@
url: opts.acceptCommentURL, url: opts.acceptCommentURL,
data: {id: id}, data: {id: id},
success: function(data, textStatus, request) { success: function(data, textStatus, request) {
$('#cm' + id).fadeOut('fast'); $('#cm' + id).fadeOut('fast');
}, },
error: function(request, textStatus, error) { error: function(request, textStatus, error) {
showError("Oops, there was a problem accepting the comment."); showError("Oops, there was a problem accepting the comment.");
}, },
}); });
}; };
@ -332,13 +332,13 @@
url: opts.rejectCommentURL, url: opts.rejectCommentURL,
data: {id: id}, data: {id: id},
success: function(data, textStatus, request) { success: function(data, textStatus, request) {
var div = $('#cd' + id); var div = $('#cd' + id);
div.slideUp('fast', function() { div.slideUp('fast', function() {
div.remove(); div.remove();
}); });
}, },
error: function(request, textStatus, error) { error: function(request, textStatus, error) {
showError("Oops, there was a problem rejecting the comment."); showError("Oops, there was a problem rejecting the comment.");
}, },
}); });
}; };
@ -349,22 +349,22 @@
url: opts.deleteCommentURL, url: opts.deleteCommentURL,
data: {id: id}, data: {id: id},
success: function(data, textStatus, request) { success: function(data, textStatus, request) {
var div = $('#cd' + id); var div = $('#cd' + id);
div div
.find('span.user_id:first') .find('span.user_id:first')
.text('[deleted]').end() .text('[deleted]').end()
.find('p.comment_text:first') .find('p.comment_text:first')
.text('[deleted]').end() .text('[deleted]').end()
.find('#cm' + id + ', #dc' + id + ', #ac' + id + ', #rc' + id + .find('#cm' + id + ', #dc' + id + ', #ac' + id + ', #rc' + id +
', #sp' + id + ', #hp' + id + ', #cr' + id + ', #rl' + id) ', #sp' + id + ', #hp' + id + ', #cr' + id + ', #rl' + id)
.remove(); .remove();
var comment = div.data('comment'); var comment = div.data('comment');
comment.username = '[deleted]'; comment.username = '[deleted]';
comment.text = '[deleted]'; comment.text = '[deleted]';
div.data('comment', comment); div.data('comment', comment);
}, },
error: function(request, textStatus, error) { error: function(request, textStatus, error) {
showError("Oops, there was a problem deleting the comment."); showError("Oops, there was a problem deleting the comment.");
}, },
}); });
}; };
@ -398,25 +398,25 @@
textarea.slideUp('fast'); textarea.slideUp('fast');
}; };
/** /*
* Handle when the user clicks on a sort by link. Handle when the user clicks on a sort by link.
*/ */
function handleReSort(link) { function handleReSort(link) {
setComparator(link.attr('id')); setComparator(link.attr('id'));
// Save/update the sortBy cookie. // Save/update the sortBy cookie.
var expiration = new Date(); var expiration = new Date();
expiration.setDate(expiration.getDate() + 365); expiration.setDate(expiration.getDate() + 365);
document.cookie= 'sortBy=' + escape(link.attr('id')) + document.cookie= 'sortBy=' + escape(link.attr('id')) +
';expires=' + expiration.toUTCString(); ';expires=' + expiration.toUTCString();
var comments = getChildren($('ul#comment_ul'), true); var comments = getChildren($('ul#comment_ul'), true);
comments = sortComments(comments); comments = sortComments(comments);
appendComments(comments, $('ul#comment_ul').empty()); appendComments(comments, $('ul#comment_ul').empty());
}; };
/** /*
* Function to process a vote when a user clicks an arrow. Function to process a vote when a user clicks an arrow.
*/ */
function handleVote(link) { function handleVote(link) {
if (!opts.voting) { if (!opts.voting) {
showError("You'll need to login to vote."); showError("You'll need to login to vote.");
@ -426,11 +426,11 @@
var id = link.attr('id'); var id = link.attr('id');
// If it is an unvote, the new vote value is 0, // If it is an unvote, the new vote value is 0,
// Otherwise it's 1 for an upvote, or -1 for a downvote. // Otherwise it's 1 for an upvote, or -1 for a downvote.
if (id.charAt(1) == 'u') if (id.charAt(1) == 'u') {
var value = 0; var value = 0;
else } else {
var value = id.charAt(0) == 'u' ? 1 : -1; var value = id.charAt(0) == 'u' ? 1 : -1;
}
// The data to be sent to the server. // The data to be sent to the server.
var d = { var d = {
comment_id: id.substring(2), comment_id: id.substring(2),
@ -450,9 +450,9 @@
// already been pressed, unpress it. // already been pressed, unpress it.
if ((d.value != 0) && (data.vote == d.value*-1)) { if ((d.value != 0) && (data.vote == d.value*-1)) {
$('#' + (d.value == 1 ? 'd' : 'u') + 'u' + d.comment_id) $('#' + (d.value == 1 ? 'd' : 'u') + 'u' + d.comment_id)
.hide(); .hide();
$('#' + (d.value == 1 ? 'd' : 'u') + 'v' + d.comment_id) $('#' + (d.value == 1 ? 'd' : 'u') + 'v' + d.comment_id)
.show(); .show();
} }
// Update the comments rating in the local data. // Update the comments rating in the local data.
@ -470,14 +470,14 @@
url: opts.processVoteURL, url: opts.processVoteURL,
data: d, data: d,
error: function(request, textStatus, error) { error: function(request, textStatus, error) {
showError("Oops, there was a problem casting that vote."); showError("Oops, there was a problem casting that vote.");
} }
}); });
}; };
/** /*
* Open a reply form used to reply to an existing comment. Open a reply form used to reply to an existing comment.
*/ */
function openReply(id) { function openReply(id) {
// Swap out the reply link for the hide link // Swap out the reply link for the hide link
$('#rl' + id).hide(); $('#rl' + id).hide();
@ -489,17 +489,17 @@
.prepend(div) .prepend(div)
// Setup the submit handler for the reply form. // Setup the submit handler for the reply form.
.find('#rf' + id) .find('#rf' + id)
.submit(function(event) { .submit(function(event) {
event.preventDefault(); event.preventDefault();
addComment($('#rf' + id)); addComment($('#rf' + id));
closeReply(id); closeReply(id);
}); });
div.slideDown('fast'); div.slideDown('fast');
}; };
/** /*
* Close the reply form opened with openReply. Close the reply form opened with openReply.
*/ */
function closeReply(id) { function closeReply(id) {
// Remove the reply div from the DOM. // Remove the reply div from the DOM.
$('#rd' + id).slideUp('fast', function() { $('#rd' + id).slideUp('fast', function() {
@ -511,9 +511,9 @@
$('#rl' + id).show(); $('#rl' + id).show();
}; };
/** /*
* Recursively sort a tree of comments using the comp comparator. Recursively sort a tree of comments using the comp comparator.
*/ */
function sortComments(comments) { function sortComments(comments) {
comments.sort(comp); comments.sort(comp);
$.each(comments, function() { $.each(comments, function() {
@ -522,51 +522,50 @@
return comments; return comments;
}; };
/** /*
* Set comp, which is a comparator function used for sorting and Set comp, which is a comparator function used for sorting and
* inserting comments into the list. inserting comments into the list.
*/ */
function setComparator(by) { function setComparator(by) {
// If the first three letters are "asc", sort in ascending order // If the first three letters are "asc", sort in ascending order
// and remove the prefix. // and remove the prefix.
if (by.substring(0,3) == 'asc') { if (by.substring(0,3) == 'asc') {
var i = by.substring(3); var i = by.substring(3);
comp = function(a, b) { return a[i] - b[i]; } comp = function(a, b) { return a[i] - b[i]; }
} } else {
// Otherwise sort in descending order. // Otherwise sort in descending order.
else
comp = function(a, b) { return b[by] - a[by]; } comp = function(a, b) { return b[by] - a[by]; }
}
// Reset link styles and format the selected sort option. // Reset link styles and format the selected sort option.
$('a.sel').attr('href', '#').removeClass('sel'); $('a.sel').attr('href', '#').removeClass('sel');
$('#' + by).removeAttr('href').addClass('sel'); $('#' + by).removeAttr('href').addClass('sel');
}; };
/** /*
* Get the children comments from a ul. If recursive is true, Get the children comments from a ul. If recursive is true,
* recursively include childrens' children. recursively include childrens' children.
*/ */
function getChildren(ul, recursive) { function getChildren(ul, recursive) {
var children = []; var children = [];
ul.children().children("[id^='cd']") ul.children().children("[id^='cd']")
.each(function() { .each(function() {
var comment = $(this).data('comment'); var comment = $(this).data('comment');
if (recursive) { if (recursive) {
comment.children = comment.children = getChildren($(this).find('#cl' + comment.id), true);
getChildren($(this).find('#cl' + comment.id), true); }
} children.push(comment);
children.push(comment);
}); });
return children; return children;
}; };
/** /*
* Create a div to display a comment in. Create a div to display a comment in.
*/ */
function createCommentDiv(comment) { function createCommentDiv(comment) {
// Prettify the comment rating. // Prettify the comment rating.
comment.pretty_rating = comment.rating + ' point' + comment.pretty_rating = comment.rating + ' point' +
(comment.rating == 1 ? '' : 's'); (comment.rating == 1 ? '' : 's');
// Create a div for this comment. // Create a div for this comment.
var context = $.extend({}, opts, comment); var context = $.extend({}, opts, comment);
var div = $(renderTemplate(commentTemplate, context)); var div = $(renderTemplate(commentTemplate, context));
@ -581,30 +580,30 @@
if (comment.text != '[deleted]') { if (comment.text != '[deleted]') {
div.find('a.reply').show(); div.find('a.reply').show();
if (comment.proposal_diff) { if (comment.proposal_diff) {
div.find('#sp' + comment.id).show(); div.find('#sp' + comment.id).show();
} }
if (opts.moderator && !comment.displayed) { if (opts.moderator && !comment.displayed) {
div.find('#cm' + comment.id).show(); div.find('#cm' + comment.id).show();
} }
if (opts.moderator || (opts.username == comment.username)) { if (opts.moderator || (opts.username == comment.username)) {
div.find('#dc' + comment.id).show(); div.find('#dc' + comment.id).show();
} }
} }
return div; return div;
} }
/** /*
* A simple template renderer. Placeholders such as <%id%> are replaced A simple template renderer. Placeholders such as <%id%> are replaced
* by context['id']. Items are always escaped. by context['id']. Items are always escaped.
*/ */
function renderTemplate(template, context) { function renderTemplate(template, context) {
var esc = $('<span></span>'); var esc = $('<span></span>');
function handle(ph, escape) { function handle(ph, escape) {
var cur = context; var cur = context;
$.each(ph.split('.'), function() { $.each(ph.split('.'), function() {
cur = cur[this]; cur = cur[this];
}); });
return escape ? esc.text(cur || "").html() : cur; return escape ? esc.text(cur || "").html() : cur;
} }
@ -617,16 +616,17 @@
function showError(message) { function showError(message) {
$('<div class="popup_error">' + $('<div class="popup_error">' +
'<h1>' + message + '</h1>' + '<h1>' + message + '</h1>' +
'</div>') '</div>'
.appendTo('body') )
.fadeIn("slow") .appendTo('body')
.delay(2000) .fadeIn("slow")
.fadeOut("slow"); .delay(2000)
.fadeOut("slow");
}; };
/** /*
* Add a link the user uses to open the comments popup. Add a link the user uses to open the comments popup.
*/ */
$.fn.comment = function() { $.fn.comment = function() {
return this.each(function() { return this.each(function() {
var id = $(this).attr('id').substring(1); var id = $(this).attr('id').substring(1);
@ -634,13 +634,14 @@
var title = count + ' comment' + (count == 1 ? '' : 's'); var title = count + ' comment' + (count == 1 ? '' : 's');
var image = count > 0 ? opts.commentBrightImage : opts.commentImage; var image = count > 0 ? opts.commentBrightImage : opts.commentImage;
$(this).append( $(this).append(
$('<a href="#" class="sphinx_comment"></a>') $('<a href="#" class="sphinx_comment"></a>')
.html('<img src="' + image + '" alt="comment" />') .html('<img src="' + image + '" alt="comment" />')
.attr('title', title) .attr('title', title)
.click(function(event) { .click(function(event) {
event.preventDefault(); event.preventDefault();
show($(this).parent().attr('id')); show($(this).parent().attr('id'));
})); })
);
}); });
}; };
@ -680,4 +681,4 @@ $(document).ready(function() {
result.highlightText(this.toLowerCase(), 'highlighted'); result.highlightText(this.toLowerCase(), 'highlighted');
}); });
}); });
}); });