darekagakaku endless scroll and pushstate

by taizooo 2015-02-26 [2015/02/26 19:18:54]
(Forked from darekagakaku endless scroll by taizooo)

darekagakaku nikki wo random ni autopagerize with scroll push^H^H^H^HreplaceState

@@ -1,142 +1,184 @@
 /*
- * @title darekagakaku endless scroll
- * @description darekagakaku nikki wo random ni autopagerize
+ * @title darekagakaku endless scroll and pushstate
+ * @description darekagakaku nikki wo random ni autopagerize with scroll pushState
  * @include http://darekagakaku.herokuapp.com/*
  * @license MIT License
+ * @private
  */
 
 // http://darekagakaku.herokuapp.com/ wo endless summer-ize!!!
 // via http://userscripts.org/scripts/review/47998
 
-
-(function (Ap) {
-  Ap = {};
-  Ap.next = '';
-
-  var State = true;
-  var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
-  var BASE_REMAIN_HEIGHT = 50;
-  var loading = false;
-
-  var now = new Date();
-  var bottom = new Date("Feburary 17, 2012"); /* http://darekagakaku.herokuapp.com/v/2012-02-17 */
-
-  //var Ap.next = get_next(document);
-  var last_element = get_next_elements(document).pop();
-  //if (!Ap.next || !last_element) {
-  if (!last_element) {
-    return error();
-  }
-  insert_point = last_element.nextSibling;
-  insert_parent = last_element.parentNode;
-
-  next_page_load();
-
-  window.addEventListener('scroll', function () {
-    if (loading) return;
-    var remain = document.documentElement.scrollHeight - window.innerHeight - window.pageYOffset;
-    if (State && remain < BASE_REMAIN_HEIGHT) {
-      next_page_load();
-    }
-  }, false);
-
-  function next_page_load() {
-    loading = true;
-    //Ap.next = next.getAttribute('href');
-    Ap.next = go();
-    history.pushState("", "",  Ap.next);
-    console.log(Ap.next);
-    var x = new XMLHttpRequest();
-    x.onload = function () {
-      if (x.status <= 200 && x.status < 300) {
-        load(x);
-      } else {
-        error();
-      }
-    };
-    x.open('GET', Ap.next, true);
-    x.send(null);
-  }
-
-  function load(x) {
-    var html = x.responseText.replace(/<script(?:[ \t\r\n][^>]*)?>[\S\s]*?<\/script[ \t\r\n]*>|<\/?(?:i?frame|html|script|object)(?:[ \t\r\n][^<>]*)?>/gi, ' ');
-    var htmlDoc;
-    if (document.implementation.createHTMLDocument) {
-      htmlDoc = document.implementation.createHTMLDocument('hogehoge')
+var next = location.href;
+var depth = 0;
+var hold = [];
+hold.push({
+  "url": next,
+  "depth": depth
+})
+
+var State = true;
+var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
+var BASE_REMAIN_HEIGHT = 50;
+var loading = false;
+
+var now = new Date();
+var bottom = new Date("Feburary 17, 2012"); /* http://darekagakaku.herokuapp.com/v/2012-02-17 */
+
+var last_element = get_next_elements(document).pop();
+if (!last_element) {
+  return error();
+}
+var insert_point = last_element.nextSibling;
+var insert_parent = last_element.parentNode;
+
+next_page_load();
+
+window.addEventListener('scroll', function () {
+  if (loading) return;
+  var remain = document.documentElement.scrollHeight - window.innerHeight - window.pageYOffset;
+  if (State && remain < BASE_REMAIN_HEIGHT) {
+    next_page_load();
+  }
+}, false);
+
+function next_page_load() {
+  loading = true;
+  next = go();
+  var x = new XMLHttpRequest();
+  x.onload = function () {
+    if (x.status <= 200 && x.status < 300) {
+      load(x);
     } else {
-      htmlDoc = document.cloneNode(false);
-      if (htmlDoc) {
-        htmlDoc.appendChild(htmlDoc.importNode(document.documentElement, false));
-      } else {
-        htmlDoc = document.implementation.createDocument(null, 'html', null);
-      }
-    }
-    var range = document.createRange();
-    range.selectNodeContents(document.documentElement);
-    htmlDoc.documentElement.appendChild(range.createContextualFragment(html));
-    //Ap.next = get_next(htmlDoc);
-    var docs = get_next_elements(htmlDoc);
-    if (!docs.length) {
-      return error();
+      error();
     }
-    docs = docs.map(function (doc) {
-      return insert_parent.insertBefore(document.importNode(doc, true), insert_point);
-    });
-    loading = false;
-    //  if (!next) {
-    //    return terminate();
-    //  }
-  }
-
-  //function get_next(doc) {
-  //  return doc.evaluate('id("next_page_link")', doc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
-  //}
-  function get_next_elements(doc) {
-    var r = doc.evaluate('//div[@class="content"]', doc, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
-    for (var i = 0, l = r.snapshotLength, res = new Array(l); i < l; i++) res[i] = r.snapshotItem(i);
-    return res;
-  }
-
-  function error() {
-    return console.log('error');
-    State = false;
-  }
-
-  function terminate() {
-    return console.log('terminate');
-    State = false;
-  }
-
-  // via http://let.hatelabo.jp/taizooo/let/gYC-xcG60rLuBA
-  function trim(num, l) {
-    if (num < 0) {
-      num = -(num);
-    }
-    if (typeof (num) != 'string') {
-      num = '' + num;
-    }
-    var s = l - num.length;
-    while (s > 0) {
-      num = '0' + num;
-      --s;
+  };
+  x.open('GET', next, true);
+  x.send(null);
+}
+
+function load(x) {
+  var html = x.responseText.replace(/<script(?:[ \t\r\n][^>]*)?>[\S\s]*?<\/script[ \t\r\n]*>|<\/?(?:i?frame|html|script|object)(?:[ \t\r\n][^<>]*)?>/gi, ' ');
+  var htmlDoc;
+  if (document.implementation.createHTMLDocument) {
+    htmlDoc = document.implementation.createHTMLDocument('hogehoge')
+  } else {
+    htmlDoc = document.cloneNode(false);
+    if (htmlDoc) {
+      htmlDoc.appendChild(htmlDoc.importNode(document.documentElement, false));
+    } else {
+      htmlDoc = document.implementation.createDocument(null, 'html', null);
     }
-    return num;
   }
-
-  function rday(max, min) {
-    max = max.getTime();
-    min = min.getTime();
-    rd = new Date(Math.floor(Math.random() * (max - min) + min));
-    d = trim(rd.getFullYear(), 4) + "-" + trim(rd.getMonth() + 1, 2) + "-" + trim(rd.getDate(), 2);
-    return d;
+  var range = document.createRange();
+  range.selectNodeContents(document.documentElement);
+  htmlDoc.documentElement.appendChild(range.createContextualFragment(html));
+  //next = get_next(htmlDoc);
+  var docs = get_next_elements(htmlDoc);
+  if (!docs.length) {
+    return error();
   }
 
-  function go() {
-    url = "http://darekagakaku.herokuapp.com/v/" + rday(now, bottom);
-    if (Ap.next == url) {
-      url = "http://darekagakaku.herokuapp.com/a";
-    }
-    return url;
+  var lastElement = get_next_elements(document).pop();
+  depth = getElementPosition(lastElement).bottom;
+  hold.push({
+    "url": next,
+    "depth": depth
+  })
+
+  docs = docs.map(function (doc) {
+    return insert_parent.insertBefore(document.importNode(doc, true), insert_point);
+  });
+
+  //history.pushState("", "", next);
+
+  loading = false;
+  //  if (!next) {
+  //    return terminate();
+  //  }
+}
+
+var timer = null;
+window.addEventListener('scroll', function () {
+  clearTimeout(timer);
+  timer = setTimeout(function () {
+    onscroll();
+  }, 10);
+}, false);
+
+function onscroll() {
+  current = window.pageYOffset;
+  for(var i = hold.length - 1, section; (ele = hold[i]); i--) {
+    if(ele.depth <= current) break;
+  }
+  ele = hold[i];
+  if (ele.url != location.href) {
+    //history.pushState("", "", ele.url);
+    history.replaceState("", "", ele.url);
+    console.log('current: '+current);
+    console.log('url: '+ele.url);
+    console.log('depth: '+ele.depth);
+  }
+}
+
+//function get_next(doc) {
+//  return doc.evaluate('id("next_page_link")', doc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
+//}
+function get_next_elements(doc) {
+  var r = doc.evaluate('//div[@class="content"]', doc, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
+  for (var i = 0, l = r.snapshotLength, res = new Array(l); i < l; i++) res[i] = r.snapshotItem(i);
+  return res;
+}
+
+function error() {
+  return console.log('error');
+  State = false;
+}
+
+function terminate() {
+  return console.log('terminate');
+  State = false;
+}
+
+// via http://d.hatena.ne.jp/javascripter/20080531/1212264942
+function getElementPosition(elem) {
+  var position = elem.getBoundingClientRect();
+  return {
+    left: Math.round(window.scrollX + position.left),
+    right: Math.round(window.scrollY + position.right),
+    top: Math.round(window.scrollY + position.top),
+    bottom: Math.round(window.scrollY + position.bottom)
+  }
+}
+
+// via http://let.hatelabo.jp/taizooo/let/gYC-xcG60rLuBA
+function trim(num, l) {
+  if (num < 0) {
+    num = -(num);
+  }
+  if (typeof (num) != 'string') {
+    num = '' + num;
+  }
+  var s = l - num.length;
+  while (s > 0) {
+    num = '0' + num;
+    --s;
+  }
+  return num;
+}
+
+function rday(max, min) {
+  max = max.getTime();
+  min = min.getTime();
+  rd = new Date(Math.floor(Math.random() * (max - min) + min));
+  d = trim(rd.getFullYear(), 4) + "-" + trim(rd.getMonth() + 1, 2) + "-" + trim(rd.getDate(), 2);
+  return d;
+}
+
+function go() {
+  url = "http://darekagakaku.herokuapp.com/v/" + rday(now, bottom);
+  if (next == url) {
+    url = "http://darekagakaku.herokuapp.com/a";
   }
-
-})();
+  return url;
+}

• /*
   * @title darekagakaku endless scroll and pushstate
   * @description darekagakaku nikki wo random ni autopagerize with scroll pushState
   * @include http://darekagakaku.herokuapp.com/*
   * @license MIT License
   * @private
   */
  
  // http://darekagakaku.herokuapp.com/ wo endless summer-ize!!!
  // via http://userscripts.org/scripts/review/47998
  
  var next = location.href;
  var depth = 0;
  var hold = [];
  hold.push({
    "url": next,
    "depth": depth
  })
  
  var State = true;
  var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
  var BASE_REMAIN_HEIGHT = 50;
  var loading = false;
  
  var now = new Date();
  var bottom = new Date("Feburary 17, 2012"); /* http://darekagakaku.herokuapp.com/v/2012-02-17 */
  
  var last_element = get_next_elements(document).pop();
  if (!last_element) {
    return error();
  }
  var insert_point = last_element.nextSibling;
  var insert_parent = last_element.parentNode;
  
  next_page_load();
  
  window.addEventListener('scroll', function () {
    if (loading) return;
    var remain = document.documentElement.scrollHeight - window.innerHeight - window.pageYOffset;
    if (State && remain < BASE_REMAIN_HEIGHT) {
      next_page_load();
    }
  }, false);
  
  function next_page_load() {
    loading = true;
    next = go();
    var x = new XMLHttpRequest();
    x.onload = function () {
      if (x.status <= 200 && x.status < 300) {
        load(x);
      } else {
        error();
      }
    };
    x.open('GET', next, true);
    x.send(null);
  }
  
  function load(x) {
    var html = x.responseText.replace(/<script(?:[ \t\r\n][^>]*)?>[\S\s]*?<\/script[ \t\r\n]*>|<\/?(?:i?frame|html|script|object)(?:[ \t\r\n][^<>]*)?>/gi, ' ');
    var htmlDoc;
    if (document.implementation.createHTMLDocument) {
      htmlDoc = document.implementation.createHTMLDocument('hogehoge')
    } else {
      htmlDoc = document.cloneNode(false);
      if (htmlDoc) {
        htmlDoc.appendChild(htmlDoc.importNode(document.documentElement, false));
      } else {
        htmlDoc = document.implementation.createDocument(null, 'html', null);
      }
    }
    var range = document.createRange();
    range.selectNodeContents(document.documentElement);
    htmlDoc.documentElement.appendChild(range.createContextualFragment(html));
    //next = get_next(htmlDoc);
    var docs = get_next_elements(htmlDoc);
    if (!docs.length) {
      return error();
    }
  
    var lastElement = get_next_elements(document).pop();
    depth = getElementPosition(lastElement).bottom;
    hold.push({
      "url": next,
      "depth": depth
    })
  
    docs = docs.map(function (doc) {
      return insert_parent.insertBefore(document.importNode(doc, true), insert_point);
    });
  
    //history.pushState("", "", next);
  
    loading = false;
    //  if (!next) {
    //    return terminate();
    //  }
  }
  
  var timer = null;
  window.addEventListener('scroll', function () {
    clearTimeout(timer);
    timer = setTimeout(function () {
      onscroll();
    }, 10);
  }, false);
  
  function onscroll() {
    current = window.pageYOffset;
    for(var i = hold.length - 1, section; (ele = hold[i]); i--) {
      if(ele.depth <= current) break;
    }
    ele = hold[i];
    if (ele.url != location.href) {
      //history.pushState("", "", ele.url);
      history.replaceState("", "", ele.url);
      console.log('current: '+current);
      console.log('url: '+ele.url);
      console.log('depth: '+ele.depth);
    }
  }
  
  //function get_next(doc) {
  //  return doc.evaluate('id("next_page_link")', doc, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
  //}
  function get_next_elements(doc) {
    var r = doc.evaluate('//div[@class="content"]', doc, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
    for (var i = 0, l = r.snapshotLength, res = new Array(l); i < l; i++) res[i] = r.snapshotItem(i);
    return res;
  }
  
  function error() {
    return console.log('error');
    State = false;
  }
  
  function terminate() {
    return console.log('terminate');
    State = false;
  }
  
  // via http://d.hatena.ne.jp/javascripter/20080531/1212264942
  function getElementPosition(elem) {
    var position = elem.getBoundingClientRect();
    return {
      left: Math.round(window.scrollX + position.left),
      right: Math.round(window.scrollY + position.right),
      top: Math.round(window.scrollY + position.top),
      bottom: Math.round(window.scrollY + position.bottom)
    }
  }
  
  // via http://let.hatelabo.jp/taizooo/let/gYC-xcG60rLuBA
  function trim(num, l) {
    if (num < 0) {
      num = -(num);
    }
    if (typeof (num) != 'string') {
      num = '' + num;
    }
    var s = l - num.length;
    while (s > 0) {
      num = '0' + num;
      --s;
    }
    return num;
  }
  
  function rday(max, min) {
    max = max.getTime();
    min = min.getTime();
    rd = new Date(Math.floor(Math.random() * (max - min) + min));
    d = trim(rd.getFullYear(), 4) + "-" + trim(rd.getMonth() + 1, 2) + "-" + trim(rd.getDate(), 2);
    return d;
  }
  
  function go() {
    url = "http://darekagakaku.herokuapp.com/v/" + rday(now, bottom);
    if (next == url) {
      url = "http://darekagakaku.herokuapp.com/a";
    }
    return url;
  }

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

  このページへの個別リンクです。

  RAW

  書かれたコードへの直接のリンクです。

  Packed

  文字列が圧縮された書かれたコードへのリンクです。

  Userscript

  Greasemonkey 等で利用する場合の .user.js へのリンクです。

  Loader

  @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。

  Metadata

  コード中にコメントで @xxx と書かれたメタデータの JSON です。