User:Joak/canvas1: Difference between revisions

Revision as of 11:15, 1 October 2012

<canvas id="c1" showsrc> function draw() {

c = document.getElementById("c1")

//console.log("c is",c)

 p = c.getContext("2d")
   x = window.innerWidth;
   y = window.innerHeight;
   var positionx = x / 2;
   var positiony= y / 2;

   if( r < 5){

if(r == 3){ upordown = -0.02; } if(r == 0){ upordown = +0.02; } r=r+upordown; } r = Math.max(r, 0); r = Math.min(r, 3); r2 = map_range(r,0,3,3,0); movement = 400*Math.sin(r); movement2 =400*Math.sin(r2);

   var number1 = p.createRadialGradient(positionx,positiony,movement2,positionx,positiony,movement);
	number1.addColorStop(0, '#000000');
 	number1.addColorStop(1, '#FFFFFF');
 	
 	p.fillStyle = number1;
 	p.clearRect(0,0,c.width,c.height);
 	p.fillRect(0,0,x,y);

   setTimeout(drawer,10)

function map_range(value, low1, high1, low2, high2) {

   return low2 + (high2 - low2) * (value - low1) / (high1 - low1);

} }

</canvas>

@@ Line 1: / Line 1: @@
 <canvas id="c1" showsrc>
-function drawer() {
+function draw() {
   c = document.getElementById("c1")
 //console.log("c is",c)
@@ Line 23: / Line 23: @@
 	movement = 400*Math.sin(r);
 	movement2 =400*Math.sin(r2);
-	//console.log("r is ",r,"movement is",movement, "movement2 is", movement2);
      var number1 = p.createRadialGradient(positionx,positiony,movement2,positionx,positiony,movement);
@@ Line 32: / Line 32: @@
    	p.clearRect(0,0,c.width,c.height);
    	p.fillRect(0,0,x,y);
-    //console.log("i is",i);
      setTimeout(drawer,10)
 function map_range(value, low1, high1, low2, high2) {