安価グラフ

ankagraph.js

let script_sigma = document.createElement('script');
script_sigma.src = 'https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.0/sigma.min.js';
document.body.appendChild(script_sigma);

/*--------------------------------------

  安価グラフを作る

--------------------------------------*/
let f = function () {
  let d = document;
  class ResHead {
    set(dts) {
      this.dts = dts;
    }

    parse() {
      let reshead = [];
      let main, mail;
      const REGEXP_MAIN = new RegExp(/^([0-9]{1,4}) ：(.*?) ?：.* ID:(.*$)/);
      const REGEXP_MAIL = new RegExp(/<a href="mailto:(.*?)">/);
      for (let value of this.dts) {
        main = value.innerText.match(REGEXP_MAIN);
        mail = value.outerHTML.match(REGEXP_MAIL);
        reshead.push({
          resnum: main[1] - 0,
          name: main[2],
          id: main[3].replace("(主)", "").replace(" ", "").replace("×", ""),
          nusi: main[3].includes("(主)"),
          mail: mail === null ? null : mail[1]
        });
      }
      this.data = reshead;
      return reshead;
    }

    get() {
      return this.data;
    }
  }

  class ResBody {
    set(dds) {
      this.dds = dds;
    }

    parse() {
      let nodes, nodeName, node, imgurs, arr;
      let resbody = [];
      for (let value of this.dds) {
        nodes = value.childNodes;
        arr = [];
        for (let ix = 0, len = nodes.length - 3; ix < len; ix++) {
          node = nodes[ix];
          nodeName = node.nodeName.toLowerCase();
          //note: 通常の目に見えるテキスト,いわゆる本文の各一行
          if (nodeName === "#text") {
            arr.push(node.textContent.trim());
          }

          //note: 文末改行および空行
          if (nodeName === "br") {
            arr.push("\n");
          }

          //note: リンク
          if (nodeName === "a") {
            //note: 安価参照の場合はリンクではなく安価テキスト(e.g. >>243-256 )を取得する
            if (/^\/test\/read\.cgi\/.*/.test(node.pathname)) {
              arr.push(node.textContent.trim());
            } else {
              arr.push(node.href);
            }
          }

          //note: imgur画像は複数毎がグループ化されているので、それを取り出す
          if (nodeName === "div" && node.className === "group" && node.firstChild.className === "imgur") {
            imgurs = node.querySelectorAll("a");
            for (let imgur of imgurs) {
              arr.push(imgur.href);
            }
          }

          if (nodeName === "font") {
            arr.push(node.textContent.trim());
          }

        }
        resbody.push(arr.join(""));
      }
      this.data = resbody;
      return resbody;
    }

    get() {
      return this.data;
    }
  }

  class Res {
    set(reshead, resbody) {
      for (let ix = 0, len = reshead.length; ix < len; ix++) {
        reshead[ix].text = resbody[ix];
      }
      this.data = reshead;
    }

    get() {
      return this.data;
    }
  }

  let appName = 'ankagraph';

  function embedBackgroundElm() {
    let bg = d.createElement('div');
    bg.id = `${appName}_bg`;
    bg.style = `
      background:black;
      position:fixed;
      top:0;
      left:0;
      width:100%;
      height:100%;
      opacity:0.5;
      z-index:30;
  `;
    d.body.appendChild(bg);
  }
  embedBackgroundElm();

  function embedMainElm() {
    let main = d.createElement('div');
    main.id = `${appName}_main`;
    main.style = `
      background:#EFEFEF;
      position:fixed;
      top:30px;
      left:30px;
      width:calc(100% - 80px);
      height:calc(100% - 80px);
      z-index:31;
      border:solid black 1px;
      padding:10px;
    `;
    d.body.appendChild(main);
  }
  embedMainElm();

  /*
  let script_sigmajson = document.createElement('script');
  script_sigmajson.src = 'https://cdnjs.cloudflare.com/ajax/libs/sigma.js/1.2.0/plugins/sigma.parsers.json.min.js';
  document.body.appendChild(script_sigmajson);
  */

  let reshead = new ResHead();
  reshead.set(document.querySelectorAll('dt'));
  let resbody = new ResBody();
  resbody.set(document.querySelectorAll('dd'));
  let res = new Res();
  res.set(reshead.parse(), resbody.parse());
  res.get();









  /*
   res.dataは以下のプロパティを持つ
   http://hayabusa.open2ch.net/test/read.cgi/news4vip/1485774514/ より抽出
    id:"ab2"
    mail:null
    name:"名無しさん＠おーぷん"
    nusi:false
    resnum:6
    text:"問題はどれだけ長く生きるかではなく、↵自分のモラルが何を語るか↵"
  **/

  let REG_ANKA = new RegExp(/>>[0-9]{1,3}/g);
  let edges = [];
  let nodes = [];
  let ankas = [];
  for (let val of res.get()) {
    //note: make a node
    nodes.push({
      id: '' + val.resnum,
      label: val.name,
      x: (val.resnum - 0) % 100,
      y: (val.resnum - 0) % 10
    });

    //note: make a edge
    ankas = val.text.match(REG_ANKA);
    if (ankas) {
      ankas = ankas.map((elm) => { return elm.replace('>>', '') });
      ankas = ankas.filter((elm, ind, ary) => { return ary.indexOf(elm) === ind });

      for (let anka of ankas) {
        edges.push({
          id: '' + val.resnum + '->' + anka,
          source: '' + val.resnum,
          target: anka
        });
      }
    }
  }

console.dir(nodes);
console.dir(edges);
  let s = new sigma(`${appName}_main`);
  s.graph.read({ nodes, edges });
  s.refresh();
  return;
}

setTimeout(f, 5000);