﻿var focusField, myColors, reportList, strMessage = "", bMessageIsError, propWidget;
var inAppMode, inCRMMode, inCRMGlobalMode;
var extremes = new Array();

if (typeof String.prototype.trim !== 'function') {
    String.prototype.trim = function () {
        return this.replace(/^\s+|\s+$/g, '');
    };
}

function resolveClientUrl(url) {
    if (url.indexOf("~/") == 0) {
        url = baseUrl + url.substring(2);
    }
    return url;
}

function setLanguage(lang) {
    var qs = "";
    var kvp;
    if (window.location.href.indexOf("?") > -1) {
        var params = window.location.href.substr(window.location.href.indexOf("?") + 1).split('&');
        for (var i = 0; i < params.length; i++) {
            kvp = params[i].split('=');
            if (kvp.length > 0 && kvp[0] != "LANG")
                qs += "&" + kvp[0] + "=" + kvp[1];
        }
    }
    document.location = "?LANG=" + lang + qs;
}

function showLanguages(langlink) {
    $("#langlink").css("display", "none");
    $(".altLang").fadeIn();
}

function LoadLogin() {
    if ($.cookie("SIMwebLogin") != null && $.cookie("SIMwebLogin") != "") {
        $("#tbLogin").val($.cookie("SIMwebLogin"));
        $("#chkRemember").attr("checked", true);
        $("#tbPwd").focus();
    }
}

function checkSaveLogin() {
    if (tab == "Login") {
        if ($("#chkRemember:checked").val() !== undefined) {
            // save login in cookie
            $.cookie("SIMwebLogin", $("#tbLogin").val(),
            {
                expires: 365
            });
        }
        else {
            // delete cookie
            $.cookie("SIMwebLogin", null);
        }
    }
}

function RememberFocus(field) {
    focusField = field;
}

function RestoreFocus() {
    if (focusField != null)
        focusField.focus();
}

function capsDetect(e) {
    var dlg = $("#dlgCapsLock");
    if (!e) {
        e = window.event;
    }
    if (!e) {
        return;
    }
    var theKey = 0;
    if (e.which) {
        theKey = e.which;
    }
    else if (e.keyCode) {
        theKey = e.keyCode;
    }
    var theShift = false;
    if (e.shiftKey) {
        theShift = e.shiftKey;
    }
    else if (e.modifiers) {
        if (e.modifiers & 4) {
            theShift = true;
        }
    }
    if ((theKey > 64 && theKey < 91 && !theShift) || (theKey > 96 && theKey < 123 && theShift)) {
        var pos = $("#tbPwd").offset();
        dlg.css("left", (pos["left"]) + "px");
        dlg.css("top", (pos["top"] + 32) + "px");
        dlg.fadeIn();
        return true;
    }
    else {
        dlg.fadeOut();
        return false;
    }
}

function LaunchApp(Obj, appName, defId) {
    try {
        Obj.Launch(appName, defId);
    }
    catch (e) {
        alert(LAUNCH_APP_ERROR.replace("-ERR_NAME-", e.name).replace("-ERR_MSG-", e.message));
    }
}

if (!Array.indexOf) {
    Array.prototype.indexOf = function (obj) {
        for (var i = 0; i < this.length; i++)
            if (this[i] == obj)
                return i;
        return -1;
    };
}

function cmp_showpropdlg(url, id, action, dlgwidth) {
    //$("#dialog #innerframe").load(AjaxUrl+"&ACTION=PROP&AJAX_CP="+id);
    propWidget = id;
    $("#dialog #innerframe").load(url, function () {
        $("#dialog").dialog({
            modal: true,
            width: dlgwidth,
            buttons:
            {
                "Ok": function () {
                    // save data
                    $.ajax({
                        url: AjaxUrl + "&ACTION=" + action + "&AJAX_CP=" + id,
                        method: 'POST',
                        data: $("#dialog form").serialize(),
                        success: function (data) {
                            $('#' + id).html(data);
                            // put new data in grid
                        },
                        error: function (data) {
                            setFlashMessage("<strong>" + ERROR + "</strong><br />" + data.responseText, 1);
                        }
                    });
                    $(this).dialog("close");
                    $("#dialog #innerframe").html("");
                },
                "Cancel": function () {
                    $(this).dialog("close");
                    $("#dialog #innerframe").html("");
                }
            }
        });
    });
}

function setPage(button, grid, page) {
    url = AjaxUrl + "&AJAX_CP=" + grid + "&ACTION=SETPAGE&PAGE=" + page;
    $('#' + grid).load(url, function () {
        agent = jQuery.browser;
    });
}

function hideFlashMessage() {
    $("#msgContainer2 #flashmessage").fadeOut("slow");
}

function setFlashMessage(message, msgType) {
    // type=0: info
    // type=1: error
    var cssClass = (msgType == 0 ? "ui-state-highlight" : "ui-state-error");
    $("#msgContainer2").html("<div id='flashmessage' class='" + cssClass + " ui-corner-all'><p><span style=\"float: left; margin-right: 0.3em; margin-bottom: 1.5em;\" class=\"ui-icon ui-icon-info\"></span></span>" + message + "</p></div>");
    $("#msgContainer2 #flashmessage").fadeIn("slow");
}

function init() {
    strMessage = "";
    bMessageIsError = false;

    if (isiPad()) {
        RenderForIpad();
    }
    else {
        RemoveIpadCss();
    }
    if (inAppMode) {
        RenderForApp();
    }

    if ($("#msgContainer2 #flashmessage").html != "") {
        $("#msgContainer2 #flashmessage").fadeIn("slow");
        $("#msgContainer2 #flashmessage").click(function () {
            $("div.details").slideToggle("slow");
        });
    }
    initLegends();
    initInDialogs();
    initSearch();
    if (inCRMMode) {
        initCRMGrid();
        TransformNavigation("100%");
    }

    $(window).resize(function () {
        positionSearchResultbox();
    });
}

(function ($) {

    $.fn.extend({
        outerHTML: function (value) {

            // Replaces the content
            if (typeof value === "string") {
                var $this = $(this),
					$parent = $this.parent();

                var replaceElements = function () {

                    // For some reason sometimes images are not replaced properly so we get rid of them first
                    var $img = $this.find("img");
                    if ($img.length > 0) {
                        $img.remove();
                    }

                    var element;
                    $(value).map(function () {
                        element = $(this);
                        $this.replaceWith(element);
                    })

                    return element;

                }

                return replaceElements();

                // Returns the value
            } else {
                return $("<div />").append($(this).clone()).html();
            }

        }
    });

})(jQuery);


