jmoyers · June 10, 2011 05:45
diff --git a/gistfile1.txt b/gistfile1.txt
 <html>
    <head>
    </head>
    <body>
        <div id='fps'>0</div>
        <canvas id='canvas' width="700" height="700"></canvas>
        <script type='text/javascript'>
        var canvas = document.getElementById('canvas')
        var context = canvas.getContext('2d');
        var fps = document.getElementById('fps');
        
        var objects = [];
        
        for(var i = 0; i < 50; i++){
            var img = new Image();
            img.src = "http://kangax.github.com/fabric.js/test/demo/assets/pug.jpg";
            
            var factor = Math.random()
            
            objects.push({
               x        : Math.random() * 500,
               y        : Math.random() * 500,
               width    : 200 * factor,
               height   : 300 * factor,
               img      : img
            });
        }
        
        // Lets be lazy as fuck
        setTimeout(function(){
            setInterval(render, 1000/60);
        }, 3000);
        
        var now;
        var last;
        
        function render(){
            now             = new Date().getTime();
            fps.innerHTML   = Math.floor(1000/(now - last));
            last            = now;
            
            context.clearRect( 0, 0, 700, 700 );
            
            for(var i = 0; i < objects.length; i++){
                context.drawImage(objects[i].img, objects[i].x, objects[i].y, objects[i].width, objects[i].height);
            }
        }
        </script>
    </body>
 </html>
	<html>
	<head>
	</head>
	<body>
	<div id='fps'>0</div>
	<canvas id='canvas' width="700" height="700"></canvas>
	<script type='text/javascript'>
	var canvas = document.getElementById('canvas')
	var context = canvas.getContext('2d');
	var fps = document.getElementById('fps');

	var objects = [];

	for(var i = 0; i < 50; i++){
	var img = new Image();
	img.src = "http://kangax.github.com/fabric.js/test/demo/assets/pug.jpg";

	var factor = Math.random()

	objects.push({
	x : Math.random() * 500,
	y : Math.random() * 500,
	width : 200 * factor,
	height : 300 * factor,
	img : img
	});
	}

	// Lets be lazy as fuck
	setTimeout(function(){
	setInterval(render, 1000/60);
	}, 3000);

	var now;
	var last;

	function render(){
	now = new Date().getTime();
	fps.innerHTML = Math.floor(1000/(now - last));
	last = now;

	context.clearRect( 0, 0, 700, 700 );

	for(var i = 0; i < objects.length; i++){
	context.drawImage(objects[i].img, objects[i].x, objects[i].y, objects[i].width, objects[i].height);
	}
	}
	</script>
	</body>
	</html>