Changeset 36076

Timestamp:

12/06/09 03:27:16 (3 years ago)

Author:

NeoCat

Message:

Make Re-tab to another div element to avoid render HTML every time.

Files:

• websites/twicli/twicli.html (modified) (22 diffs)

websites/twicli/twicli.html

@@ -27 +27 @@
 #menu a.new { background-color: #fcc; }
 
-#tw, #tw2 { position: absolute; left: 0px; top: 54px; width: 100%; font-size: small; }
+.tw { position: absolute; left: 0px; top: 54px; width: 100%; font-size: small; }
+#re { display: none; }
 #tw2 { background-color: #ffd; display: none; min-height: 448px; }
 #tw > div { border-bottom: 1px solid #777; }
-#tw > div > div, #tw2c > div > div { padding: 1px; border-bottom: 1px solid #999; }
+.tw-parent > div > div { padding: 1px; border-bottom: 1px solid #999; }
 .dummy { border-bottom: 0; padding: 0; height: 0; clear: both; }
 .uicon { float: left; width: 32px; height: 32px; }
@@ -50 +51 @@
 .lock { position: relative; top: 2px; left: 0; }
 .close { color: red; }
-#get_old, #next { text-align: center; background-color: #999; color: #fec; cursor: pointer; }
+.get-next { text-align: center; background-color: #999; color: #fec; cursor: pointer; }
 #rep { display: none; background-color: #fee; position: absolute; width: 90%; left: 4%; top: 200px; border: 4px solid #666; z-index: 2; padding: 2px; font-size: small; }
 #reps { margin-top: 5px; }
@@ -71 +72 @@
         #menu a { padding: 1px 5px; height: 22px; line-height: 22px; }
         #menu a.sel { height: 24px; }
-        #tw, #tw2 { margin-top: 5px; }
+        .tw { margin-top: 5px; }
 }
 --></style>
@@ -83 +84 @@
         $("menu").style.top = $("counter-div").style.top = h+3+exh*5;
         $("control").style.height = h+23+exh*5;
-        $("tw").style.top = $("tw2").style.top = h+24+exh*4;
+        $("tw").style.top = $("tw2").style.top = $("re").style.top = h+24+exh*4;
 }
 // 文字参照をデコード
@@ -269 +270 @@
 </div>
 <!--メインタイムライン-->
-<div id="tw"></div>
-<!--TL以外のタブ-->
-<div id="tw2"><div id="tw2h"></div><div id="tw2c"></div></div>
+<div id="tw" class="tw tw-parent"></div>
+<!--Reply-->
+<div id="re" class="tw tw-parent"></div>
+<!--TL,Re以外のタブ-->
+<div id="tw2" class="tw"><div id="tw2h"></div><div id="tw2c" class="tw-parent"></div></div>
 <!--返信-->
 <div id="rep"><a href="javascript:closeRep()" class="close"><img alt="×" src="clr.png"></a>
@@ -301 +304 @@
 pluginstr = pluginstr.substr(1);
 var plugins = new Array;
-var nr_limit = parseInt(readCookie('limit')) || 500;                            // 表示する発言数の上限
-var max_count = (cookieVer>3) && parseInt(readCookie('max_count')) || 50;
-var max_count_u = parseInt(readCookie('max_count_u')) || 50;
+var max_count = Math.min((cookieVer>3) && parseInt(readCookie('max_count')) || 50, 200);
+var max_count_u = Math.min(parseInt(readCookie('max_count_u')) || 50, 200);;
+var nr_limit = Math.max(max_count*2.5, parseInt(readCookie('limit')) || 500);           // 表示する発言数の上限
 var no_since_id = parseInt(readCookie('no_since_id') || "0");           // since_idを使用しない
 var no_counter = parseInt(readCookie('no_counter') || "0");                     // 発言文字数カウンタを無効化
@@ -313 +316 @@
 var nr_tw = 0;                                  // 現在のTLの発言数
 var cur_page = 1;                               // 現在表示中のページ
-var nr_page = 0;        // 次に取得するページ
+var nr_page = 0;                                // 次に取得するページ
+var nr_page_re = 0;                             // 次に取得するページ(reply用)
 var get_next_func = getOldTL;   // 次ページ取得関数
 var since_id = null;                    // TLの最終since_id
@@ -319 +323 @@
 var in_reply_to_user = null;    // 発言の返信先
 var tl_oldest_id = null;                // TLの最も古いid
-var last_replies = [];                  // 受信した返信
 // クロスドメイン通信関連
 var seq = (new Date).getTime();
@@ -328 +331 @@
 var update_ele2 = null;
 var reply_ele = null;
