include("utility-function.js");
autowatch = 1;

mgraphics.init();
mgraphics.relative_coords = 0;
mgraphics.autofill = 0;

var w = this.box.rect[2] - this.box.rect[0];
var h = w;

var borderC = [0.652, 0.666, 0.663, 0.5];
var yellowC = [1, 0.8, 0.2, 0.7];
var grayC = [0.325, 0.345, 0.372, 0.8];
var cirColor = [
    [0.785, 0.145, 0.023, 1], //red
    [0.318, 0.654, 0.976, 1], //blue
    [0.439, 0.750, 0.254, 1], //green
    [0.700, 0.415, 0.886, 1]  //purple
];

function paint(){
   var lineNum = 10;

    mgraphics.set_source_rgba(grayC[0], grayC[1], grayC[2], grayC[3]);
    mgraphics.set_line_width(1);
    for(var i = 1; i < lineNum; i++){
        var X = i*w/lineNum;
        var Y = i*h/lineNum;

        if(i%(lineNum/2)){
            mgraphics.set_line_width(0.5);
        }
        else{
            mgraphics.set_line_width(1);
        }
        mgraphics.move_to(X, 0);
        mgraphics.line_to(X, h);
        mgraphics.move_to(0, Y);
        mgraphics.line_to(w, Y);
        mgraphics.stroke();
   }


}