Duplicate IDs are not allowed in HTML and do make problems. Use classes.
[Sone.git] / src / main / resources / static / javascript / sone.js
1 /* Sone JavaScript functions. */
2
3 function registerInputTextareaSwap(inputSelector, defaultText, inputFieldName, optional) {
4         $(inputSelector).each(function() {
5                 textarea = $("<textarea name=\"" + inputFieldName + "\"></textarea>").blur(function() {
6                         if ($(this).val() == "") {
7                                 $(this).hide();
8                                 $(this).data("inputField").show().removeAttr("disabled");
9                         }
10                 }).hide().data("inputField", $(this));
11                 $(this).after(textarea);
12                 (function(inputField, textarea) {
13                         $(inputField).focus(function() {
14                                 $(this).hide().attr("disabled", "disabled");
15                                 textarea.show().focus();
16                         }).addClass("default");
17                         (function(inputField) {
18                                 $.getJSON("ajax/getTranslation.ajax", {"key": defaultText}, function(data, textStatus) {
19                                         $(inputField).val(data.value);
20                                 });
21                         })(inputField);
22                         $(inputField.form).submit(function() {
23                                 if (!optional && (textarea.val() == "")) {
24                                         return false;
25                                 }
26                         });
27                 })(this, textarea);
28         });
29 }
30
31 /* hide all the “create reply” forms until a link is clicked. */
32 function addCommentLinks() {
33         $("#sone .post").each(function() {
34                 postId = $(this).attr("id");
35                 commentElement = (function(postId) {
36                         var commentElement = $("<div><span>Comment</span></div>").addClass("show-reply-form").click(function() {
37                                 replyElement = $("#sone .post#" + postId + " .create-reply");
38                                 replyElement.removeClass("hidden");
39                                 replyElement.removeClass("light");
40                                 (function(replyElement) {
41                                         replyElement.find("input.reply-input").blur(function() {
42                                                 if ($(this).hasClass("default")) {
43                                                         replyElement.addClass("light");
44                                                 }
45                                         }).focus(function() {
46                                                 replyElement.removeClass("light");
47                                         });
48                                 })(replyElement);
49                                 replyElement.find("input.reply-input").focus();
50                         });
51                         return commentElement;
52                 })(postId);
53                 $(this).find(".create-reply").addClass("hidden");
54                 $(this).find(".status-line .time").each(function() {
55                         $(this).after(commentElement.clone(true));
56                 });
57         });
58 }
59
60 /**
61  * Fires off an AJAX request to retrieve the current status of a Sone.
62  *
63  * @param soneId
64  *            The ID of the Sone
65  */
66 function getSoneStatus(soneId) {
67         $.getJSON("ajax/getSoneStatus.ajax", {"sone": soneId}, function(data, textStatus) {
68                 updateSoneStatus(soneId, data.status, data.modified, data.lastUpdated);
69                 /* seconds! */
70                 updateInterval = 60;
71                 if (data.age < 600) {
72                         updateInterval = 5;
73                 } else if (data.age < 86400) {
74                         updateInterval = 30;
75                 }
76                 setTimeout(function() {
77                         getSoneStatus(soneId);
78                 }, updateInterval * 1000);
79         });
80 }
81
82 /**
83  * Updates the status of the given Sone.
84  *
85  * @param soneId
86  *            The ID of the Sone to update
87  * @param status
88  *            The status of the Sone (“idle”, “unknown”, “inserting”,
89  *            “downloading”)
90  * @param modified
91  *            Whether the Sone is modified
92  * @param lastUpdated
93  *            The date and time of the last update (formatted for display)
94  */
95 function updateSoneStatus(soneId, status, modified, lastUpdated) {
96         $("#sone .sone." + soneId).
97                 toggleClass("unknown", status == "unknown").
98                 toggleClass("idle", status == "idle").
99                 toggleClass("inserting", status == "inserting").
100                 toggleClass("downloading", status == "downloading").
101                 toggleClass("modified", modified);
102         $("#sone .sone." + soneId + " .last-update span.time").text(lastUpdated);
103 }
104
105 var watchedSones = {};
106
107 /**
108  * Watches this Sone for updates to its status.
109  *
110  * @param soneId
111  *            The ID of the Sone to watch
112  */
113 function watchSone(soneId) {
114         if (watchedSones[soneId]) {
115                 return;
116         }
117         watchedSones[soneId] = true;
118         (function(soneId) {
119                 setTimeout(function() {
120                         getSoneStatus(soneId);
121                 }, 5000);
122         })(soneId);
123 }