Flash Game Tryout

Hello Everyone!
This is a flash game iv'e built with the help of this set of videos on youtube, it was very simple and very fun to learn. So hope you enjoy my first flash game (:
Please Subscribe and leave Comments, Cya (:
 (:(:

JavaScript Tree Fractal

Hello Everyone! Today we are going to discuss one of the most simple and beautiful fractals there is, the Tree Fractal!

Algorithm (very simple one):

1. Draw a line

2. From the end of that line draw another two lines, that are split by an angle

3. Repeat with shorter lines, but with the same angle

 Now, I've taken a code from http://rosettacode.org/wiki/Fractal_tree , and made some changes in it so you can have the opportunity to create your own tree fractal right here in the site,

So Here Is The JavaScript Code:

<body>


Angle: <INPUT TYPE = Text NAME = txtAngle id = a1 SIZE = 5 value ="20">

Depth: <INPUT TYPE = Text NAME = txtDepth id = d1 SIZE = 5 value ="9" onclick="return d1_onclick()">    

<Input Type = Button NAME = b1 VALUE = "Create Tree" onClick = Button1_onclick()>      

<Input Type = Button NAME = s1 VALUE = "Save Tree" onClick = Button2_onclick()>
<P>
 <canvas id="canvas" width="0" height="0"></canvas><script type="text/javascript">
var elem = document.getElementById('canvas');
var context = elem.getContext('2d');
 
context.fillStyle   = '#000';
context.lineWidth   = 1;
 
var deg_to_rad = Math.PI / 180.0;
var globalW = 0;
var globalH = 0;

function drawLine(x1, y1, x2, y2, brightness){
 context.moveTo(x1, y1);
 context.lineTo(x2, y2);
}
function drawTree(x1, y1, angle, depth, angle1){
 if (depth != 0){
  var x2 = x1 + (Math.cos(angle * deg_to_rad) * depth * 10.0);
  var y2 = y1 + (Math.sin(angle * deg_to_rad) * depth * 10.0);
  drawLine(x1, y1, x2, y2, depth);
  drawTree(x2, y2, angle - angle1, depth - 1,angle1);
  drawTree(x2, y2, angle + angle1, depth - 1,angle1);
 }
}
    
function TreeCanvasLimits(x1, y1, angle, depth, angle1){
 if (depth != 0){
  var x2 = x1 - (Math.cos(angle * deg_to_rad) * depth * 10.0);
  var y2 = y1 - (Math.sin(angle * deg_to_rad) * depth * 10.0);
  if (globalW > x2)
  {
      globalW = x2;
  }
  if(globalH < y2)
  {
      globalH = y2;
  }
  TreeCanvasLimits(x2, y2, angle - angle1, depth - 1,angle1);
  TreeCanvasLimits(x2, y2, angle + angle1, depth - 1,angle1);
 }

}
function clearCanvas(context3, canvas3) {
  context3.clearRect(0, 0, canvas3.width, canvas3.height); 
  var an1 = parseFloat(document.getElementById('a1').value);
  var dep1 = parseFloat(document.getElementById('d1').value);
  globalH = 0;
  globalW = 0;
  TreeCanvasLimits(0,0,-90,dep1,an1);
  canvas3.width = 1;  
  globalW = globalW * (-2)
  canvas3.width = globalW;
  canvas3.height = globalH;
}

function Button1_onclick() 
{   
    var canvas2 = document.getElementById('canvas');
    var context2 = canvas2.getContext('2d');
    clearCanvas(context2,canvas2);
    var an1 = parseFloat(document.getElementById('a1').value);
    var dep1 = parseFloat(document.getElementById('d1').value);
    
    context.beginPath();
    drawTree(canvas2.width/2 ,canvas2.height , -90, dep1 , an1);
    context.closePath();
    context.stroke();
}

function Button2_onclick() 
{   
    var canvas2 = document.getElementById('canvas');
    var img    = canvas2.toDataURL("image/png");
    document.write('<img src="'+img+'"/>');

}
</script> 


</body>

Just enter the parameters(angle and depth) and it will create you the tree(credit for rosettacode):

BEWARE - to much depth will get your browser stuck!

Angle: Depth: