Back to Coding Horrors

Coding horror experiment in HTML 5

Coding Horrors Community

Started by rip-off October 31, 2013 11:34 PM

20 comments, last by rip-off 10 years, 4 months ago

RLS0812

3,045

November 23, 2013 01:03 PM

Added background image.

Added title.

TODO: game mechanics if I have the time.


<!DOCTYPE html>
<html>
<head>
    <title>Horror!</title>
    <style type="text/css">
        body {
            text-align:center;
            margin: 0;
            padding: 0;
			background-image:url('http://fc09.deviantart.net/fs70/f/2010/323/9/8/black_stone_by_rls0812-d335i0x.jpg');
        }
		<!-- I own the copyright to the background image, and it may be used for purpose of this project ~RLS0812 -->
    </style>
</head>
<body>
<br>
<div>
<canvas id="Title" width="800" height="35" style="border:4px solid #600000;">
<h1><b><center>Your browser is outdated. Use <a href="http://mozilla-firefox.todownload.com">FireFox</a> !</center></b></h1></canvas>
<script>
var Title = "Only Frankenstein Can Save The World !";
var c=document.getElementById("Title");
var ctx=c.getContext("2d");
ctx.rect(0,0,800,35);;
ctx.fillStyle="#000000";
ctx.fill();
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","#FF0000");
gradient.addColorStop("0.5","#FFFFFF");
gradient.addColorStop("1.0","#FF0000");
ctx.font="39px Verdana";
ctx.fillStyle=gradient;
ctx.fillText(Title,2,32);
</script>
</div>
<div>
    <canvas id="canvas" width="800" height="600" style="border:4px solid #600000;">
        Your browser does not support the canvas element
    </canvas>
	
