$(function() {
    // Debugger error workaround
    jQuery.extend({
        getScript: function(url, callback) {
            var d = $.Deferred();
            if (callback)
                d.done(callback);
            var head = document.getElementsByTagName("head")[0];
            var script = document.createElement("script");
            script.src = url;

            // Handle Script loading
            {
                var done = false;

                // Attach handlers for all browsers
                script.onload = script.onreadystatechange = function(){
                    if ( !done && (!this.readyState ||
                        this.readyState == "loaded" || this.readyState == "complete") ) {
                        done = true;
                        d.resolve();

                        // Handle memory leak in IE
                        script.onload = script.onreadystatechange = null;
                    }
                };
            }

            head.appendChild(script);

            // We handle everything using the script element injection
            return d;
        }
    });
       
       
       
    mockup = {
        api: {
            clickTile: function(thisElement, url) {
                // clear frame
                $(".basePanel").children().remove();
                mockup.api.loadPage(url);
            
            },
            loadPage: function(name, conf) {
                
                if (conf) {
                    if (!confirm("Are you sure you want to go back? You will lose your selected data.")) {
                        return;
                    }
                }
                
                $(".basePanel").children().remove();
                
                $.get("pages/"+name+".html", function(responseText, textStatus, XMLHttpRequest) {
                    $(".basePanel").append(responseText);
                    $.getScript("pages/"+name+".js", function(responseText, textStatus, XMLHttpRequest){
                        
                        })
                });
                mockup.api.breadcrumbs.navTo(name);
            },
            auth: function(target, destination) {
                debugger;
                var name = document.getElementById("loginForm_name");
                var pw = document.getElementById("loginForm_password");
                
                if (name.value.length > 0 && pw.value.length > 0) {
                    mockup.api.clickTile(target, destination);
                }
                
            },
            breadcrumbs: new (function() {
                var _crumbs = [];
                var _element = document.getElementById('breadcrumbs');
                this.init = function() {
                    updateDiv();
                }
                
                this.navTo = function(name) {
                    // Check of 'name' al in crumbs staat.
                    // Als wel: navBack, delete alle crumbs na 'name', update div.
                    // Als niet: addCrumb, voeg 'name' toe aan crumbs en update de div.
                    var index = _crumbs.indexOf(name);
                    if (index != -1) {
                        navBack(name, index);
                    }
                    else {
                        addCrumb(name);
                    }
                }
                
                var addCrumb = function(name) {
                    _crumbs.push(name);
                    updateDiv();
                }
                
                var navBack = function(name, index) {
                    var i = index;
                    _crumbs = _crumbs.slice(0, i+1);
                    updateDiv();
                }
                
                var updateDiv = function() {
                    //format first
                    _element.innerHTML = null || "";
                    for (var n=0; n < _crumbs.length; n++) {
                        var _link;
                        if (_crumbs[n] == "Home") {
                            link = document.createTextNode("Home");
                            _element.appendChild(link);
                            
                            
                        }
                        else{
                            link = document.createElement('a');
                            link.innerHTML = _crumbs[n];
                            link.setAttribute("onclick", "mockup.api.loadPage('"+_crumbs[n]+"', true);");
                            link.setAttribute("href","#");
                            _element.appendChild(link);
                            
                        }
                        
                        if (n != _crumbs.length-1) {
                            _element.innerHTML += " > ";
                        }
                        else {
                            link.className = "selected";
                        }
                        
                    }
                }
            })(),
            graphs: {
                previewGraph: null,
                dashboard: [],
                graphObjects: []
            }
        
        }
    
    
    }
});