grafiの添付ファイル:sl.js

   1 /*
   2    This script is based on sl.js by teramako.
   3    see slide <http://teramako.github.io/doc/LLTV20090829/lltv.html>
   4        source <https://github.com/vimpr/vimperator-plugins/pull/43>
   5  */
   6 (function () {
   7 
   8 function SL() { this.init.apply(this, arguments); }
   9 SL.prototype = { // {{{
  10   init: function (elm, fontSize, frameRate, speed) {
  11     this.canvas = elm;
  12     this.ctx = this.canvas.getContext("2d");
  13 
  14     this.width = window.innerWidth;
  15     this.height = this.lineNum * fontSize;
  16     this.canvas.setAttribute("width", this.width);
  17     this.canvas.setAttribute("height", this.height);
  18 
  19     this.fontSize = fontSize;
  20     this.frameRate = frameRate;
  21     this.speed = speed;
  22 
  23     this.interval = null;
  24     this.count = 0;
  25   },
  26 
  27   lineNum: 16,
  28 
  29   start: function () {
  30     this.ctx.clearRect(0, 0, this.width, this.height);
  31     this.ctx.font = this.fontSize + "px monospace";
  32     this.ctx.textAlign = 'start'
  33 
  34     var sl = this.slGenerator();
  35     var self = this;
  36     this.interval = window.setInterval(function () {
  37       self.draw(sl);
  38     }, this.frameRate);
  39   },
  40 
  41   draw: function (gene) {
  42     this.count++;
  43     this.ctx.clearRect(0, 0, this.width, this.height);
  44     this.ctx.fillStyle = "rgb(0,0,0)";
  45 
  46     var data = gene.next();
  47     var x = this.width - this.count * this.speed;
  48     data.forEach (function (str, i) {
  49       this.ctx.fillText(str, x, this.height / this.lineNum * (i+1));
  50     }, this);
  51   },
  52 
  53   merge: function () {
  54     var data = [];
  55     for (var k = 0; k < arguments.length; k++) {
  56       arguments[k].forEach(function (str, i) {
  57         if (!data[i]) data[i] = "";
  58         data[i] = data[i] + str;
  59       });
  60     }
  61     return data;
  62   },
  63 
  64   slGenerator: function () {
  65     var data = this.slData;
  66     var self = this;
  67 
  68     var i = 0;
  69     return {
  70       next: (function () {
  71         i++;
  72         return [].concat(data.steam[i%data.steam.length], self.merge(data.body.concat(data.wheel[i%data.wheel.length]), data.coal));
  73       })
  74     }
  75   },
  76 
  77   slData: { /// {{{
  78     steam: [
  79       [
  80         "                      (@@) (  ) (@)  ( )  @@    ()    @     O     @     O      @",
  81         "                 (   )",
  82         "             (@@@@)",
  83         "          (    )",
  84         "",
  85         "        (@@@)",
  86       ],[
  87         "                      (  ) (@@) ( )  (@)  ()    @@    O     @     O     @      O",
  88         "                 (@@@)",
  89         "             (    )",
  90         "          (@@@@)",
  91         "",
  92         "        (   )"
  93       ]
  94     ],
  95     body: [
  96       "      ====        ________                ___________ ",
  97       "  _D _|  |_______/        \\__I_I_____===__|_________| ",
  98       "   |(_)---  |   H\\________/ |   |        =|___ ___|   ",
  99       "   /     |  |   H  |  |     |   |         ||_| |_||   ",
 100       "  |      |  |   H  |__--------------------| [___] |   ",
 101       "  | ________|___H__/__|_____/[][]~\\_______|       |   ",
 102       "  |/ |   |-----------I_____I [][] []  D   |=======|__ "
 103     ],
 104     wheel: [
 105       [
 106         "__/ =| o |=-~~\\  /~~\\  /~~\\  /~~\\ ____Y___________|__ ",
 107         " |/-=|___|=    ||    ||    ||    |_____/~\\___/        ",
 108         "  \\_/      \\O=====O=====O=====O_/      \\_/            "
 109       ],[
 110         "__/ =| o |=-~~\\  /~~\\  /~~\\  /~~\\ ____Y___________|__ ",
 111         " |/-=|___|=    ||    ||    ||    |_____/~\\___/        ",
 112         "  \\_/      \\_O=====O=====O=====O/      \\_/            "
 113       ],[
 114         "__/ =| o |=-~~\\  /~~\\  /~~\\  /~~\\ ____Y___________|__ ",
 115         " |/-=|___|=   O=====O=====O=====O|_____/~\\___/        ",
 116         "  \\_/      \\__/  \\__/  \\__/  \\__/      \\_/            "
 117       ],[
 118         "__/ =| o |=-~O=====O=====O=====O\\ ____Y___________|__ ",
 119         " |/-=|___|=    ||    ||    ||    |_____/~\\___/        ",
 120         "  \\_/      \\__/  \\__/  \\__/  \\__/      \\_/            "
 121       ],[
 122         "__/ =| o |=-O=====O=====O=====O \\ ____Y___________|__ ",
 123         " |/-=|___|=    ||    ||    ||    |_____/~\\___/        ",
 124         "  \\_/      \\__/  \\__/  \\__/  \\__/      \\_/            "
 125       ],[
 126         "__/ =| o |=-~~\\  /~~\\  /~~\\  /~~\\ ____Y___________|__ ",
 127         " |/-=|___|=O=====O=====O=====O   |_____/~\\___/        ",
 128         "  \\_/      \\__/  \\__/  \\__/  \\__/      \\_/            "
 129       ]
 130     ],
 131     coal: [
 132       "                              ",
 133       "                              ",
 134       "    _________________         ",
 135       "   _|                \\_____A  ",
 136       " =|                        |  ",
 137       " -|                        |  ",
 138       "__|________________________|_ ",
 139       "|__________________________|_ ",
 140       "   |_D__D__D_|  |_D__D__D_|   ",
 141       "    \\_/   \\_/    \\_/   \\_/    "
 142     ],
 143   }, /// }}}
 144 };
 145 
 146 // }}}
 147 
 148 var sl = new SL(document.getElementById("sl"), 16, 60, 20);
 149 
 150 sl.start();
 151 })();