//
// WERK1 - Javascript
//
// Copyright (c) 2008-2010 Jeamy Lee 
// Licensed under the MIT (MIT-LICENSE.txt)
// and GPL (GPL-LICENSE.txt) licenses.
//
//
Desktop = function(){
    var setActiveMenu = function(desktop, id){
        $j(desktop.lastMenuId).css({
            color: "#807000",
            textDecoration: "line-through"
        });
        $j(id).css({
            color: "black",
            textDecoration: "none"
        });
        desktop.lastMenuId = id;
    };
    var getItemHtml = function(item){
        var iIdIn = "item" + item.id;
        var tpl = "<div class=\"item\" title=\"F&uuml;r Details hier klicken!\" id=\"" + iIdIn + "\">";
        tpl += "<div class=\"item_topline\">" + item.topline + "</div>";
        tpl += "<div class=\"item_titel\">" + item.titel + "</div>";
        tpl += "<div class=\"item_subtitel\">" + item.subtitel + "</div>";
        /*
         if(item.time != null && item.time != "") {
         tpl += "<div class=\"item_time\">" + item.time + "</div>";
         }
         */
        if (item.text != null && item.text != "") {
            tpl += "<div class=\"item_text\">" + item.text + "</div>";
        }
        tpl += "<img class=\"item_image\" title=\"F&uuml;r Details hier klicken! - " + item.image + "\" alt=\"" + item.image + "\" src=\"" + PROJECT_ROOT + item.link + "/" + item.image + "\">";
        if (item.text2 != null && item.text2 != "" && item.text2 != "Zusatztext eingeben") {
            tpl += "<div class=\"item_text\">" + item.text2 + "<p></div>";
        }
        tpl += "</div>";
        return {
            tpl: tpl,
            id: iIdIn
        };
    };
    return {
        items: new Items(),
        menuX: 25,
        menuY: 11,
        menuStartY: 11,
        menuSpaceX: 180,
        menuSpaceY: 14,
        menuIndex: 0,
        menuMaxIndex: 26,
        menuId: 0,
        lastMenuId: undefined,
        loadData: function(){
            app.loadMenu(app);
        },
        loadPage: function(id, type){
            this.setVisibility(type);
            switch (type) {
                case START:
                    app.emptyPage(app);
                    break;
                case TEAM:
                    app.loadTeamPage(app, id);
                    break;
                case JOB:
                    app.loadJobPage(app, id);
                    break;
                case CATEGORY:
                    app.loadItemsCategoryPage(app, id);
                    break;
                case COMPANY:
                    app.loadItemsCompanyPage(app, id);
                    break;
                case KUNDEN:
                    app.loadInfoPage(app, KUNDEN);
                    break;
                case AGB:
                    app.loadInfoPage(app, AGB);
                    break;
                case IMPRESSUM:
                    app.loadInfoPage(app, IMPRESSUM);
                    break;
            /*                case MAP:
                 app.loadMap(app, MAP);
                 break;
                 */
            }
        },
        emptyPage: function(desktop){
            $j("#output-main").empty();
            $j("#output-left").empty();
            $j("#output-middle").empty();
            $j("#output-right").empty();
            $j("#info-page").empty();
        },
        loadMenu: function(desktop){
            $j("#menu").ajaxComplete(function(ev, xhr, s){
                if (s.url == GET_STAFF) {
                    desktop.nextMenuPosition(desktop);
                    desktop.loadMenuStandards(desktop);
                    desktop.nextMenuPosition(desktop);
                    desktop.loadMenuCategory(desktop);
                }
                else {
                    if (s.url == GET_CATEGORY) {
                        desktop.nextMenuPosition(desktop);
                        desktop.loadMenuCompanies(desktop);
                    }
                    else {
                        if (s.url == GET_COMPANIES) {
                            $j("#toolbar").hover(function(){
                                $j("#menu").show(200).css({
                                    visibility: "visible"
                                });
                            }, function(){
                                });
                            $j("#menu-img").hover(function(){
                                }, function(){
                                    $j("#menu").css({
                                        visibility: "hidden"
                                    });
                                });
                            $j("#menu").unbind("ajaxComplete");
                        }
                    }
                }
            });
            desktop.loadMenuStaff(desktop);
        },
        loadMenuStandards: function(desktop){
            var iId = "menu" + desktop.menuId++;
            tpl = "<div class=\"menu-item\" id=\"" + iId + "\">Start</div>";
            $j(tpl).appendTo("#menu-img");
            $j("#" + iId).click(function(){
                setActiveMenu(desktop, this);
                desktop.loadPage(desktop.menuId, START);
            }).css({
                top: desktop.menuY + "px",
                left: desktop.menuX + "px"
            });
            desktop.nextMenuPosition(desktop);
            iId = "menu" + desktop.menuId++;
            tpl = "<div class=\"menu-item\" id=\"" + iId + "\">Team</div>";
            $j(tpl).appendTo("#menu-img");
            $j("#" + iId).click(function(){
                setActiveMenu(desktop, this);
                desktop.loadPage(desktop.menuId, TEAM);
            }).css({
                top: desktop.menuY + "px",
                left: desktop.menuX + "px"
            });
            desktop.nextMenuPosition(desktop);
            iId = "menu" + desktop.menuId++;
            tpl = "<div class=\"menu-item\" id=\"" + iId + "\">Kunden</div>";
            $j(tpl).appendTo("#menu-img");
            $j("#" + iId).click(function(){
                setActiveMenu(desktop, this);
                desktop.loadPage(desktop.menuId, KUNDEN);
            }).css({
                top: desktop.menuY + "px",
                left: desktop.menuX + "px"
            });
            desktop.nextMenuPosition(desktop);
            iId = "menu" + desktop.menuId++;
            tpl = "<div class=\"menu-item\" id=\"" + iId + "\">Impressum</div>";
            $j(tpl).appendTo("#menu-img");
            $j("#" + iId).click(function(){
                setActiveMenu(desktop, this);
                desktop.loadPage(desktop.menuId, IMPRESSUM);
            }).css({
                top: desktop.menuY + "px",
                left: desktop.menuX + "px"
            });
            /*
             desktop.nextMenuPosition(desktop);
             iId = "menu" + desktop.menuId++;
             tpl = "<div class=\"menu-item\" id=\"" + iId + "\">So finden sie uns</div>";
             $j(tpl).appendTo("#menu-img");
             $j("#" + iId).click(function(){
             setActiveMenu(desktop, this);
             desktop.loadPage(desktop.menuId, MAP);
             }).css({
             top: desktop.menuY + "px",
             left: desktop.menuX + "px"
             });
             */
            desktop.nextMenuPosition(desktop);
            iId = "menu" + desktop.menuId++;
            tpl = "<div class=\"menu-item\" id=\"" + iId + "\">AGB</div>";
            $j(tpl).appendTo("#menu-img");
            $j("#" + iId).click(function(){
                setActiveMenu(desktop, this);
                desktop.loadPage(desktop.menuId, AGB);
            }).css({
                top: desktop.menuY + "px",
                left: desktop.menuX + "px"
            });
            desktop.nextMenuPosition(desktop);
        },
        loadMenuStaff: function(desktop){
            $j.getJSON(GET_STAFF, function(data){
                $j.each(data, function(i, item){
                    var iId = "menu" + desktop.menuId++;
                    var tpl = "<div class=\"menu-item-mail\" id=\"" + iId + "\"><a href=\"mailto:" +
                    item.email +
                    "\"><span class=\"menu-item-mail\">" +
                    item.email +
                    "</span></a></div>";
                    $j(tpl).appendTo("#menu-img");
                    $j("#" + iId).click(function(){
                        $j("#menu").css({
                            visibility: "hidden"
                        });
                    }).css({
                        top: desktop.menuY + "px",
                        left: desktop.menuX + "px"
                    });
                    desktop.nextMenuPosition(desktop);
                });
            });
        },
        loadMenuCategory: function(desktop){
            $j.getJSON(GET_CATEGORY, function(data){
                $j.each(data, function(i, item){
                    var iId = "menu" + desktop.menuId++;
                    tpl = "<div class=\"menu-item\" id=\"" + iId + "\">" + item.name + "</div>";
                    $j(tpl).appendTo("#menu-img");
                    $j("#" + iId).click(function(){
                        setActiveMenu(desktop, this);
                        desktop.loadPage(item.id, CATEGORY);
                    }).css({
                        top: desktop.menuY + "px",
                        left: desktop.menuX + "px"
                    });
                    desktop.nextMenuPosition(desktop);
                });
            });
        },
        loadMenuCompanies: function(desktop){
            $j.getJSON(GET_COMPANIES, function(data){
                $j.each(data, function(i, item){
                    if (item.id == 1) {
                        tpl = "<span class=\"text\">" + item.address + "<br>";
                        tpl += item.plzcity + "<br>";
                        tpl += "T " + item.tel + "<br>";
                        tpl += "F " + item.fax + "<br>";
                        tpl += "<a href=\"mailto:" + item.mail + "\">" + item.mail + "</a></span>";
                        $j(tpl).appendTo("#company-address");
                        $j("<img id=\"logo\" src=\"/" + item.logo + "\">").appendTo("#logo-panel");
                    }
                    else {
                        var _1d = "menu" + desktop.menuId++;
                        tpl = "<div class=\"menu-item\" id=\"" + _1d + "\">" + item.name + "</div>";
                        $j(tpl).appendTo("#menu-img");
                        $j("#" + _1d).click(function(){
                            setActiveMenu(desktop, this);
                            desktop.loadPage(item.id, COMPANY);
                        }).css({
                            top: desktop.menuY + "px",
                            left: desktop.menuX + "px"
                        });
                        desktop.nextMenuPosition(desktop);
                    }
                });
            });
        },
        loadTeamPage: function(desktop, id){
            desktop.emptyPage(desktop);
            activeItemColumn = 0;
            $j.getJSON(GET_STAFF, function(data){
                $j.each(data, function(i, item){
                    var iId = "staff-output" + i;
                    var tpl = "<div class=\"staff-output\" id=\"" + iId + "\"></div>";

                    if (activeItemColumn == 0) {
                        $j(tpl).appendTo("#output-left");
                        activeItemColumn++;
                    }
                    else
                    if (activeItemColumn == 1) {
                        $j(tpl).appendTo("#output-middle");
                        activeItemColumn++;
                    }
                    else
                    if (activeItemColumn == 2) {
                        $j(tpl).appendTo("#output-right");
                        activeItemColumn = 0;
                    }

                    var iIdIn = "item" + i;
                    tpl = "<div class=\"staff\" id=\"" + iIdIn + "\">";
                    tpl += "<span class=\"staff_name\">" + item.name + "</span>";
                    // 	 + " " + item.vorname + "</div>";
                    tpl += "<span class=\"staff_tel\">" + item.tel + "</span>";
                    tpl += "<a href=\"mailto:" + item.email + "\"><span class=\"staff_email\">" + item.email + "</span></a>";
                    //tpl += "<div class=\"staff_text\">" + item.text + "</div>";
                    if (item.image == "BILD" || item.image == null || item.image == undefined) {
                        item.image = "mademoiselle.jpg";
                        item.link = "../img";
                    }
                    tpl += "<img class=\"staff_image\" title=\"" + item.image + "\" alt=\"" + item.image + "\" src=\"" + PROJECT_ROOT + item.link + "/" + item.image + "\">";
                    tpl += "</div>";
                    $j(tpl).appendTo("#" + iId);
                    $j("#" + iIdIn).corner("round 3px");
                    $j("#" + iId).corner("round 5px");
                });
            });
        },
        loadJobPage: function(desktop, itemdata){
            $j.getJSON(GET_JOB, {
                id: itemdata.id
            }, function(data){
                data.jobinfo = itemdata.jobinfo;
                desktop.viewJob(desktop, data);
            });
        },
        loadItemsCategoryPage: function(desktop, id){
            desktop.emptyPage();
            $j.getJSON(GET_ITEMS_CATEGORY, {
                id: id
            }, function(data){
                data.sticky_type = STICKY_CATEGORY;
                //data.sticky_type = STICKY_ITEM;
                desktop.viewItems(desktop, data);
            });
        },
        loadItemsCompanyPage: function(desktop, id){
            desktop.emptyPage();
            $j.getJSON(GET_ITEMS_COMPANIES, {
                id: id
            }, function(data){
                data.sticky_type = STICKY_ITEM;
                desktop.viewItems(desktop, data);
            });
        },
        loadInfoPage: function(desktop, type){
            desktop.emptyPage(desktop);
            $j.getJSON(GET_ITEMS, {
                type: type
            }, function(data){
                if (data != "") {
                    if (type == AGB) {
                        var t = "<div><a href=\"img/werk1.AGB.pdf\">AGB als PDF</a></div><br>\n"
                        $j("<div><a href=\"img/werk1.AGB.pdf\">AGB als PDF</a></div><p>\n").appendTo("#info-page");
                    }
                    $j("<span>" + data + "</span>").appendTo("#info-page");
                    $j("#info-page").css({
                        visibility: "visible"
                    });
                }
            });
        },
        /*
         loadMap: function(desktop, type){
         desktop.emptyPage(desktop);
         $j("<span>Werk1 Werbegraphik GmbH, Siriusstra&szlig;e3, 9020 Klagenfurt</span>").appendTo("#info-page");
         $j("#info-page").css({
         visibility: "visible"
         });
         _showGM("#info-page");
         },
         */
        writeHtml: function(dir, file){
            var html = "<html>" + HEADER + "<body>" + TOP + $j("body").html() + GA + "</body></html>";
            html = html.replace(/\n/g, "");
            $j.postJSON(WRITE_HTML, {
                html: html,
                dir: dir,
                file: file
            }, function(result){
                });
        },
        viewItems: function(desktop, data){
            var lCol = 0;
            var file = "";
            var dir = "";
            var sticky = new Array();
            var other = new Array();
            var is = 0;
            var io = 0;
            // first prepare data for columns
            $j.each(data, function(i, item){
                // store id for later use
                item.outerId = "item-output" + i;
                if (item.sticky & data.sticky_type) {
                    sticky[is++] = item;
                }
                else {
                    other[io++] = item;
                }
            });
            // prepare sticky html
            var tpl = "";
            for(var i = 0; i<sticky.length; i++) {
                tpl += "<div class=\"item-output\" id=\"" + sticky[i].outerId + "\"></div>";
            }
            // prepare rest
            var tpll = "";
            var tplm = "";
            var l = sticky.length * 2;
            for(i = 0; i<other.length; i++) {
                if (i < l ) {
                    if (lCol == 0) {
                        tpll += "<div style=\"visibility:hidden;\" class=\"item-output\" id=\"" + other[i].outerId + "\"></div>";
                        lCol = 1;
                    }
                    else {
                        tplm += "<div style=\"visibility:hidden;\"  class=\"item-output\" id=\"" + other[i].outerId + "\"></div>";
                        lCol = 0;
                    }
                }
                else {
                    if (i % 3 == 2) {
                        tpl += "<div style=\"visibility:hidden;\"  class=\"item-output\" id=\"" + other[i].outerId + "\"></div>";
                    }
                    else
                    if (i % 3 == 1) {
                        tplm += "<div style=\"visibility:hidden;\"  class=\"item-output\" id=\"" + other[i].outerId + "\"></div>";
                    }
                    else
                    if (i % 3 == 0) {
                        tpll += "<div style=\"visibility:hidden;\"  class=\"item-output\" id=\"" + other[i].outerId + "\"></div>";
                    }
                }
            }
            if(tplm != ""){
                $j(tplm).appendTo("#output-middle");
            }
            if (tpll != "") {
                $j(tpll).appendTo("#output-left");
            }
            if (tpl != "") {
                $j(tpl).appendTo("#output-right");
            }

            $j.each(sticky, function() {
                var tmp = getItemHtml(this);
                $j(tmp.tpl).appendTo("#" + this.outerId );

                var item = this;
                $j("#" + tmp.id).corner("round 3px").click(function(){
                    desktop.loadPage(item, JOB);
                });
                $j("#" + this.outerId).corner("round 5px").css({visibility: "visible"});

//            writeHtml filename, alternative version. for now we use global index.html
//            file = this.link.substring(this.link.lastIndexOf('/') + 1) + ".html";
//            writeHtml
//              desktop.writeHtml(upload_dir + this.link, "index.html");
            });

            var path = "";
            $j.each(other, function() {
                var tmp = getItemHtml(this);
                $j(tmp.tpl).appendTo("#" + this.outerId );
                var item = this;
                $j("#" + tmp.id).corner("round 3px").click(function(){
                    desktop.loadPage(item, JOB);
                });
                $j("#" + this.outerId).corner("round 5px").css({visibility: "visible"});

//            writeHtml filename, alternative version. for now we use global index.html
//            file = this.link.substring(this.link.lastIndexOf('/') + 1) + ".html";
//            writeHtml
//              desktop.writeHtml(upload_dir + this.link, "index.html");
            });
//          write whole page
//            path = path.substring(0, path.lastIndexOf('/'));
//            if(upload_dir != path) {
//                desktop.writeHtml(path, "index.html");
//            }

        },
        viewJob: function(desktop, data){
            if (data == undefined || data.length == 0) {
                return;
            }
            desktop.items.setList(data);
            desktop.items.setNav();
            desktop.items.getItem(0);
            var top = $j(document).scrollTop();
            top += 139;
            $j("#popup").fadeIn(300).css({
                visibility: "visible",
                top: top + "px"
            });
            desktop.mask(true);
            $j("#popup-close").click(function(){
                desktop.mask(false);
            });
        },
        mask: function(flag){
            if (flag) {
                $j("#popup").before("<div class=\"mask\" id=\"page\"></div>");
                $j("#page").css({
                    width: $j(document).width(),
                    height: $j(document).height()
                });
            }
            else {
                $j("#popup").css({
                    visibility: "hidden"
                });
                $j("#page").remove();
            }
        },
        setVisibility: function(status){
            $j("#menu").css({
                visibility: "hidden"
            });
            $j("#popup").css({
                visibility: "hidden"
            });
            $j("#info-page").css({
                visibility: "hidden"
            });
            if (status == START) {
                $j("#company-panel").css({
                    visibility: "hidden"
                });
                $j("#background-text").css({
                    visibility: "visible"
                });
            }
            else {
                $j("#company-panel").css({
                    visibility: "visible"
                });
                $j("#background-text").css({
                    visibility: "hidden"
                });
            }
        },
        nextMenuPosition: function(desktop){
            desktop.menuIndex++;
            if (desktop.menuIndex % desktop.menuMaxIndex == 0) {
                desktop.menuIndex = 0;
                desktop.menuY = desktop.menuStartY;
                desktop.menuX += desktop.menuSpaceX;
            }
            else {
                desktop.menuY += desktop.menuSpaceY;
            }
        },
        lastDummy: function(){
        }
    };
};
function Items(){
    var desk = this;
    var lastNavId = undefined;
    var itemList = undefined;
    var index = 0;
    var getImgHtml = function(id){
        var tpl = "<img id=\"detailImageId\" class=\"detail_image\" title=\"" + itemList[id].image + "\" alt=\"" + itemList[id].image + "\" src=\"" + PROJECT_ROOT + itemList[id].link + "/" + itemList[id].image + "\">";
        return tpl;
    };
    var getTxtHtml = function(id){
        var tpl = "<div class=\"detail\" id=\"detailTextId\">";
        //        tpl += "<span class=\"detail_topline\">" + itemList[id].topline + "</span><br>";
        //        tpl += "<span class=\"detail_titel\">" + itemList[id].titel + "</span><br>";
        //        tpl += "<span class=\"detail_subtitel\">" + itemList[id].subtitel + "</span><br>";
        //        tpl += "<span class=\"detail_text\">" + itemList[id].text + "</span><br></div>";
        tpl += "<span class=\"detail_text\">" + itemList.jobinfo + "</span><br></div>";
        return tpl;
    };
    var addToPage = function(tpl, desk){
        $j("#popup-img").empty();
        $j(tpl).appendTo("#popup-img");
        $j("#detailImageId").click(function(){
            desk.getNext();
        });
    };
    var setActiveNav = function(id){
        if (lastNavId != undefined) {
            $j(lastNavId).css({
                color: "gray",
                textDecoration: "line-through"
            });
        }
        $j("#nav-" + id).css({
            color: "black",
            textDecoration: "none"
        });
        lastNavId = "#nav-" + id;
    };
    return {
        setNav: function(){
            lastNavId = undefined;
            $j("#popup-nav-page").empty();
            if (itemList.length == 1) {
                return;
            }
            var tpl = "<div id=\"nav-left\" class=\"popup-nav\">&lt;</div><div class=\"popup-nav-spacer\">&nbsp;</div>\n";
            tpl += "<div id=\"nav-right\" class=\"popup-nav\">&gt;</div><div class=\"popup-nav-spacer\">&nbsp;</div>\n";
            for (var i = 0; i < itemList.length; i++) {
                tpl += "<div id=\"" + ("nav-" + i) + "\" class=\"popup-nav\">" + (i + 1) + "</div>\n";
            }
            if (itemList.jobinfo != undefined && itemList.jobinfo != "Jobinfo eingeben" &&
                itemList.jobinfo != "" &&
                itemList.jobinfo != "null" &&
                itemList.jobinfo != "NULL") {
                tpl += "<div class=\"popup-nav-spacer\">&nbsp;</div><div id=\"nav-info\" class=\"popup-nav\">info</div>";
            }
            $j(tpl).appendTo("#popup-nav-page");

            $j("#nav-left").click(function(){
                desk.getPrev();
            });
            $j("#nav-right").click(function(){
                desk.getNext();
            });
            if (itemList.jobinfo != undefined && itemList.jobinfo != "Jobinfo eingeben" &&
                itemList.jobinfo != "" &&
                itemList.jobinfo != "null" &&
                itemList.jobinfo != "NULL") {
                $j("#nav-info").click(function(){
                    desk.getText();
                });
            }
            for (i = 0; i < itemList.length; i++) {
                $j("#nav-" + i).attr({
                    value: i
                }).click(function(){
                    desk.getItem($j("#" + this.id).attr("value"));
                });
            }
        },
        setList: function(list){
            delete items;
            itemList = list;
            index = 0;
            desk = this;
        },
        getNext: function(){
            if (itemList == undefined) {
                return -1;
            }
            if (index == itemList.length - 1) {
                index = -1;
            }
            index++;
            var tpl = getImgHtml(index);
            addToPage(tpl, this);
            setActiveNav(index);
            return itemList.length - 1;
        },
        getPrev: function(){
            if (index == 0) {
                index = itemList.length;
            }
            index--;
            var tpl = getImgHtml(index);
            addToPage(tpl, this);
            setActiveNav(index);
        },
        getItem: function(id){
            if (id == undefined || id < 0 || id >= itemList.length) {
                id = 0;
            }
            index = id;
            var tpl = getImgHtml(index);
            addToPage(tpl, this);
            setActiveNav(index);
        },
        getText: function(){
            var tpl = getTxtHtml(index);
            addToPage(tpl, this);
        },
        clear: function(){
            delete items;
        },
        length: function(){
            return itemList.length;
        }
    };
}