function initToolTips() {
    $("img.tip[title]").each(function () {
        var $img = $(this);
        $img.qtip({
            show:
            {
                solo: true,
                effect: 'fade',
                when: 'mouseover',
                delay: 1000
            },
            hide: 'mouseout',
            position:
            {
                corner:
                {
                    target: 'bottomLeft',
                    tooltip: 'topLeft'
                }
            },
            style:
            {
                name: 'green',
                tip: 'topLeft',
                width: 300
                /*,
                background: '#fff'*/

            }
        });
    });

    $("area.tooltip[CID][AID]").each(function () {
        var $row = $(this);
        $row.qtip({
            show:
            {
                solo: true,
                when: 'mouseover'
                /*,
                delay: 1000*/

            },
            hide: 'mouseout',
            position:
            {
                corner:
                {
                    target: 'bottomMiddle',
                    tooltip: 'topMiddle'
                }
            },
            style:
            {
                name: 'green',
                tip: 'topMiddle',
                width: 490,
                background: '#fff'
            },
            content:
            {
                url: 'flow_object_info.aspx',
                data:
                {
                    CID: $row.attr("CID"),
                    AID: $row.attr("AID")
                },
                method: 'get'
            }
        });
    });

    $("area.pftooltip[PFID][PID][TTURL]").each(function () {
        var $row = $(this);
        $row.qtip({
            show:
            {
                solo: true,
                when: 'mouseover'
                /*,
                delay: 1000*/

            },
            hide: 'mouseout',
            position:
            {
                corner:
                {
                    target: 'bottomMiddle',
                    tooltip: 'topMiddle'
                }
            },
            style:
            {
                name: 'green',
                tip: 'topMiddle',
                width: 480,
                background: '#fff'
            },
            content:
            {
                url: $row.attr("TTURL"),
                data:
                {
                    PFID: $row.attr("PFID"),
                    PID: $row.attr("PID")
                },
                method: 'get'
            }
        });
    });
}

function initControlToolbar(id) {
    $("#" + id + " .gvBtnExportXls").button("destroy").button({
        text: true,
        icons:
        {
            primary: "gvBtnExportXls"
        }
    });
    $("#" + id + " .gvBtnExportPdf").button("destroy").button({
        text: false,
        icons:
        {
            primary: "gvBtnExportPdf"
        }
    });
    $("#" + id + " .gvBtnExportPng").button("destroy").button({
        text: false,
        icons:
        {
            primary: "gvBtnExportPng"
        }
    });
    if (inCRMMode && $("#" + id).closest(".popup").length <= 0) resizeIframe();
}

function initGrid(gridid) {
    // In initGrid, want hover kan niet gebind worden via .live()
    $("tr[itemid]").hover(function () {
        $(this).parent("tbody").children("tr[itemid=" + $(this).attr("itemid") + "]").addClass("hovering");
    }, function () {
        $(this).parent("tbody").children("tr[itemid=" + $(this).attr("itemid") + "]").removeClass("hovering");
    });

    $("td[row][col]").hover(function () {
        $(this).parent("tr").parent("tbody").children("tr").children("td[row=" + $(this).attr("row") + "]:first-child").addClass("hovering");
        $(this).parent("tr").parent("tbody").children("tr").children("td[row=" + $(this).attr("row") + "]:last-child").addClass("hovering");
        $(this).parent("tr").parent("tbody").children("tr:first-child").children("td[col=" + $(this).attr("col") + "]").addClass("hovering");
    }, function () {
        $(this).parent("tr").parent("tbody").children("tr").children("td[row=" + $(this).attr("row") + "]:first-child").removeClass("hovering");
        $(this).parent("tr").parent("tbody").children("tr").children("td[row=" + $(this).attr("row") + "]:last-child").removeClass("hovering");
        $(this).parent("tr").parent("tbody").children("tr:first-child").children("td[col=" + $(this).attr("col") + "]").removeClass("hovering");
    });

    /*werkt niet via selector wanneer data van item-attribuut af moet komen //    $("tr[itemid]").qtip({   */
    $("tr[itemid][tooltip=flowImg]").each(function () {
        var $row = $(this);
        $row.qtip({
            show:
            {
                solo: true,
                when: 'mouseover',
                delay: 1000
            },
            hide: 'mouseout',
            position:
            {
                corner:
                {
                    target: 'bottomLeft',
                    tooltip: 'topLeft'
                }
            },
            style:
            {
                name: 'green',
                tip: 'topMiddle',
                width: 423,
                background: '#fff'
            },
            content:
            {
                url: 'flow_image.aspx',
                data:
                {
                    ID: $row.attr("itemid"),
                    WIDTH: "400"
                },
                method: 'get'
            }
        });
    });

    $('.component .toolbar .selColumns').die();
    $('.component .toolbar .selColumns').live("click", function (obj) {
        var pos = $(this).offset();
        component = $(this).parents(".component").get(0);
        showGridColumns($(this), component.id);
    });
    // functions for dynamic hierarchical grid
    $("table.dyngrid td.toggle").die();
    $("table.dyngrid td.toggle").live("click", function () {
        var row = $(this).closest("tr[id]");
        var rowid = $(row).attr("id");
        if ($(row).attr("showing") == "false")
            showRows($(row), rowid, this);
        else
            hideRows($(row), rowid, this);
    });
    $("table.dyngrid td.toggle[cid][aid][lid][pid]").die();
    $("table.dyngrid td.toggle[cid][aid][lid][pid]").live("click", function () {
        var row = $(this).closest("tr[id]");
        var rowid = $(row).attr("id");
        if ($(row).attr("DataLoaded") != "true")
            LoadGridArticles($(this), $(row), $(this).attr("lid"), $(this).attr("cid"), $(this).attr("aid"), $(this).attr("pid"));
    });

    // initially minimize the grid
    $("table.dyngrid tr").each(function () {
        // minimaliseer alle toggle-rijen, behalve die die getoggled worden door een cel in de eerste kolom
        $(this).children(" td.toggle:not(:first)").each(function () {
            var row = $(this).closest("tr[id]");
            if ($(row).attr("showing") == "true" || $(row).attr("showing") == "" || $(row).attr("showing") == undefined)
                hideRows($(row), $(row).attr("id"), $(this));
        });
    });

    // using live; if a column is added at run-time, the handler will automatically work;
    $("img.deleteColGroup").die();
    $("img.deleteColGroup").live("click", function () {
        var $tab = $(this).closest("div.ui-tabs-panel[id]").attr("id");
        if (!$tab)
            $tab = $(this).closest("div.component[id]").attr("id");
        deleteDynGridColumn($tab, $(this).closest("div.component[id]").attr("id"), $(this).attr("CID"), $(this).attr("AID"));

        var $gridid = $(this).closest("div.ui-tabs-panel").attr("id");
        $("#" + $gridid).find("[group=" + $(this).closest("th").attr("group") + "]").remove();

        if ($("#" + $gridid).find("img.deleteColGroup").length <= 1)// only 1 column left; remove delete-button
            $("#" + $gridid).find("img.deleteColGroup").remove();

        return false;
    });
    $(".component .grid .chkCompare").unbind("click");
    $(".component .grid .chkCompare").click(function (e) {
        var dlg = $("#dlgSelectedElements");
        var pos = $(this).offset();

        if ($(e.target).attr('checked')) {
            component = $(this).parents(".component").get(0);
            grid = $("#" + component.id).children(".grid");
            var output = "";

            output = $("#divElementsList").html();
            output += "<span id='_sp" + $(e.target).attr('value') + "' objID='" + $(e.target).attr('value') + "'><img src=" + resolveClientUrl('~/img/images/delete.gif') + " width='16' height='16' alt='-' border='0' align='absmiddle' onclick='removeCompareItem(\"" + $(e.target).attr('value') + "\", event)' />&nbsp;" + $(e.target).attr('caption') + " <small>[" + $(e.target).attr('value') + "]</small><br /></span>";
            $("#divElementsList").html(output);

            e.stopPropagation();
        }
        else {
            // remove element from list
            $("#_sp" + $(e.target).attr('value')).remove();
            e.stopPropagation();
        }
        dlg.css("left", (pos["left"] + 24) + "px");
        dlg.css("top", (pos["top"] - 13) + "px");
        dlg.css("display", "block");
        e.stopPropagation();
    });

    $(".grid[baseurl='']").removeAttr("baseurl");
    $(".grid tbody tr").die();
    $(".grid tbody tr").live("click", function (obj) {
        var $baseUrl = $(this).closest("table").attr("baseurl");
        if ($baseUrl != "" && $baseUrl != undefined) {
            document.location = $baseUrl + "?ID=" + $(this).attr("itemid");
        }
    });

    $(".grid img.crDelete").unbind("click");
    $(".grid img.crDelete").click(function (e) {

        var uID = $(this).attr("uID");
        var cid = $(this).attr("cid");

        var html = Translate("~CUSTOM_REPORT_DELETE~", "", $(this).parent().parent().get(0).children[1].innerHTML);
        $("#dialog #innerframe").html("<img src='" + resolveClientUrl('~/img/images/warning.gif') + "' width='16' height='16' alt='-' border='0' align='absmiddle' /> " + html);

        $("#dialog").dialog({
            modal: true,
            resizable: false,
            width: 400,
            buttons:
            {
                "Yes": function () {
                    removeReport(uID, cid);
                    $(this).dialog("close");
                },
                "No": function () {
                    $(this).dialog("close");
                }
            },
            "Cancel": function () {

                $(this).dialog("close");
            }
        });
        e.stopPropagation();
        setTimeout(function () {
            if ($("#dialog #innerframe").html().indexOf("checkSaveLogin") != -1)
                window.location = 'login.aspx';
        }, 2000);

        //        if(confirm(DELETE_CR_CONFIRM))
        //            removeReport($(this).attr("uID"), $(this).attr("cid"));
        //        e.stopPropagation();
    });

    initDeliveryOverlay();
    /*
    //pager for grid
    $("ul.pager li a.gridpager[parentid][pageid]").die();
    $("ul.pager li a.gridpager[parentid][pageid]").live("click", function (e) {
    url = AjaxUrl + "&AJAX_CP=" + $(this).attr("parentid") + "&ACTION=SETPAGE&PAGE=" + $(this).attr("pageid");
    console.log("pager url " + url + " for [" + $('#' + $(this).attr("parentid")).length + "]");
    var target = $('#' + $(this).attr("parentid"));
    if (target.length <= 0)
    console.log("ERROR: target [" + '#' + $(this).attr("parentid") + "] not found");
    else
    target.load(url, function (response, status, xhr) {
    if (status == "error") {
    var msg = "Sorry but there was an error: \n\n";
    alert(msg + xhr.status + " " + xhr.statusText);
    }
    });
    //target.load(url, function () { console.log("done"); });
    });
    */

    // Resize iFrame if in CRM-mode
    if (inCRMMode) {
        resizeIframe();
    }
}

