var p; //the processing object
setUpProcessing=function(){
	p = Processing(document.getElementById("processing"));
        d=new Date();
        m=function(){};
        e=[[],[],[],[],[]];
        url='http://doodle4noodle.appspot.com/';
        // url='http://localhost:8080/';
		var qs = new Querystring()
		if (qs.contains('whiteboard')){
		    whiteboardID=qs.get('whiteboard');
		} else {
    		whiteboardID=0;

		}
		sessionID=Math.floor(Math.random()*500);
		//console.log(sessionID);
		lastUpdate=0;
        m.mouseX=0;
        m.mouseY=0;
		lastDiff='';

p.setup = function(){
    p.__WIDTH=360;
	p.__HEIGHT=360;
    p.size(p.__WIDTH, p.__HEIGHT);
    p.background(230);
    p.frameRate(30);
}

p.draw= function() {
  if(m.mousePressed) {
    if (m.mouseX==0){
     if (m.mouseY==0){
    m.mouseX=p.mouseX;
    m.mouseY=p.mouseY;
    }
    }
    p.stroke(0);
    doLine();
    m.mouseX=p.mouseX;
    m.mouseY=p.mouseY;
  }

}
doLine=function() {
    x=p.mouseX;    y=p.mouseY;    px=m.mouseX;    py=m.mouseY;
    p.line(x, y, px, py);
	var dt=(new Date().getTime());
	thisOne=x.toString()+y.toString()+px.toString()+py.toString();
	t=thisOne;
	l=lastDiff;
	if (thisOne != lastDiff){
//       e.push([dt,x, y, px, py]);
	e[0].push(dt);
	e[1].push(x);
	e[2].push(y);
	e[3].push(px);
	e[4].push(py);
    	//console.log(lastDiff);
	}
	lastDiff=thisOne;
    //~ console.log(dt);
}
goLine=function(points){
    segments=points[0].length;
    //console.log(segments);
    //~ start=points[0][0][0];
    for (var i=0;i<=segments;i++){
        //~ console.log(points[1][i], points[2][i], points[3][i],points[4][i]);
	p.line(points[1][i], points[2][i], points[3][i],points[4][i]);
    }
}

iterateVectors=function(vectorList){
	//console.log(vectorList);
	lastUpdate=vectorList[0];
	vectors=vectorList[1];
	for (i=0;i<vectors.length;i++){
	    goLine(vectors[i]);
	}
}

initialLoad=function(){
	initLoad=loadJSONDoc(url + 'whiteboard?whiteboard=' + whiteboardID);
	initLoad.addCallback(iterateVectors);	
	//console.log(initLoad);
}

initialLoad();

refreshLoad=function(){
    reLoad=loadJSONDoc(url + 'update?whiteboard=' + whiteboardID + '&session=' + sessionID + '&since=' + lastUpdate);
	reLoad.addCallback(iterateVectors);
}

setInterval('refreshLoad()',5000);

p.mousePressed=function() {
    m.mousePressed=true;
}
p.mouseReleased=function() {
    if (m.mousePressed){
    m.mousePressed=false;
    m.mouseX=0;
    m.mouseY=0;
    f=e;
    e=[[],[],[],[],[]];
    doXHR(url + 'post', 
	{
       method: 'POST',
       sendContent: "vectors=" + repr(f) + "&session=" + sessionID + "&whiteboard=" + whiteboardID,
	   headers: {"Content-Type":"application/x-www-form-urlencoded"} 
    });
   }
}

addEmbed = function(){
$('skibbleembed').value='<iframe src="/static/embed.html?whiteboard=' + whiteboardID + '&timestamp='+ timestampID +'" height="420" width="360" scrolling="auto"></iframe>';
}

updateBookmark =function(){
     $('skibblelink').value=document.location;
}

addHistory = function(){
//$('history').innerHTML='<iframe src="/history?whiteboard=' + whiteboardID + '" height="200" width="200" scrolling="auto"></iframe>';
$('history').innerHTML='<a href="/history?whiteboard=' + whiteboardID + '&offset=0">animated history</a>';
}

p.init();
updateBookmark();
addHistory();
//addEmbed();
connect(document,"onmouseup",p.mouseReleased);
connect(document.getElementById("processing"),"onmouseout",p.mouseReleased);
}
document.addEventListener("DOMContentLoaded",setUpProcessing,false);