User:Mathijs van Oosterhoudt/counting

<!DOCTYPE HTML>

 <head>
   <title>Canvasplay</title>
   <script src="http://www.google.com/jsapi?key=AIzaSyA5m1Nc8ws2BbmPRwKu5gFradvD_hgq6G0" type="text/javascript"></script>
   <script type="text/javascript">

   google.load('search', '1');

   function searchComplete(searcher) {

c = document.getElementById("canvas") p = c.getContext("2d") var dimension = [document.documentElement.clientWidth, document.documentElement.clientHeight]; c.width = ((dimension[1]-100)/4)*5; c.height = (dimension[1]-100)/3;

p.globalAlpha = 0.8;

     if (searcher.results && searcher.results.length > 0) {
       var results = searcher.results;
       for (var i = 0; i < results.length; i++) {
         var result = results[i];
         base_image = new Image();
 		base_image.src = result.unescapedUrl;
 		p.drawImage(base_image, Math.floor((Math.random()*((dimension[1]-100)/4)*5-220)+1), 0);

       }
     }
   }
   
   
   
       function searchComplete2(searcher) {

c = document.getElementById("canvas2") p = c.getContext("2d") var dimension = [document.documentElement.clientWidth, document.documentElement.clientHeight]; c.width = ((dimension[1]-100)/4)*5; c.height = (dimension[1]-100)/3;

p.globalAlpha = 0.8;

     if (searcher.results && searcher.results.length > 0) {
       var results = searcher.results;
       for (var i = 0; i < results.length; i++) {
         var result = results[i];
         base_image = new Image();
 		base_image.src = result.unescapedUrl;
 		p.drawImage(base_image, Math.floor((Math.random()*((dimension[1]-100)/4)*5-220)+1),(Math.random()*10)+1);

       }
     }
   }
   
   
   
           function searchComplete3(searcher) {

c = document.getElementById("canvas3") p = c.getContext("2d") var dimension = [document.documentElement.clientWidth, document.documentElement.clientHeight]; c.width = ((dimension[1]-100)/4)*5; c.height = (dimension[1]-100)/3;

p.globalAlpha = 0.8;

     if (searcher.results && searcher.results.length > 0) {
       var results = searcher.results;
       for (var i = 0; i < results.length; i++) {
         var result = results[i];
         base_image = new Image();
 		base_image.src = result.unescapedUrl;
 		p.drawImage(base_image, Math.floor((Math.random()*((dimension[1]-100)/4)*5-220)+1),(Math.random()*10)+1);

       }
     }
   }
   
   
   
   function OnLoad() {

     var imageSearch = new google.search.ImageSearch();
     var imageSearch2 = new google.search.ImageSearch();
     var imageSearch3 = new google.search.ImageSearch();

imageSearch.setResultSetSize(8); imageSearch2.setResultSetSize(8); imageSearch3.setResultSetSize(8);

     imageSearch.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE, google.search.ImageSearch.IMAGESIZE_MEDIUM);
     imageSearch2.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE, google.search.ImageSearch.IMAGESIZE_MEDIUM);
     imageSearch3.setRestriction(google.search.ImageSearch.RESTRICT_IMAGESIZE, google.search.ImageSearch.IMAGESIZE_MEDIUM);

     imageSearch.setSearchCompleteCallback(this, searchComplete, [imageSearch]);
     imageSearch2.setSearchCompleteCallback(this, searchComplete2, [imageSearch2]);
     imageSearch3.setSearchCompleteCallback(this, searchComplete3, [imageSearch3]);

     imageSearch2.execute("blue sky");

     imageSearch3.execute("the matterhorn");

     imageSearch.execute("old person raising hand");

   }
   google.setOnLoadCallback(OnLoad);
   </script>
 </head>

 		<canvas id="canvas2" style="margin = 0px; padding = 0px;"></canvas>
 		<canvas id="canvas3" style="margin = 0px; padding = 0px;"></canvas>

 </body>

</html>