santa_in_snow.js

function xmas() {
    var b = document.getElementsByTagName('body')[0];
    var c = document.createElement('canvas');
    var ctx = c.getContext('2d');
    var flakes, flakeNumber = 250, gravity = 1, w, h, timer;

    c.style.cursor = 'pointer';
    c.style.zIndex = '999999';
    c.style.top = 0;
    c.style.left = 0;
    c.style.position = 'absolute';
    
    b.appendChild(c);
    
    c.onclick = function() {
        c.parentNode.removeChild(c);
    };
    
    window.onresize = function() {
        window.clearTimeout(timer);
        init();
    };
    
    function init() {
        w = window.innerWidth - 20;
        h = window.innerHeight - 20;

        c.setAttribute('width', w);
        c.setAttribute('height', h);

        flakes = [];

        for(var i=0; i<flakeNumber; i++) {
            flakes.push({
                x: Math.random() * w,
			    y: ((Math.random() * h) - gravity)
		    });
        }
        
        animate();
    }

    function drawFlake(x, y) {
        ctx.fillStyle = '#ffffff';
        ctx.beginPath();
        ctx.arc(x, y, 5, 0, Math.PI*2, true);
        ctx.closePath();
        ctx.fill();
    }
    
    function drawSanta(x, y) {
        ctx.fillStyle = "white";
        ctx.strokeStyle = "black";
        ctx.globalAlpha = "1.0";
        ctx.lineWidth = "1";
        ctx.lineCap = "butt";
        ctx.lineJoin = "round";
        ctx.mitterLimit = "1";
        ctx.font = "normal normal 12 Courier";
        ctx.fillStyle = "#cf7122";
        ctx.beginPath();
        ctx.moveTo(190.50 + x, 110 + y);    
        ctx.bezierCurveTo(212.76 + x, 137.04 + y, 228.70 + x, 183.28 + y, 201 + x, 214.50 + y);    
        ctx.bezierCurveTo(177.76 + x, 240.70 + y, 137.26 + x, 243.54 + y, 115 + x, 216.50 + y);    
        ctx.bezierCurveTo(92.74 + x, 189.46 + y, 95.24 + x, 144.54 + y, 117.50 + x, 117.50 + y);    
        ctx.bezierCurveTo(139.76 + x, 90.46 + y, 168.24 + x, 82.96 + y, 190.50 + x, 110 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "white";
        ctx.strokeStyle = "black";
        ctx.fillStyle = "#dd381b";
        ctx.beginPath();
        ctx.moveTo(164 + x, 125 + y);    
        ctx.bezierCurveTo(189.77 + x, 161.32 + y, 206.77 + x, 222.68 + y, 181 + x, 259 + y);    
        ctx.bezierCurveTo(155.23 + x, 295.32 + y, 77.77 + x, 296.32 + y, 52 + x, 260 + y);    
        ctx.bezierCurveTo(26.23 + x, 223.68 + y, 36.21 + x, 158.10 + y, 66 + x, 125 + y);    
        ctx.bezierCurveTo(93 + x, 95 + y, 138.23 + x, 88.68 + y, 164 + x, 125 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "#f8d5a1";
        ctx.beginPath();
        ctx.moveTo(48 + x, 169.50 + y);    
        ctx.bezierCurveTo(52.06 + x, 174.75 + y, 44.75 + x, 178 + y, 45.82 + x, 190.33 + y);    
        ctx.bezierCurveTo(46.70 + x, 200.46 + y, 38.15 + x, 193.63 + y, 33.92 + x, 188.06 + y);    
        ctx.bezierCurveTo(29.69 + x, 182.48 + y, 29.69 + x, 173.45 + y, 33.92 + x, 167.88 + y);    
        ctx.bezierCurveTo(38.15 + x, 162.30 + y, 43.94 + x, 164.25 + y, 48 + x, 169.50 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.beginPath();
        ctx.moveTo(184.25 + x, 209 + y);    
        ctx.bezierCurveTo(179.33 + x, 204.25 + y, 187.98 + x, 205.19 + y, 186.25 + x, 190.50 + y);    
        ctx.bezierCurveTo(184.87 + x, 178.73 + y, 189.51 + x, 181.16 + y, 193.03 + x, 186.04 + y);    
        ctx.bezierCurveTo(196.56 + x, 190.93 + y, 197.10 + x, 199.29 + y, 194.24 + x, 204.71 + y);    
        ctx.bezierCurveTo(191.38 + x, 210.14 + y, 189.17 + x, 213.75 + y, 184.25 + x, 209 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "white";
        ctx.strokeStyle = "black";
        ctx.fillStyle = "#ffd5a2";
        ctx.beginPath();
        ctx.moveTo(142.82 + x, 38.47 + y);    
        ctx.bezierCurveTo(160.39 + x, 56.44 + y, 160.39 + x, 85.56 + y, 142.82 + x, 103.53 + y);    
        ctx.bezierCurveTo(125.25 + x, 121.49 + y, 96.75 + x, 121.49 + y, 79.18 + x, 103.53 + y);    
        ctx.bezierCurveTo(61.61 + x, 85.56 + y, 61.61 + x, 56.44 + y, 79.18 + x, 38.47 + y);    
        ctx.bezierCurveTo(96.75 + x, 20.51 + y, 125.25 + x, 20.51 + y, 142.82 + x, 38.47 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "white";
        ctx.strokeStyle = "black";
        ctx.strokeStyle = "#000000";
        ctx.lineWidth = "1.000000";
        ctx.lineJoin = "miter";
        ctx.beginPath();
        ctx.moveTo(-122 + x, -146 + y);    
        ctx.bezierCurveTo( - 122 + x, -146 + y, -122 + x, -146 + y, -122 + x, -146 + y);    
        ctx.bezierCurveTo( - 122 + x, -146 + y, -122 + x, -146 + y, -122 + x, -146 + y);    
        ctx.bezierCurveTo( - 122 + x, -146 + y, -122 + x, -146 + y, -122 + x, -146 + y);    
        ctx.bezierCurveTo( - 122 + x, -146 + y, -122 + x, -146 + y, -122 + x, -146 + y);    
        ctx.closePath();
        ctx.stroke();
        ctx.fillStyle = "#4f4f4f";
        ctx.lineWidth = "1";
        ctx.lineJoin = "round";
        ctx.beginPath();
        ctx.moveTo(100.03 + x, 54.81 + y);    
        ctx.bezierCurveTo(101.59 + x, 56.42 + y, 101.59 + x, 59.03 + y, 100.03 + x, 60.64 + y);    
        ctx.bezierCurveTo(98.47 + x, 62.25 + y, 95.93 + x, 62.25 + y, 94.37 + x, 60.64 + y);    
        ctx.bezierCurveTo(92.81 + x, 59.03 + y, 92.81 + x, 56.42 + y, 94.37 + x, 54.81 + y);    
        ctx.bezierCurveTo(95.93 + x, 53.20 + y, 98.47 + x, 53.20 + y, 100.03 + x, 54.81 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.beginPath();
        ctx.moveTo(128.83 + x, 54.81 + y);    
        ctx.bezierCurveTo(130.39 + x, 56.42 + y, 130.39 + x, 59.03 + y, 128.83 + x, 60.64 + y);    
        ctx.bezierCurveTo(127.27 + x, 62.25 + y, 124.73 + x, 62.25 + y, 123.17 + x, 60.64 + y);    
        ctx.bezierCurveTo(121.61 + x, 59.03 + y, 121.61 + x, 56.42 + y, 123.17 + x, 54.81 + y);    
        ctx.bezierCurveTo(124.73 + x, 53.20 + y, 127.27 + x, 53.20 + y, 128.83 + x, 54.81 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "#ffffff";
        ctx.beginPath();
        ctx.moveTo(135.06 + x, 89.53 + y);    
        ctx.bezierCurveTo(142.85 + x, 107.86 + y, 130.06 + x, 138.27 + y, 123.51 + x, 157.06 + y);    
        ctx.bezierCurveTo(110.97 + x, 192.98 + y, 111.61 + x, 192.98 + y, 95.27 + x, 157.06 + y);    
        ctx.bezierCurveTo(87.02 + x, 138.91 + y, 77.83 + x, 108.48 + y, 85.62 + x, 90.14 + y);    
        ctx.bezierCurveTo(93.42 + x, 71.81 + y, 127.26 + x, 71.19 + y, 135.06 + x, 89.53 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "#4f4f4f";
        ctx.beginPath();
        ctx.moveTo(117.93 + x, 97.68 + y);    
        ctx.bezierCurveTo(122.03 + x, 95.92 + y, 122.03 + x, 93.08 + y, 117.93 + x, 91.32 + y);    
        ctx.bezierCurveTo(113.82 + x, 89.56 + y, 107.18 + x, 89.56 + y, 103.07 + x, 91.32 + y);    
        ctx.bezierCurveTo(98.97 + x, 93.08 + y, 98.97 + x, 95.92 + y, 103.07 + x, 97.68 + y);    
        ctx.bezierCurveTo(107.18 + x, 99.44 + y, 113.82 + x, 99.44 + y, 117.93 + x, 97.68 + y);    
        ctx.closePath();
        ctx.fill();
        ctx.fillStyle = "white";
        ctx.strokeStyle = "black";
        ctx.fillStyle = "#dc381b";
        ctx.beginPath();
        ctx.moveTo(127.25 + x, 12.09 + y);    
        ctx.bezierCurveTo(146.48 + x, 27.35 + y, 158.99 + x, 59.74 + y, 147 + x, 52.50 + y);    
        ctx.bezierCurveTo(123 + x, 38 + y, 92 + x, 40 + y, 72.50 + x, 54.50 + y);    
        ctx.bezierCurveTo(65.64 + x, 59.60 + y, 77 + x, 29.50 + y, 89.50 + x, 16 + y);    
        ctx.bezierCurveTo(103.44 + x, 0.94 + y, 109.50 + x, -2 + y, 127.25 + x, 12.09 + y);    
        ctx.closePath();
        ctx.fill();
    }

    function animate() {
        ctx.clearRect(0, 0, w, h);
        drawSanta((w/2) - 120, (h/2) - 150);
        
        for(var i in flakes) {
            var f = flakes[i];

            f.y += gravity;
            
            if(f.y > h) {
                f.y = -10;
                f.x = Math.random() * w;
            }
            
			drawFlake(f.x, f.y);
        }
        
        timer = window.setTimeout(animate, 20);
    }
    
    init();
    return false;
};