feat: 自動で読み込み

* 通知とアカウントページは引っ張り更新と競合してバグる
nzws · Sep 4, 2018 · 948916e · 948916e
1 parent 5d07115
commit 948916e
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 31 deletions.
diff --git a/www/index.html b/www/index.html
@@ -582,7 +582,7 @@ <h4 id="splitter-profile-name" class="acct-small" style="height: 20px"></h4>
   </ons-template>
 
   <ons-template id="alert.html">
-    <ons-page>
+    <ons-page id="alert-page">
       <ons-toolbar>
         <div class="left" id="alert_button">
           <ons-toolbar-button onclick="fn.open()">
@@ -1729,7 +1729,7 @@ <h4><span data-i18n="config.notification.keyword.title">キーワード検知</s
     </ons-page>
   </ons-template>
   <ons-template id="showtag.html">
-    <ons-page>
+    <ons-page id="showtag-page">
       <ons-toolbar>
         <div class="left">
           <ons-toolbar-button onclick="BackTab()">
@@ -1757,7 +1757,7 @@ <h4><span data-i18n="config.notification.keyword.title">キーワード検知</s
     </ons-page>
   </ons-template>
   <ons-template id="olist.html">
-    <ons-page>
+    <ons-page id="olist">
       <ons-toolbar>
         <div class="left">
           <ons-toolbar-button onclick="fn.open()">
@@ -1774,7 +1774,7 @@ <h4><span data-i18n="config.notification.keyword.title">キーワード検知</s
     </ons-page>
   </ons-template>
   <ons-template id="olist_nav.html">
-    <ons-page>
+    <ons-page id="olist_nav">
       <ons-toolbar>
         <div class="left">
           <ons-toolbar-button onclick="BackTab()">

diff --git a/www/js/init.js b/www/js/init.js
@@ -384,6 +384,18 @@ function initevent() {
     if (event.enterPage.id === 'lists-page') {
       renderListsCollection();
     }
+
+    if (event.enterPage.id === 'olist' || event.enterPage.id === 'olist_nav') {
+      event.enterPage.onInfiniteScroll = function(done) {
+        list_n(null, null, done, null, event.enterPage.id === 'olist_nav');
+      };
+    }
+
+    if (event.enterPage.id === 'showtag-page') {
+      event.enterPage.onInfiniteScroll = function(done) {
+        showTagTL(null, done);
+      };
+    }
   });
 
   document.addEventListener('postpop', function(event) {

diff --git a/www/js/list.js b/www/js/list.js
@@ -25,9 +25,13 @@ function list_n(mode, title, more_load, mode_toot, navmode) {
     pin;
   var id_title, id_main;
   if (more_load) {
+    if (!list_old_id[0]) {
+      setTimeout(function() {
+        more_load();
+      }, 500);
+      return;
+    }
     get = '?' + list_old_id[0];
-    more_load.value = 'Loading now...';
-    more_load.disabled = true;
   }
   if (mode === 'pin') {
     pin = true;
@@ -40,17 +44,17 @@ function list_n(mode, title, more_load, mode_toot, navmode) {
     id_title = 'olist_title';
     id_main = 'olist_main';
   }
+  if (!mode && more_load) {
+    mode = elemId(id_main).mode;
+    mode_toot = elemId(id_main).mode_toot;
+  }
   var xhr = new XMLHttpRequest();
   xhr.onreadystatechange = function() {
     if (xhr.readyState === 4) {
       if (xhr.status === 200 || xhr.status === 304) {
         var json = JSON.parse(xhr.responseText);
-        if (more_load) {
-          more_load.className = 'button button--large--quiet invisible';
-          reshtml = elemId(id_main).innerHTML;
-        } else {
-          elemId(id_title).innerHTML = title.match(/\./i) ? i18next.t(title) : title;
-        }
+        if (more_load) reshtml = elemId(id_main).innerHTML;
+        else elemId(id_title).innerHTML = title.match(/\./i) ? i18next.t(title) : title;
 
         while (json[i]) {
           if (mode_toot === 'toot') {
@@ -83,26 +87,21 @@ function list_n(mode, title, more_load, mode_toot, navmode) {
           list_old_id = xhr.getResponseHeader('link').match(/max_id=\d+/);
         else list_old_id = '';
 
+        if (!more_load) {
+          elemId(id_main).mode = mode;
+          elemId(id_main).mode_toot = mode_toot;
+          elemId(id_main).navmode = navmode;
+        }
+
         if (pin === true) mode = 'pin';
-        if (list_old_id !== '')
-          reshtml +=
-            "<button class='button button--large--quiet' onclick='list_n(\"" +
-            mode +
-            '", "' +
-            title +
-            '", this, "' +
-            mode_toot +
-            '", ' +
-            navmode +
-            ")'>" +
-            i18next.t('navigation.load_more') +
-            '</button>';
+
         elemId(id_main).innerHTML = reshtml;
-        return true;
       } else {
         showtoast('cannot-load');
-        return false;
       }
+      setTimeout(function() {
+        if (more_load) more_load();
+      }, 500);
     }
   };
   xhr.open('GET', 'https://' + inst + '/api/v1/' + mode + get, false);

diff --git a/www/js/timeline.js b/www/js/timeline.js
@@ -638,11 +638,8 @@ function showTagTL(tag, more_load) {
         }
 
         if (i !== 0) tag_old_id = json[i - 1]['id'];
-        reshtml +=
-          "<button class='button button--large--quiet' onclick='showTagTL(null,this)'>" +
-          i18next.t('navigation.load_more') +
-          '</button>';
         elemId('tag_main').innerHTML = reshtml;
+        if (more_load) more_load();
         return true;
       }
     })