</div>
<div id="hiddenStuff" style="display: none">
    <script>
        function makeTransparent(imageElement) {
            var canvas = document.createElement("canvas");
            canvas.width = imageElement.width;
            canvas.height = imageElement.height;
            document.getElementById("hiddenStuff").appendChild(canvas);
 
            var context = canvas.getContext("2d");
            context.drawImage(imageElement, 0, 0);
 
            var canvasImage = context.getImageData(0, 0, canvas.width, canvas.height); //IE10 error: IndexSizeError
            var imageData = canvasImage.data;
            for(var i = 0; i < imageData.length; i += 4) {
                if(imageData[i + 0] == 0 && imageData[i + 1] == 0 && imageData[i + 2] == 0) {
                    imageData[i + 3] = 0;
                }
            }
            canvasImage.data = imageData;
            context.putImageData(canvasImage, 0, 0);
 
            var newImage = new Image();
            newImage.src = canvas.toDataURL();
            return newImage;
        }
        
        function Particle(x, y, vx, vy, color, size, lifeTime) {
            this.x = x;
            this.y = y;
            this.vx = vx;
            this.vy = vy;
            this.color = color;
            this.size = size;
            this.lifeTime = lifeTime;
            
            this.Update = function(delta) {
                this.x += this.vx * delta;
                this.y += this.vy * delta;
                this.lifeTime -= delta;
            }
        }
        
        function CreateParticleExplosion(x, y, particles) {
            for(var i = 0; i < 100; ++i) {
                particles.push(new Particle(x, y, Math.random() - 0.5, Math.random() - 0.5, '#FF0000', 10, 5000));
            }
        }
        
        function Rect(left, top, right, bottom) {
            this.left = left;
            this.right = right;
            this.top = top;
            this.bottom = bottom;
        }
        
        function IntersectRect(r1, r2) {
            return !(r2.left > r1.right || 
                r2.right < r1.left || 
                r2.top > r1.bottom ||
                r2.bottom < r1.top);
        }
 
        window.onload = function () {
            var canvas = document.getElementById("canvas");
            if (canvas.getContext) {
                var canvasWidth = canvas.offsetWidth;
                var canvasHeight = canvas.offsetHeight;
                var context = canvas.getContext("2d");
                var lastTime = 0;
                var keys = new Object();
                var skipDelta = 0;
                var skipInterval = 4;
                var lightning = { current: 0, max: 0 };
                var speed = 0.5;
                var particles = [];
 
                context.fillStyle = "rgb(0, 0, 0)";
                context.fillRect(0, 0, canvasWidth, canvasHeight);
 
                var sprite = makeTransparent(document.getElementById("sprite"));
                var x = Math.random() * (canvasWidth - sprite.width);
                var y = Math.random() * (canvasHeight - sprite.height);
 
                var organIds = ['brain', 'heart', 'lungs', 'liver', 'kidney', 'stomache', 'intestines', 'ghost1', 'ghost2', 'ghost3'];
                var organs = [];
                var organImages = [];
 
                for (var i = 0 ; i < organIds.length ; ++i) {
                    var organImage = document.getElementById(organIds[i]);
                    organImages.push(makeTransparent(organImage));
                }
 
                for (var i = 0 ; i < organIds.length * 10; ++i) {
                    var organX = Math.random() * (canvasWidth - sprite.width);
                    var organY = Math.random() * (canvasHeight - sprite.height);
                    organs.push({ image: organImages[i % organIds.length], x: organX, y: organY, origX: organX, origY: organY });
                }
 
                function Draw() {
                    var LIGHTNING_WIDTH = 0.03;
                    if (Math.random() > 0.99 && lightning.current <= 0) {
                        lightning.max = 100 * (0.5 + Math.random());
                        lightning.current = lightning.max;
                        var LIGHTNING_NOT_TOO_CLOSE_TO_EDGE = LIGHTNING_WIDTH * 3;
                        lightning.position = LIGHTNING_NOT_TOO_CLOSE_TO_EDGE + ((1 - LIGHTNING_NOT_TOO_CLOSE_TO_EDGE) * Math.random());
                    }
 
                    context.fillStyle = '#000000';
                    if(lightning.current > 0) {
                        context.fillRect(0, 0, canvasWidth, canvasHeight);
 
                        var grad = context.createLinearGradient(0, 0, canvasWidth, canvasHeight);
                        var gradientLimit = 8;
                        var gradientMid = gradientLimit / 2;
                        for (var i = 0; i < 1 * gradientLimit; i++) {
                            var offSet = i;
                            if(i == 0 || i == (gradientLimit - 1)) {
                                offSet = (i == 0) ? 0 : 1;
                            } else {
                                offSet = lightning.position;
                                var difference = i - gradientMid;
                                offSet += difference * LIGHTNING_WIDTH;
                            }
 
                            if(false) {
                                var randomColor = Math.floor(Math.random() * 9999999);
                                var randomColorHexString = '#' + randomColor.toString(16);
                            }
                            var redAndGreen = (i == gradientMid) ? 0xff : 0x00;
                            var blue = (Math.abs(i - gradientMid) < 2) ? 0xff : 0x00;
                            var lightningAlpha = lightning.current / lightning.max;
                            var randomColorRGBAString = "rgba(" + redAndGreen + "," + redAndGreen + "," + blue + "," + lightningAlpha + ")";
 
                            var offSetLimited = Math.min(1, Math.max(0, offSet))
                            grad.addColorStop(offSetLimited, randomColorRGBAString /* randomColorHexString */);
                        }
 
                        context.fillStyle = grad;
                        lightning.current -= 1;
                    }
                    context.fillRect(0, 0, canvasWidth, canvasHeight);
                    context.fillStyle = '#FFFFFF';
 
                    for (var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        context.drawImage(organ.image, organ.x, organ.y);
                    }
                
                    for(var i = 0; i < particles.length; ++i) {
                        var p = particles[i];
                        context.fillStyle = p.color;
                        context.fillRect(p.x, p.y, p.size, p.size);
                    }
 
                    context.drawImage(sprite, x, y);
                }
 
                function keyEvent(e) {
                    e = e || window.event;
                    if (e.type == 'keyup') {
                        keys.down = null;
                    } else {
                        keys.down = e;
                    }
                }
 
                function Update(delta, now) {
                    skipDelta = skipInterval * delta;
                    
                    for(var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        if(IntersectRect(new Rect(x, y, x + sprite.width, y + sprite.height),
                            new Rect(organ.x, organ.y, organ.x + sprite.width, organ.y + sprite.height))) {
                            organs.splice(i, 1);
                            CreateParticleExplosion(x, y, particles);
                        }
                    }
                
                    for(var i = 0; i < particles.length; ++i) {
                        if(particles[i].lifeTime <= 0) {
                            particles.splice(i, 1);
                        } else {
                            particles[i].Update(delta);
                        }
                    }
 
                    for (var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        organ.x = organ.origX + Math.cos(now/((i%5)*100 + 500) + i) * (i % 20);
                        organ.y = organ.origY + Math.sin(now/((i%5)*100 + 500) + i) * (i % 20);
                    }
 
                    if(lightning.current > 0) {
                        for (var i = 0 ; i < organs.length ; ++i) {
                            var organ = organs[i];
                            organ.x += Math.random() * lightning.current/4;
                            organ.y += Math.random() * lightning.current/4;
                        }
                    }
 
                    if (e = keys.down) {
                        if (e.keyCode == '87') {
                            y -= delta * speed;
                        } else if (e.keyCode == '83') {
                            y += delta * speed;
                        } else if (e.keyCode == '65') {
                            x -= delta * speed;
                        } else if (e.keyCode == '68') {
                            x += delta * speed;
                        } else if (e.keyCode == '84') {
                            y -= skipDelta;
                        } else if (e.keyCode == '71') {
                            y += skipDelta;
                        } else if (e.keyCode == '70') {
                            x -= skipDelta;
                        } else if (e.keyCode == '72') {
                            x += skipDelta;
                        }
                        
                        if(x < 0) {
                            x = 0;
                        } else if(x > (canvasWidth - sprite.width)) {
                            x = canvasWidth - sprite.width;
                        }
                        
                        if(y < 0) {
                            y = 0;
                        } else if(y > (canvasHeight - sprite.height)) {
                            y = canvasHeight - sprite.height;
                        }
                    }
                }
 
                var fps = 60;
                var intervalId = setInterval(function () {
                    var now = Date.now();
                    if(lastTime === 0) {
                        lastTime = now;
                    }
                    var delta = now - lastTime;
                    lastTime = now;
                    Update(delta, now);
                    Draw();
                }, 1000 / fps);
 
                document.onkeydown = keyEvent;
                document.onkeyup = keyEvent;
            }
        }
    </script>
    <img id="sprite" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTFH80I3AAABDElEQVRYR8XOC27CMBBFUVbQNWVnzc4pZETGTk4+tiVa6UjtA9/p4/Xz/Gccv4njzjzPTdQ4wHGleAs1NzgudrHfn1t279AucFy0HD0y9A8o2EXtxDEo1kPtxDEo1kPtxDEo1kPtxDG0hVLbO45hGyn/PqO3xziGMjJC7cQxnMXu7uVnxtGhEboRODoyQjcCR0dG6Ebg6Ehp9PuJoyMjdCNwDAr1UDtxDIr1UDtxDIp9jHy3xjEo9qbPrr5/jGNQrIfaiWNSsIWaNY41he9Qa4+j6Yjo7TGOVh4oD2638s01jpVpmuL37cHS5rP1zTWOlXdsCZZHTqzfRws4VtYYjlH55hpH0zHRW3o8/wAvkCGGQzdTzQAAAABJRU5ErkJggg=="/>
    <img id="brain" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAUdJREFUWEfFkUFuQjEMRH3iHg1RNhygu56BXqPqApHWGCe2M/khVJhKTyITx2++Sn9/5cXAMBMYZgLDTGCYCQwf5kClgu4BMITY5VEQ7xQ7MwCGEF5Y6HTFCvS33ikf9N3tAMCwQwRvhlZiVMDOoJ03YOhoy30BK9CzvVMmJWBYwXKR9HI8Z2eBowscIhgvLfR1O8cZRYsNS7iDQwRoOfr6OBORuXe6RI87VLygX7YmZ3RW3hqXFzNebgVtgdxrpvczFgrocFzg5Y8wKdAEz5AzGwX44kjn6xB69H85MynwPLn8S3WX8W4XaPJYbBUoZ7YKyKN1uXxtPAM50w4i84vmBVS2zUDOtAMP7eineyi/kZyRmRnWE+jD+HhcYPp19wBDh5TYVyFzoc9aEL1ZAIYdKoug2UVgmAkMM4FhJjDMBIaZwDAJKr+ZqoF7rlvrLwAAAABJRU5ErkJggg=="/>
    <img id="heart" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTFH80I3AAABLklEQVRYR8WSC47CMAwFe6c94B696xfVaTBT5yPIIo2EX+x4aDnsc/4zd/ELtOcrDNx3F6Xp5zitqCSDKT4nLMjuuovSYAItdjAl4n3CgpdZATN30TZWQEK0c3HeircZ6r/AsOIXuEitL2KfeiKxN4DhC+WC5km0+MVPy51EAsOKD2YLynn4zxDLAvYlxQV7EtMCfrEVXaqE6LyuAIaF0eUtmcSSQO+9EjTnYrAHw8KnBWiHgWHBrWclNEMZ7TAwrKwIRPyH0P0GhhUflsSqSLJcYPhGK2LBFB8RECsSneUCw0dmBAaWCwwfmXkKXxEQIwKDywWGKS6QSXxVQGQSE8sFhl2KgLgkXMRzmnkAwyGiwMJygeEQvrCF+jpguBMMd4LhTjDcCYY7wXATx/kHt+4qtXoUaqkAAAAASUVORK5CYII="/>
    <img id="lungs" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAThJREFUWEfVjlGSgjAQBbnlHsc7eUGWUD54M3Qw2SirVvWHw3RPpuU3/zM4vBIcXgkOm/iZbiv0rQMcNvH2B+hA7dCzee174jh0+T7NKxQ7m2Uv7xlx4IIiHqPdPCOPdh/EgRZzRCHazbOam3cf7H+0RIFCDlD0mZ/3F9rkgmSFMj0No+8BLZAryne/ufC3B7gnV5ArwI0RkoQOuOPoO7kC/BggSegARMI3cgW4MUKS8CPuyRXkCnBjhCRHR9yT2+onN0ZIcnTIPbmtfnL7AxAZ8YcDo/4eICEDgc3vaZi7B2g5o0MW2Pyehrl7gJYzdFx87wPK4OoHWOdDHkCLmSQe0HdyM9Y5f4CiQsdq5H1qFqxVf4Aiivciv9Ze984WtqUB1KndCA/Q8voBYiN4+/AAh+RXEu/d5l/4B/ATKM7DZAAAAABJRU5ErkJggg=="/>
    <img id="liver" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAOxJREFUWEfFjtsOwzAIQ/vn+/QOHmgM8ZKlFzfSkWILbDZ7+8tQUwk1lVBTCTWVUFMJNffPgNV5hOxS81gwkcCwSp1lxCx0JXEwCowQhM39wuehK4lTgau8ckDklnInG08c8KM4yMZd5VE6KXeaiGETp8HSADsITcSCiSWwjIEdhCZ82D5L1DIEswc04Uv2mVKLGJg7oQlftM+QWoRg1gJNRJAJCpYhmHGCbHigfablde8C2fjngLpzkWywAx4sd7IRRSa6A+rsTfQmHvBwudObcYCg3OnNKBaUO9RUQk0l1FRCTSXUVEJNEdv+BVHR+n2aiu90AAAAAElFTkSuQmCC"/>
    <img id="kidney" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAOpJREFUWEflktENgzAMRLtTt+oSXbPbUE7IkuO8EEio+SjSk/DV5ztVPNZnuRkUM0HxMpbXxvvJv6+gOI0FR6BIJUxDwUZugY97d4T9SpiGQj3hXyiGS6BQz6ECZBS0GyGfp1uATB7yEOQVuwXIQERfC4V55O0X0Nfb+IKNcKTJAW8xbEudcPHbAh104LYCZ8JF64bbKQY0CAs+Ey5at9xOMaBBjISLA3eKoTJERkrIs+MvBR9GjBQQ8jW8tUjBxmiBHWqRgo3/KCAoXKQVELcXMGIJ2pkAxUxQzATFTFDMBMVMUMwExSQeyxcohkKoZGlOOAAAAABJRU5ErkJggg=="/>
    <img id="stomache" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAANVJREFUWEftz1EOwiAQhOHewTt4TS/hfdENbrqFX8pCoS+YfDFOkZlu30+4GYbnHq+InvlgWHZducCwbA0QpRH6LEVnIahDBdYzHGme35UF9WyhZYvfP/9HHH70oQF2xG0DdIR8DxtQKrfWgKEDqDA1ZEBtubh8gFzoefshA6jM0uK8XGRBPb2USi0uVhjmtMyispSepTsjDHeeMlIuFxjuesu7BugFZ9rLBYaRLaHnwp7xlwsMI89FetbznwjDyH9ZCwxb36YFhmvATBjOhOFMGE6yhQ/Vn9p8tmxuOAAAAABJRU5ErkJggg=="/>
    <img id="intestines" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAO5JREFUWEftjmsOgzAMg7nTDrijs1Elke2GxxCkmgTS96OObTx9v3kwqVhJKlaSipWkYiWpeAnvDcBHj4YYThM/fAGmgS8JAHj/BerBATYCvBISo5gP4bkAO60X/BJUcx9IiZ85kKUu0yCblCQBB/2U04zkUJM8C6tljnu2/OAJ5Ab/pAeHHCxHsptluk7xwJ0eUYCm0LAkAzJIl+U7PdisOt7A42AP0uX4Tg82yy3ugnqU5js74MgP9ngGPAP+e4Dez7DTyULFAOmlRxiGDVi4e4DcO+HyAQutUzSjF908bMBdDB+wQipWkopFTPMHvTGkayscCJoAAAAASUVORK5CYII="/>
    //Credit for sprites goes to George Williams
    //http://gmc.yoyogames.com/index.php?showtopic=302110
    <img id="ghost1" src="data:image/gif;base64,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" />
    <img id="ghost2" src="data:image/gif;base64,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" />
    <img id="ghost3" src="data:image/gif;base64,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" />