function removeCompareItem(id, e) {
    var dlg = $("#dlgSelectedElements");
    $("#_sp" + id).remove();
    $(".chkCompare[value=" + id + "]").removeAttr("checked");
    e.stopPropagation();
}

function deleteDynGridColumn(id, ajaxcp, cid, aid) {
    $.ajax({
        url: AjaxUrl + "&ACTION=DELETE_ELEMENT&AJAX_CP=" + ajaxcp + "&CID=" + cid + "&AID=" + aid,
        method: 'POST',
        success: function (data) {
            $('#' + id).html(data);
            // put new data in grid
            //initGrid();
        },
        error: function (data) {
            setFlashMessage("<strong>" + ERROR + "</strong><br />" + data.responseText, 1);
        }
    });
}

function CompareObjects() {
    var IDs = "0";
    $.each($("[objID]"), function (k, v) {
        IDs += "," + $(this).attr("objID");
    });
    window.location = "flow_compare_objects.aspx?ID=" + IDs;
}

function initSearch() {
    // Search-functionality
    $("#spClearSearch").click(function () {
        $("#txtSearch").val("");
        $("#divSearchResults").html("");
        $("#spClearSearch").css("display", "none");
        $('#dlgSearchResults').css("display", "none");
        $("#txtSearch").focus();
    });
    $("#txtSearch").searchbox({
        url: 'search.aspx',
        param: 'q',
        dom_id: '#divSearchResults',
        loading_css: '#spSearchSpinner',
        clear_css: '#spClearSearch',
        delay: 250,
        searchField: $("#txtSearch"),
        minLength: 3,
        maxResults: 30
    });
    $(document).bind('after.searchbox', function () {
        positionSearchResultbox();
        if ($("#divSearchResults").html() != "")
            $('#dlgSearchResults').css("display", "block");
    });
    var sPath = window.location.pathname;
    var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
    if (sPage == "flows.aspx" || sPage == "lists.aspx" || sPage == "interfaces.aspx" || sPage == "pageflows.aspx" || sPage == "exports.aspx" || sPage == "list_segmentation.aspx" || sPage == "custom_reports.aspx")
        enableSearch(sPage);
    else
        disableSearch();
}

function initInDialogs() {
    // set close-actions on dialogs
    $('.img_close').each(function (obj) {
        var dlg = $(this).parents(".dlg").get(0);
        $(this).click(function () {
            dlg.style.display = "none";
        });
    });
    // always hide the tip-dialogs when the page is clicked
    $("body").click(function (event) {
        // speciale constructie om propagatie van live-event te kunnen stoppen
        if ($(event.target).parents(".dlg").length <= 0 && event.target.className != "dlg" && event.target.className.indexOf("gvBtnSelColumns") <= 0) {
            if (event.target.className != "selColumns") {
                $("#dlgSelectColumns").fadeOut();
            }
            if (event.target.className != "chkCompare") {
                $("#dlgSelectedElements").fadeOut();
            }
        }
    });
}

//var frmAccountOK = false;

function openAccountDetails() {
    $("#dialog #innerframe").load("account_details.aspx");
    $("#dialog").dialog({
        modal: true,
        resizable: false,
        width: 400,
        buttons:
        {
            "Ok": function () {
                var params = {};
                $("#frmAccount").find("input, option").filter(":enabled").each(function () {
                    params[this.name || this.id || this.parentNode.name || this.parentNode.id] = this.value;
                });
                $.post($("#frmAccount").attr("action").replace("?call=ajax", "") + "?call=ajax", params, function (data) {
                    $("#dialog #innerframe").html(data);
                    if (data.indexOf("<div class='error'>") > -1) {
                        // update failed
                        setFlashMessage("<strong>" + ERROR + "</strong><br />Update failed", 1);
                    }
                    else {
                        // else, it succeeded
                        setFlashMessage(ACCOUNT_UPDATE_USER_OK, 0);
                        // automatically hide message after 3 seconds
                        setTimeout("hideFlashMessage()", 3000);
                        $("#dialog").dialog("close");
                    }
                });
            },
            "Cancel": function () {
                $(this).dialog("close");
            }
        }
    });

    setTimeout(function () {
        if ($("#dialog #innerframe").html().indexOf("checkSaveLogin") != -1)
            window.location = 'login.aspx';
    }, 2000);
}