+var reply_ele2 = null;
 var direct_ele1 = null;
 var direct_ele2 = null;
@@ -612 +616 @@
         var ret = document.createElement('div');
         ret.id = id;
+        ret.className = 'get-next';
         ret.onclick = function() { getNext(this); };
         ret.innerHTML = '▽' + (p ? '(' + p + ')' : '');
@@ -702 +707 @@
 }
 // 新着reply受信通知
-function noticeNewReply() {
+function noticeNewReply(replies) {
         if ($("reply").className.indexOf("new") < 0)
                 $("reply").className += " new";
-        callPlugins("noticeNewReply");
-        if (selected_menu.id == "reply")
-                twShow2(last_replies);
-}
-// last_repliesの重複排除・要素数制限
-function cleanupLastReplies() {
-        var rep_ids = [];
-        for (var i = 0; i < last_replies.length; i++) {
-                if (rep_ids[last_replies[i].id]) {
-                        last_replies.splice(i--, 1);
-                }
-                rep_ids[last_replies[i].id] = 1;
-        }
-        last_replies.splice(nr_limit);
+        callPlugins("noticeNewReply", replies);
 }
 // 受信repliesを表示
-function twReplies(tw) {
+function twReplies(tw, fromTL) {
         if (tw.error) return alert(tw.error);
-        last_replies = tw.concat(last_replies);
-        cleanupLastReplies();
         tw.reverse();
         for (var j in tw) callPlugins("gotNewReply", tw[j]);
         tw.reverse();
-        var nr = tw.length;
-        if (replies_in_tl)
-                nr = twShowToNode(tw, $("tw"), false, false, true, false, true);
-        if (nr > 0)
-                noticeNewReply();
-        else if (selected_menu.id == "reply")
-                twShow2(last_replies);
-        if (tw.length > 0) since_id_reply = tw[0].id;
+        if (nr_page_re == 0) {
+                nr_page_re = 2;
+                $("re").appendChild(nextButton('get_old_re', nr_page_re));
+        }
+        twShowToNode(tw, $("re"), false, false, true, false, false, false, fromTL);
+        if (!fromTL && replies_in_tl)
+                twShowToNode(tw, $("tw"), false, false, true, false, true);
+        if (!fromTL && tw.length > 0) since_id_reply = tw[0].id;
 }
 // 受信twitを表示
@@ -757 +747 @@
         twShowToNode(tw, $("tw"), false, false, true, true, true);
         if (tl_oldest_id && update_reply_counter-- <= 0) {
-                update_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
+                reply_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
                                                 '&count=' + (since_id_reply ? 200 : max_count_u) +
                                                 (since_id_reply ? '&since_id='+since_id_reply : '') +
                                                 '&callback=twReplies',
-                                        update_ele2);
+                                        reply_ele2);
                 update_reply_counter = 4;
         }
@@ -774 +764 @@
         if (tw.error) return alert(tw.error);
         var tmp = $("tmp");
+        twShowToNode(tw, $("tw"), false, true, false, false, false, true);
         if (tmp && tmp.parentNode) tmp.parentNode.removeChild(tmp);
-        twShowToNode(tw, $("tw"), false, true, false, false, false, true);
         $("tw").appendChild(nextButton('get_old', nr_page));
+}
+function twOldReply(tw) {
+        if (tw.error) return alert(tw.error);
+        var tmp = $("tmp");
+        twShowToNode(tw, $("re"), false, true, false, false, false, true);
+        if (tmp && tmp.parentNode) tmp.parentNode.removeChild(tmp);
+        $("re").appendChild(nextButton('get_old_re', nr_page_re));
 }
 function twShow2(tw) {
@@ -802 +799 @@
         }
 }
