fastco sidebar animation

fastco.js

function (e, t, n, r, i) {
    var s = r.ItemView.extend({
        template: i.sidebarBranding,
        initialize: function (t) {
            this.options = e.extend({}, t || {})
            window.requestAnimationFrame || (window.requestAnimationFrame = window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || function (e) {
                return window.setTimeout(e, 17)
            })
        },
        getRandomArbitrary: function (e, t) {
            return Math.random() * (t - e) + e
        },
        mapRange: function (e, t, n, r, i) {
            return r + (i - r) * (e - t) / (n - t)
        },
        onRender: function () {
            function u(e, t) {
                this.x = e
                this.y = t
                this.t = 1
                this.angle = n.getRandomArbitrary(-0.2, .2)
                this.speed = n.getRandomArbitrary(-0.009, .009)
            }
            var e = this.model,
                n = this,
                r = e.get("date");
            if (r && r.published) {
                var i = r.published.medium,
                    s = '<time datetime="' + r.published.short + '">' + i + "</time>",
                    o = n.$el.find("hgroup");
                o.append(s)
            }
            u.prototype.oscillateX = function (e, t) {
                this.x = Math.sin(this.angle + this.t) * h
                this.x = n.mapRange(this.x, 0, a.width, e, t)
                this.angle += this.speed
            }, u.prototype.oscillateY = function (e, t) {
                this.y = Math.sin(this.angle + this.t) * p
                this.y = n.mapRange(this.y, 0, a.height, e, t)
                this.angle += this.speed
            }, u.prototype.makeShape = function (e) {
                e.lineWidth = 1
                e.lineJoin = "round"
                e.beginPath()
                e.moveTo(y[0].x, y[0].y)
                e.lineTo(y[1].x, y[1].y)
                e.lineTo(y[0].x, y[0].y)
                e.lineTo(y[2].x, y[2].y)
                e.lineTo(y[0].x, y[0].y)
                e.lineTo(y[3].x, y[3].y)
                e.lineTo(y[0].x, y[0].y)
                e.lineTo(y[4].x, y[4].y)
                e.lineTo(y[4].x, y[4].y)
                e.lineTo(y[5].x, y[5].y)
                e.lineTo(y[5].x, y[5].y)
                e.lineTo(y[3].x, y[3].y)
                e.lineTo(y[3].x, y[3].y)
                e.lineTo(y[1].x, y[1].y)
                e.lineTo(y[1].x, y[1].y)
                e.lineTo(y[6].x, y[6].y)
                e.lineTo(y[6].x, y[6].y)
                e.lineTo(y[4].x, y[4].y)
                e.lineTo(y[6].x, y[6].y)
                e.lineTo(y[2].x, y[2].y)
                e.lineTo(y[2].x, y[2].y)
                e.lineTo(y[5].x, y[5].y)
                e.stroke()
            };
            var a = this.$el.find("canvas")[0];
            if (!a || !t.isFunction(a.getContext)) return;
            var f = a.getContext("2d"),
                l = a.width,
                c = a.height,
                h = l / 2,
                p = c / 2,
                d = new Date,
                v = d.getDate(),
                m = d.getMonth() + 1,
                g = d.getFullYear();
            v < 10 && (v = "0" + v)
						m < 10 && (m = "0" + m)
						d = m + "/" + v + "/" + g;
            var y = [];
            y[0] = new u(160, 150)
            y[1] = new u(210, -130)
            y[2] = new u(29, -174)
            y[3] = new u(-39, -25)
            y[4] = new u(-192, 29)
            y[5] = new u(-220, 0)
            y[6] = new u(-148, -124);
            var b = function () {
                window.requestAnimationFrame(b, a), f.clearRect(0, 0, l * 2, c * 2);
                var e = f.createLinearGradient(-100, -100, 0, p - 100);
                e.addColorStop(0, "#FF1200")
		e.addColorStop(.5, "#F65517")
		e.addColorStop(1, "#F98E20")
		f.save()
		f.scale(.5, .5)
		f.translate(l + 70, c + 80)
		f.strokeStyle = e
		f.fillStyle = e;
                for (var t = 0; t < y.length; t++) y[t].makeShape(f);
		y[0].oscillateX(-67, 160)
		y[0].oscillateY(150, 220)
		y[1].oscillateX(150, 210)
		y[1].oscillateY(-290, -130)
		y[2].oscillateY(-174, -134)
		y[3].oscillateX(-39, 148)
		y[4].oscillateX(-290, -192)
		y[5].oscillateX(-300, -220)
		y[5].oscillateY(-114, 140)
		y[6].oscillateX(-218, -148)
		y[6].oscillateY(-194, -124)
		f.restore()
	    };
            b()
        }
    });
    return s
})