//give global scope to this variable
//var hidden_content = "imglobal";
//global variable to track the state of the visibility
var content_fadestate = "0";
//other global variables
var magnify_node = "imglobal";
var navigation_node = "imglobal";
var magnify_hover_connect_unactive = "imglobal";
var magnify_hover_connect_active = "imglobal";
var magnify_exit_connect_unactive = "imglobal";
var magnify_exit_connect_active = "imglobal";
var core_contentpane = "imglobal";
var authenticateuser;

var setupSlideshowNaviDisplacerVars = function() {
    //variables needed by the content toggling function
    //var magnify_tooltip = dojo.byId("magnify_tooltip");
    magnify_node = dojo.byId("magnify");
    navigation_node = dojo.byId("slideshow_navigation");
    // define some bogus object to be assigned to these variables. They are used for tracking connect/disconnect events relative to the magnify button
    magnify_hover_connect_unactive = magnify_node;
    magnify_hover_connect_active = magnify_node;
    magnify_exit_connect_unactive = magnify_node;
    magnify_exit_connect_active = magnify_node;
    core_contentpane = dijit.byId("the_content");
};



// define some bogus object to be assigned to these variables. They are used for tracking connect/disconnect events relative to the magnify button
var magnify_hover_active = function() {
    magnify_node.style.backgroundPosition = '0 -40px';
};

var magnify_hover_unactive = function() {
    magnify_node.style.backgroundPosition = '0 -160px';
};

var magnify_exit_active = function() {
    magnify_node.style.backgroundPosition = '0 -0px';
};

var magnify_exit_unactive = function() {
    magnify_node.style.backgroundPosition = '0 -120px';
};


//function to use to toggle the content, icons, navigation, and so on
var togglecontent = function() {

    if (content_fadestate == "1") {
        //		magnify_tooltip.innerHTML='Zoom to content';
        magnify_node.style.backgroundPosition = '0 -200px';

        dojo.disconnect(magnify_hover_connect_unactive);
        magnify_hover_connect_active = dojo.connect(magnify_node, 'onmouseover', magnify_hover_active);

        dojo.disconnect(magnify_exit_connect_unactive);
        magnify_exit_connect_active = dojo.connect(magnify_node, 'onmouseout', magnify_exit_active);

        core_contentpane.domNode.style.opacity = "0";
        core_contentpane.domNode.style.display = "block";


        var hidenavigation = dojo.animateProperty({
            node: navigation_node,
            duration: 500,
            properties: {
                opacity: {
                    end: 0
                }
            },
            onEnd: function() {
                dojo.style(navigation_node, "display", "none");
            }
        });
        //		var hidehiddencontent = dojo.animateProperty({node: hidden_content, duration: 500, properties: {opacity: { end: 0 }}, onEnd: function(){ dojo.style(hidden_content, "display", "none");} });
        var showcontent = dojo.animateProperty({
            node: core_contentpane.domNode,
            duration: 500,
            properties: {
                opacity: {
                    end: 1
                }
            }
        });



        var combinehider = dojo.fx.chain([hidenavigation, showcontent]);

        combinehider.play();

        content_fadestate = "0";


    }
    else if (content_fadestate == "0") {
        //		magnify_tooltip.innerHTML='Zoom to images';
        magnify_node.style.backgroundPosition = '0 -80px';

        dojo.disconnect(magnify_hover_connect_active);
        magnify_hover_connect_unactive = dojo.connect(magnify_node, 'onmouseover', magnify_hover_unactive);

        dojo.disconnect(magnify_exit_connect_active);
        magnify_exit_connect_unactive = dojo.connect(magnify_node, 'onmouseout', magnify_exit_unactive);

        //		hidden_content.style.opacity = "0";
        //		hidden_content.style.display = "block";
        navigation_node.style.opacity = "0";
        navigation_node.style.display = "block";
        navigation_node.style.visibility = "visible";

        var hidecontent = dojo.animateProperty({
            node: core_contentpane.domNode,
            duration: 500,
            properties: {
                opacity: {
                    end: 0
                }
            },
            onEnd: function() {
                dojo.style(core_contentpane.domNode, "display", "none");
            }
        });
        //		var showhiddencontent = dojo.animateProperty({node: hidden_content, duration: 500, properties: {opacity: { end: 1 }} });
        var shownavigation = dojo.animateProperty({
            node: navigation_node,
            duration: 500,
            properties: {
                opacity: {
                    end: 1
                }
            }
        });



        var combineshower = dojo.fx.chain([hidecontent, shownavigation]);

        combineshower.play();

        content_fadestate = "1";
    }
};