-function twShowToNode(tw, twNode, no_name, after, animation, check_since, ignore_old, ignore_new) {
+function twShowToNode(tw, twNode, no_name, after, animation, check_since, ignore_old, ignore_new, weak) {
         $('loading').style.display = 'none';
         var len = tw.length;
@@ -810 +807 @@
         var myname_r = new RegExp("@"+myname+"\\b","i");
         var nr_show = 0;
-        var need_cleanup_last_replies = false;
+        var replies = [];
         for (var i = len-1; i >= 0; i--) {
-                if ($(twNode.id + "-" + tw[i].id))
-                        continue;
+                var duplication = $(twNode.id + "-" + tw[i].id);
+                if (duplication) {
+                        if (duplication.weak)
+                                duplication.parentNode.removeChild(duplication);
+                        else
+                                continue;
+                }
                 if (ignore_old && tl_oldest_id > tw[i].id)
                         continue;
@@ -824 +826 @@
                         s.screen_name = tw[i].user.screen_name;
                         s.tw = tw[i]; // DOMツリーにJSONを記録
+                        if (weak) s.weak = true;
                         if (tw[i].d_dir == 1 || tw[i].text.match(myname_r)) {
                                 s.className = "tome";
-                                if (animation) {
-                                        last_replies.unshift(tw[i]);
-                                        need_cleanup_last_replies = true;
-                                        noticeNewReply();
+                                if (animation && !duplication) {
+                                        replies.push(tw[i]);
                                 }
                         }
@@ -865 +866 @@
         if (animation) {
                 nr_tw += nr_show;
-                while (nr_tw > nr_limit) {
-                        var last_node = twNode.childNodes[twNode.childNodes.length-1];
-                        nr_tw -= last_node.childNodes.length;
-                        twNode.removeChild(last_node);
-                }
-                tl_oldest_id = 0; // 最大3ブロックスキャンしてoldest更新(repliesの挿入等により必ずしもID順でない)
-                for (var i = 0; i < 3 && i < twNode.childNodes.length; i++) {
-                        var target_block = twNode.childNodes[twNode.childNodes.length-i-1].childNodes;
-                        for (var j = 0; j < target_block.length; j++)
-                                if (target_block[j].tw && (target_block[j].tw.id < tl_oldest_id || !tl_oldest_id))
-                                        tl_oldest_id = target_block[j].tw.id;
+                if (nr_tw > nr_limit) {
+                        while (nr_tw > nr_limit) {
+                                var last_node = twNode.childNodes[twNode.childNodes.length-1];
+                                nr_tw -= last_node.childNodes.length;
+                                twNode.removeChild(last_node);
+                        }
+                        if (twNode.id == 'TL') {
+                                tl_oldest_id = 0; // 最大3ブロックスキャンしてoldest更新(repliesの挿入等により必ずしもID順でない)
+                                for (var i = 0; i < 3 && i < twNode.childNodes.length; i++) {
+                                        var target_block = twNode.childNodes[twNode.childNodes.length-i-1].childNodes;
+                                        var target_ele = target_block[target_block.length-1];
+                                        if (target_ele.tw && (target_ele.tw.id < tl_oldest_id || !tl_oldest_id))
+                                                tl_oldest_id = target_ele.tw.id;
+                                }
+                        }
                 }
         }
@@ -884 +889 @@
                 }
         }
-        if (need_cleanup_last_replies)
-                cleanupLastReplies();
+        if (replies.length) {
+                if (twNode.id == "tw")
+                        twReplies(replies, true);
+                else 
+                        noticeNewReply(replies);
+        }
         return nr_show;
 }
@@ -911 +920 @@
                                 '&callback=twOld', update_ele2);
 }
+function getOldReply() {
+        update_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
+                                '&count=' + max_count_u + '&page=' + (nr_page_re++) +
+                                '&callback=twOldReply', update_ele2);
+}
 function getNextFuncCommon() {
         if (selected_menu.id == "user" && !fav_mode)
@@ -919 +933 @@
                 update_ele2 = loadXDomainScript(twitterAPI + 'favorites/' + last_user + '.json?seq=' + (seq++) +
                                         '&page=' + (++cur_page) + '&callback=twShow2', update_ele2);
-        else if (selected_menu.id == "reply")
-                update_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
-                                        '&count=' + max_count_u + '&page=' + (++cur_page) +
-                                        '&callback=twShow2', update_ele2);
 }
 // タイムライン切り替え
@@ -930 +940 @@
         selected_menu.className = "sel";
         $("tw").style.display = id=="TL"?"block":"none";
+        $("re").style.display = id=="reply"?"block":"none";
         $("tw2h").innerHTML = "";
         $("tw2c").innerHTML = "";
-        $("tw2").style.display = id!="TL"?"block":"none";
+        $("tw2").style.display = id!="TL"&&id!="reply"?"block":"none";
         $("rep").style.display = "none";
         scrollTo(0, 1); scrollTo(0, 0);
@@ -943 +954 @@
 }
 function switchReply() {
-        if (selected_menu.id == "reply" || last_replies.length == 0) {
+        get_next_func = getOldReply;
+        if (selected_menu.id == "reply") {
                 switchTo("reply");
                 $("loading").style.display = "block";
-                update_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
-                                        '&count=' + max_count_u + '&callback=twReplies', update_ele2);
+                reply_ele2 = loadXDomainScript(twitterAPI + 'statuses/mentions.json?seq=' + (seq++) +
+                                        '&count=' + max_count_u + '&callback=twReplies', reply_ele2);
         } else {
                 switchTo("reply");
-                twShow2(last_replies);
         }
 }