function initDeliveryOverlay(id) {
    var sel;
    if (id)
        sel = "#" + id + " span[rel][href]";
    else
        sel = "span[rel][href]";

    $(sel).overlay({
        mask: '#000',
        oneInstance: false,
        onBeforeLoad: function () {
            var wrap = this.getOverlay().find(".contentWrap");
            wrap.load(this.getTrigger().attr("href"));
        },
        onClose: function () {
            AjaxUrlPopup = "";
        },
        onLoad: function () {
            if ($.client.os == "Windows") {
                var close = this.getOverlay().find(".close");
                close.removeClass("close").addClass("close-right");
            }
        }
    });
}

function initThumbOverlay(id) {
    // script voor thumbs wordt na laden van thumb gezet
    // known issue: op IE8 wordt de overlay niet horizontaal gecentreerd
    $("#imgThumb_" + id).overlay({
        mask: '#000',
        fixed: false,
        oneInstance: false,
        onBeforeLoad: function () {
            this.getOverlay().appendTo('body');
        },
        onLoad: function () {
            if ($.client.os == "Windows") {
                var close = this.getOverlay().find(".close");
                close.removeClass("close").addClass("close-right");
            }
        }
    });
}

function initTree(id) {
    $('#' + id).dynatree({
        fx:
        {
            height: "toggle",
            duration: 200
        },
        autoFocus: true,
        initAjax:
        {
            url: AjaxUrl + "&AJAX_CP=" + $("#" + id).attr("ajaxid") + "&ACTION=LOADNODE",
            data:
            {
                mode: "funnyMode"
            }
        },
        onActivate: function (node) {
            // send signal to grid to load appropriate data
            if ($("#" + id).attr("siblingid")) {
                url = AjaxUrl + "&AJAX_CP=" + $("#" + id).attr("siblingid") + "&ACTION=MAILTREE&KEY=" + node.data.key;
                $('#' + $("#" + id).attr("siblingid")).load(url, function () {
                    //initGrid();
                });

            }
        },

        onLazyRead: function (node) {
            node.appendAjax({
                url: AjaxUrl + "&AJAX_CP=" + $("#" + id).attr("ajaxid") + "&ACTION=LOADNODE",
                data:
                {
                    key: node.data.key,
                    mode: "funnyMode"
                }
            });
        }
    });
}
;

function initHeatmapTips() {
    $("#probemap area.tooltip[title]").each(function () {
        var $area = $(this);
        $area.qtip({
            show:
            {
                solo: true,
                effect: 'fade',
                when: 'mouseover'
            },
            hide: 'mouseout',
            position:
            {
                corner:
                {
                    target: 'bottomLeft',
                    tooltip: 'topLeft'
                },
                adjust:
                {
                    x: 20,
                    y: 10
                }
            },
            style:
            {
                name: 'green',
                tip: 'topLeft',
                width: 250
            }
        });
    });
}

function selectTreeNode(treeid, gridid, expand) {
    var tree = $("#tree" + treeid).dynatree("getTree");
    tree.activateKey(tree.getRoot().getChildren()[0].data.key);
    tree.onLazyRead;
    //tree.activateKey($("#tree" + treeid).dynatree("getRoot").data.key);
    var node = tree.getActiveNode();
    if (node != null && expand) {
        node.toggleExpand();
    }
}
;

function initTabs() {
    $(".uiTabs").tabs({
        ajaxOptions:
        {
            error: function (xhr, status, index, anchor) {
                $(anchor.hash).html("An error occured during the load of the tab-content.");
            }
        }
    });
}

function initLegends() {
    myColors = Highcharts21.getOptions().colors;
    if ($("#cssLegend").length > 0)
        return;
    var cssLegend = "";
    var cssMailAB = "";
    for (var i = 0; i < myColors.length; i++) {
        cssLegend += ".color" + i + " {background-color:" + myColors[i] + "} ";
        cssMailAB += ".AB_Mail" + i + " {color:" + myColors[i] + "} ";
    }
    cssLegend += ".ulLifeCycleIndicators li span.amount span.invitors {background-color:" + myColors[0] + "} ";
    cssLegend += ".ulLifeCycleIndicators li span.amount span.invitations {background-color:" + myColors[1] + "} ";
    cssLegend += ".ulLifeCycleIndicators li span.amount span.friendsperinvitation {background-color:" + myColors[2] + "} ";
    $("head").append("<style type=\"text/css\" id=\"cssLegend\">" + cssLegend + cssMailAB + "</style>");
}

function positionSearchResultbox() {
    var pos = $("#txtSearch").offset();
    var dlg = $('#dlgSearchResults');
    if (pos != null && dlg != null) {
        dlg.css("left", (pos["left"] - 220) + "px");
        dlg.css("top", (pos["top"] + 23) + "px");
    }
}

function sortCol(grid, col) {
    url = AjaxUrl + "&AJAX_CP=" + grid + "&ACTION=SORT&COL=" + col;
    $('#' + grid).load(url, function () {
        //initGrid();
    });
}

/* Selection of columns in grids */

function setColumns(id) {
    $.ajax({
        url: AjaxUrl + "&ACTION=SETCOLUMNS&AJAX_CP=" + id,
        method: 'POST',
        data: $("#dlgSelectColumns form").serialize(),
        success: function (data) {
            $('#' + id).html(data);
            // put new data in grid
            $("#dlgSelectColumns").css("display", "none");
            //initGrid();
        },
        error: function (data) {
            $("#dlgSelectColumns").css("display", "none");
            //alert(data.responseText);
            setFlashMessage("<strong>" + ERROR + "</strong><br />" + data.responseText, 1);
            //initGrid();
        }
    });
}

function showGridColumns(button, componentid) {
    var pos = $(button).offset();
    var grid = $("#tbl" + componentid);
    var output = "";
    var visibleColumns = grid.attr("visibleColumns").split(',');
    var availableColumns = grid.attr("availableColumns").split(',');
    for (var i = 0, len = availableColumns.length; i < len; ++i) {
        var kvPairs = availableColumns[i].split(':');
        output += "<label><input type='checkbox' name='COLUMN' value='" + kvPairs[0] + "'";
        if (jQuery.inArray(kvPairs[0], visibleColumns) > -1)
            output += " checked='checked'";
        output += " />" + (kvPairs[1] != undefined ? kvPairs[1] : kvPairs[0]) + "</label>";
    }
    var dlg = $("#dlgSelectColumns");
    $("#divColumsList").html(output);
    dlg.css("left", (pos["left"] - 190) + "px");
    dlg.css("top", (pos["top"] + 24) + "px");
    dlg.css("display", "block");
    $(".btn_saveColumns").unbind("click");
    $(".btn_saveColumns").bind('click', function () {
        setColumns(componentid);
    });
}

function triggerAction(id, action) {
    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=" + action;
    if (inCRMMode)
        $('#' + id).load(url, function () { resizeIframe() });
    else
        $('#' + id).load(url);

    switch (action) {
        case "EDITDOC":
            initEditDoc();
            // initialise dragdrop-functionality
            break;
    }
}

function triggerActionAnchor(id, action, anchor) {
    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=" + action;
    $('#' + id).load(url, function () {
        document.location = '#' + anchor;
    });
}

function applyDocProp(id) {
    $.ajax({
        url: AjaxUrl + "&PAGEACTION=1&ACTION=APPLY&AJAX_CP=" + id,
        method: 'POST',
        data: $("#" + id + " *").serialize(),
        success: function (data) {
            $('#' + id).html(data);
            // put new data in grid
            //initGrid();
        },
        error: function (data) {
            //alert(data.responseText);
            setFlashMessage("<strong>" + ERROR + "</strong><br />" + data.responseText, 1);
        }
    });
}

