first commit

source/js/third-party/canvas-ribbon.js

@@ -0,0 +1,85 @@
+/**
+ * Copyright (c) 2016 hustcc
+ * License: MIT
+ * Version: v1.0.1
+ * GitHub: https://github.com/hustcc/ribbon.js
+ **/
+// changed by Molunerfinn
+!(function () {
+  function attr (node, attr, default_value) {
+    if (default_value === true) {
+      return node.getAttribute(attr) || default_value
+    }
+    return Number(node.getAttribute(attr)) || default_value
+  }
+
+  // get user config
+  var script = document.getElementById('ribbon'),
+    config = {
+      z: attr(script, 'zIndex', -1), // z-index
+      a: attr(script, 'alpha', 0.6), // alpha
+      s: attr(script, 'size', 90), // size
+      c: attr(script, 'data-click', true) // click-to-change
+    }
+
+  var canvas = document.createElement('canvas'),
+    g2d = canvas.getContext('2d'),
+    pr = window.devicePixelRatio || 1,
+    width = window.innerWidth,
+    height = window.innerHeight,
+    f = config.s,
+    q,
+    t,
+    m = Math,
+    r = 0,
+    pi = m.PI * 2,
+    cos = m.cos,
+    random = m.random
+  canvas.width = width * pr
+  canvas.height = height * pr
+  g2d.scale(pr, pr)
+  g2d.globalAlpha = config.a
+  canvas.style.cssText =
+    'opacity: ' +
+    config.a +
+    ';position:fixed;top:0;left:0;z-index: ' +
+    config.z +
+    ';width:100%;height:100%;pointer-events:none;'
+  // create canvas
+  document.getElementsByTagName('body')[0].appendChild(canvas)
+
+  function redraw () {
+    g2d.clearRect(0, 0, width, height)
+    q = [{ x: 0, y: height * 0.7 + f }, { x: 0, y: height * 0.7 - f }]
+    while (q[1].x < width + f) draw(q[0], q[1])
+  }
+  function draw (i, j) {
+    g2d.beginPath()
+    g2d.moveTo(i.x, i.y)
+    g2d.lineTo(j.x, j.y)
+    var k = j.x + (random() * 2 - 0.25) * f,
+      n = line(j.y)
+    g2d.lineTo(k, n)
+    g2d.closePath()
+    r -= pi / -50
+    g2d.fillStyle =
+      '#' +
+      (
+        ((cos(r) * 127 + 128) << 16) |
+        ((cos(r + pi / 3) * 127 + 128) << 8) |
+        (cos(r + (pi / 3) * 2) * 127 + 128)
+      ).toString(16)
+    g2d.fill()
+    q[0] = q[1]
+    q[1] = { x: k, y: n }
+  }
+  function line (p) {
+    t = p + (random() * 2 - 1.1) * f
+    return t > height || t < 0 ? line(p) : t
+  }
+  if (config.c !== 'false') {
+    document.onclick = redraw
+    document.ontouchstart = redraw
+  }
+  redraw()
+})()