Dan Cummings Thing

by Admiral Potato

HTML

<ul id="boxList"></ul>
<ul id="buttonList">
    <li><button id="prev">Previous</button></li>
    <li><button id="next">Next</button></li>
</ul>

SCSS

#boxList, #buttonList{
    display: block;
    width: 1000px;
    height: 1000px;
    overflow: hidden;
    li{
        float: left;
        display: block;
        width: 250px;
        height: 250px;
        line-height: 250px;
        font-size: 96px;
        text-align: center;
        color: #fff;
        font-family: monospace;
        button{
            display: block;
            width: 90%;
            margin: auto;
        }
    }
}

JavaScript

//reference for seeded random number generator by Antti Sykäri:
//http://stackoverflow.com/questions/521295/javascript-random-seeds
var seed = function(s) {
    return function random() {
        var x = Math.sin(s++) * 10000;
        return x - Math.floor(x);
    }
};
//end seeded random

var numBoxes = 16,
    numOrientations = 4,
    currentRandomSeed = 0,
    imageList = [
        'http://31.media.tumblr.com/826ef53b5f5ffa6550fea0a4d11813ec/tumblr_nmu9blZtgH1relaado1_250.gif',
        'http://33.media.tumblr.com/c26742bfb56f65cde060dacb0edeb72c/tumblr_nlptn4t5Ug1relaado2_250.gif',
        'http://33.media.tumblr.com/96379ac3db3d8b4402dc7a050aec1e08/tumblr_nlzrplqoZN1relaado1_250.gif',
        'http://38.media.tumblr.com/2e32733ba3d24198e67bc9e81c5daa43/tumblr_nkbp05brJm1relaado1_250.gif',
        'http://33.media.tumblr.com/df4ddde2c64effc35689919824d92de6/tumblr_nig1lqXIor1relaado1_250.gif',
        'http://33.media.tumblr.com/b10ff6dd657c57954397d1c403c5574b/tumblr_nfsuvwSJyr1relaado1_250.gif',
        'http://38.media.tumblr.com/05ce7d846e3c6b4e06f7728819737a05/tumblr_nevo7uAXJB1relaado1_250.gif',
        'http://33.media.tumblr.com/51a89454ccc82ae37b8ae6b509d893f9/tumblr_nevq60pHa91relaado1_250.gif',
        'http://38.media.tumblr.com/7629cf9a04852024a2e08eca6d97509a/tumblr_negckda8Tw1relaado1_250.gif',
        'http://33.media.tumblr.com/fd19fd7e41823f820628e9386b40f430/tumblr_neakx06PAr1relaado2_r1_250.gif',
        'http://33.media.tumblr.com/f69dbc063dd42382bf4fd460c94b7326/tumblr_ndvzioCGzg1relaado1_250.gif',
        'http://31.media.tumblr.com/5975e93c1382470021bccbe585affe7c/tumblr_ncr8cdHvnB1relaado1_250.gif',
        'http://38.media.tumblr.com/2ce57de121a326a31ac65c7ef32d6f1f/tumblr_n7nxi7WEN71relaado1_r1_250.gif',
        'http://33.media.tumblr.com/027a1d74edcd2ca44cd8296cb6ce9b92/tumblr_mz77fw7kmg1relaado1_250.gif',
        'http://31.media.tumblr.com/b90ac70b213f12b714ea0c3b19c5ad1b/tumblr_n1kecnnkGZ1relaado3_r1_250.gif',
       ...