/* start dyngrid functions */
var masterRowID;

function showRows(row, parentid, cell) {
    $("[parent=" + parentid + "]").css("display", "");
    $(cell).removeClass("tree_closed");
    row.attr("showing", "true");
}

function hideRows(row, parentid, cell) {
    masterRowID = row.attr("id");
    // also hide child-nodes from nested parents; if level decreases, stop iterating
    row.nextAll("tr[id]").each(function (innerRow) {
        if ($(this).attr("id") != masterRowID && $(this).attr("parent") == masterRowID) {
            hideRows($(this), $(this).attr("id"), $(this).children("td.toggle"));
            return false;
        }
    });

    $("tr[parent=" + parentid + "]").css("display", "none");
    $(cell).addClass("tree_closed");
    row.attr("showing", "false");
}

function LoadGridArticles(cell, row, LID, CID, AID, PID) {
    cell.append("&nbsp;<span id='spArticleLoader" + PID + "' class='spinner'></span>");
    // show loader image in cell

    var id = row.closest("div.component").attr("id");
    var bUnique = false;
    if (row.attr("parent") == "trUClicks")
        bUnique = true;
    url = "articleclicks.aspx?LID=" + LID + "&CID=" + CID + "&AID=" + AID + "&PID=" + PID + "&PARENT=" + row.attr("id") + "&UNIQUE=" + bUnique + "&GROUP=" + cell.attr("xgroup") + "&CAPTION=" + urlEncode(cell.text());
    $.get(url, function (data) {
        row.after(data);
        row.attr("DataLoaded", "true");
        $("#spArticleLoader" + PID).remove();
        // remove loader image after articles are loaded
        $("[parent=" + row.attr("parentid") + "]").css("display", "");
        cell.removeClass("tree_closed");
        row.attr("showing", "true");
    });
}
/* end dyngrid functions */

