/*
   Copyright 2010 Hanov Solutions Inc. All Rights Reserved

   steve.hanov@gmail.com
 */
var gDrawApp = null;

function LoadFile( obj, file )
{
    gDrawApp.undoStack.clear();
    gDrawApp.drawView.clearSelection();
    gDrawApp.drawView.doc.root = Loader( obj );
    gDrawApp.file = file;
    gDrawApp.drawView.update();
}

function splitQueryString(b) {

    var a = {};

    var c = b.split("?");
    var fields = c[c.length - 1].split("&");

    for(var f = 0; f < fields.length; f++ ) {
        var i = fields[f].split("=");

        if( i[0] ) {

            try {
                if ( i.length > 1 ) {
                    if ( window.decodeURIComponent ) {
                        a[ i[0].toLowerCase() ] =
                            decodeURIComponent(i[1].replace( /\+/g, " "));
                    } else {
                        a[ i[0].toLowerCase() ] = unescape(i[1]);
                    }
                } else {
                    a[ i[0].toLowerCase() ] = "";
                }
            } catch(except) {
                
            }
            
        }
    }
    
    return a;
}

/** @constructor */
function DrawApp(divId)
{
    var self = this;
    this.undoStack = new UndoStack();
    this.div = document.getElementById(divId);

    var toolbar = new Toolbar();
    toolbar.addButton("wd-box.png", function() {
        self.newRect();
    });
    toolbar.addButton("wd-circle.png", function() {
        self.newCircle();
    });
    toolbar.addButton("wd-line.png", function() {
        self.lineTool();
    });
    toolbar.addButton("wd-curve.png", function() {
        self.curveTool();
    });
    toolbar.addButton("wd-arrow.png", function() {
        self.arrowTool();
    });
    toolbar.addButton("wd-text.png", function() {
        self.newText();
    });

    toolbar.addButton("wd-undo.png", function() {
        self.undo();
    });
    toolbar.addButton("wd-redo.png", function() {
        self.redo();
    });
    toolbar.div.style.cssFloat = "left";
    this.div.appendChild(toolbar.div);

    this.canvas = $("<canvas width='700' tabindex='1' height='700'>")[0];
    this.canvas.style.borderColor = "black";
    this.canvas.style.borderWidth = "2px";
    this.canvas.style.borderStyle = "solid";
    this.canvas.style.borderTop = "2px solid white";
    this.canvas.style.cssFloat = "left";
    this.canvas.style.cursor = "default";
    this.panel = new PropertyPanel();
    this.drawView = new DrawView(this.canvas, this.undoStack, this.panel);
    this.div.appendChild( this.canvas );
    this.div.appendChild( this.panel.div );

    var onResize = function()
    {
        self.canvas.width = $(window).width() - 400;
        self.canvas.height = $(window).height() - $(self.canvas).offset().top - 30;
        self.drawView.draw();
    };

    $(window).resize( onResize );
    $(document).ready( onResize );

    var bottom = document.createElement("div");
    bottom.style.clear = "both";
    
    var a = document.createElement("a");
    a.appendChild( document.createTextNode("Open as Image in New Window"));
    a.href="";
    a.onclick = function()
    {
        self.drawView.drawForSave();
        window.open( self.canvas.toDataURL() );
        self.drawView.draw();
        return false;
    };

    bottom.appendChild( a );
    this.div.appendChild( bottom );

    this.file = {
        name: "Drawing created on " + (new Date()).toLocaleDateString(),
        fileId: -1,
        shared: 0
    };
    
    this.hasFocus = false;

    gDrawApp = this;

    var query = splitQueryString( window.location.href );
    if ( "drawdoc" in query ) {
        var saved;
        try {
            saved = window.JSON.parse( query.drawdoc );
        } catch (e) {
            alert( "Error loading drawing." );
            return;
        }
        this.drawView.doc.root = Loader( saved );
        this.drawView.update();
    }

    /*
    this.newRect();
    e = $.Event("mousedown");
    e.pageX = 400;
    e.pageY = 400;
    $(this.canvas).trigger(e);
    e = $.Event("mouseup");
    e.pageX = 400;
    e.pageY = 400;
    $(this.canvas).trigger(e);

    e = $.Event("mousedown");
    e.pageX = 400;
    e.pageY = 400;
    $(this.canvas).trigger(e);
    e = $.Event("mousemove");
    e.pageX = 500;
    e.pageY = 500;

    $(this.canvas).trigger(e);
    e = $.Event("mouseup");
    e.pageX = 400;
    e.pageY = 400;
    //$(this.canvas).trigger(e);
    */
}

DrawApp.prototype = {
    dirty: function()
    {
        return this.undoStack.dirty;
    },

    undo: function()
    {
          if ( this.undoStack.canUndo() ) {
            this.undoStack.undo();
            this.drawView.update();
          }
    },

    redo: function()
    {
          if ( this.undoStack.canRedo() ) {
            this.undoStack.redo();
            this.drawView.update();
          }
    },

    newDocument: function()
    {
        this.drawView.clearSelection();
        this.undoStack.clear();
        this.drawView.doc = new DrawDoc();
        this.drawView.update();

        this.file = {
            name: "Drawing created on " + (new Date()).toLocaleDateString(),
            fileId: -1,
            shared: 0
        };
    },

    newRect: function()
    {
        var node = new PathNode( 10, 10 );
        node.lineTo( 110, 10 );
        node.lineTo( 110, 110 );
        node.lineTo( 10, 110 );
        node.lineTo( 10, 10 );
        node.close();

        this.undoStack.execute( 
            new NewNodeAction( this.drawView, this.drawView.doc.root,
                node
                ));
        this.drawView.update();
    },

    newCircle: function()
    {
        var node = new PathNode( 50, 0 );
        node.cornerTo( 100, 0, 100, 50 );
        node.cornerTo( 100, 100, 50, 100 );
        node.cornerTo( 0, 100, 0, 50 );
        node.cornerTo( 0, 0, 50, 0 );
        node.close();

        this.undoStack.execute( 
            new NewNodeAction( this.drawView, this.drawView.doc.root,
                node
                ));
        this.drawView.update();
    },

    newText: function()
    {
        this.undoStack.execute( 
            new NewNodeAction( this.drawView, this.drawView.doc.root,
                new TextNode( "Lorum ipsum dolor" )
                ));
        this.drawView.update();
    },

    lineTool: function()
    {
        this.drawView.lineTool();
    },

    curveTool: function()
    {
        this.drawView.curveTool();
    },

    arrowTool: function()
    {
        this.drawView.arrowTool();
    }

};



var nodes = {
    "type":"Node",
    "matrix": {
        "m11":1,
        "m12":0,
        "m21":0,
        "m22":1,
        "dx":0,
        "dy":0
    },
    "strokeStyle":"#000000",
    "fillStyle":"#ffffff",
    "lineWidth":2,
    "children":[]
};