honjarake blog

自分用にテキトーにまとめる

ニコニコ動画概要から動画リンクだけ抽出して表示するスクリプト

ノートPC買おう…

前回のスクリプトと同時進行で作っていたモノ(暫定

これからの課題

  • windowのresize(拡大縮小を交互に速めに行う)で動画プレイヤーが右にずれていく問題
    • 現時点で、ブラウザの全画面表示、サイズ変更でリセットされるのを確認
      最悪、ツールチップやメッセージでその旨を表示して対応
  • 疑似クラス化
    • 今は困難。一個、一から作って試す必要あり。
  • 次の動画、前の動画の表示が実際のpart数と異なるパターンが存在する
    • 動画が修正版や再アップの場合は正確に取得できない('/watch/sm数字'の数字部分の大小だけで表示する動画を決定している為)
      動画説明の動画すべて載せるように修正した方が早い

以下、ソースコード

// ==UserScript==
// @name        Nico2 Get Next Video
// @namespace   http://honjarake.hatenablog.jp/
// @description ニコニコ動画の動画説明文から動画リンクを取得して表示する
// @include     http://www.nicovideo.jp/watch/*
// @version     0.0.2
// @grant       none
// ==/UserScript==
var THE_LAST;
var N2GNV = function () {
  console.log('Nico2 Get Next Video : Start');
  if (window != parent) return;
  // current video
  var current = location.href.match(/sm\d+/) [0];
  console.log('current : ' + current);
  // videoinfo block
  var desc = document.getElementById('topVideoInfo');
  //var desc = document;
  if (!desc) return;
  // view video link list
  try {
    N2GNV_setList(desc, current);
  } catch (e) {
    console.log('N2GNV:' + e);
  }
  console.log('Nico2 Get Next Video : End');
};
function N2GNV_Update() {
  try {
    var desc = document.getElementById('topVideoInfo');
    var current = location.href.match(/sm\d+/) [0];
    N2GNV_setList(desc, current);
  } catch (e) {
    console.log('N2GNV_Update:' + e);
  }
}
function N2GNV_setList(desc, current) {
  console.log('current : ' + current + ' - the last : ' + THE_LAST);
  if (THE_LAST == current) return;
  THE_LAST = current;
  var list = document.getElementById('N2GNV_list');
  if (!list) {
    var wih = window.innerHeight - 50;
    list = document.createElement('div');
    list.id = 'N2GNV_list';
    list.style.zIndex = 100;
    list.style.position = 'fixed';
    list.style.top = wih + 'px';
    list.style.background = '#FFFFFF';
    list.style.border = '1px solid #000000';
    list.style.padding = '2px';
    document.body.appendChild(list);
  }
  
  // get anchor in description
  var prev = '';
  var next = '';
  var prevs = [  ];
  var nexts = [  ];
  var html = '';
  var c_num = current.match(/\d+/);
  var anc = desc.getElementsByTagName('a');
  for (var i = 0; i < anc.length; i++) {
    var ref = anc[i].innerHTML.match(/sm\d+/);
    //console.log('ref=' + ref);
    if (ref) {
      var r = ref[0];
      var r_num = r.match(/\d+/);
      var n_num;
      var p_num;
      //console.log('current=' + c_num + ' : ref=' + r_num);
      //console.log(n_num + ' & ' + p_num);
      if (parseInt(c_num) < parseInt(r_num)) {
        //console.log(i + ' : < : ' + anc[i].innerHTML);
        next = r;
        nexts.push('<a href="http://www.nicovideo.jp/watch/' + next + '" style="color:red !important;">' + next + '></a>');
        n_num = next.match(/\d+/);
      } else if (parseInt(c_num) > parseInt(r_num)) {
        //console.log(i + ' : > :  ' + anc[i].innerHTML);
        prev = r;
        prevs.push('<a href="http://www.nicovideo.jp/watch/' + prev + '" style="color:blue !important">' + prev + '</a>');
        p_num = prev.match(/\d+/);
      }
    }
  }
  
  // set prev next list
  if (prev != '') html = '<' + prevs.sort().join(' |\n') + '|'
  html += '<strong> <a href="Javascript:void(0);" id="N2GV_clink"> ' + current + '</a> </strong>';
  if (next != '') html += '| ' + nexts.sort().join(' |\n');
  html += '<span id ="N2GNV_screen_toggle"><-></span>';
  list.innerHTML = html;
  // add click event
  var bclink = document.getElementById('N2GV_clink');
  bclink.title = '現在の動画';
  bclink.addEventListener('click', N2GNV_Update, false);
  
  var toggle = document.getElementById('N2GNV_screen_toggle');
  toggle.title = '最小化';
  toggle.style.border = "1px solid #000000";
  toggle.addEventListener('click', function(){
    var tg = document.getElementById('N2GNV_screen_toggle');
    var list = document.getElementById('N2GNV_list');
    if (tg.innerText == '<<'){
      tg.innerText = '>>';
      tg.title = '最小化';
      list.style.left = '0px';
    }else{
      tg.innerText = '<<';
      tg.title = '通常表示';
      list.style.left = (list.clientWidth - tg.clientWidth - 30) * -1 + 'px';
    }
  }, false);
  
  // add resize event(jquery)
  $(window).resize(function () {
    var list = document.getElementById('N2GNV_list');
    var wih = window.innerHeight - 50;
    list.style.top = wih + 'px';
  });
  nico_thumbnail();
}

//event function
function nico_thumbnail() {
  var samne = document.getElementById('N2NV_nico_thumb');
  if (!samne) {
    samne = document.createElement('div');
    samne.id = 'N2NV_nico_thumb';
    samne.style.zIndex = 100;
    samne.style.position = 'fixed';
    samne.style.top = (window.innerHeight - 240) + 'px';
    samne.style.background = '#FFFFFF';
    samne.style.border = 'solid 1px #000000';
    samne.style.padding = '0px';
    samne.style.display = 'none';
    var iframe = document.createElement('iframe');
    iframe.id = 'N2NV_nico_thumb_in';
    iframe.src = '';
    iframe.style.width = '312px';
    iframe.style.height = '176px';
    iframe.style.border = 'solid 1px #CCC';
    iframe.setAttribute('rameborder', '0');
    iframe.setAttribute('scrolling', 'no');
    samne.appendChild(iframe);
    document.body.appendChild(samne);
  }
  $('#N2GNV_list a').hover(function () {
    var iframe = document.getElementById('N2NV_nico_thumb_in');
    var sm = this.innerHTML.replace(' ', '').replace('|', '').replace('&lt;', '').replace('&gt;', '');
    var flame = 'http://ext.nicovideo.jp/thumb/' + sm;
    //console.log('flame:' + flame);
    //履歴残す
    //iframe.src = flame;
    //履歴残さない
    if (iframe.contentDocument == null) {
      var iframed = (iframe.contentWindow || iframe.contentDocument);
      iframed.location.replace(flame);
    } else {
      //console.log('iframe:' + iframe);
      iframe.contentDocument.location.replace(flame);
    }
    var list = document.getElementById('N2GNV_list');
    var samne = document.getElementById('N2NV_nico_thumb');
    if (samne) samne.style.top = (window.innerHeight - (list.clientHeight + 20)) + 'px';
    samne.style.display = 'block';
  }, function () {
    samne.style.display = 'none';
  }
  );
}
//trigger
window.addEventListener('load', N2GNV, false);