Display trust control with only two buttons and no numbers.
[Sone.git] / src / main / resources / static / javascript / sone.js
1 /* Sone JavaScript functions. */
2
3 /* jQuery overrides. */
4 oldGetJson = jQuery.prototype.getJSON;
5 jQuery.prototype.getJSON = function(url, data, successCallback, errorCallback) {
6         if (typeof errorCallback == "undefined") {
7                 return oldGetJson(url, data, successCallback);
8         }
9         if (jQuery.isFunction(data)) {
10                 errorCallback = successCallback;
11                 successCallback = data;
12                 data = null;
13         }
14         return jQuery.ajax({
15                 data: data,
16                 error: errorCallback,
17                 success: successCallback,
18                 url: url
19         });
20 }
21
22 function isOnline() {
23         return $("#sone").hasClass("online");
24 }
25
26 function registerInputTextareaSwap(inputElement, defaultText, inputFieldName, optional, dontUseTextarea) {
27         $(inputElement).each(function() {
28                 textarea = $(dontUseTextarea ? "<input type=\"text\" name=\"" + inputFieldName + "\">" : "<textarea name=\"" + inputFieldName + "\"></textarea>").blur(function() {
29                         if ($(this).val() == "") {
30                                 $(this).hide();
31                                 inputField = $(this).data("inputField");
32                                 inputField.show().removeAttr("disabled").addClass("default");
33                                 inputField.val(defaultText);
34                         }
35                 }).hide().data("inputField", $(this)).val($(this).val());
36                 $(this).after(textarea);
37                 (function(inputField, textarea) {
38                         inputField.focus(function() {
39                                 $(this).hide().attr("disabled", "disabled");
40                                 textarea.show().focus();
41                         });
42                         if (inputField.val() == "") {
43                                 inputField.addClass("default");
44                                 inputField.val(defaultText);
45                         } else {
46                                 inputField.hide().attr("disabled", "disabled");
47                                 textarea.show();
48                         }
49                         $(inputField.get(0).form).submit(function() {
50                                 if (!optional && (textarea.val() == "")) {
51                                         return false;
52                                 }
53                         });
54                 })($(this), textarea);
55         });
56 }
57
58 /**
59  * Adds a “comment” link to all status lines contained in the given element.
60  *
61  * @param postId
62  *            The ID of the post
63  * @param element
64  *            The element to add a “comment” link to
65  */
66 function addCommentLink(postId, element, insertAfterThisElement) {
67         if ($(element).find(".show-reply-form").length > 0) {
68                 return;
69         }
70         commentElement = (function(postId) {
71                 separator = $("<span> · </span>").addClass("separator");
72                 var commentElement = $("<div><span>Comment</span></div>").addClass("show-reply-form").click(function() {
73                         markPostAsKnown(getPostElement(this));
74                         replyElement = $("#sone .post#" + postId + " .create-reply");
75                         replyElement.removeClass("hidden");
76                         replyElement.removeClass("light");
77                         (function(replyElement) {
78                                 replyElement.find("input.reply-input").blur(function() {
79                                         if ($(this).hasClass("default")) {
80                                                 replyElement.addClass("light");
81                                         }
82                                 }).focus(function() {
83                                         replyElement.removeClass("light");
84                                 });
85                         })(replyElement);
86                         replyElement.find("input.reply-input").focus();
87                 });
88                 return commentElement;
89         })(postId);
90         $(insertAfterThisElement).after(commentElement.clone(true));
91         $(insertAfterThisElement).after(separator);
92 }
93
94 var translations = {};
95
96 /**
97  * Retrieves the translation for the given key and calls the callback function.
98  * The callback function takes a single parameter, the translated string.
99  *
100  * @param key
101  *            The key of the translation string
102  * @param callback
103  *            The callback function
104  */
105 function getTranslation(key, callback) {
106         if (key in translations) {
107                 callback(translations[key]);
108                 return;
109         }
110         $.getJSON("getTranslation.ajax", {"key": key}, function(data, textStatus) {
111                 if ((data != null) && data.success) {
112                         translations[key] = data.value;
113                         callback(data.value);
114                 }
115         }, function(xmlHttpRequest, textStatus, error) {
116                 /* ignore error. */
117         });
118 }
119
120 /**
121  * Filters the given Sone ID, replacing all “~” characters by an underscore.
122  *
123  * @param soneId
124  *            The Sone ID to filter
125  * @returns The filtered Sone ID
126  */
127 function filterSoneId(soneId) {
128         return soneId.replace(/[^a-zA-Z0-9-]/g, "_");
129 }
130
131 /**
132  * Updates the status of the given Sone.
133  *
134  * @param soneId
135  *            The ID of the Sone to update
136  * @param status
137  *            The status of the Sone (“idle”, “unknown”, “inserting”,
138  *            “downloading”)
139  * @param modified
140  *            Whether the Sone is modified
141  * @param locked
142  *            Whether the Sone is locked
143  * @param lastUpdated
144  *            The date and time of the last update (formatted for display)
145  */
146 function updateSoneStatus(soneId, name, status, modified, locked, lastUpdated) {
147         $("#sone .sone." + filterSoneId(soneId)).
148                 toggleClass("unknown", status == "unknown").
149                 toggleClass("idle", status == "idle").
150                 toggleClass("inserting", status == "inserting").
151                 toggleClass("downloading", status == "downloading").
152                 toggleClass("modified", modified);
153         $("#sone .sone." + filterSoneId(soneId) + " .lock").toggleClass("hidden", locked);
154         $("#sone .sone." + filterSoneId(soneId) + " .unlock").toggleClass("hidden", !locked);
155         $("#sone .sone." + filterSoneId(soneId) + " .last-update span.time").text(lastUpdated);
156         $("#sone .sone." + filterSoneId(soneId) + " .profile-link a").text(name);
157 }
158
159 /**
160  * Enhances a “delete” button so that the confirmation is done on the same page.
161  *
162  * @param button
163  *            The button element
164  * @param text
165  *            The text to show on the button
166  * @param deleteCallback
167  *            The callback that actually deletes something
168  */
169 function enhanceDeleteButton(button, text, deleteCallback) {
170         (function(button) {
171                 newButton = $("<button></button>").addClass("confirm").hide().text(text).click(function() {
172                         $(this).fadeOut("slow");
173                         deleteCallback();
174                         return false;
175                 }).insertAfter(button);
176                 (function(button, newButton) {
177                         button.click(function() {
178                                 button.fadeOut("slow", function() {
179                                         newButton.fadeIn("slow");
180                                         $(document).one("click", function() {
181                                                 if (this != newButton.get(0)) {
182                                                         newButton.fadeOut(function() {
183                                                                 button.fadeIn();
184                                                         });
185                                                 }
186                                         });
187                                 });
188                                 return false;
189                         });
190                 })(button, newButton);
191         })($(button));
192 }
193
194 /**
195  * Enhances a post’s “delete” button.
196  *
197  * @param button
198  *            The button element
199  * @param postId
200  *            The ID of the post to delete
201  * @param text
202  *            The text to replace the button with
203  */
204 function enhanceDeletePostButton(button, postId, text) {
205         enhanceDeleteButton(button, text, function() {
206                 $.getJSON("deletePost.ajax", { "post": postId, "formPassword": getFormPassword() }, function(data, textStatus) {
207                         if (data == null) {
208                                 return;
209                         }
210                         if (data.success) {
211                                 $("#sone .post#" + postId).slideUp();
212                         } else if (data.error == "invalid-post-id") {
213                                 alert("Invalid post ID given!");
214                         } else if (data.error == "auth-required") {
215                                 alert("You need to be logged in.");
216                         } else if (data.error == "not-authorized") {
217                                 alert("You are not allowed to delete this post.");
218                         }
219                 }, function(xmlHttpRequest, textStatus, error) {
220                         /* ignore error. */
221                 });
222         });
223 }
224
225 /**
226  * Enhances a reply’s “delete” button.
227  *
228  * @param button
229  *            The button element
230  * @param replyId
231  *            The ID of the reply to delete
232  * @param text
233  *            The text to replace the button with
234  */
235 function enhanceDeleteReplyButton(button, replyId, text) {
236         enhanceDeleteButton(button, text, function() {
237                 $.getJSON("deleteReply.ajax", { "reply": replyId, "formPassword": $("#sone #formPassword").text() }, function(data, textStatus) {
238                         if (data == null) {
239                                 return;
240                         }
241                         if (data.success) {
242                                 $("#sone .reply#" + replyId).slideUp();
243                         } else if (data.error == "invalid-reply-id") {
244                                 alert("Invalid reply ID given!");
245                         } else if (data.error == "auth-required") {
246                                 alert("You need to be logged in.");
247                         } else if (data.error == "not-authorized") {
248                                 alert("You are not allowed to delete this reply.");
249                         }
250                 }, function(xmlHttpRequest, textStatus, error) {
251                         /* ignore error. */
252                 });
253         });
254 }
255
256 function getFormPassword() {
257         return $("#sone #formPassword").text();
258 }
259
260 function getSoneElement(element) {
261         return $(element).closest(".sone");
262 }
263
264 /**
265  * Generates a list of Sones by concatening the names of the given sones with a
266  * new line character (“\n”).
267  *
268  * @param sones
269  *            The sones to format
270  * @returns {String} The created string
271  */
272 function generateSoneList(sones) {
273         var soneList = "";
274         $.each(sones, function() {
275                 if (soneList != "") {
276                         soneList += ", ";
277                 }
278                 soneList += this.name;
279         });
280         return soneList;
281 }
282
283 /**
284  * Returns the ID of the Sone that this element belongs to.
285  *
286  * @param element
287  *            The element to locate the matching Sone ID for
288  * @returns The ID of the Sone, or undefined
289  */
290 function getSoneId(element) {
291         return getSoneElement(element).find(".id").text();
292 }
293
294 function getPostElement(element) {
295         return $(element).closest(".post");
296 }
297
298 function getPostId(element) {
299         return getPostElement(element).attr("id");
300 }
301
302 function getPostTime(element) {
303         return getPostElement(element).find(".post-time").text();
304 }
305
306 function getReplyElement(element) {
307         return $(element).closest(".reply");
308 }
309
310 function getReplyId(element) {
311         return getReplyElement(element).attr("id");
312 }
313
314 function getReplyTime(element) {
315         return getReplyElement(element).find(".reply-time").text();
316 }
317
318 function likePost(postId) {
319         $.getJSON("like.ajax", { "type": "post", "post" : postId, "formPassword": getFormPassword() }, function(data, textStatus) {
320                 if ((data == null) || !data.success) {
321                         return;
322                 }
323                 $("#sone .post#" + postId + " > .inner-part > .status-line .like").addClass("hidden");
324                 $("#sone .post#" + postId + " > .inner-part > .status-line .unlike").removeClass("hidden");
325                 updatePostLikes(postId);
326         }, function(xmlHttpRequest, textStatus, error) {
327                 /* ignore error. */
328         });
329 }
330
331 function unlikePost(postId) {
332         $.getJSON("unlike.ajax", { "type": "post", "post" : postId, "formPassword": getFormPassword() }, function(data, textStatus) {
333                 if ((data == null) || !data.success) {
334                         return;
335                 }
336                 $("#sone .post#" + postId + " > .inner-part > .status-line .unlike").addClass("hidden");
337                 $("#sone .post#" + postId + " > .inner-part > .status-line .like").removeClass("hidden");
338                 updatePostLikes(postId);
339         }, function(xmlHttpRequest, textStatus, error) {
340                 /* ignore error. */
341         });
342 }
343
344 function updatePostLikes(postId) {
345         $.getJSON("getLikes.ajax", { "type": "post", "post": postId }, function(data, textStatus) {
346                 if ((data != null) && data.success) {
347                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes").toggleClass("hidden", data.likes == 0)
348                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes span.like-count").text(data.likes);
349                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes > span").attr("title", generateSoneList(data.sones));
350                 }
351         }, function(xmlHttpRequest, textStatus, error) {
352                 /* ignore error. */
353         });
354 }
355
356 function likeReply(replyId) {
357         $.getJSON("like.ajax", { "type": "reply", "reply" : replyId, "formPassword": getFormPassword() }, function(data, textStatus) {
358                 if ((data == null) || !data.success) {
359                         return;
360                 }
361                 $("#sone .reply#" + replyId + " .status-line .like").addClass("hidden");
362                 $("#sone .reply#" + replyId + " .status-line .unlike").removeClass("hidden");
363                 updateReplyLikes(replyId);
364         }, function(xmlHttpRequest, textStatus, error) {
365                 /* ignore error. */
366         });
367 }
368
369 function unlikeReply(replyId) {
370         $.getJSON("unlike.ajax", { "type": "reply", "reply" : replyId, "formPassword": getFormPassword() }, function(data, textStatus) {
371                 if ((data == null) || !data.success) {
372                         return;
373                 }
374                 $("#sone .reply#" + replyId + " .status-line .unlike").addClass("hidden");
375                 $("#sone .reply#" + replyId + " .status-line .like").removeClass("hidden");
376                 updateReplyLikes(replyId);
377         }, function(xmlHttpRequest, textStatus, error) {
378                 /* ignore error. */
379         });
380 }
381
382 function updateReplyLikes(replyId) {
383         $.getJSON("getLikes.ajax", { "type": "reply", "reply": replyId }, function(data, textStatus) {
384                 if ((data != null) && data.success) {
385                         $("#sone .reply#" + replyId + " .status-line .likes").toggleClass("hidden", data.likes == 0)
386                         $("#sone .reply#" + replyId + " .status-line .likes span.like-count").text(data.likes);
387                         $("#sone .reply#" + replyId + " .status-line .likes > span").attr("title", generateSoneList(data.sones));
388                 }
389         }, function(xmlHttpRequest, textStatus, error) {
390                 /* ignore error. */
391         });
392 }
393
394 /**
395  * Posts a reply and calls the given callback when the request finishes.
396  *
397  * @param postId
398  *            The ID of the post the reply refers to
399  * @param text
400  *            The text to post
401  * @param callbackFunction
402  *            The callback function to call when the request finishes (takes 3
403  *            parameters: success, error, replyId)
404  */
405 function postReply(postId, text, callbackFunction) {
406         $.getJSON("createReply.ajax", { "formPassword" : getFormPassword(), "post" : postId, "text": text }, function(data, textStatus) {
407                 if (data == null) {
408                         /* TODO - show error */
409                         return;
410                 }
411                 if (data.success) {
412                         callbackFunction(true, null, data.reply);
413                 } else {
414                         callbackFunction(false, data.error);
415                 }
416         }, function(xmlHttpRequest, textStatus, error) {
417                 /* ignore error. */
418         });
419 }
420
421 /**
422  * Requests information about the reply with the given ID.
423  *
424  * @param replyId
425  *            The ID of the reply
426  * @param callbackFunction
427  *            A callback function (parameters soneId, soneName, replyTime,
428  *            replyDisplayTime, text, html)
429  */
430 function getReply(replyId, callbackFunction) {
431         $.getJSON("getReply.ajax", { "reply" : replyId }, function(data, textStatus) {
432                 if ((data != null) && data.success) {
433                         callbackFunction(data.soneId, data.soneName, data.time, data.displayTime, data.text, data.html);
434                 }
435         }, function(xmlHttpRequest, textStatus, error) {
436                 /* ignore error. */
437         });
438 }
439
440 /**
441  * Ajaxifies the given post by enhancing all eligible elements with AJAX.
442  *
443  * @param postElement
444  *            The post element to ajaxify
445  */
446 function ajaxifyPost(postElement) {
447         $(postElement).find("form").submit(function() {
448                 return false;
449         });
450         $(postElement).find(".create-reply button:submit").click(function() {
451                 inputField = $(this.form).find(":input:enabled").get(0);
452                 postId = getPostId(this);
453                 text = $(inputField).val();
454                 (function(postId, text, inputField) {
455                         postReply(postId, text, function(success, error, replyId) {
456                                 if (success) {
457                                         $(inputField).val("");
458                                         loadNewReply(replyId);
459                                         markPostAsKnown(getPostElement(inputField));
460                                         $("#sone .post#" + postId + " .create-reply").addClass("hidden");
461                                 } else {
462                                         alert(error);
463                                 }
464                         });
465                 })(postId, text, inputField);
466                 return false;
467         });
468
469         /* replace all “delete” buttons with javascript. */
470         (function(postElement) {
471                 getTranslation("WebInterface.Confirmation.DeletePostButton", function(deletePostText) {
472                         postId = getPostId(postElement);
473                         enhanceDeletePostButton($(postElement).find(".delete-post button"), postId, deletePostText);
474                 });
475         })(postElement);
476
477         /* convert all “like” buttons to javascript functions. */
478         $(postElement).find(".like-post").submit(function() {
479                 likePost(getPostId(this));
480                 markPostAsKnown(getPostElement(this));
481                 return false;
482         });
483         $(postElement).find(".unlike-post").submit(function() {
484                 unlikePost(getPostId(this));
485                 markPostAsKnown(getPostElement(this));
486                 return false;
487         });
488
489         /* add “comment” link. */
490         addCommentLink(getPostId(postElement), postElement, $(postElement).find(".post-status-line .time"));
491
492         /* process all replies. */
493         $(postElement).find(".reply").each(function() {
494                 ajaxifyReply(this);
495         });
496
497         /* process reply input fields. */
498         getTranslation("WebInterface.DefaultText.Reply", function(text) {
499                 $(postElement).find("input.reply-input").each(function() {
500                         registerInputTextareaSwap(this, text, "text", false, false);
501                 });
502         });
503
504         /* mark everything as known on click. */
505         $(postElement).click(function() {
506                 markPostAsKnown(this);
507         });
508
509         /* hide reply input field. */
510         $(postElement).find(".create-reply").addClass("hidden");
511 }
512
513 /**
514  * Ajaxifies the given reply element.
515  *
516  * @param replyElement
517  *            The reply element to ajaxify
518  */
519 function ajaxifyReply(replyElement) {
520         $(replyElement).find(".like-reply").submit(function() {
521                 likeReply(getReplyId(this));
522                 markPostAsKnown(getPostElement(this));
523                 return false;
524         });
525         $(replyElement).find(".unlike-reply").submit(function() {
526                 unlikeReply(getReplyId(this));
527                 markPostAsKnown(getPostElement(this));
528                 return false;
529         });
530         (function(replyElement) {
531                 getTranslation("WebInterface.Confirmation.DeleteReplyButton", function(deleteReplyText) {
532                         $(replyElement).find(".delete-reply button").each(function() {
533                                 enhanceDeleteReplyButton(this, getReplyId(replyElement), deleteReplyText);
534                         });
535                 });
536         })(replyElement);
537         addCommentLink(getPostId(replyElement), replyElement, $(replyElement).find(".reply-status-line .time"));
538
539         /* mark post and all replies as known on click. */
540         $(replyElement).click(function() {
541                 markPostAsKnown(getPostElement(this));
542         });
543 }
544
545 /**
546  * Ajaxifies the given notification by replacing the form with AJAX.
547  *
548  * @param notification
549  *            jQuery object representing the notification.
550  */
551 function ajaxifyNotification(notification) {
552         notification.find("form.dismiss").submit(function() {
553                 return false;
554         });
555         notification.find("form.dismiss button").click(function() {
556                 $.getJSON("dismissNotification.ajax", { "formPassword" : getFormPassword(), "notification" : notification.attr("id") }, function(data, textStatus) {
557                         /* dismiss in case of error, too. */
558                         notification.slideUp();
559                 }, function(xmlHttpRequest, textStatus, error) {
560                         /* ignore error. */
561                 });
562         });
563         return notification;
564 }
565
566 function getStatus() {
567         $.getJSON("getStatus.ajax", {"loadAllSones": isKnownSonesPage()}, function(data, textStatus) {
568                 if ((data != null) && data.success) {
569                         /* process Sone information. */
570                         $.each(data.sones, function(index, value) {
571                                 updateSoneStatus(value.id, value.name, value.status, value.modified, value.locked, value.lastUpdated);
572                         });
573                         /* process notifications. */
574                         $.each(data.notifications, function(index, value) {
575                                 oldNotification = $("#sone #notification-area .notification#" + value.id);
576                                 notification = ajaxifyNotification(createNotification(value.id, value.text, value.dismissable)).hide();
577                                 if (oldNotification.length != 0) {
578                                         oldNotification.replaceWith(notification.show());
579                                 } else {
580                                         $("#sone #notification-area").append(notification);
581                                         notification.slideDown();
582                                 }
583                                 setActivity();
584                         });
585                         $.each(data.removedNotifications, function(index, value) {
586                                 $("#sone #notification-area .notification#" + value.id).slideUp();
587                         });
588                         /* process new posts. */
589                         $.each(data.newPosts, function(index, value) {
590                                 loadNewPost(value);
591                         });
592                         /* process new replies. */
593                         $.each(data.newReplies, function(index, value) {
594                                 loadNewReply(value);
595                         });
596                         /* do it again in 5 seconds. */
597                         setTimeout(getStatus, 5000);
598                 } else {
599                         /* data.success was false, wait 30 seconds. */
600                         setTimeout(getStatus, 30000);
601                 }
602         }, function(xmlHttpRequest, textStatus, error) {
603                 /* something really bad happend, wait a minute. */
604                 setTimeout(getStatus, 60000);
605         })
606 }
607
608 /**
609  * Returns the content of the page-id attribute.
610  *
611  * @returns The page ID
612  */
613 function getPageId() {
614         return $("#sone .page-id").text();
615 }
616
617 /**
618  * Returns whether the current page is the index page.
619  *
620  * @returns {Boolean} <code>true</code> if the current page is the index page,
621  *          <code>false</code> otherwise
622  */
623 function isIndexPage() {
624         return getPageId() == "index";
625 }
626
627 /**
628  * Returns whether the current page is a “view Sone” page.
629  *
630  * @returns {Boolean} <code>true</code> if the current page is a “view Sone”
631  *          page, <code>false</code> otherwise
632  */
633 function isViewSonePage() {
634         return getPageId() == "view-sone";
635 }
636
637 /**
638  * Returns the ID of the currently shown Sone. This will only return a sensible
639  * value if isViewSonePage() returns <code>true</code>.
640  *
641  * @returns The ID of the currently shown Sone
642  */
643 function getShownSoneId() {
644         return $("#sone .sone-id").text();
645 }
646
647 /**
648  * Returns whether the current page is a “view post” page.
649  *
650  * @returns {Boolean} <code>true</code> if the current page is a “view post”
651  *          page, <code>false</code> otherwise
652  */
653 function isViewPostPage() {
654         return getPageId() == "view-post";
655 }
656
657 /**
658  * Returns the ID of the currently shown post. This will only return a sensible
659  * value if isViewPostPage() returns <code>true</code>.
660  *
661  * @returns The ID of the currently shown post
662  */
663 function getShownPostId() {
664         return $("#sone .post-id").text();
665 }
666
667 /**
668  * Returns whether the current page is the “known Sones” page.
669  *
670  * @returns {Boolean} <code>true</code> if the current page is the “known
671  *          Sones” page, <code>false</code> otherwise
672  */
673 function isKnownSonesPage() {
674         return getPageId() == "known-sones";
675 }
676
677 /**
678  * Returns whether a post with the given ID exists on the current page.
679  *
680  * @param postId
681  *            The post ID to check for
682  * @returns {Boolean} <code>true</code> if a post with the given ID already
683  *          exists on the page, <code>false</code> otherwise
684  */
685 function hasPost(postId) {
686         return $(".post#" + postId).length > 0;
687 }
688
689 /**
690  * Returns whether a reply with the given ID exists on the current page.
691  *
692  * @param replyId
693  *            The reply ID to check for
694  * @returns {Boolean} <code>true</code> if a reply with the given ID already
695  *          exists on the page, <code>false</code> otherwise
696  */
697 function hasReply(replyId) {
698         return $("#sone .reply#" + replyId).length > 0;
699 }
700
701 function loadNewPost(postId) {
702         if (hasPost(postId)) {
703                 return;
704         }
705         $.getJSON("getPost.ajax", { "post" : postId }, function(data, textStatus) {
706                 if ((data != null) && data.success) {
707                         if (hasPost(data.post.id)) {
708                                 return;
709                         }
710                         if (!isIndexPage() && !(isViewSonePage() && ((getShownSoneId() == data.post.sone) || (getShownSoneId() == data.post.recipient)))) {
711                                 return;
712                         }
713                         var firstOlderPost = null;
714                         $("#sone .post").each(function() {
715                                 if (getPostTime(this) < data.post.time) {
716                                         firstOlderPost = $(this);
717                                         return false;
718                                 }
719                         });
720                         newPost = $(data.post.html).addClass("hidden");
721                         if (firstOlderPost != null) {
722                                 newPost.insertBefore(firstOlderPost);
723                         } else {
724                                 $("#sone #posts").append(newPost);
725                         }
726                         ajaxifyPost(newPost);
727                         newPost.slideDown();
728                         setActivity();
729                 }
730         });
731 }
732
733 function loadNewReply(replyId) {
734         if (hasReply(replyId)) {
735                 return;
736         }
737         $.getJSON("getReply.ajax", { "reply": replyId }, function(data, textStatus) {
738                 /* find post. */
739                 if ((data != null) && data.success) {
740                         if (hasReply(data.reply.id)) {
741                                 return;
742                         }
743                         $("#sone .post#" + data.reply.postId).each(function() {
744                                 var firstNewerReply = null;
745                                 $(this).find(".replies .reply").each(function() {
746                                         if (getReplyTime(this) > data.reply.time) {
747                                                 firstNewerReply = $(this);
748                                                 return false;
749                                         }
750                                 });
751                                 newReply = $(data.reply.html).addClass("hidden");
752                                 if (firstNewerReply != null) {
753                                         newReply.insertBefore(firstNewerReply);
754                                 } else {
755                                         if ($(this).find(".replies .create-reply")) {
756                                                 $(this).find(".replies .create-reply").before(newReply);
757                                         } else {
758                                                 $(this).find(".replies").append(newReply);
759                                         }
760                                 }
761                                 ajaxifyReply(newReply);
762                                 newReply.slideDown();
763                                 setActivity();
764                                 return false;
765                         });
766                 }
767         });
768 }
769
770 function markPostAsKnown(postElements) {
771         $(postElements).each(function() {
772                 postElement = this;
773                 if ($(postElement).hasClass("new")) {
774                         (function(postElement) {
775                                 $.getJSON("markPostAsKnown.ajax", {"formPassword": getFormPassword(), "post": getPostId(postElement)}, function(data, textStatus) {
776                                         $(postElement).removeClass("new");
777                                 });
778                         })(postElement);
779                 }
780         });
781         markReplyAsKnown($(postElements).find(".reply"));
782 }
783
784 function markReplyAsKnown(replyElements) {
785         $(replyElements).each(function() {
786                 replyElement = this;
787                 if ($(replyElement).hasClass("new")) {
788                         (function(replyElement) {
789                                 $.getJSON("markReplyAsKnown.ajax", {"formPassword": getFormPassword(), "reply": getReplyId(replyElement)}, function(data, textStatus) {
790                                         $(replyElement).removeClass("new");
791                                 });
792                         })(replyElement);
793                 }
794         });
795 }
796
797 function resetActivity() {
798         title = document.title;
799         if (title.indexOf('(') == 0) {
800                 document.title = title.substr(title.indexOf(' ') + 1);
801         }
802 }
803
804 function setActivity() {
805         if (!focus) {
806                 title = document.title;
807                 if (title.indexOf('(') != 0) {
808                         document.title = "(!) " + title;
809                 }
810         }
811 }
812
813 /**
814  * Creates a new notification.
815  *
816  * @param id
817  *            The ID of the notificaiton
818  * @param text
819  *            The text of the notification
820  * @param dismissable
821  *            <code>true</code> if the notification can be dismissed by the
822  *            user
823  */
824 function createNotification(id, text, dismissable) {
825         notification = $("<div></div>").addClass("notification").attr("id", id);
826         if (dismissable) {
827                 dismissForm = $("#sone #notification-area #notification-dismiss-template").clone().removeClass("hidden").removeAttr("id")
828                 dismissForm.find("input[name=notification]").val(id);
829                 notification.append(dismissForm);
830         }
831         notification.append(text);
832         return notification;
833 }
834
835 /**
836  * Shows the details of the notification with the given ID.
837  *
838  * @param notificationId
839  *            The ID of the notification
840  */
841 function showNotificationDetails(notificationId) {
842         $("#sone .notification#" + notificationId + " .text").show();
843         $("#sone .notification#" + notificationId + " .short-text").hide();
844 }
845
846 //
847 // EVERYTHING BELOW HERE IS EXECUTED AFTER LOADING THE PAGE
848 //
849
850 var focus = true;
851
852 $(document).ready(function() {
853
854         /* this initializes the status update input field. */
855         getTranslation("WebInterface.DefaultText.StatusUpdate", function(defaultText) {
856                 registerInputTextareaSwap("#sone #update-status .status-input", defaultText, "text", false, false);
857                 $("#sone #update-status").submit(function() {
858                         if ($(this).find(":input.default:enabled").length > 0) {
859                                 return false;
860                         }
861                         text = $(this).find(":input:enabled").val();
862                         $.getJSON("createPost.ajax", { "formPassword": getFormPassword(), "text": text }, function(data, textStatus) {
863                                 if ((data != null) && data.success) {
864                                         loadNewPost(data.postId);
865                                 }
866                         });
867                         $(this).find(":input:enabled").val("").blur();
868                         return false;
869                 });
870         });
871
872         /* ajaxify input field on “view Sone” page. */
873         getTranslation("WebInterface.DefaultText.Message", function(defaultText) {
874                 registerInputTextareaSwap("#sone #post-message input[name=text]", defaultText, "text", false, false);
875                 $("#sone #post-message").submit(function() {
876                         text = $(this).find(":input:enabled").val();
877                         $.getJSON("createPost.ajax", { "formPassword": getFormPassword(), "recipient": getShownSoneId(), "text": text }, function(data, textStatus) {
878                                 if ((data != null) && data.success) {
879                                         loadNewPost(data.postId);
880                                 }
881                         });
882                         $(this).find(":input:enabled").val("").blur();
883                         return false;
884                 });
885         });
886
887         /* Ajaxifies all posts. */
888         /* calling getTranslation here will cache the necessary values. */
889         getTranslation("WebInterface.Confirmation.DeletePostButton", function(text) {
890                 getTranslation("WebInterface.Confirmation.DeleteReplyButton", function(text) {
891                         getTranslation("WebInterface.DefaultText.Reply", function(text) {
892                                 $("#sone .post").each(function() {
893                                         ajaxifyPost(this);
894                                 });
895                         });
896                 });
897         });
898
899         /* hides all replies but the latest two. */
900         if (!isViewPostPage()) {
901                 getTranslation("WebInterface.ClickToShow.Replies", function(text) {
902                         $("#sone .post .replies").each(function() {
903                                 allReplies = $(this).find(".reply");
904                                 if (allReplies.length > 2) {
905                                         newHidden = false;
906                                         for (replyIndex = 0; replyIndex < (allReplies.length - 2); ++replyIndex) {
907                                                 $(allReplies[replyIndex]).addClass("hidden");
908                                                 newHidden |= $(allReplies[replyIndex]).hasClass("new");
909                                         }
910                                         clickToShowElement = $("<div></div>").addClass("click-to-show");
911                                         if (newHidden) {
912                                                 clickToShowElement.addClass("new");
913                                         }
914                                         (function(clickToShowElement, allReplies, text) {
915                                                 clickToShowElement.text(text);
916                                                 clickToShowElement.click(function() {
917                                                         allReplies.removeClass("hidden");
918                                                         clickToShowElement.addClass("hidden");
919                                                 });
920                                         })(clickToShowElement, allReplies, text);
921                                         $(allReplies[0]).before(clickToShowElement);
922                                 }
923                         });
924                 });
925         }
926
927         /*
928          * convert all “follow”, “unfollow”, “lock”, and “unlock” links to something
929          * nicer.
930          */
931         $("#sone .follow").submit(function() {
932                 var followElement = this;
933                 $.getJSON("followSone.ajax", { "sone": getSoneId(this), "formPassword": getFormPassword() }, function() {
934                         $(followElement).addClass("hidden");
935                         $(followElement).parent().find(".unfollow").removeClass("hidden");
936                 });
937                 return false;
938         });
939         $("#sone .unfollow").submit(function() {
940                 var unfollowElement = this;
941                 $.getJSON("unfollowSone.ajax", { "sone": getSoneId(this), "formPassword": getFormPassword() }, function() {
942                         $(unfollowElement).addClass("hidden");
943                         $(unfollowElement).parent().find(".follow").removeClass("hidden");
944                 });
945                 return false;
946         });
947         $("#sone .lock").submit(function() {
948                 var lockElement = this;
949                 $.getJSON("lockSone.ajax", { "sone" : getSoneId(this), "formPassword" : getFormPassword() }, function() {
950                         $(lockElement).addClass("hidden");
951                         $(lockElement).parent().find(".unlock").removeClass("hidden");
952                 });
953                 return false;
954         });
955         $("#sone .unlock").submit(function() {
956                 var unlockElement = this;
957                 $.getJSON("unlockSone.ajax", { "sone" : getSoneId(this), "formPassword" : getFormPassword() }, function() {
958                         $(unlockElement).addClass("hidden");
959                         $(unlockElement).parent().find(".lock").removeClass("hidden");
960                 });
961                 return false;
962         });
963
964         /* process all existing notifications, ajaxify dismiss buttons. */
965         $("#sone #notification-area .notification").each(function() {
966                 ajaxifyNotification($(this));
967         });
968
969         /* activate status polling. */
970         setTimeout(getStatus, 5000);
971
972         /* reset activity counter when the page has focus. */
973         $(window).focus(function() {
974                 focus = true;
975                 resetActivity();
976         }).blur(function() {
977                 focus = false;
978         })
979
980 });