| OLD | NEW |
|---|
| (Empty) |
| 1 <!doctype html> | |
| 2 <!-- | |
| 3 | |
| 4 This page draws a square of random blue pixels whenever the page is clicked | |
| 5 anywhere. The query string variable "interval" can be specified in milliseconds | |
| 6 to automatically switch images on an interval, and the variable "size" can | |
| 7 specify the size of the square in pixels. | |
| 8 | |
| 9 --> | |
| 10 | |
| 11 <script> | |
| 12 | |
| 13 var DEFAULT_SQUARE_SIZE = 200; | |
| 14 | |
| 15 // Returns an object with a key-value mapping from the query string. | |
| 16 var parseQuery = function() { | |
| 17 var pieces = location.search.substring(1).split('&'); | |
| 18 var query = {}; | |
| 19 for (var i = 0; i < pieces.length; i++) { | |
| 20 var pair = pieces[i].split('='); | |
| 21 query[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]); | |
| 22 } | |
| 23 return query; | |
| 24 }; | |
| 25 | |
| 26 // Draw a square made of random pixels. | |
| 27 var drawSquare = function(size) { | |
| 28 var canvas = document.getElementById('square'); | |
| 29 canvas.height = size; | |
| 30 canvas.width = size; | |
| 31 | |
| 32 var context = canvas.getContext('2d'); | |
| 33 for (var x = 0; x < size; x++) { | |
| 34 for (var y = 0; y < size; y++) { | |
| 35 var blue = Math.floor(Math.random() * 255); | |
| 36 context.fillStyle = 'rgb(0, 0, ' + blue + ')'; | |
| 37 context.fillRect(x, y, 1, 1); | |
| 38 } | |
| 39 } | |
| 40 | |
| 41 // Keep the canvas hidden and write the data URL to an <img> tag, because | |
| 42 // Blimp doesn't support canvas. | |
| 43 var image = document.getElementById('square-png'); | |
| 44 image.src = canvas.toDataURL('image/png'); | |
| 45 }; | |
| 46 | |
| 47 document.addEventListener('DOMContentLoaded', function(event) { | |
| 48 var query = parseQuery(); | |
| 49 var interval = parseInt(query.interval); | |
| 50 var size = parseInt(query.size) || DEFAULT_SQUARE_SIZE; | |
| 51 | |
| 52 document.addEventListener('click', drawSquare.bind(null, size)); | |
| 53 if (interval) { | |
| 54 window.setInterval(drawSquare, interval, size); | |
| 55 } | |
| 56 drawSquare(size); | |
| 57 }); | |
| 58 | |
| 59 </script> | |
| 60 | |
| 61 <canvas id="square" style="display:none"></canvas> | |
| 62 <img id="square-png"> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2626423004:
Remove all //blimp code. (Closed)