</div>
<br><br><br>
</body>
</html>

I cannot remember the books I've read any more than the meals I have eaten; even so, they have made me.

~ Ralph Waldo Emerson

froop

642

November 27, 2013 12:19 AM

Added some gameplay. Now Frankenstein has to collect all the organs without touching the ghosts.

Also made the blood fx more next gen.


<!DOCTYPE html>
<html>
<head>
    <title>Horror!</title>
    <style type="text/css">
        body {
            text-align:center;
            margin: 0;
            padding: 0;
            background-image:url('http://fc09.deviantart.net/fs70/f/2010/323/9/8/black_stone_by_rls0812-d335i0x.jpg');
        }
        <!-- I own the copyright to the background image, and it may be used for purpose of this project ~RLS0812 -->
    </style>
</head>
<body>
<br>
<div>
<canvas id="Title" width="800" height="35" style="border:4px solid #600000;">
<h1><b><center>Your browser is outdated. Use <a href="http://mozilla-firefox.todownload.com">FireFox</a> !</center></b></h1></canvas>
<script>
var Title = "Only Frankenstein Can Save The World !";
var c=document.getElementById("Title");
var ctx=c.getContext("2d");
ctx.rect(0,0,800,35);;
ctx.fillStyle="#000000";
ctx.fill();
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","#FF0000");
gradient.addColorStop("0.5","#FFFFFF");
gradient.addColorStop("1.0","#FF0000");
ctx.font="39px Verdana";
ctx.fillStyle=gradient;
ctx.fillText(Title,2,32);
</script>
</div>
<div>
    <canvas id="canvas" width="800" height="600" style="border:4px solid #600000;">
        Your browser does not support the canvas element
    </canvas>
    
