Code for Task02_A

#include "Canvas.as"
var V = new Canvas ();
V.setBackgroundColor (1, 1, 1);
function drawRoof (howMany)
{         
	//initiate a counter
	var counter = 0;
	do   //this loop draws roofs until counter reaches the value of howMany
	{
		do  //this loop generates proper parameters for one roof
		{
			//randomize the direction of the roof
			var sa = Math.random() - .5;
			var s_a = Math.abs(sa)/sa;  // left or right roof, returns 1  or -1
			var sb = Math.random() - .5;
			var s_b = Math.abs(sb)/sb;  //up or down roof, returns 1 or -1
			//randomize the lowerleft corner of the roof, range: (0,1)
			var a = Math.random();
			var b = Math.random();
				 
			//calculate the size of the roof, according to how close it is to the lowerleft corner of the canvas
			var roofSize = (1-a) * b * .75 + .05; //the figures come from numerous test, this combination used pleases my eyes
			//calculate the highest point of the front facade
			var c = a + (s_a * roofSize);
			var d = b - (s_b * roofSize);
			//calculate the lowerright corner of the front facade
			var e = c + (s_a * roofSize);
			var f = b;
			//calculate the lowerright corner of the side
			var g = e + (s_a * roofSize);
			var h = b;
		}
		while ( d>1 || d<0 || g>1 || g<0  ); //regenerate parameters if out of range


		//draw the thick line from the lowerleft point to the highest point
		V.setPenColor (0, 0, 0);
		V.setPenWeight (.18 * roofSize);
		V.drawLine (a,b,   c,d); 
		//draw the tile columns for the side of the roof
		for (i=0; i<9; i++) 
		{
			//calculate the distance between tile columns
			 var r = roofSize*s_a / 8; 
			//the farther the tile column is from the facade, the lighter color 
			 var t = i/8 * .75 + .25;
			 V.setPenColor (t,t,t);
			//draw one tile column
			 V.setPenWeight (.18 * roofSize * (1-t) );
			 V.drawLine (c + (r*i), d,    e + (r*i), f); 
			//draw one tile column top
			 V.setPenWeight(.12 * roofSize );
			 V.drawLine (c + (r*i), d,    c + (r * (i+1) ),  d);                  
		}
	counter++;
	}
	while (counter < howMany);
}

//excute the function of drawRoof
var numberOfRoofs = 13;
drawRoof(numberOfRoofs);

#include "Canvas.as"
var V = new Canvas ();
V.setBackgroundColor(1, 1, 1);
function drawRoof (howMany, rValue, gValue, bValue)
{               
	//initiate a counter
	var counter = 0;
	do  //this loop draws roofs until counter reaches the value of howMany
	{
         do //this loop generates proper parameters for one roof
		{
			//randomize the direction of the roof
			var sa = Math.random() - .5;
			var s_a = Math.abs(sa)/sa;  // left or right roof, returns 1  or -1
			var sb = Math.random() - .5;
			var s_b = Math.abs(sb)/sb;  //up or down roof, returns 1 or -1
			//randomize the size of the roof, range: (.1, .2)
			var roofSize = Math.random() * .1 + .1;
			//randomize the lowerleft corner of the front facade, range: (0,1)
			var a = Math.random();
			var b = Math.random();
 			//calculate the highest point of the front facade
			var c = a + (s_a * roofSize);
			var d = b - (s_b * roofSize);
			//calculate the lowerright corner of the front facade
			var e = c + (s_a * roofSize);
			var f = b;
          //calculate the lowerright corner of the side
			var g = e + (s_a * roofSize);
			var h = b;
		}
		while ( d>1 || d<0 || g>1 || g<0  ); //regenerate parameters if out of range

		//draw the thick line from the lowerleft point to the highest point
		V.setPenColor ( rValue, gValue, bValue);
		V.setPenWeight (.18 * roofSize);
		V.drawLine (a,b,   c,d); 
		//draw the thin lines for the side of the roof
		for (i=0; i<8; i++) 
		{
			//calculate the distance between thin lines
			var r = roofSize*s_a / 8; 
			//draw one thin line
			V.setPenWeight (.1 * roofSize * (1.25 - i/8) );
			V.drawLine (c + (r*i), d,    e + (r*i), f) 
		}
		counter++;
	}
	while (counter < howMany);
}

//excute the function of drawRoof to draw 7 black roofs
var blackRoofs = 7;
r1 = 0;
g1 = 0;
b1 = 0;
drawRoof(blackRoofs,r1,g1,b1);

//excute the function of drawRoof to draw a special red roof
var redRoof = 1;
r2 = 1;
g2 = 0;
b2 = 0;
drawRoof(redRoof,r2,g2,b2);

//draw the outer frame with red
V.setPenColor (1, 0, 0);
V.setPenWeight (.08);
V.drawLine (0,0,  0,1);
V.drawLine (0,0,  1,0);
V.drawLine (1,1,  1,0);
V.drawLine (1,1,  0,1);