Wrap setting the document title into an own function to work around bugs in Chrome.

[Sone.git] / src / main / resources / static / javascript / sone.js

diff --git a/src/main/resources/static/javascript/sone.js b/src/main/resources/static/javascript/sone.js
index 6ff4ceb..fb16b97 100644 (file)
--- a/src/main/resources/static/javascript/sone.js
+++ b/src/main/resources/static/javascript/sone.js
@@ -71,7 +71,6 @@ function addCommentLink(postId, element, insertAfterThisElement) {
        commentElement = (function(postId) {
                separator = $("<span> · </span>").addClass("separator");
                var commentElement = $("<div><span>Comment</span></div>").addClass("show-reply-form").click(function() {
-                       markPostAsKnown(getPostElement(this));
                        replyElement = $("#sone .post#" + postId + " .create-reply");
                        replyElement.removeClass("hidden");
                        replyElement.removeClass("light");
@@ -606,7 +605,6 @@ function ajaxifyPost(postElement) {
                                if (success) {
                                        $(inputField).val("");
                                        loadNewReply(replyId, soneId, postId);
-                                       markPostAsKnown(getPostElement(inputField));
                                        $("#sone .post#" + postId + " .create-reply").addClass("hidden");
                                        $("#sone .post#" + postId + " .create-reply .sender").hide();
                                        $("#sone .post#" + postId + " .create-reply .select-sender").show();
@@ -630,12 +628,10 @@ function ajaxifyPost(postElement) {
        /* convert all “like” buttons to javascript functions. */
        $(postElement).find(".like-post").submit(function() {
                likePost(getPostId(this));
-               markPostAsKnown(getPostElement(this));
                return false;
        });
        $(postElement).find(".unlike-post").submit(function() {
                unlikePost(getPostId(this));
-               markPostAsKnown(getPostElement(this));
                return false;
        });
 
@@ -698,12 +694,10 @@ function ajaxifyPost(postElement) {
 function ajaxifyReply(replyElement) {
        $(replyElement).find(".like-reply").submit(function() {
                likeReply(getReplyId(this));
-               markPostAsKnown(getPostElement(this));
                return false;
        });
        $(replyElement).find(".unlike-reply").submit(function() {
                unlikeReply(getReplyId(this));
-               markPostAsKnown(getPostElement(this));
                return false;
        });
        (function(replyElement) {
@@ -728,11 +722,6 @@ function ajaxifyReply(replyElement) {
                untrustSone(getReplyAuthor(this));
                return false;
        });
-
-       /* mark post and all replies as known on click. */
-       $(replyElement).click(function() {
-               markPostAsKnown(getPostElement(this));
-       });
 }
 
 /**
@@ -753,6 +742,15 @@ function ajaxifyNotification(notification) {
        notification.find("form.mark-as-read button").click(function() {
                $.getJSON("markAsKnown.ajax", {"formPassword": getFormPassword(), "type": $(":input[name=type]", this.form).val(), "id": $(":input[name=id]", this.form).val()});
        });
+       notification.find("a[class^='link-']").each(function() {
+               linkElement = $(this);
+               if (linkElement.is("[href^='viewPost']")) {
+                       id = linkElement.attr("class").substr(5);
+                       if (hasPost(id)) {
+                               linkElement.attr("href", "#post-" + id);
+                       }
+               }
+       });
        notification.find("form.dismiss button").click(function() {
                $.getJSON("dismissNotification.ajax", { "formPassword" : getFormPassword(), "notification" : notification.attr("id") }, function(data, textStatus) {
                        /* dismiss in case of error, too. */
@@ -1013,10 +1011,9 @@ function markPostAsKnown(postElements) {
                postElement = this;
                if ($(postElement).hasClass("new")) {
                        (function(postElement) {
-                               $.getJSON("markAsKnown.ajax", {"formPassword": getFormPassword(), "type": "post", "id": getPostId(postElement)}, function(data, textStatus) {
-                                       $(postElement).removeClass("new");
-                                       $(".click-to-show", postElement).removeClass("new");
-                               });
+                               $(postElement).removeClass("new");
+                               $(".click-to-show", postElement).removeClass("new");
+                               $.getJSON("markAsKnown.ajax", {"formPassword": getFormPassword(), "type": "post", "id": getPostId(postElement)});
                        })(postElement);
                }
        });
@@ -1028,9 +1025,8 @@ function markReplyAsKnown(replyElements) {
                replyElement = this;
                if ($(replyElement).hasClass("new")) {
                        (function(replyElement) {
-                               $.getJSON("markAsKnown.ajax", {"formPassword": getFormPassword(), "type": "reply", "id": getReplyId(replyElement)}, function(data, textStatus) {
-                                       $(replyElement).removeClass("new");
-                               });
+                               $(replyElement).removeClass("new");
+                               $.getJSON("markAsKnown.ajax", {"formPassword": getFormPassword(), "type": "reply", "id": getReplyId(replyElement)});
                        })(replyElement);
                }
        });
@@ -1039,7 +1035,7 @@ function markReplyAsKnown(replyElements) {
 function resetActivity() {
        title = document.title;
        if (title.indexOf('(') == 0) {
-               document.title = title.substr(title.indexOf(' ') + 1);
+               setTitle(title.substr(title.indexOf(' ') + 1));
        }
 }
 
@@ -1047,12 +1043,65 @@ function setActivity() {
        if (!focus) {
                title = document.title;
                if (title.indexOf('(') != 0) {
-                       document.title = "(!) " + title;
+                       setTitle("(!) " + title);
+               }
+               if (!iconBlinking) {
+                       setTimeout(toggleIcon, 1500);
+                       iconBlinking = true;
                }
        }
 }
 
 /**
+ * Sets the window title after a small delay to prevent race-condition issues.
+ *
+ * @param title
+ *            The title to set
+ */
+function setTitle(title) {
+       setTimeout(function() {
+               document.title = title;
+       }, 50);
+}
+
+/** Whether the icon is currently showing activity. */
+var iconActive = false;
+
+/** Whether the icon is currently supposed to blink. */
+var iconBlinking = false;
+
+/**
+ * Toggles the icon. If the window has gained focus and the icon is still
+ * showing the activity state, it is returned to normal.
+ */
+function toggleIcon() {
+       if (focus) {
+               if (iconActive) {
+                       changeIcon("images/icon.png");
+                       iconActive = false;
+               }
+               iconBlinking = false;
+       } else {
+               iconActive = !iconActive;
+               console.log("showing icon: " + iconActive);
+               changeIcon(iconActive ? "images/icon-activity.png" : "images/icon.png");
+               setTimeout(toggleIcon, 1500);
+       }
+}
+
+/**
+ * Changes the icon of the page.
+ *
+ * @param iconUrl
+ *            The new URL of the icon
+ */
+function changeIcon(iconUrl) {
+       $("link[rel=icon]").remove();
+       $("head").append($("<link>").attr("rel", "icon").attr("type", "image/png").attr("href", iconUrl));
+       $("iframe[id=icon-update]")[0].src += "";
+}
+
+/**
  * Creates a new notification.
  *
  * @param id