dojo.require("dojox.gfx");

var mainWidth = 300; 
var mainHeight = 300;  
var surface = null; 
var firstArtist = null;
var drawing = 0;
var x = 0;
var y = 0; 
var container_position = null;
var currentG = null; 
var gShapes = {};
var gShapeCounter = 0; 
var drawNow = 0; 
var lineColor = "black"; 
var lineWidth = 5;
var lynes = new Array();

handleMouseDown = function(event) {
    if (drawing == 0) {
	drawing = 1; 
	x = event.clientX-container_position.x; 
	y = event.clientY-container_position.y;
    } 
    dojo.stopEvent(event);
}

handleMouseUp = function(event) {

    if (drawing == 1) {
      drawing=0; drawNow=0; currentG=null;
    }
    dojo.stopEvent(event);
}

handleMouseMove = function(event) {

    if (drawing == 1) {
	if (drawNow == 0) {
	    currentG = surface.createPath().moveTo(x,y); 
	    currentG.getEventSource().setAttribute('id', gShapeCounter); 
	    gShapes[gShapeCounter] = currentG; gShapeCounter=gShapeCounter+1;
	} 
	drawNow = 1; 
	var line = { x1: x, y1:y, x2:(event.clientX-container_position.x), y2:(event.clientY-container_position.y) }; 
	var nX = event.clientX-container_position.x; 
	var nY = event.clientY-container_position.y; 
	var ref = currentG.lineTo(nX,nY).setStroke({color:lineColor, width:lineWidth} );
	x = event.clientX-container_position.x; 
	y = event.clientY-container_position.y;
    }
    dojo.stopEvent(event);
}

calculate = function(url) {
    var svg = "(";

    for (i = 0; i<gShapeCounter; i++) {
	for (j = 0; j<gShapes[i].segments.length; j++) {
	    svg += "(:|" + gShapes[i].segments[j].action + "| " + gShapes[i].segments[j].args[0] + " " + gShapes[i].segments[j].args[1] + ")";
	}
    }

    for (i = 0; i<lynes.length; i++){ 
	lynes[i].removeShape();
    }
    lynes = new Array();
    
    svg += ")";

    document.forms.toolbar.b.value = svg;
    dojo.byId("swg").innerHTML = "⌚";
    dojo.xhrPost( { 
	    url: url, 
		form: "toolbar", 
		handleAs: "xml",
		timeout: 180000,
		
		load: function(response, ioArgs) {
		doc = ioArgs.xhr.responseXML.documentElement;
		dojo.byId("swg").innerHTML = doc.childNodes[0].childNodes[0].nodeValue;
		dojo.byId("grf").innerHTML = doc.childNodes[2].childNodes[0].nodeValue;
		lines = doc.childNodes[1].childNodes;
		for (i = 0; i < lines.length; i++) {
		    line = lines[i];
		    x0 = parseInt(line.childNodes[0].getAttribute("x")) + 10;
		    y0 = parseInt(line.childNodes[0].getAttribute("y")) + 10;
		    x1 = parseInt(line.childNodes[1].getAttribute("x")) + 10;
		    y1 = parseInt(line.childNodes[1].getAttribute("y")) + 10;
		    lyne = surface.createPath().moveTo(x0, y0);
		    lyne.lineTo(x1,y1).setStroke({color:"red", width:2});
		    lynes[lynes.length] = lyne;
		}
		return response; 
	    },

		error: function(response, ioArgs) {
		if (ioArgs.xhr.status != 200) {
		    alert(ioArgs.xhr.status);
		    dojo.byId("swg").innerHTML = response;
		    return response;
		}
	    }
        });
}

remember = function() {
    if (document.forms.toolbar.c.value.length != 1) {
	alert("☹");
	return;
    }

    var svg = "(";

    for (i = 0; i<gShapeCounter; i++) {
	for (j = 0; j<gShapes[i].segments.length; j++) {
	    svg += "(:|" + gShapes[i].segments[j].action + "| " + gShapes[i].segments[j].args[0] + " " + gShapes[i].segments[j].args[1] + ")";
	}
    }

    for (i = 0; i<lynes.length; i++){ 
	lynes[i].removeShape();
    }
    lynes = new Array();
    
    svg += ")";

    document.forms.toolbar.b.value = svg;
    dojo.byId("swg").innerHTML = "⌚";
    dojo.xhrPost( { 
	    url: "/cof", 
		form: "toolbar", 
		handleAs: "xml",
		timeout: 60000,
		
		load: function(response, ioArgs) {
		doc = ioArgs.xhr.responseXML.documentElement;
		dojo.byId("swg").innerHTML = doc.childNodes[0].childNodes[0].nodeValue;
		dojo.byId("grf").innerHTML = doc.childNodes[2].childNodes[0].nodeValue;
		return response; 
	    },

		error: function(response, ioArgs) {
		if (ioArgs.xhr.status != 200) {
		    alert(ioArgs.xhr.status);
		    dojo.byId("swg").innerHTML = response;
		    return response;
		}
	    }
        });
}

clearShapes = function(){
    surface.clear();
    surface.createRect({ x: 0, y: 0, width: mainWidth, height: mainHeight }).setStroke("black").setFill("white");
    gShapeCounter = 0;
    gShapes = {};
    if (document.forms.toolbar.c) document.forms.toolbar.c.value = "";
    dojo.byId("swg").innerHTML = "";
    dojo.byId("grf").innerHTML = "";
}

drawLogo = function(){
    currentG = surface.createPath().moveTo(20,150).setStroke({color:lineColor, width:lineWidth} );
    currentG.lineTo(150,70).lineTo(280,150).lineTo(150,230).lineTo(20,150); 
    gShapes[gShapeCounter] = currentG; gShapeCounter=gShapeCounter+1;
    currentG = surface.createPath().moveTo(101,101).setStroke({color:lineColor, width:lineWidth} );
    currentG.lineTo(199,101).lineTo(199,199).lineTo(101,199).lineTo(101,101); 
    gShapes[gShapeCounter] = currentG; gShapeCounter=gShapeCounter+1;
}

makeShapes = function(){
    var domNode=dojo.byId("drawboard");
    container_position = dojo._abs(domNode); 
    dojo.connect(domNode, 'onmousedown', "handleMouseDown");
    dojo.connect(domNode, 'onmouseup', "handleMouseUp"); 
    dojo.connect(domNode, 'onmousemove', "handleMouseMove"); 
    
    surface=dojox.gfx.createSurface("drawboard", mainWidth, mainHeight);
    surface.createRect({ x: 0, y: 0, width: mainWidth, height: mainHeight }).setStroke("black"); 
    if (firstArtist) firstArtist();
};

dojo.addOnLoad(makeShapes);