r/matrix

    @@ -3,6 +3,7 @@ * @description Neo's-eyes simulator * @include http://* * @include https://* + * @contributor http://timelessname.com/sandbox/matrix.html * @contributor jargonjustin https://www.reddit.com/r/programming/comments/1ag0c3/ * @contributor NonNonHeinous, OptionalField, echeese and maschnitz * @contributor yuta25 http://let.hatelabo.jp/yuta25/let/hJmeu-js5vps (Fork of) @@ -11,8 +12,14 @@ */ // remember '00s web -// c.f. -// https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/ +// Matrix digital rain c.f. +// https://www.google.com/search?q=matrix+rain+javascript +// https://en.wikipedia.org/wiki/Matrix_digital_rain +// +// purhaps parent code c.f. +// http://timelessname.com/sandbox/matrix.html +// https://news.ycombinator.com/item?id=5388444 +// https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/ (() => { 'use strict'; @@ -35,9 +42,9 @@ ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillStyle = 'rgba(0, 255, 0, 1)'; // opacity range: 0-1 - // Trigonometry and Radian based algorithm + // Unit Circle and Radian based cyclic algorithm, like a ^^^^^^^^ canvas.style.opacity = Math.abs(Math.cos(degree * Math.PI / 180)); - degree += 10; + degree = (degree % 360) + 10; texts = texts.map((val, idx) => { const rand = Math.random(); @@ -51,14 +58,17 @@ // # License/Fork Tree // -// ## origin on /r/programming +// unknown origin, below? +// http://timelessname.com/sandbox/matrix.html +// +// ## on /r/programming // https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/ // -// ## original code by /u/jargonjustin +// ## posted by /u/jargonjustin // Unknown (as-is) // https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/c8x2fjx/ // -// ## merged by NonNonHeinous +// ## merged by /u/NonNonHeinous // Unknown (as-is) // /u/jargonjustin, /u/OptionalField, /u/echeese, and /u/maschnitz (and/or more redditors?) // https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/c8x3vov/
  • /*
     * @title /r/matrix
     * @description Neo's-eyes simulator
     * @include http://*
     * @include https://*
     * @contributor http://timelessname.com/sandbox/matrix.html
     * @contributor jargonjustin  https://www.reddit.com/r/programming/comments/1ag0c3/
     * @contributor NonNonHeinous, OptionalField, echeese and maschnitz
     * @contributor yuta25        http://let.hatelabo.jp/yuta25/let/hJmeu-js5vps (Fork of)
     * @license TBD (as-is); see the bottom
     * @javascript_url
     */
    
    // remember '00s web
    // Matrix digital rain c.f.
    // https://www.google.com/search?q=matrix+rain+javascript
    // https://en.wikipedia.org/wiki/Matrix_digital_rain
    //
    // purhaps parent code c.f.
    // http://timelessname.com/sandbox/matrix.html
    //  https://news.ycombinator.com/item?id=5388444
    //  https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/
    (() => {
      'use strict';
    
      const canvas = document.createElement('canvas');
      canvas.width = window.screen.width;
      canvas.height = document.body.scrollHeight;
    
      //canvas.style.height = `${document.body.scrollHeight}px`;
      canvas.style.position = 'absolute';
      canvas.style.top = canvas.style.left = '0';
      canvas.style.zIndex = Number.MAX_SAFE_INTEGER || Number.MAX_VALUE;
    
      document.body.appendChild(canvas);
    
      const ctx = canvas.getContext('2d');
      let degree = 0;
      let texts = Array(256).fill(1);
      setInterval(() => {
        ctx.fillStyle = 'rgba(0, 0, 0, 0.05)';
        ctx.fillRect(0, 0, canvas.width, canvas.height);
        ctx.fillStyle = 'rgba(0, 255, 0, 1)';
        // opacity range: 0-1
        // Unit Circle and Radian based cyclic algorithm, like a ^^^^^^^^
        canvas.style.opacity = Math.abs(Math.cos(degree * Math.PI / 180));
        degree = (degree % 360) + 10;
    
        texts = texts.map((val, idx) => {
          const rand = Math.random();
          // XXX too much Magic Numbers
          ctx.fillText(String.fromCharCode(Math.floor(2720 + rand * 33)), idx * 10, val);
          val += 10;
          return val > 768 + rand * 1e4 ? 0 : val;
        });
      }, 33);
    })();
    
    // # License/Fork Tree
    //
    // unknown origin, below?
    // http://timelessname.com/sandbox/matrix.html
    //
    // ## on /r/programming
    //  https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/
    //
    // ## posted by /u/jargonjustin
    // Unknown (as-is)
    //  https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/c8x2fjx/
    //
    // ## merged by /u/NonNonHeinous
    // Unknown (as-is)
    // /u/jargonjustin, /u/OptionalField, /u/echeese, and /u/maschnitz (and/or more redditors?)
    //  https://www.reddit.com/r/programming/comments/1ag0c3/someone_posted_an_htmljavascript_implementation/c8x3vov/
    //
    // ## just a collect by MinhasKamal from merged code
    // Unknown (as-is)
    //  https://github.com/MinhasKamal/CreepyCodeCollection/blob/master/README.md
    //    https://github.com/MinhasKamal/CreepyCodeCollection/blob/master/matrix_effect.html
    //
    // ## pure js port and mod by yuta25
    // MIT License  https://opensource.org/licenses/MIT
    //  http://let.hatelabo.jp/yuta25/let/hJmeu-js5vps
    //
    // ## re-mod by noromanba the Genin translator
    // WTFPL (Do What the Fuck You Want to Public License)
    //  http://www.wtfpl.net/about/
    //  http://www.wtfpl.net/txt/copying/
    // http://let.hatelabo.jp/noromanba/let/hJmevPLog7ty
    
    
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2017/01/31 07:21:20 - 2017-01-31
  2. 2017/01/31 07:17:17 - 2017-01-31
  3. 2017/01/31 06:57:09 - 2017-01-31
  4. 2017/01/30 02:50:32 - 2017-01-30
  5. 2017/01/29 17:04:21 - 2017-01-29
  6. 2017/01/29 16:09:47 - 2017-01-29
  7. 2017/01/29 07:30:08 - 2017-01-29
  8. 2017/01/29 07:24:01 - 2017-01-29
  9. 2017/01/29 07:23:23 - 2017-01-29