home *** CD-ROM | disk | FTP | other *** search
/ com!online 2002 May / comcd0502.iso / homepage / special / javascript / 01_01 / Java / pinwheel2 / pinwheel2.js < prev    next >
Encoding:
JavaScript  |  2000-11-12  |  4.0 KB  |  201 lines
  1. /*******************************************************************
  2. *
  3. * File    : pinwheel.js
  4. *
  5. * Created : 2000/06/17
  6. *
  7. * Author  : Roy Whittle  (Roy@Whittle.com) www.Roy.Whittle.com
  8. *
  9. * Purpose : To create a pinwheel firework that follows the cursor.
  10. *
  11. * Requires    : xLayer.js - for layer creation, movement
  12. *        : xMouse.js - to track the mouse x,y coordinates
  13. *
  14. * History
  15. * Date         Version        Description
  16. *
  17. * 2000-06-17    1.0        Initial version
  18. * 2000-10-15    1.1        Used xMouse for mouse tracking
  19. ***********************************************************************/
  20. var theTimer=null;
  21. var m = new xMouse();
  22.  
  23. var oneDeg=(2*Math.PI)/360;
  24.  
  25. /*** Pinwheel type 1 ***/
  26. var Radius = 5;
  27. var NumStars=32;
  28. var NumSteps=16;
  29. var StepAngle=(25)*oneDeg;
  30.  
  31. /*** Pinwheel type 2 ***/
  32. //var Radius = 10;
  33. //var NumStars=16;
  34. //var NumSteps=8;
  35. //var StepAngle=(22.5)*oneDeg;
  36.  
  37. /*** Pinwheel type 3 ***/
  38. //var Radius = 5;
  39. //var NumStars=16;
  40. //var NumSteps=16;
  41. //var StepAngle=(22.5)*oneDeg;
  42.  
  43. /*** Pinwheel type 4 ***/
  44. //var Radius = 10;
  45. //var NumStars=32;
  46. //var NumSteps=16;
  47. //var StepAngle=(11.25)*oneDeg;
  48.  
  49. var StarObject=new Array();
  50.  
  51. var hexDigit=new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
  52. function dec2hex(dec)
  53. {
  54.     return(hexDigit[dec>>4]+hexDigit[dec&15]);
  55. }
  56. function hex2dec(hex)
  57. {
  58.     return(parseInt(hex,16))
  59. }
  60.  
  61. function CreateStar()
  62. {
  63.  
  64.     this.layer         = new xLayer("X", 100, 100, 10);
  65.     this.currAngle     = 0;
  66.     this.step        = 0;
  67.     this.x        = 100;
  68.     this.y        = 100;
  69.     return (this);
  70. }
  71.  
  72. function restart()
  73. {
  74.     for(i=0;i<NumStars;i++)
  75.     {
  76.         StarObject[i].currAngle = (StepAngle*i);
  77.         StarObject[i].step = (i%NumSteps);
  78.         StarObject[i].x = m.X;
  79.         StarObject[i].y = m.Y;
  80.         StarObject[i].layer.moveTo(m.X, m.Y);
  81.         StarObject[i].layer.show();
  82.     }
  83. }
  84. /*** Choose a random pinwheel configuration ***/
  85. function next_random()
  86. {
  87.     var num=Math.floor(Math.random()*4);
  88.     
  89.     for(i=0;i<NumStars;i++)
  90.         StarObject[i].layer.hide();
  91.  
  92.     if(num==0){
  93.         Radius = 5;
  94.         NumStars=32;
  95.         NumSteps=16;
  96.         StepAngle=(25)*oneDeg;
  97.     }
  98.     else
  99.     if(num==1){
  100.         Radius = 10;
  101.         NumStars=16;
  102.         NumSteps=8;
  103.         StepAngle=(22.5)*oneDeg;
  104.     }
  105.     else
  106.     if(num==2){
  107.         Radius = 5;
  108.         NumStars=16;
  109.         NumSteps=16;
  110.         StepAngle=(22.5)*oneDeg;
  111.     }
  112.     else{
  113.         Radius = 10;
  114.         NumStars=32;
  115.         NumSteps=16;
  116.         StepAngle=(11.25)*oneDeg;
  117.     }
  118.  
  119.  
  120.     for(i=0 ; i<NumStars; i++)
  121.     {
  122.         var s=StarObject[i];
  123.         s.currAngle = (StepAngle*i);
  124.         s.step = (i%NumSteps);
  125.         s.x=m.X;
  126.         s.y=m.Y;
  127.     }
  128.  
  129.     restart();
  130.  
  131.     theTimer=setTimeout("next_random()", 10000);
  132. }
  133. function start()
  134. {
  135.     for(i=0 ; i<NumStars; i++)
  136.     {
  137.         StarObject[i]=new CreateStar();
  138.         StarObject[i].currAngle = (StepAngle*i);
  139.         StarObject[i].step = (i%NumSteps);
  140.         StarObject[i].layer.clip(0,0,2,2);
  141.         StarObject[i].layer.setBgColor("red");
  142.     }
  143.  
  144.     for(i=0 ; i<NumStars ; i++)
  145.         StarObject[i].layer.show();
  146.  
  147.     /*** Remove this if you only 1 type of pinwheel ***/
  148.     theTimer=setTimeout("next_random()", 10000);
  149.  
  150.     Rotate();
  151. }
  152.  
  153. function changeColour(s)
  154. {
  155.     var colour="";
  156.  
  157.     r2= Math.floor(Math.random()*2)*255;
  158.     g2= Math.floor(Math.random()*2)*255;
  159.     b2= Math.floor(Math.random()*2)*255;
  160.  
  161.     if(r2==0 && g2==0 && b2==0)
  162.         r2=255;
  163.  
  164.     colour = "#" + dec2hex(r2) + dec2hex(g2) + dec2hex(b2);
  165.     s.layer.setBgColor(colour);
  166.  
  167.     s.x=m.X;
  168.     s.y=m.Y;
  169. }
  170. function Rotate() 
  171. {
  172.     var x;
  173.     var y;
  174.     for (i = 0 ; i < NumStars ; i++ ) {
  175.         var s=StarObject[i];
  176.         
  177.         if(s.step==0)
  178.             changeColour(s);
  179.  
  180.         var angle = s.currAngle;
  181.         var rad   = s.step*Radius + 10;
  182.         x = s.x + rad*Math.cos(angle);
  183.         y = s.y + rad*Math.sin(angle);
  184.  
  185.         s.layer.moveTo(x,y);
  186.  
  187.         s.step = (s.step+1)%NumSteps;
  188.     }
  189.  
  190.     setTimeout("Rotate()", 30);
  191. }
  192.  
  193. function handle_resize()
  194. {
  195.     if(document.layers)
  196.         start();
  197. }
  198.  
  199. window.onresize=handle_resize;
  200. window.onload=start;
  201.