function urlEncode(s) {
    return encodeURIComponent(s).replace(/\%20/g, '+').replace(/!/g, '%21').replace(/'/g, '%27').replace(/\(/g, '%28').replace(/\)/g, '%29').replace(/\*/g, '%2A').replace(/\~/g, '%7E');
}

function urlDecode(s) {
    return decodeURIComponent(s.replace(/\+/g, '%20').replace(/\%21/g, '!').replace(/\%27/g, "'").replace(/\%28/g, '(').replace(/\%29/g, ')').replace(/\%2A/g, '*').replace(/\%7E/g, '~'));
}

function loadImage(imageid, compid, width, height) {
    document.getElementById(imageid).src = AjaxUrl + "&AJAX_CP=" + compid + "&ACTION=GETIMAGE&WIDTH=" + width + "&HEIGHT=" + height;
    initToolTips();
    if (inCRMMode)
        setTimout("resizeIframe()", 250);
}

function InitLookupDomain(id, startDT, endDT) {
    $("#lookupdomainsearch").searchbox({
        url: 'delivery_search.aspx',
        param: 'q',
        dom_id: '#' + id + '',
        loading_css: '#spSearchSpinner2',
        clear_css: '#spClearSearch2',
        delay: 250,
        searchField: $("#lookupdomainsearch"),
        minLength: 3,
        maxResults: 20,
        startDT: startDT,
        endDT: endDT
    });
}

function loadChart(id) {
    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=GETCHART";
    $('#' + id).load(url);
}

function triggerPageAction(id, action) {
    url = AjaxUrl + "&AJAX_CP=" + id + "&PAGEACTION=1&ACTION=" + action;
    $('#' + id).load(url);

    //initGrid();
}

function enableSearch(pageName) {
    var context = pageName.replace(".aspx", "");
    if (context == "list_segmentation")
        context = "segments";
    else if (context == "list_relations")
        context = "listlinks";
    else if (context == "flows")
        context = "campaigns";

    $("#txtSearch").attr("CONTEXT", context.toUpperCase());
    $("#spSearch").removeClass("searchDisabled");
    $("#txtSearch").css('display', '');
}

function disableSearch() {
    $("#spSearch").addClass("searchDisabled");
    $("#txtSearch").css('display', 'none');
    $("#spSearch #spClearSearch").css('display', 'none');
}

function comboBoxChange(id, action, comboBox) {
    var keyField = comboBox.options[comboBox.selectedIndex].value;

    $('#' + id).html('<div style=\"width:800px; height:200px; text-align:center; \"><img border=\"0\" src=\"' + resolveClientUrl('~/img/images/loading.gif') + '\" /></div>');

    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=" + action + "&VALUE=" + keyField;
    $('#' + id).load(url);
}

function decodeIDChange(id, action) {
    var decode = $("#hashInput").val();

    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=" + action + "&VALUE=" + decode;
    $('#' + id).load(url);
}

function ShowChartDetails(pointX, pointY, eventX, eventY, category, seriesName, id) {
    var $this = $("#divGraphDetails" + id);
    if (eventX === undefined || eventY === undefined) {
        eventX = event.screenX;
        eventY = event.screenY;
    }
    $this.css("left", eventX);
    $this.css("top", eventY);
    $this.html('<div style=\"width:400px; height:250px; text-align:center; \"><img border=\"0\" src=\"' + resolveClientUrl('~/img/images/loading.gif') + '\" /></div>');
    $this.fadeIn();

    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=CHARTDETAILS&DATE=" + Highcharts21.dateFormat('%Y%m%d%H%M%S', pointX);
    if (category != undefined)
        url += "&CATEGORY=" + encodeURIComponent(category) + "";
    if (seriesName != undefined)
        url += "&SERIESNAME=" + encodeURIComponent(seriesName) + "";

    $this.load(url);
}

function RenderForApp() {
    TransformNavigation("100%");
}

function TransformNavigation(width) {
    if ($("div.report select.leftnav").length > 0)
        return;

    $link = "", $caption = "", $group = "", $curUrl = "";

    $nav = $(".leftpane").html();
    $newnav = "";
    $("table.document").css("width", width);

    var groups = $("ul.leftnav li[group]").length;
    if (groups > 0) {
        var menuItems = $("ul.leftnav li").length;
        for (i = 0; i < menuItems; i++) {
            $group = $($("ul.leftnav li")[i]).text();
            $link = $($(($("ul.leftnav li")[i])).children()[0]).attr("href");
            $caption = $($("ul.leftnav li")[i]).text();
            $curUrl = document.location.href;

            if ($($("ul.leftnav li")[i]).attr("group") !== undefined) {
                // categorie
                $newnav += ($newnav == "" ? "" : "</optgroup>");
                $newnav += "<optgroup label='" + $group + "'>";
            }
            else {
                $newnav += "<option value='" + $link + "'";
                if ($curUrl.indexOf($link) > -1)
                    $newnav += " selected='selected'";
                $newnav += ">" + $caption;
                $newnav += "</option>";
            }
        }
        $newnav = "<select class='leftnav' onchange='document.location=this.options[this.selectedIndex].value'>" + $newnav + "</optgroup></select>";
    }
    $(".leftpane").remove();
    $("li.buttons").append($newnav != "" ? $newnav : $nav);
}

/* iPad functions */

function isiPad() {
    return (navigator.platform.indexOf("iPad") != -1);
}

function RenderForIpad() {
    TransformNavigation("975px");
}

function RemoveIpadCss() {
    var styleSheets = document.styleSheets;
    for (var i = 0; i < styleSheets.length; i++) {
        if (styleSheets[i].href != null) {
            if (styleSheets[i].href.indexOf("/iPad.css") > -1) {
                styleSheets[i].disabled = true;
                break;
            }
        }
    }
    $("#ipadCss").remove();
    // disabling needs to be done first because of a bug in IE
}

/* end iPad functions */


/* Charting functions - custom zoom-functionality */

/*SELECTIONEVENT*/
function selection(event) {
    var chart = this;
    var id = chart.container.parentNode.id;
    if (extremes[id] == null)
        extremes[id] = chart.xAxis[0].getExtremes();
    //    try {
    //        if (chart != null)
    //            if (chart.$resetButton != null)
    //                chart.$resetButton.remove();
    //    }
    //    catch (err) { }

    var correction = chart.plotWidth - 45;

    var _AjaxUrl = AjaxUrlPopup != "" ? AjaxUrlPopup : AjaxUrl;
    if (event.xAxis) {
        var xAxis = event.xAxis[0], min = xAxis.min, max = xAxis.max;

        if (max - min < chart.options.xAxis.maxZoom)//(chart.options.xAxis.maxZoom / 24 / 3600000))
        {
            //alert("te diep gezoomd\n\n" + (max - min) + " < " + chart.options.xAxis.maxZoom);
            return false;
        }

        var zoomEnabled = false;

        if ($(chart.container).closest("div.chartdiv").attr("zoomenabled") == 'true') {

            chart.showLoading();


            var _AjaxCP = AjaxUrlPopup != "" ? "" : '&AJAX_CP=' + $(chart.container).closest("div.component").attr("id");

            $.get(_AjaxUrl + _AjaxCP + '&ACTION=ZOOM',
            {
                MINDT: Highcharts21.dateFormat('%Y%m%d%H%M%S', min),
                MAXDT: Highcharts21.dateFormat('%Y%m%d%H%M%S', max)
            }, function (drillDownData) {
                onGetNewData(chart, drillDownData);
            }, 'json');

            zoomEnabled = true;
        }

        zoomCompId = $(chart.container).closest("div.chartdiv").attr("zoomcompid");
        if (zoomCompId != '' && zoomCompId != undefined) {
            var IDs = zoomCompId.split(",");
            for (i = 0; i < IDs.length; i++) {
                if (IDs[i] != '' && IDs[i] != undefined)
                    $('#' + IDs[i]).load(_AjaxUrl + '&AJAX_CP=' + IDs[i] + '&ACTION=ZOOM&MINDT=' + Highcharts21.dateFormat('%Y%m%d%H%M%S', min) + '&MAXDT=' + Highcharts21.dateFormat('%Y%m%d%H%M%S', max));
            }
        }
        if (chart.$resetButton == null) {
            chart.$resetButton = $('<div><a href="#" class="button2 small white"><span>' + Highcharts21.getOptions().lang["resetZoom"] + '</span></a></div>').css({
                position: 'absolute',
                top: '20px',
                left: correction + 'px',
                zIndex: 999
            }).click(function () {
                chart.showLoading();
                chart.xAxis[0].setExtremes(extremes[id].min, extremes[id].max);
                $(this).hide();
                chart.$resetButton.remove();
                chart.$resetButton = null;
                chart.hideLoading();
                chart.toolbar.remove('zoom');
                extremes[id] = null;
            }).appendTo(chart.container);
        }
        return !zoomEnabled;
    }
    else if ($(chart.container).closest("div.chartdiv").attr("zoomenabled") != 'true') {

        zoomCompId = $(chart.container).closest("div.chartdiv").attr("zoomcompid");
        if (zoomCompId != '' && zoomCompId != undefined) {
            var IDs = zoomCompId.split(",");
            for (i = 0; i < IDs.length; i++) {
                if (IDs[i] != '' && IDs[i] != undefined)
                    $('#' + IDs[i]).load(_AjaxUrl + '&AJAX_CP=' + IDs[i] + '&ACTION=ZOOMOUT');
            }
        }
    }
}

function onGetNewData(chart, drillDownData) {
    onResetData(chart, drillDownData);
    try {
        if (chart != null)
            if (chart.$resetButton != null)
                chart.$resetButton.remove();
    }
    catch (err) { }
    chart.$resetButton = $('<div><a href="#" class="button2 small white"><span>' + Highcharts21.getOptions().lang["resetZoom"] + '</span></a></div>').css({
        position: 'absolute',
        top: '20px',
        right: '50px',
        zIndex: 999
    }).click(function () {
        chart.showLoading();
        resetSelection(chart);

    }).appendTo(chart.container);
}

function onResetData(chart, drillDownData) {
    for (i = 0; i < drillDownData.length; i++)
        chart.series[i].setData(drillDownData[i]);
    chart.hideLoading();
}

function resetSelection(chart) {
    var _AjaxUrl = AjaxUrlPopup != "" ? AjaxUrlPopup : AjaxUrl;
    if ($(chart.container).closest("div.chartdiv").attr("zoomenabled") == 'true') {

        var _AjaxCP = AjaxUrlPopup != "" ? "" : '&AJAX_CP=' + $(chart.container).closest("div.component").attr("id");

        $.get(_AjaxUrl + _AjaxCP + '&ACTION=ZOOMOUT', {}, function (drillDownData) {
            onResetData(chart, drillDownData);
        }, 'json');

        chart.$resetButton.remove();
    }

    zoomCompId = $(chart.container).closest("div.chartdiv").attr("zoomcompid");
    if (zoomCompId != '' && zoomCompId != undefined) {
        var IDs = zoomCompId.split(",");
        for (i = 0; i < IDs.length; i++) {
            if (IDs[i] != '' && IDs[i] != undefined)
                $('#' + IDs[i]).load(_AjaxUrl + '&AJAX_CP=' + IDs[i] + '&ACTION=ZOOMOUT');
        }
    }
}

function refreshSystemUsageChart(id) {
    var $year = $("#selYear").val();
    var $month = $("#selMonth").val();

    if ($year == "ALL") {
        $("#selMonth").val("ALL");
        $month = "ALL";
    }
    if ($month == "ALL") {
        if ($year == "ALL")
            url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=ALL&YSEL=" + $year + "&MSEL=" + $month;
        else
            url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=RANGE&YSEL=" + $year + "&MSEL=" + $month + "&START=" + $year + "0101000000" + "&STOP=" + (parseInt($year, 10) + 1) + "0101000000";
    }
    else {
        if ($month == "12")
            url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=RANGE&YSEL=" + $year + "&MSEL=" + $month + "&START=" + $year + $month + "01000000" + "&STOP=" + (parseInt($year, 10) + 1) + "0101000000";
        else {
            _month = parseInt($month, 10) + 1;
            if (_month < 10)
                $month2 = "0" + _month;
            else
                $month2 = _month;
            url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=RANGE&YSEL=" + $year + "&MSEL=" + $month + "&START=" + $year + $month + "01000000" + "&STOP=" + $year + "" + $month2 + "01000000";
        }
    }

    $('#' + id).load(url);
}

/* list search */

function ClearSearchRow(button) {
    $(button).closest("tr").remove();
}

function checkSearchCriteria(field) {
    hideFlashMessage();
    switch ($(field).attr("class")) {
        case "selList":
            $selectedTable = parseInt($(field).parent().parent().find("select.selList").val(), 10);
            $fieldDD = $(field).parent().parent().find("select.selField");
            $fieldDD.find('option').remove().end().append($("<option></option>"));
            if ($selectedTable != "") {
                var i = 0;
                for (i = 0; i < $tables[$selectedTable][1]; i++)
                    $fieldDD.append($("<option></option>").attr("value", $fields[$selectedTable][i][0]).attr("type", $fields[$selectedTable][i][1].toUpperCase()).text($fields[$selectedTable][i][0]));
            }
            $fieldDD.focus();
            break;
        case "selField":
            $operatorField = $(field).parent().parent().find("select.selOperator");
            $operatorField.find('option').remove().end().append($("<option></option>"));
            $arrOperators = new Array();
            $thisOperator = $(field).children(":selected").attr("type");
            switch ($thisOperator) {
                case "INTEGER":
                case "NUMERIC":
                case "FLOAT":
                case "DECIMAL":
                    $arrOperators = ["<", "<=", "=", ">", ">=", "<>", "IsEmpty", "IsNotEmpty"];
                    break;
                case "TEXT":
                case "LONGTEXT":
                    $arrOperators = ["=", "<>", "LIKE", "NOT LIKE", "IsEmpty", "IsNotEmpty"];
                    break;
                case "DATETIME":
                case "DATE":
                    $arrOperators = ["<", "<=", "=", ">", ">=", "<>", "IsEmpty", "IsNotEmpty"];
                    break;
            }

            $.each($arrOperators, function (idx, value) {
                $operatorField.append($("<option></option>").attr("value", value).text(value));
            });
            $(field).parent().parent().find("input.txtValue").removeAttr("inputtype").attr("inputtype", $thisOperator);
            setInputHelpers();
            $operatorField.focus();

            break;
        case "selOperator":
            $textField = $(field).parent().parent().find("input.txtValue");
            if ($(field).val() == "IsEmpty" || $(field).val() == "IsNotEmpty")
                $textField.val("-").attr("disabled", "disabled");
            else
                $textField.val("").removeAttr("disabled");
            $textField.val("").focus();
            break;
    }

    $row = $(field).closest("tbody").children("tr:last");
    $list = $row.find("select.selList").val();
    $field = $row.find("select.selField").val();
    $operator = $row.find("select.selOperator").val();
    $value = $row.find("input.txtValue").val();

    if ($list != "" && $field != "" && $operator && $value != "")
        $("#templateRow").clone().removeAttr("id").appendTo($("table.find tbody"));

    enableListSearch();
}

function setInputHelpers() {
    $("[inputtype]").unbind("keypress");
    $("[inputtype]").dateplustimepicker("destroy").unbind("keydown").unbind("keypress").unbind("keyup").unbind("focus").unbind("blur");
    // Only allow numeric input
    $("[inputtype=INTEGER],[inputtype=NUMERIC],[inputtype=FLOAT],[inputtype=DECIMAL]").keypress(function (event) {
        var controlKeys = [8, 9, 13, 35, 36, 37, 39];
        // Backspace, tab, enter, end, home, left, right. We don't support the del key in Opera because del == . == 46.
        var isControlKey = controlKeys.join(",").match(new RegExp(event.which));
        // Some browsers just don't raise events for control keys. Easy. e.g. Safari backspace.
        if (!event.which ||
        // Control keys in most browsers. e.g. Firefox tab is 0
         (49 <= event.which && event.which <= 57) ||
        // Always 1 through 9
         (48 == event.which && $(this).attr("value")) ||
        // No 0 first digit
            isControlKey) {
            // Opera assigns values for control keys.
            return;
        }
        else {
            event.preventDefault();
        }
    });
    $("[inputtype=DATETIME]").dateplustimepicker({
        hourGrid: 4,
        minuteGrid: 10,
        secondGrid: 10,
        dateFormat: "yy-mm-dd",
        timeFormat: "hh:mm:ss"
    });
    $("[inputtype=DATE]").dateplustimepicker({
        hourGrid: 4,
        minuteGrid: 10,
        secondGrid: 10,
        dateFormat: "yy-mm-dd"
    });
    $("[inputtype=TIME]").dateplustimepicker({
        hourGrid: 4,
        minuteGrid: 10,
        secondGrid: 10,
        timeFormat: "hh:mm:ss"
    });
}

function enableListSearch() {
    var button = $("#btnSearch");
    button.removeAttr("disabled");
    button.text(BTN_SEARCH);
}

function initSearchDropdowns() {
    // vul eerste dropdowns
    $("table.find tbody tr td .selList").each(function () {
        $tableDD = $(this);
        $tableDD.find('option').remove().end();
        // 1 lege waarde toevoegen
        $tableDD.append($("<option></option>"));
        // andere opties toevoegen
        for (i = 0; i < $tables.length; i++)
            if ($tables[i] != undefined)
                $tableDD.append($("<option></option>").attr("value", i).text($tables[i][0]));
    });
}

function ExecuteSearch(button, id) {
    $(button).attr("disabled", "disabled");
    $(button).text(BTN_SEARCHING);
    $s_output = "";
    $s_lists = "";
    $s_fields = "";
    $s_operators = "";
    $s_values = "";
    // TODO: urlEncode variables?
    $("table.find tbody tr").not(":first").each(function () {
        $listNew = $(this).find("select.selList").val();
        $fieldNew = $(this).find("select.selField").val();
        $operatorNew = $(this).find("select.selOperator").val();
        $valueNew = $(this).find("input.txtValue").val().trim();

        if ($listNew != "" && $fieldNew != "" && $operatorNew) {
            // && $valueNew != "") {
            $s_lists += $listNew + ",";
            $s_fields += $fieldNew + ",";
            $s_operators += $operatorNew + ",";
            $s_values += escape($valueNew) + ",";
            //.replace(/ /g, "+") + ",";
        }
    });
    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=QUERY&LISTS=" + $s_lists + "&FIELDS=" + $s_fields + "&OPS=" + $s_operators + "&VALUES=" + $s_values;
    $('#' + id).load(url);
}

function showPreviousRecord() {
    selectComboResult("-1");
}

function showNextRecord() {
    selectComboResult("+1");
}

function showRecord() {
    selectComboResult("");
}

function selectComboResult(idx) {
    var $combo = $("#lstFoundSearchResults");
    if ($combo.length <= 0)
        return;

    var id = $combo.closest(".component").attr("id");
    var $selidx = $combo.get(0).selectedIndex;

    var $itmcnt = $("#lstFoundSearchResults option").length;

    switch (idx) {
        case "-1":
            if ($selidx > 0) {
                ShowLoader(id);
                $("#lstFoundSearchResults").get(0).selectedIndex = ($selidx - 1);
                window.location = "?RECORDID=" + $combo.val();
            }
            break;
        case "+1":
            if ($selidx < $itmcnt) {
                ShowLoader(id);
                $("#lstFoundSearchResults").get(0).selectedIndex = ($selidx + 1);
                window.location = "?RECORDID=" + $combo.val();
            }
            break;
        default:
            ShowLoader(id);
            window.location = "?RECORDID=" + $combo.val();
            break;
    }
}

function ShowLoader(id) {
    $('#' + id + ' .uiTabs').html("<div style='text-align:center'><img src='" + resolveClientUrl('~/img/images/loading.gif') + "' width='32' height='32' border='0' alt='Loading...'></div>");
    return true;
}

/* Object selector */
var osObjCount = 0;

function initOSTree(id, items) {
    _initOSTree(id);
    var newObjects = "";
    var cssClass = GetOsClass(OsScope);
    for (var i = 0; i < items.length; i++) {
        newObjects += getOsObjectNode(cssClass, items[i][0], items[i][1]);
        osObjCount++;
    }
    $("#osElements").html($("#osElements").html() + newObjects);
    CheckOsSelection();
}

function _initOSTree(id) {
    osObjCount = 0;
    $("#txtOsScope").val(OsScope);
    $(".OSdropzone").droppable({
        addClasses: true,
        drop: function (event, ui) {
            var source = ui.helper.data("dtSourceNode") || ui.draggable;
            // ui.helper[0];    // from tree or from searchresults
            var classToMatch = GetOsClass(OsScope);
            var newObjects = "";
            if (!ui.helper.data("dtSourceNode")) {
                // dragged from search-results
                if (!ContainsOsSelection($(source).attr("itemid"))) {
                    newObjects = getOsObjectNode(classToMatch, $(source).attr("itemid"), $(source).children("td:last").text());
                }
            }
            else
                newObjects = AddOsObjects(source, classToMatch);

            $(this).html($(this).html() + newObjects);
            CheckOsSelection();
        }
    });

    $("div.osObject span.deleteOsObject").live("click", function () {
        $(this).closest("div").remove();
        osObjCount--;
        CheckOsSelection();
    });

    $('#' + id).dynatree({
        fx:
        {
            height: "toggle",
            duration: 200
        },
        autoFocus: true,
        initAjax:
        {
            url: currUrl + "?AJAX=TRUE&ACTION=LOADNODE",
            data:
            {
                mode: "funnyMode"
            }
        },
        dnd:
        {
            onDragStart: function (node) {
                //if (node.data.isFolder) return false;   // do not allow to drop folders
                if (node) {
                    $(this).css("z-index", 1005);
                    return true;
                }
            },
            onDragStop: function (node) {
                logMsg("tree.onDragStop(%o)", node);
            }
        },

        onLazyRead: function (node) {
            node.appendAjax({
                url: currUrl + "?AJAX=TRUE&ACTION=LOADNODE",
                data:
                {
                    "key": node.data.key,
                    mode: "funnyMode",
                    "class": node.data.addClass
                }
            });
        }
    });
}

function GetOsClass(OsScope) {
    var classToMatch = "";
    switch (OsScope) {
        case "Unknown":
        case "DashBoard":
            return;
            break;
        case "SingleFlow":
        case "MultiFlow":
            classToMatch = "flow";
            break;
        case "SingleMail":
        case "MultiMail":
            classToMatch = "mail";
            break;
        case "SinglePage":
        case "MultiPage":
            classToMatch = "page";
            break;
        case "SingleList":
            classToMatch = "list";
            break;
        case "SinglePageFlow":
            classToMatch = "pageflow";
            break;
    }
    return classToMatch;
}

function getOsObjectNode(cssClass, key, value) {
    var osObjItem = "<div class='osObject' key='~KEY~'><span class='icon ~TYPE~'></span><span class='text' title='~TOOLTIP~'>~NAME~</span><span class='deleteOsObject'></span></div>";
    return osObjItem.replace("~TYPE~", cssClass).replace("~KEY~", key).replace("~NAME~", value).replace("~TOOLTIP~", value);
}

function AddOsObjects(node, classToMatch) {
    if (osObjCount > 40)// max 40 items to be selected
        return;

    var items = "";
    var hasChildren = node.childList != null;

    if (hasChildren) {
        var i = 0;
        // needed to avoid scoping issue!
        for (i = 0; i < node.childList.length; i++)
            items += AddOsObjects(node.childList[i], classToMatch);
    }
    else {
        if (node.data.addClass != null && node.data.addClass.indexOf(classToMatch) > -1) {
            if (!ContainsOsSelection(node.data.key)) {
                items += getOsObjectNode(classToMatch, node.data.key, node.data.title);
                osObjCount++;
            }
        }
    }
    return items;
}

function ContainsOsSelection(key) {
    if ($(".OSdropzone").children("div.osObject[key=" + key + "]").length > 0)
        return true;
    else
        return false;
}

function CheckOsSelection() {
    if (OsScope.substr(0, 6) == "Single" && osObjCount > 1)
        $(".OSdropzone").addClass("invalidSelection");
    else
        $(".OSdropzone").removeClass("invalidSelection");
    // put selected id's in hidden field for submission
    strVal = "";
    $.each($(".OSdropzone").children("div.osObject"), function () {
        strVal += strVal != "" ? "," : "";
        strVal += $(this).attr("key");
    });
    $("#txtOsSelection").val(strVal);
}

function setDateField(id, altId) {
    $("#" + id).datepicker({
        changeMonth: true,
        changeYear: true,
        showWeek: true,
        firstDay: 1,
        showOn: "button",
        buttonImage: resolveClientUrl('~/img/images/calendar.png'),
        buttonImageOnly: false,
        altField: "#" + altId,
        altFormat: "yyyyMMdd"
    });
}

/* End Object Selector */

function exportXls(id) {
    window.location.href = AjaxUrl + '&AJAX_CP=' + id + '&ACTION=EXPORTXLS';
}

function exportPng(id) {
    if (id != undefined && id != "")
        window.location.href = AjaxUrl + '&AJAX_CP=' + id + '&ACTION=EXPORTPNG';
    else
        window.location.href = AjaxUrl + '&AJAX_CP=' + $("div.doc").attr("id") + '&ACTION=EXPORTPNG';
}

function initReportList(aid) {
    reportList = aid;
}

function clickList(link) {
    var doc = $("div.doc");
    var listid = $(link).attr("value");
    var actionid = $(link).attr("actionid");
    if (reportList == actionid) {
        // is already selected
        if (actionid > 0)
            document.location.href = "flow_list.aspx?ID=" + actionid + "&LID=" + listid;
    }
    else {
        // list aanvinken en document herladen
        url = AjaxUrl + "&AJAX_CP=" + doc.attr("id") + "&PAGEACTION=1&ACTION=SELECTLIST&LID=" + listid + "&AID=" + actionid;
        reportList = actionid;
        doc.load(url);
    }
    return true;
}

function saveAccount(id) {
    $.ajax({
        url: "account_details.aspx?call=ajax",
        method: 'POST',
        data: $('#frmAccount').serialize(),
        success: function (data) {
            $('#' + id).html(data);
            // put new data in grid
        }
    });
}

function removeReport(id, repid) {
    url = AjaxUrl + "&AJAX_CP=" + id + "&ACTION=DELREPORT&REPID=" + repid;
    $('#' + id).load(url);
}

function checkComponentError(id, message, bError) {
    var _comp = $("#" + id).closest(".component");
    if (message != "") {
        strMessage += "<li>" + message + "</li>";

        _comp.addClass(bError == true ? "component_error" : "component_warning");
        _comp.attr("title", message);

        setFlashMessage("<strong>" + (bError == true ? ERROR : WARNING) + "</strong><ul>" + strMessage + "</ul>", bError == true ? 1 : 0);
    }
    else
        _comp.removeAttr("title");
}

function showPopupWindow(id) {
    $("#" + id).dialog({
        modal: true,
        resizable: false,
        width: 500,
        buttons:
        {
            "OK": function () {
                $(this).dialog("close");
            }
        }
    });
}