var slideshowNaviDisplacer = function() {
    //DISPLACE SLIDESHOW NAVIGATION
    var initnavmenuxpos = dijit.getViewport().w / 2 + 60;
    var initnavmenuypos = dijit.getViewport().h - 40;

    //we have to do this twice otherwise its not positioned correctly the first time.
    dijit.placeOnScreen(navigation_node, {
        x: initnavmenuxpos,
        y: initnavmenuypos
    },
    ["TR", "BL"]);
    dojo.style(navigation_node, "zIndex", 4);
    dojo.style(navigation_node, "opacity", 0);

    dojo.connect(window, "onresize",
    function() {
        var navmenuxpos = dijit.getViewport().w / 2 + 60;
        var navmenuypos = dijit.getViewport().h - 40;
        dijit.placeOnScreen(navigation_node, {
            x: navmenuxpos,
            y: navmenuypos
        },
        ["TR", "BL"]);
    });
};


var getintrotextwidth = function() {

    var amount = 180;
    var tempnodetodestroy1 = dojo.create("span", {
        innerHTML: dojo.byId("i18n_pagetitle").innerHTML
    },
    dojo.body());
    var tempnodetodestroy2 = dojo.create("span", {
        innerHTML: dojo.byId("i18n_presents").innerHTML
    },
    dojo.body());



    var marginBox1 = dojo.marginBox(tempnodetodestroy1);
    var marginBox2 = dojo.marginBox(tempnodetodestroy2);
    dojo.marginBox(dojo.query(".under")[0], {
        w: (marginBox1.w + marginBox2.w + amount + 50)
    });
    dojo.destroy(tempnodetodestroy1);
    dojo.destroy(tempnodetodestroy2);



    var tempnodetodestroy3 = dojo.create("span", {
        innerHTML: dojo.byId("i18n_introtext").innerHTML
    },
    dojo.body());
    var tempnodetodestroy4 = dojo.create("span", {
        innerHTML: "Applications Collaboratives"
    },
    dojo.body());



    var marginBox3 = dojo.marginBox(tempnodetodestroy3);
    var marginBox4 = dojo.marginBox(tempnodetodestroy4);
    dojo.marginBox(dojo.query(".upper")[0], {
        w: (marginBox3.w + marginBox4.w + 35)
    });
    dojo.destroy(tempnodetodestroy3);
    dojo.destroy(tempnodetodestroy4);



};

