TYJ viewer

by noromanba 2015-05-15 [2015/05/15 10:17:24]

non-flick spread image viewer w/ Tab-navi on flash-free tonarinoyj

• /*
   * @title TYJ viewer
   * @description non-flick spread viewer w/ Tab-navi on flash-free tonarinoyj
   * @include http://tonarinoyj.jp/manga/*
   * @license MIT http://opensource.org/licenses/MIT
   * @javascript_url
   */
  
  // require TYJ HTML5
  // http://let.hatelabo.jp/noromanba/let/hLHXivqj-p4O
  
  // TODO split to function for scope
  (function () {
      var meta = (/tonarinoyj\.jp\/manga\/(\w+)\/([\w-]+)/.exec(location.hostname + location.pathname) || []).slice(1);
      if (meta.length < 2) return;
  
      // http://tonarinoyj.jp/manga/XXXX/XX/HTML5/
      var pageCount = Number(document.querySelector('#sTitle').textContent.match(/\d+/g).pop());
  
      // cleanup c.f. http://jsperf.com/innerhtml-vs-removechild/157
      var body = document.body;
      while (body.firstChild) { // TBD range
          body.removeChild(body.firstChild);
      }
      body.removeAttribute('style');
  
      // TBD named RegExp capture
      var book = meta[0], volume = meta[1];
      var endpoint = 'http://img.tonarinoyj.jp/manga/' + book + '/' + volume + '/books/images/2/';
  
      // front cover
      var container = document.createElement('div');
      container.tabIndex = 0;
      var cover = document.createElement('img');
      cover.src = endpoint + 2 + '.jpg';
      cover.style.maxWidth = '50%';
      container.appendChild(cover);
  
      body.appendChild(container);
  
      // contents
      for (var page = 3; page <= pageCount; page += 2) {
          var container = document.createElement('div');
          container.tabIndex = 0;
  
          var rimg = document.createElement('img');
          rimg.src = endpoint + (page + 1) + '.jpg';
          rimg.style.maxWidth = '50%';
          rimg.style.maxHeight = '100%';
          rimg.dataset.align = 'right';
          container.appendChild(rimg);
  
          var limg = document.createElement('img');
          limg.src = endpoint + page + '.jpg';
          limg.style.maxWidth = '50%';
          limg.style.maxHeight = '100%';
          limg.dataset.align = 'left';
          container.appendChild(limg);
  
          body.appendChild(container);
      }
  
      // navigation
      var container = document.createElement('div');
      container.style.backgroundColor = 'ivory';
      container.style.height = '5em';
  
      // TODO sepalate index
      var navi = window.$PAGES;
      var next = document.createElement('a');
      var ntext;
      if (navi.next) {
          next.href = navi.next + 'HTML5';
          ntext = '< next';
      } else { // latest story
          next.href =  '../../';
          ntext = 'index';
      }
      next.appendChild(document.createTextNode(ntext));
      next.style.marginLeft = '10%';
      next.tabIndex = 0;
      container.appendChild(next);
  
      var prev = document.createElement('a');
      var ptext;
      if (navi.prev) { // first story
          prev.href = navi.prev + 'HTML5';
          ptext = 'prev >';
      } else {
          prev.href = '../../';
          ptext = 'index';
      }
      prev.appendChild(document.createTextNode(ptext));
      prev.style.marginLeft = '20%';
      prev.tabIndex = 0;
      container.appendChild(prev);
  
      body.appendChild(container);
  }());
  
  // DBG
  // e.g. http://tonarinoyj.jp/manga/onepanman/1
  //
  // HTML5 interface for "smart"-devices
  // http://tonarinoyj.jp/manga/onepanman/1/HTML5/?type=single
  // low-rez images in div#horizontal_div
  // http://tonarinoyj.jp/manga/onepanman/2/iPhone/ipad/1/1.jpg
  // http://tonarinoyj.jp/manga/onepanman/2/iPhone/ipad/1/2.jpg
  // http://tonarinoyj.jp/manga/onepanman/2/iPhone/ipad/1/3.jpg
  //
  // default flash interface
  // http://tonarinoyj.jp/manga/onepanman/3/?type=single&viewer=
  // high-rez images in flash
  // http://img.tonarinoyj.jp/manga/onepanman/1/books/images/2/1.jpg
  // http://img.tonarinoyj.jp/manga/onepanman/1/books/images/2/2.jpg
  // http://img.tonarinoyj.jp/manga/onepanman/1/books/images/2/3.jpg
  

• Permalink RAW Packed Userscript LOADER Metadata ?

  Permalink

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

  RAW

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

  Packed

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

  Userscript

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

  Loader

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

  Metadata

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