</div>
<div id="hiddenStuff" style="display: none">
    <script>
        function makeTransparent(imageElement) {
            var canvas = document.createElement("canvas");
            canvas.width = imageElement.width;
            canvas.height = imageElement.height;
            document.getElementById("hiddenStuff").appendChild(canvas);
 
            var context = canvas.getContext("2d");
            context.drawImage(imageElement, 0, 0);
 
            var canvasImage = context.getImageData(0, 0, canvas.width, canvas.height); //IE10 error: IndexSizeError
            var imageData = canvasImage.data;
            for(var i = 0; i < imageData.length; i += 4) {
                if(imageData[i + 0] == 0 && imageData[i + 1] == 0 && imageData[i + 2] == 0) {
                    imageData[i + 3] = 0;
                }
            }
            canvasImage.data = imageData;
            context.putImageData(canvasImage, 0, 0);
 
            var newImage = new Image();
            newImage.src = canvas.toDataURL();
            return newImage;
        }
        
        function Particle(x, y, vx, vy, color, size, lifeTime) {
            this.x = x;
            this.y = y;
            this.vx = vx;
            this.vy = vy;
            this.color = color;
            this.size = size;
            this.lifeTime = lifeTime;
            
            this.Update = function(delta) {
                this.x += this.vx * delta;
                this.y += this.vy * delta;
                this.lifeTime -= delta;
            }
        }
        
        function CreateParticleExplosion(x, y, particles) {
            for(var i = 0; i < 50; ++i) {
                var red = Math.floor(Math.random() * 16).toString(16);
                particles.push(new Particle(x, y, Math.random() - 0.5, Math.random() - 0.5, '#' + red + 'F0000', 10 * Math.random(), 5000));
            }
        }
        
        function Rect(left, top, right, bottom) {
            this.left = left;
            this.right = right;
            this.top = top;
            this.bottom = bottom;
        }
        
        function IntersectRect(r1, r2) {
            return !(r2.left > r1.right || 
                r2.right < r1.left || 
                r2.top > r1.bottom ||
                r2.bottom < r1.top);
        }
        
        function fillRoundedRect(x, y, w, h, r) {
            /* code from http://gmigdos.wordpress.com/2010/05/20/javascript-draw-a-rounded-rectangle-on-an-html-5-canvas/ */
            this.beginPath();
            this.moveTo(x+r, y);
            this.lineTo(x+w-r, y);
            this.quadraticCurveTo(x+w, y, x+w, y+r);
            this.lineTo(x+w, y+h-r);
            this.quadraticCurveTo(x+w, y+h, x+w-r, y+h);
            this.lineTo(x+r, y+h);
            this.quadraticCurveTo(x, y+h, x, y+h-r);
            this.lineTo(x, y+r);
            this.quadraticCurveTo(x, y, x+r, y);
            this.fill();       
        }
 
        window.onload = function () {
            CanvasRenderingContext2D.prototype.fillRoundedRect = fillRoundedRect;
            
            var canvas = document.getElementById("canvas");
            if (canvas.getContext) {
                var canvasWidth = canvas.offsetWidth;
                var canvasHeight = canvas.offsetHeight;
                var context = canvas.getContext("2d");
                var lastTime = 0;
                var keys = new Object();
                var skipDelta = 0;
                var skipInterval = 4;
                var lightning = { current: 0, max: 0 };
                var speed = 0.5;
                var particles = [];
                var lives = 5;
 
                context.fillStyle = "rgb(0, 0, 0)";
                context.fillRect(0, 0, canvasWidth, canvasHeight);
 
                var sprite = makeTransparent(document.getElementById("sprite"));
                var x = Math.random() * (canvasWidth - sprite.width);
                var y = Math.random() * (canvasHeight - sprite.height);
 
                var organIds = ['brain', 'heart', 'lungs', 'liver', 'kidney', 'stomache', 'intestines', 'ghost1', 'ghost2', 'ghost3'];
                var organs = [];
                var organImages = [];
 
                for (var i = 0 ; i < organIds.length ; ++i) {
                    var organImage = document.getElementById(organIds[i]);
                    organImages.push(makeTransparent(organImage));
                }
 
                for (var i = 0 ; i < organIds.length * 10; ++i) {
                    var organX = Math.random() * (canvasWidth - sprite.width);
                    var organY = Math.random() * (canvasHeight - sprite.height);
                    organs.push({ organId: i % organIds.length, image: organImages[i % organIds.length], x: organX, y: organY, origX: organX, origY: organY });
                }
 
                function Draw() {
                    var LIGHTNING_WIDTH = 0.03;
                    if (Math.random() > 0.99 && lightning.current <= 0) {
                        lightning.max = 100 * (0.5 + Math.random());
                        lightning.current = lightning.max;
                        var LIGHTNING_NOT_TOO_CLOSE_TO_EDGE = LIGHTNING_WIDTH * 3;
                        lightning.position = LIGHTNING_NOT_TOO_CLOSE_TO_EDGE + ((1 - LIGHTNING_NOT_TOO_CLOSE_TO_EDGE) * Math.random());
                    }
 
                    context.fillStyle = '#000000';
                    if(lightning.current > 0) {
                        context.fillRect(0, 0, canvasWidth, canvasHeight);
 
                        var grad = context.createLinearGradient(0, 0, canvasWidth, canvasHeight);
                        var gradientLimit = 8;
                        var gradientMid = gradientLimit / 2;
                        for (var i = 0; i < 1 * gradientLimit; i++) {
                            var offSet = i;
                            if(i == 0 || i == (gradientLimit - 1)) {
                                offSet = (i == 0) ? 0 : 1;
                            } else {
                                offSet = lightning.position;
                                var difference = i - gradientMid;
                                offSet += difference * LIGHTNING_WIDTH;
                            }
 
                            if(false) {
                                var randomColor = Math.floor(Math.random() * 9999999);
                                var randomColorHexString = '#' + randomColor.toString(16);
                            }
                            var redAndGreen = (i == gradientMid) ? 0xff : 0x00;
                            var blue = (Math.abs(i - gradientMid) < 2) ? 0xff : 0x00;
                            var lightningAlpha = lightning.current / lightning.max;
                            var randomColorRGBAString = "rgba(" + redAndGreen + "," + redAndGreen + "," + blue + "," + lightningAlpha + ")";
 
                            var offSetLimited = Math.min(1, Math.max(0, offSet))
                            grad.addColorStop(offSetLimited, randomColorRGBAString /* randomColorHexString */);
                        }
 
                        context.fillStyle = grad;
                        lightning.current -= 1;
                    }
                    context.fillRect(0, 0, canvasWidth, canvasHeight);
                    context.fillStyle = '#FFFFFF';
 
                    for (var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        context.drawImage(organ.image, organ.x, organ.y);
                    }
                
                    for(var i = 0; i < particles.length; ++i) {
                        var p = particles[i];
                        context.fillStyle = p.color;
                        context.fillRect(p.x, p.y, p.size, p.size);
                    }
 
                    context.drawImage(sprite, x, y);
                    
                    context.fillStyle = '#333';
                    context.fillRoundedRect(30, 520, 170, 50, 20);
                    
                    for(var i = 0; i < lives; ++i) {
                        context.drawImage(sprite, 38 + i * 30, 528);
                    }
                }
 
                function keyEvent(e) {
                    e = e || window.event;
                    if (e.type == 'keyup') {
                        keys.down = null;
                    } else {
                        keys.down = e;
                    }
                }
                
                function LoseGame() {
                    for(var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        CreateParticleExplosion(organ.x, organ.y, particles);
                    }
                    
                    organs = [];
                }
 
                function Update(delta, now) {
                    skipDelta = skipInterval * delta;
                    
                    for(var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        if(IntersectRect(new Rect(x, y, x + sprite.width, y + sprite.height),
                            new Rect(organ.x, organ.y, organ.x + sprite.width, organ.y + sprite.height))) {
                            organs.splice(i, 1);
                            CreateParticleExplosion(x, y, particles);
                            if(organ.organId > 6) {
                                --lives;
                                if(lives == 0) {
                                    LoseGame();
                                    break;
                                }
                            }
                        }
                    }
                
                    for(var i = 0; i < particles.length; ++i) {
                        if(particles[i].lifeTime <= 0) {
                            particles.splice(i, 1);
                        } else {
                            particles[i].Update(delta);
                        }
                    }
 
                    for (var i = 0 ; i < organs.length ; ++i) {
                        var organ = organs[i];
                        organ.x = organ.origX + Math.cos(now/((i%5)*100 + 500) + i) * (i % 20);
                        organ.y = organ.origY + Math.sin(now/((i%5)*100 + 500) + i) * (i % 20);
                    }
 
                    if(lightning.current > 0) {
                        for (var i = 0 ; i < organs.length ; ++i) {
                            var organ = organs[i];
                            organ.x += Math.random() * lightning.current/4;
                            organ.y += Math.random() * lightning.current/4;
                        }
                    }
 
                    if (e = keys.down) {
                        if (e.keyCode == '87') {
                            y -= delta * speed;
                        } else if (e.keyCode == '83') {
                            y += delta * speed;
                        } else if (e.keyCode == '65') {
                            x -= delta * speed;
                        } else if (e.keyCode == '68') {
                            x += delta * speed;
                        } else if (e.keyCode == '84') {
                            y -= skipDelta;
                        } else if (e.keyCode == '71') {
                            y += skipDelta;
                        } else if (e.keyCode == '70') {
                            x -= skipDelta;
                        } else if (e.keyCode == '72') {
                            x += skipDelta;
                        }
                        
                        if(x < 0) {
                            x = 0;
                        } else if(x > (canvasWidth - sprite.width)) {
                            x = canvasWidth - sprite.width;
                        }
                        
                        if(y < 0) {
                            y = 0;
                        } else if(y > (canvasHeight - sprite.height)) {
                            y = canvasHeight - sprite.height;
                        }
                    }
                }
 
                var fps = 60;
                var intervalId = setInterval(function () {
                    var now = Date.now();
                    if(lastTime === 0) {
                        lastTime = now;
                    }
                    var delta = now - lastTime;
                    lastTime = now;
                    Update(delta, now);
                    Draw();
                }, 1000 / fps);
 
                document.onkeydown = keyEvent;
                document.onkeyup = keyEvent;
            }
        }
    </script>
    <img id="sprite" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwQAADsEBuJFr7QAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTFH80I3AAABDElEQVRYR8XOC27CMBBFUVbQNWVnzc4pZETGTk4+tiVa6UjtA9/p4/Xz/Gccv4njzjzPTdQ4wHGleAs1NzgudrHfn1t279AucFy0HD0y9A8o2EXtxDEo1kPtxDEo1kPtxDEo1kPtxDG0hVLbO45hGyn/PqO3xziGMjJC7cQxnMXu7uVnxtGhEboRODoyQjcCR0dG6Ebg6Ehp9PuJoyMjdCNwDAr1UDtxDIr1UDtxDIp9jHy3xjEo9qbPrr5/jGNQrIfaiWNSsIWaNY41he9Qa4+j6Yjo7TGOVh4oD2638s01jpVpmuL37cHS5rP1zTWOlXdsCZZHTqzfRws4VtYYjlH55hpH0zHRW3o8/wAvkCGGQzdTzQAAAABJRU5ErkJggg=="/>
    <img id="brain" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAUdJREFUWEfFkUFuQjEMRH3iHg1RNhygu56BXqPqApHWGCe2M/khVJhKTyITx2++Sn9/5cXAMBMYZgLDTGCYCQwf5kClgu4BMITY5VEQ7xQ7MwCGEF5Y6HTFCvS33ikf9N3tAMCwQwRvhlZiVMDOoJ03YOhoy30BK9CzvVMmJWBYwXKR9HI8Z2eBowscIhgvLfR1O8cZRYsNS7iDQwRoOfr6OBORuXe6RI87VLygX7YmZ3RW3hqXFzNebgVtgdxrpvczFgrocFzg5Y8wKdAEz5AzGwX44kjn6xB69H85MynwPLn8S3WX8W4XaPJYbBUoZ7YKyKN1uXxtPAM50w4i84vmBVS2zUDOtAMP7eineyi/kZyRmRnWE+jD+HhcYPp19wBDh5TYVyFzoc9aEL1ZAIYdKoug2UVgmAkMM4FhJjDMBIaZwDAJKr+ZqoF7rlvrLwAAAABJRU5ErkJggg=="/>
    <img id="heart" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAOwAAADsABataJCQAAABp0RVh0U29mdHdhcmUAUGFpbnQuTkVUIHYzLjUuMTFH80I3AAABLklEQVRYR8WSC47CMAwFe6c94B696xfVaTBT5yPIIo2EX+x4aDnsc/4zd/ELtOcrDNx3F6Xp5zitqCSDKT4nLMjuuovSYAItdjAl4n3CgpdZATN30TZWQEK0c3HeircZ6r/AsOIXuEitL2KfeiKxN4DhC+WC5km0+MVPy51EAsOKD2YLynn4zxDLAvYlxQV7EtMCfrEVXaqE6LyuAIaF0eUtmcSSQO+9EjTnYrAHw8KnBWiHgWHBrWclNEMZ7TAwrKwIRPyH0P0GhhUflsSqSLJcYPhGK2LBFB8RECsSneUCw0dmBAaWCwwfmXkKXxEQIwKDywWGKS6QSXxVQGQSE8sFhl2KgLgkXMRzmnkAwyGiwMJygeEQvrCF+jpguBMMd4LhTjDcCYY7wXATx/kHt+4qtXoUaqkAAAAASUVORK5CYII="/>
    <img id="lungs" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAThJREFUWEfVjlGSgjAQBbnlHsc7eUGWUD54M3Qw2SirVvWHw3RPpuU3/zM4vBIcXgkOm/iZbiv0rQMcNvH2B+hA7dCzee174jh0+T7NKxQ7m2Uv7xlx4IIiHqPdPCOPdh/EgRZzRCHazbOam3cf7H+0RIFCDlD0mZ/3F9rkgmSFMj0No+8BLZAryne/ufC3B7gnV5ArwI0RkoQOuOPoO7kC/BggSegARMI3cgW4MUKS8CPuyRXkCnBjhCRHR9yT2+onN0ZIcnTIPbmtfnL7AxAZ8YcDo/4eICEDgc3vaZi7B2g5o0MW2Pyehrl7gJYzdFx87wPK4OoHWOdDHkCLmSQe0HdyM9Y5f4CiQsdq5H1qFqxVf4Aiivciv9Ze984WtqUB1KndCA/Q8voBYiN4+/AAh+RXEu/d5l/4B/ATKM7DZAAAAABJRU5ErkJggg=="/>
    <img id="liver" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAOxJREFUWEfFjtsOwzAIQ/vn+/QOHmgM8ZKlFzfSkWILbDZ7+8tQUwk1lVBTCTWVUFMJNffPgNV5hOxS81gwkcCwSp1lxCx0JXEwCowQhM39wuehK4lTgau8ckDklnInG08c8KM4yMZd5VE6KXeaiGETp8HSADsITcSCiSWwjIEdhCZ82D5L1DIEswc04Uv2mVKLGJg7oQlftM+QWoRg1gJNRJAJCpYhmHGCbHigfablde8C2fjngLpzkWywAx4sd7IRRSa6A+rsTfQmHvBwudObcYCg3OnNKBaUO9RUQk0l1FRCTSXUVEJNEdv+BVHR+n2aiu90AAAAAElFTkSuQmCC"/>
    <img id="kidney" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAOpJREFUWEflktENgzAMRLtTt+oSXbPbUE7IkuO8EEio+SjSk/DV5ztVPNZnuRkUM0HxMpbXxvvJv6+gOI0FR6BIJUxDwUZugY97d4T9SpiGQj3hXyiGS6BQz6ECZBS0GyGfp1uATB7yEOQVuwXIQERfC4V55O0X0Nfb+IKNcKTJAW8xbEudcPHbAh104LYCZ8JF64bbKQY0CAs+Ey5at9xOMaBBjISLA3eKoTJERkrIs+MvBR9GjBQQ8jW8tUjBxmiBHWqRgo3/KCAoXKQVELcXMGIJ2pkAxUxQzATFTFDMBMVMUMwExSQeyxcohkKoZGlOOAAAAABJRU5ErkJggg=="/>
    <img id="stomache" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAANVJREFUWEftz1EOwiAQhOHewTt4TS/hfdENbrqFX8pCoS+YfDFOkZlu30+4GYbnHq+InvlgWHZducCwbA0QpRH6LEVnIahDBdYzHGme35UF9WyhZYvfP/9HHH70oQF2xG0DdIR8DxtQKrfWgKEDqDA1ZEBtubh8gFzoefshA6jM0uK8XGRBPb2USi0uVhjmtMyispSepTsjDHeeMlIuFxjuesu7BugFZ9rLBYaRLaHnwp7xlwsMI89FetbznwjDyH9ZCwxb36YFhmvATBjOhOFMGE6yhQ/Vn9p8tmxuOAAAAABJRU5ErkJggg=="/>
    <img id="intestines" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAAO5JREFUWEftjmsOgzAMg7nTDrijs1Elke2GxxCkmgTS96OObTx9v3kwqVhJKlaSipWkYiWpeAnvDcBHj4YYThM/fAGmgS8JAHj/BerBATYCvBISo5gP4bkAO60X/BJUcx9IiZ85kKUu0yCblCQBB/2U04zkUJM8C6tljnu2/OAJ5Ab/pAeHHCxHsptluk7xwJ0eUYCm0LAkAzJIl+U7PdisOt7A42AP0uX4Tg82yy3ugnqU5js74MgP9ngGPAP+e4Dez7DTyULFAOmlRxiGDVi4e4DcO+HyAQutUzSjF908bMBdDB+wQipWkopFTPMHvTGkayscCJoAAAAASUVORK5CYII="/>
    //Credit for sprites goes to George Williams
    //http://gmc.yoyogames.com/index.php?showtopic=302110
    <img id="ghost1" src="data:image/gif;base64,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" />
    <img id="ghost2" src="data:image/gif;base64,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" />
    <img id="ghost3" src="data:image/gif;base64,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" />
</div>
<br><br><br>
</body>
</html>

rip-off

11,000

Author

December 01, 2013 08:57 PM

Thanks everyone, I'm closing the experiment. As noted after the jump, all this really means is that I'm unpinning the topics, by all means continue to contribute!

blog | twitter

Coding horror experiment in HTML 5

This topic is closed to new replies.

Popular Topics

Recommended Tutorials

Coding horror experiment in HTML 5

This topic is closed to new replies.

Popular Topics

Recommended Tutorials

Reticulating splines