var startadministration = function() {
    console.log("administrating");
    dijit.popup.close(dijit.byId('tt'));


    var popupcontainer = dojo.create("div", null, dojo.body());


    var userTextarea = new dijit.form.Textarea({
        id: "user",
        name: "user",
        cols: "60",
        value: ""
    });



    var passwordTextarea = new dijit.form.Textarea({
        id: "password",
        name: "password",
        cols: "60",
        value: ""
    });


    var convertToByteArray = function(data) {
        var bin = [];
        for (var i = 0; i < data.length; i++) {
            bin.push(data.charCodeAt(i));
        }
        return bin;
    };

    var data = '{  "docs": [   {"_id": "lastlogin", "integer": 0, "string": "0"}]}';
    var username = userTextarea.value;
    var password = passwordTextarea.value;
    authenticateuser = function() {
        dojo.rawXhrPost({
            url: "/couchdb/addplus_eu/_bulk_docs",
            headers: {
                "Authorization": "Basic " + dojox.encoding.base64.encode(convertToByteArray(username + ":" + password))
            },
            handleAs: "json",
            postData: data,
            load: function(response, ioArgs) {
                // inspect the response and ioArgs...
                console.log(response, ioArgs);
            }
        });
    };





    popupcontainer.style.width = "300px";
    popupcontainer.style.height = "300px";

    authenticationDLG = new dijit.Dialog({
        id: "dialog3",
        refocus: false,
        title: "Programatic Dialog Creation"
    }).placeAt(dojo.body());

    var submitterbutton = new dijit.form.Button({
        label: "Authenticate me!",
        onClick: function() {
            // Do something:
            authenticateuser();
        }
    }).placeAt(dojo.body());


    userTextarea.placeAt(authenticationDLG.containerNode);
    passwordTextarea.placeAt(authenticationDLG.containerNode);
    submitterbutton.placeAt(authenticationDLG.containerNode);

    authenticationDLG.startup();
    authenticationDLG.show();




};

var connectNewsLetterTooltip = function() {

    var postForm = function() {
        if (dojo.byId('email').value == "administrate") {
            startadministration();
        } else {


            dojo.xhrPost({
                // The page that parses the POST request
                url: '/email/mail.cgi',
                handleAs: 'text',
                // Name of the Form we want to submit
                form: dojo.byId('newsletterForm'),
                // Loads this function if everything went ok
                load: function() {
                    // Put the data into the appropriate <div>
                    dojo.byId('i18n_newsletter_tooltip').innerHTML = 'Thank you!';
                    setTimeout("dijit.popup.close(dijit.byId('tt'))", 500);
                    dijit.byId('tt').destroyRecursive();
                },
                // Call this function if an error happened
                error: function(error) {
                    console.error('Error: ', error);
                }
            });
        }
    };


    dojo.query("#newsletter_tooltip_connector").forEach(function(n) {
        // do more stuff for these (this) node: n
        dojo.query("#tt div").addClass("dijitInline");
        var myDialog = new dijit.TooltipDialog({},
        "tt");
        myDialog.startup();


        var coords = dojo.coords(dojo.byId("newsletter_tooltip_connector"));

        var placenewslettertt = function() {
            coords = dojo.coords(dojo.byId("newsletter_tooltip_connector"));
        };

        dojo.connect(window, "onresize", placenewslettertt);




        dojo.connect(n, "onclick",
        function(e) {
            // stop the native click
            e.preventDefault();
            if (dojo.byId("i18n_newsletter_tooltip").innerHTML != 'Thank you!') {
                coords = dojo.coords(dojo.byId("newsletter_tooltip_connector"));


                var mypopup = dijit.popup.open({
                    popup: myDialog,
                    around: dojo.byId("newsletter_tooltip_connector"),
                    orient: {
                        'TR': 'BR',
                        'TL': 'BL',
                        'BL': 'TL',
                        'BR': 'TR'
                    }
                });

                dijit.popup.close(myDialog);

                mypopup = dijit.popup.open({
                    popup: myDialog,
                    around: dojo.byId("newsletter_tooltip_connector"),
                    orient: {
                        'TR': 'BR',
                        'TL': 'BL',
                        'BL': 'TL',
                        'BR': 'TR'
                    }
                });

                dojo.connect(myDialog, "onBlur",
                function(e) {
                    dijit.popup.close(myDialog);
                },
                true);

            }
        });


        dojo.query("#cancel").onclick(function(e) {
            e.preventDefault();
            // like return false;
            dijit.popup.close(myDialog);
        });

        dojo.connect(dojo.byId('newsletterForm'), "onsubmit", dojo, "stopEvent");




        dojo.query("#newsletterForm").onsubmit(function(e) {
            e.preventDefault();
            postForm();
        });

        dojo.connect(dojo.byId('newsletterFormSubmit'), "onclick", postForm);

    });



};