task 02: [ view product file, task02.swf ] [ download source code, task02.as ]
product:
SE|PY formatted code: [ back to top ]
//task02 grid compostion by Jon Gladden
//Code Document Contents: Sections of function main()
//Part I: Draw Outter Box and Inner Boxes 1 & 2
//Part II: Create color palete arrays to be used in the innerline functions
//Part III: Declare innerline functions for drawing the rest of the inner boxes
//Part IV: Drawing with loops, drawing inner box zero
//Part V: Drawing inner boxes 3 to 8 with the innerline function
//Part VI: Create red composition frame
function main() {
// set initial properties
// import Canvas classes
import edu.osu.accad.util.graphics.Canvas;
// the Canvas constructor function
/*function Canvas( easel: MovieClip,
w: Number,
h: Number ) */
//var C:Canvas(this.100,300);
var C:Canvas = new Canvas(this, Stage.width, Stage.height);
//experiment with transaltion values (for later in the code)
//set variable to translate certain lines right and down
var transr = 0.25;
//set variable to translate certain lines right and down more
var transrr = 0.375;
//set variable to translate certain lines left and down?
//var transl = 0.125
//Part I: Draw Outter Box and Inner Boxes 1 & 2
//setup and draw basic grid of boxes (need to make these functions?)
// outter big box coordinates
var a = 0.5;
var b = 1.0;
var c = 0.0;
// innner box one coordinates
var d = 0.5;
var e = 0.75;
var f = 0.25;
var g = 0.0;
// innner box two coordinates
//0.38
var h = 0.375;
//0.63
var i = 0.625;
//0.13
var j = 0.125;
// draw outter big box outline, set pen color to black
C.setPenRGB(0, 0, 0);
C.setPenWeight(2);
C.drawLine(a, b, b, a);
C.drawLine(b, a, a, c);
C.drawLine(a, c, c, a);
C.drawLine(c, a, a, b);
// draw inner box one outline
C.drawLine(f, f, d, d);
C.drawLine(d, d, e, f);
C.drawLine(e, f, d, g);
C.drawLine(d, g, f, f);
// draw inner box two outline
C.drawLine(h, h, a, a);
C.drawLine(a, a, i, h);
C.drawLine(i, h, a, f);
C.drawLine(a, f, h, h);
//create endpoints for solid inner box three (old variables, now set in the innerline function below)
//var b1x =h;
//var b1y =j;
//var b2x =a;
//var b2y =f;
//var b3x =i;
//var b3y =j;
//var b4x =a;
//var b4y =c;
//Part II: create color palete arrays to be used in the innerline functions
//store red RGB values in an array
var red_array = ['1.0', '0.3', '0.3'];
//store green RGB values in an array in a different way
var green_array = new Array (0.2, 0.6, 0.6);
//store blue RGB values in an array in another way (specify type)
var blue_array:Array = ['.5', '.8', '.9'];
// store violet RGB values in an array in another way (specify type)
var violet_array:Array = new Array(1, .3, .54)
// store black RGB values in an array
var blk = new Array(0, 0, 0);
//Part III: Declare innerline functions for drawing the rest of the inner boxes
//an attempt to streamline drawing the inner boxes lines with a function:
//draw innerline functions below
function innerline(wght, rcolor, gcolor, bcolor, b1x, b1y, b2x, b2y) {
C.setPenWeight(wght);
C.setPenRGB(rcolor, gcolor, bcolor);
C.drawLine(b1x, b1y, b2x, b2y);
}
//new function innerline2 with color Array variable
function innerline2(wght, color:Array, b1x, b1y, b2x, b2y) {
C.setPenWeight(wght);
C.setPenRGB(color[0], color[1], color[2]);
C.drawLine(b1x, b1y, b2x, b2y);
}
//calling the functions to draw the inner box lines below:
//draw axis line of inner box two, set pen weight to 2, set pen color black
//innerline2(2, blk[0], blk[1], blk[2], a, c, a, f); old method using innerline function
//new method: pass the blk array in the innerline2 function
//innerline2(2, ['.0', '.0', '.0'], a, c, a, f); just need the array variable name like below ("blk")
innerline2(2, blk, a, c, a, f);
//Part IV: Drawing with loops, drawing inner box zero
//draw diagonal line 1
C.setPenWeight(3);
//set the pen color to pink/violet
C.setPenRGB(1, .3, .54);
var left = 0.438;
var top = 0.312;
C.drawLine(left, top, left+.062, top +.062);
//draw diagonal line 2
C.setPenWeight(2);
//set the pen color to pink/violet
C.setPenRGB(1, .3, .54)
var left2 = 0.438;
var right2 = 0.438;
C.drawLine(left2, right2, left2-.062, right2 -.062);
////draw diagonal lines 3 & 4
// below is a for loop that draws a diagonal line out from a specificed point
// The number .062 is on small unit on the grid
var leftx = .312 + .062;
var topy = .312 + .062;
//set the pen color to pink/violet
C.setPenRGB(1, .3, .54);
//below is a for loop that draws a diagonal line 2 times
//like the duplicate function in Maya or Freehand?
for (var i = 0; i < 2; i++) {
C.setPenWeight(3);
C.drawLine(leftx, topy, leftx+.062, topy-.062);
leftx += .062;
topy += .062;
}
//draw inner box zero axis, set pen color pink/violet
innerline2(2, violet_array, 0.438, 0.312, 0.438, 0.375);
innerline2(2, violet_array, 0.438, 0.375, 0.469, 0.406);
innerline2(2, violet_array, 0.438, 0.375, 0.406, 0.406);
//note: drawing boxes one & two are above the innerline function declarations
//Part V: Drawing inner boxes 3 to 8 with the innerline function
//draw inner box three axis, set pen color green
innerline(2, green_array[0], green_array[1], green_array[2], 0.75, 0.25, 0.75, 0.375);
innerline(2, green_array[0], green_array[1], green_array[2], 0.75, 0.375, 0.688, 0.438);
innerline(2, green_array[0], green_array[1], green_array[2], 0.75, 0.375, 0.812, 0.438);
//draw lower line of box three, set pen color to green, translate whole box right and down
innerline(3, green_array[0], green_array[1], green_array[2], h+transr, j+transr, a+transr, f+transr);
//draw lower right line of box three, set pen color to green
innerline(3, green_array[0], green_array[1], green_array[2], 0.875, 0.375, 0.75, 0.50);
//draw inner box four axis, set pen color red
innerline(2, red_array[0], red_array[1], red_array[2], f, f, f, 0.312);
innerline(2, red_array[0], red_array[1], red_array[2], f, 0.312, 0.281, 0.344);
innerline(2, red_array[0], red_array[1], red_array[2], f, 0.312, 0.219, 0.344);
//draw lower lines of box four
innerline(3, red_array[0], red_array[1], red_array[2], 0.312, 0.312, f, 0.375);
innerline(3, red_array[0], red_array[1], red_array[2], 0.188, 0.312, f, 0.375);
//draw inner box five axis, set pen color blue
innerline(1, blue_array[0], blue_array[1], blue_array[2], 0.375, e, 0.375, 0.812);
innerline(1, blue_array[0], blue_array[1], blue_array[2], 0.375, 0.812, 0.406, 0.844);
innerline(1, blue_array[0], blue_array[1], blue_array[2], 0.375, 0.812, 0.344, 0.844);
//draw lower lines of box five
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.50, 0.75, 0.375, 0.875);
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.312, 0.812, 0.375, 0.875);
//draw upper lines of box five
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.375, e, 0.438, 0.812);
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.375, e, 0.312, 0.812);
//draw inner box six axis, set pen color blue
innerline(2, blue_array[0], blue_array[1], blue_array[2], 0.50, 0.75, 0.50, 0.875);
innerline(2, blue_array[0], blue_array[1], blue_array[2], 0.50, 0.875, 0.562, 0.938);
innerline(2, blue_array[0], blue_array[1], blue_array[2], 0.50, 0.875, 0.438, 0.938);
//draw lower lines of box six
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.625, 0.875, 0.5, 1.0);
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.375, 0.875, 0.5, 1.0);
//draw upper line of box six
innerline(3, blue_array[0], blue_array[1], blue_array[2], 0.50, 0.75, 0.625, 0.875);
//draw inner box seven axis, set pen color red
innerline(1, red_array[0], red_array[1], red_array[2], 0.125, 0.375, 0.125, 0.50);
innerline(1, red_array[0], red_array[1], red_array[2], 0.125, 0.50, 0.188, 0.562);
innerline(1, red_array[0], red_array[1], red_array[2], 0.125, 0.50, 0.062, 0.562);
//draw lower right line of box seven, set pen color red
innerline(3, red_array[0], red_array[1], red_array[2], 0.25, 0.50, 0.125, 0.625);
//draw lower left line of box seven, set pen color red, put whole box left
innerline(3, red_array[0], red_array[1], red_array[2], 0.0, 0.5, 0.125, 0.625);
//draw upper right line of box seven, set pen color red
innerline(3, red_array[0], red_array[1], red_array[2], 0.125, 0.375, 0.25, 0.50);
//draw inner box eight axis, set pen color violet
innerline(1, violet_array[0], violet_array[1], violet_array[2], 0.875, 0.375, 0.875, 0.50);
innerline(1, violet_array[0], violet_array[1], violet_array[2], 0.875, 0.50, 0.938, 0.562);
innerline(1, violet_array[0], violet_array[1], violet_array[2], 0.875, 0.50, 0.812, 0.562);
//draw lower left line of box eight, set pen color to violet, translate whole box right and down
innerline(3, violet_array[0], violet_array[1], violet_array[2], h+transrr, j+transrr, a+transrr, f+transrr);
//draw lower right line of box eight, set pen color to violet
innerline(3, violet_array[0], violet_array[1], violet_array[2], 1.0, 0.5, 0.875, 0.625);
//Part VI: Create red composition frame
function frame(framewt, framer, frameg, frameb) {
C.setPenRGB(framer, frameg, frameb);
C.setPenWeight(framewt);
C.drawLine(0, 0, 0, 1);
C.drawLine(0, 0, 1, 0);
C.drawLine(1, 1, 1, 0);
C.drawLine(1, 1, 0, 1);
}
//call the frame function, set pen weight to hairline
frame(.05, 1, 0, 0);
}
//call the main function
main();