src/main/resources/static/javascript/sone.js

   1 /* Sone JavaScript functions. */
   2
   3 function isOnline() {
   4         return $("#sone").hasClass("online");
   5 }
   6
   7 function registerInputTextareaSwap(inputSelector, defaultText, inputFieldName, optional, dontUseTextarea) {
   8         $(inputSelector).each(function() {
   9                 textarea = $(dontUseTextarea ? "<input type=\"text\" name=\"" + inputFieldName + "\">" : "<textarea name=\"" + inputFieldName + "\"></textarea>").blur(function() {
  10                         if ($(this).val() == "") {
  11                                 $(this).hide();
  12                                 inputField = $(this).data("inputField");
  13                                 inputField.show().removeAttr("disabled").addClass("default");
  14                                 (function(inputField) {
  15                                         getTranslation(defaultText, function(translation) {
  16                                                 inputField.val(translation);
  17                                         });
  18                                 })(inputField);
  19                         }
  20                 }).hide().data("inputField", $(this)).val($(this).val());
  21                 $(this).after(textarea);
  22                 (function(inputField, textarea) {
  23                         inputField.focus(function() {
  24                                 $(this).hide().attr("disabled", "disabled");
  25                                 textarea.show().focus();
  26                         });
  27                         if (inputField.val() == "") {
  28                                 inputField.addClass("default");
  29                                 (function(inputField) {
  30                                         getTranslation(defaultText, function(translation) {
  31                                                 inputField.val(translation);
  32                                         });
  33                                 })(inputField);
  34                         } else {
  35                                 inputField.hide().attr("disabled", "disabled");
  36                                 textarea.show();
  37                         }
  38                         $(inputField.get(0).form).submit(function() {
  39                                 if (!optional && (textarea.val() == "")) {
  40                                         return false;
  41                                 }
  42                         });
  43                 })($(this), textarea);
  44         });
  45 }
  46
  47 /* hide all the “create reply” forms until a link is clicked. */
  48 function addCommentLinks() {
  49         if (!isOnline()) {
  50                 return;
  51         }
  52         $("#sone .post").each(function() {
  53                 postId = $(this).attr("id");
  54                 commentElement = (function(postId) {
  55                         var commentElement = $("<div><span>Comment</span></div>").addClass("show-reply-form").click(function() {
  56                                 replyElement = $("#sone .post#" + postId + " .create-reply");
  57                                 replyElement.removeClass("hidden");
  58                                 replyElement.removeClass("light");
  59                                 (function(replyElement) {
  60                                         replyElement.find("input.reply-input").blur(function() {
  61                                                 if ($(this).hasClass("default")) {
  62                                                         replyElement.addClass("light");
  63                                                 }
  64                                         }).focus(function() {
  65                                                 replyElement.removeClass("light");
  66                                         });
  67                                 })(replyElement);
  68                                 replyElement.find("input.reply-input").focus();
  69                         });
  70                         return commentElement;
  71                 })(postId);
  72                 $(this).find(".create-reply").addClass("hidden");
  73                 $(this).find(".status-line .time").each(function() {
  74                         $(this).after(commentElement.clone(true));
  75                 });
  76         });
  77 }
  78
  79 /**
  80  * Retrieves the translation for the given key and calls the callback function.
  81  * The callback function takes a single parameter, the translated string.
  82  *
  83  * @param key
  84  *            The key of the translation string
  85  * @param callback
  86  *            The callback function
  87  */
  88 function getTranslation(key, callback) {
  89         $.getJSON("ajax/getTranslation.ajax", {"key": key}, function(data, textStatus) {
  90                 callback(data.value);
  91         });
  92 }
  93
  94 /**
  95  * Fires off an AJAX request to retrieve the current status of a Sone.
  96  *
  97  * @param soneId
  98  *            The ID of the Sone
  99  */
 100 function getSoneStatus(soneId) {
 101         $.getJSON("ajax/getSoneStatus.ajax", {"sone": soneId}, function(data, textStatus) {
 102                 updateSoneStatus(soneId, data.name, data.status, data.modified, data.lastUpdated);
 103                 /* seconds! */
 104                 updateInterval = 60;
 105                 if (data.modified || (data.status == "downloading") || (data.status == "inserting")) {
 106                         updateInterval = 5;
 107                 }
 108                 setTimeout(function() {
 109                         getSoneStatus(soneId);
 110                 }, updateInterval * 1000);
 111         });
 112 }
 113
 114 /**
 115  * Filters the given Sone ID, replacing all “~” characters by an underscore.
 116  *
 117  * @param soneId
 118  *            The Sone ID to filter
 119  * @returns The filtered Sone ID
 120  */
 121 function filterSoneId(soneId) {
 122         return soneId.replace(/[^a-zA-Z0-9-]/g, "_");
 123 }
 124
 125 /**
 126  * Updates the status of the given Sone.
 127  *
 128  * @param soneId
 129  *            The ID of the Sone to update
 130  * @param status
 131  *            The status of the Sone (“idle”, “unknown”, “inserting”,
 132  *            “downloading”)
 133  * @param modified
 134  *            Whether the Sone is modified
 135  * @param lastUpdated
 136  *            The date and time of the last update (formatted for display)
 137  */
 138 function updateSoneStatus(soneId, name, status, modified, lastUpdated) {
 139         $("#sone .sone." + filterSoneId(soneId)).
 140                 toggleClass("unknown", status == "unknown").
 141                 toggleClass("idle", status == "idle").
 142                 toggleClass("inserting", status == "inserting").
 143                 toggleClass("downloading", status == "downloading").
 144                 toggleClass("modified", modified);
 145         $("#sone .sone." + filterSoneId(soneId) + " .last-update span.time").text(lastUpdated);
 146         $("#sone .sone." + filterSoneId(soneId) + " .profile-link a").text(name);
 147 }
 148
 149 var watchedSones = {};
 150
 151 /**
 152  * Watches this Sone for updates to its status.
 153  *
 154  * @param soneId
 155  *            The ID of the Sone to watch
 156  */
 157 function watchSone(soneId) {
 158         if (watchedSones[soneId]) {
 159                 return;
 160         }
 161         watchedSones[soneId] = true;
 162         (function(soneId) {
 163                 setTimeout(function() {
 164                         getSoneStatus(soneId);
 165                 }, 5000);
 166         })(soneId);
 167 }
 168
 169 /**
 170  * Enhances a “delete” button so that the confirmation is done on the same page.
 171  *
 172  * @param buttonId
 173  *            The selector of the button
 174  * @param translationKey
 175  *            The translation key of the text to show on the button
 176  * @param deleteCallback
 177  *            The callback that actually deletes something
 178  */
 179 function enhanceDeleteButton(buttonId, translationKey, deleteCallback) {
 180         button = $(buttonId);
 181         (function(button) {
 182                 getTranslation(translationKey, function(translation) {
 183                         newButton = $("<button></button>").addClass("confirm").hide().text(translation).click(function() {
 184                                 $(this).fadeOut("slow");
 185                                 deleteCallback();
 186                                 return false;
 187                         }).insertAfter(button);
 188                         (function(button, newButton) {
 189                                 button.click(function() {
 190                                         button.fadeOut("slow", function() {
 191                                                 newButton.fadeIn("slow");
 192                                                 $(document).one("click", function() {
 193                                                         if (this != newButton.get(0)) {
 194                                                                 newButton.fadeOut(function() {
 195                                                                         button.fadeIn();
 196                                                                 });
 197                                                         }
 198                                                 });
 199                                         });
 200                                         return false;
 201                                 });
 202                         })(button, newButton);
 203                 });
 204         })(button);
 205 }
 206
 207 /**
 208  * Enhances a post’s “delete” button.
 209  *
 210  * @param buttonId
 211  *            The selector of the button
 212  * @param postId
 213  *            The ID of the post to delete
 214  */
 215 function enhanceDeletePostButton(buttonId, postId) {
 216         enhanceDeleteButton(buttonId, "WebInterface.Confirmation.DeletePostButton", function() {
 217                 $.getJSON("ajax/deletePost.ajax", { "post": postId, "formPassword": $("#sone #formPassword").text() }, function(data, textStatus) {
 218                         if (data.success) {
 219                                 $("#sone .post#" + postId).slideUp();
 220                         } else if (data.error == "invalid-post-id") {
 221                                 alert("Invalid post ID given!");
 222                         } else if (data.error == "auth-required") {
 223                                 alert("You need to be logged in.");
 224                         } else if (data.error == "not-authorized") {
 225                                 alert("You are not allowed to delete this post.");
 226                         }
 227                 });
 228         });
 229 }
 230
 231 /**
 232  * Enhances a reply’s “delete” button.
 233  *
 234  * @param buttonId
 235  *            The selector of the button
 236  * @param replyId
 237  *            The ID of the reply to delete
 238  */
 239 function enhanceDeleteReplyButton(buttonId, replyId) {
 240         enhanceDeleteButton(buttonId, "WebInterface.Confirmation.DeleteReplyButton", function() {
 241                 $.getJSON("ajax/deleteReply.ajax", { "reply": replyId, "formPassword": $("#sone #formPassword").text() }, function(data, textStatus) {
 242                         if (data.success) {
 243                                 $("#sone .reply#" + replyId).slideUp();
 244                         } else if (data.error == "invalid-reply-id") {
 245                                 alert("Invalid reply ID given!");
 246                         } else if (data.error == "auth-required") {
 247                                 alert("You need to be logged in.");
 248                         } else if (data.error == "not-authorized") {
 249                                 alert("You are not allowed to delete this reply.");
 250                         }
 251                 });
 252         });
 253 }
 254
 255 function getFormPassword() {
 256         return $("#sone #formPassword").text();
 257 }
 258
 259 function getSoneElement(element) {
 260         return $(element).parents(".sone");
 261 }
 262
 263 /**
 264  * Generates a list of Sones by concatening the names of the given sones with a
 265  * new line character (“\n”).
 266  *
 267  * @param sones
 268  *            The sones to format
 269  * @returns {String} The created string
 270  */
 271 function generateSoneList(sones) {
 272         var soneList = "";
 273         $.each(sones, function() {
 274                 if (soneList != "") {
 275                         soneList += "\n";
 276                 }
 277                 soneList += this.name;
 278         });
 279         return soneList;
 280 }
 281
 282 /**
 283  * Returns the ID of the Sone that this element belongs to.
 284  *
 285  * @param element
 286  *            The element to locate the matching Sone ID for
 287  * @returns The ID of the Sone, or undefined
 288  */
 289 function getSoneId(element) {
 290         return getSoneElement(element).find(".id").text();
 291 }
 292
 293 function getPostElement(element) {
 294         return $(element).parents(".post");
 295 }
 296
 297 function getPostId(element) {
 298         return getPostElement(element).attr("id");
 299 }
 300
 301 function getReplyElement(element) {
 302         return $(element).parents(".reply");
 303 }
 304
 305 function getReplyId(element) {
 306         return getReplyElement(element).attr("id");
 307 }
 308
 309 function likePost(postId) {
 310         $.getJSON("ajax/like.ajax", { "type": "post", "post" : postId, "formPassword": getFormPassword() }, function() {
 311                 $("#sone .post#" + postId + " > .inner-part > .status-line .like").addClass("hidden");
 312                 $("#sone .post#" + postId + " > .inner-part > .status-line .unlike").removeClass("hidden");
 313                 updatePostLikes(postId);
 314         });
 315 }
 316
 317 function unlikePost(postId) {
 318         $.getJSON("ajax/unlike.ajax", { "type": "post", "post" : postId, "formPassword": getFormPassword() }, function() {
 319                 $("#sone .post#" + postId + " > .inner-part > .status-line .unlike").addClass("hidden");
 320                 $("#sone .post#" + postId + " > .inner-part > .status-line .like").removeClass("hidden");
 321                 updatePostLikes(postId);
 322         });
 323 }
 324
 325 function updatePostLikes(postId) {
 326         $.getJSON("ajax/getLikes.ajax", { "type": "post", "post": postId }, function(data, textStatus) {
 327                 if (data.success) {
 328                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes").toggleClass("hidden", data.likes == 0)
 329                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes span.like-count").text(data.likes);
 330                         $("#sone .post#" + postId + " > .inner-part > .status-line .likes > span").attr("title", generateSoneList(data.sones));
 331                 }
 332         });
 333 }
 334
 335 function likeReply(replyId) {
 336         $.getJSON("ajax/like.ajax", { "type": "reply", "reply" : replyId, "formPassword": getFormPassword() }, function() {
 337                 $("#sone .reply#" + replyId + " .status-line .like").addClass("hidden");
 338                 $("#sone .reply#" + replyId + " .status-line .unlike").removeClass("hidden");
 339                 updateReplyLikes(replyId);
 340         });
 341 }
 342
 343 function unlikeReply(replyId) {
 344         $.getJSON("ajax/unlike.ajax", { "type": "reply", "reply" : replyId, "formPassword": getFormPassword() }, function() {
 345                 $("#sone .reply#" + replyId + " .status-line .unlike").addClass("hidden");
 346                 $("#sone .reply#" + replyId + " .status-line .like").removeClass("hidden");
 347                 updateReplyLikes(replyId);
 348         });
 349 }
 350
 351 function updateReplyLikes(replyId) {
 352         $.getJSON("ajax/getLikes.ajax", { "type": "reply", "reply": replyId }, function(data, textStatus) {
 353                 if (data.success) {
 354                         $("#sone .reply#" + replyId + " .status-line .likes").toggleClass("hidden", data.likes == 0)
 355                         $("#sone .reply#" + replyId + " .status-line .likes span.like-count").text(data.likes);
 356                         $("#sone .reply#" + replyId + " .status-line .likes > span").attr("title", generateSoneList(data.sones));
 357                 }
 358         });
 359 }