var ALL_TEXT = "(All)";
var ALL_VALUE = "@all";

$(function () {
    // global event
}());

function showMapAlertLayer(data) {
    var opt = $('<option></option>').val("").text("(None)");
    var sel = $("#selMapAlertLayer");
    sel.empty();
    sel.append(opt);
    for (var i = 0; i < data.length; i++) {
        var mal = data[i];
        opt = $('<option></option>').val(mal.ID).text(mal.Name).data("mal", mal);
        sel.append(opt);
    }
    if (userParams && userParams.MapAlertLayer) {
        sel.val(userParams.MapAlertLayer);
    }
    showMapAlertLayerDetail();
}

function showMapAlertLayerDetail() {
    var mal = $("#selMapAlertLayer").find("option:selected").data("mal");
    var tb = $("#tbLegend");
    tb.empty();
    var haspramameter = false;
    if (mal && mal.Layers) {
        //var tr = $("<tr></tr>");
        //tb.append(tr);
        //var td = $("<td class='mapalertlayertitle'></td>").html("Icon Definition").css("width", 100);
        //tr.append(td);
        //td = $("<td class='mapalertlayertitle'></td>").html("Alert Title").css("width", 150);
        //tr.append(td);
        for (var i = 0; i < mal.Layers.length; i++) {
            var layer = mal.Layers[i];
            if ((layer.CriteriaSQLParameters && layer.CriteriaSQLParameters.length > 0)
                || (layer.AlertSQLParameters && layer.AlertSQLParameters.length > 0))
                haspramameter = true;

            var tr = $("<tr style='border-bottom: 1px solid lightgray;'></tr>");
            tb.append(tr);

            if (layer.IconColor.length == 9)
                layer.IconColor = "#" + layer.IconColor.substring(3);
            var td = $("<td></td>").css("width", 30);
            td.append($("<img></img>").attr("src", layer.LegendUrl).css({ "width": 18, "vertical-align": "middle" }));
            //td.append($("<div></div>").css({ "background-color": layer.IconColor, "width": 24, "height": 16 }));
            tr.append(td);

            td = $("<td></td>").html(layer.Title).css({ "padding-left": 10, "width": 220 });
            tr.append(td);
        }
    }

    var staticlegend = ["InMotion", "StoppedOn", "StoppedOff", "CGain", "CLoss"];
    var staticlegendtitle = ["In Motion", "Stopped On", "Stopped Off", "Connectivity Recovery", "Connectivity Loss"];
    for (var i = 0; i < staticlegend.length; i++) {
        var tr = $("<tr style='border-bottom: 1px solid lightgray;'></tr>");
        tb.append(tr);

        var url = userParams.MachineIconURL + "?legend=" + staticlegend[i];
        var td = $("<td></td>").css("width", 30);
        td.append($("<img></img>").attr("src", url).css({ "width": 18, "vertical-align": "middle" }));
        tr.append(td);

        td = $("<td></td>").html(staticlegendtitle[i]).css({ "padding-left": 10, "width": 220 });
        tr.append(td);
    }

    var harshdrivinglegend = ["#ff3f48cc", "#ff00a8f3", "#fffff200", "#ffff7f27", "#ffec1c24"];
    var harshdrivingtitle = ["Hard Acceleration", "Hard Brake", "Hard Turn", "Speeding: Low Severity", "Speeding: High Severity"];
    for (var i = 0; i < harshdrivinglegend.length; i++) {
        var tr = $("<tr style='border-bottom: 1px solid lightgray;'></tr>");
        tb.append(tr);

        var ironurl = userParams.MachineIconURL.toLowerCase().replace("machinetypeicon.ashx", "machinemovingicon.ashx");
        var url = ironurl + "?tp=0&bkcolor=" + encodeURIComponent(harshdrivinglegend[i]) + "&heading=45";
        var td = $("<td></td>").css("width", 30);
        td.append($("<img></img>").attr("src", url).css({ "width": 18, "vertical-align": "middle" }));
        tr.append(td);

        td = $("<td></td>").html(harshdrivingtitle[i]).css({ "padding-left": 10, "width": 220 });
        tr.append(td);
    }

    if (haspramameter) {
        $('#setparameter').css('display', '');
    }
    else {
        $('#setparameter').css('display', 'none');
    }
    var right = $('#mapAlertLayerDiv').width() + 100;
    $('#filterIconDiv').css('right', right);
}

function setParameterDatimeTimePicker(ipt) {
    ipt.datetimepicker({
        timepicker: false,
        format: 'm/d/Y',
        enterLikeTab: false,
        onSelectDate: function (v, inp) {
            var date = new DateFormatter().formatDate(v, 'm/d/Y 00:00:00');
            inp.parent().data('val', [date]);
        }
    });
}

function getAlertLayerParameters() {
    if (parameterinput.length > 0) {//更新参数选择的值
        for (var l = 0; l < parameterinput.length; l++) {
            var ipt = parameterinput[l];
            var param = ipt.data("parameter");
            if (ipt.data('commoninput'))
                param.ParameterValue = ipt.val();
        }
    }

    var mal = $("#selMapAlertLayer").find("option:selected").data("mal");
    if (mal)
        return mal.Layers;
    return null;
}


var parameterinput = [];
var paramindex = -1;
function setAlertLayerParameters() {
    parameterinput = [];
    paramindex = -1;
    var ul = $("#ul_parameter");
    ul.empty();
    var pdiv = $("#parameter_right");
    pdiv.empty();
    var mal = $("#selMapAlertLayer").find("option:selected").data("mal");

    var layerHasParam = 0;
    if (mal && mal.Layers) {
        for (var i = 0; i < mal.Layers.length; i++) {
            var layer = mal.Layers[i];

            var criteriaparam = layer.CriteriaSQLParameters;
            var alertparam = layer.AlertSQLParameters;

            if (layer && (criteriaparam || alertparam)) {
                var li = $("<li class='nav_item'></li>").data("layerid", layer.ID).click(layerHasParam++, layerclick);

                if (layer.IconColor.length == 9)
                    layer.IconColor = "#" + layer.IconColor.substring(3);
                var img = $("<img></img>").attr("src", layer.LegendUrl).css({ "width": 18, "vertical-align": "middle" });
                var span = $("<span></span>").text(layer.Title).css({ "margin-left": 10, "vertical-align": "middle" });
                li.append(img).append(span);
                ul.append(li);
                var tb = $("<table class='tb_parameter'></table>").data("layerid", layer.ID);
                if (layerHasParam == 1)
                    li.addClass("selected");
                else
                    tb.css('display', 'none');

                pdiv.append(tb);
                if (criteriaparam && criteriaparam.length > 0)
                    createParameters(criteriaparam, tb, 1);

                if (alertparam && alertparam.length > 0)
                    createParameters(alertparam, tb, 2);
            }
        }
    }
}

function createParameters(params, tb, type) {
    var tr = $("<tr></tr>").append("<td colspan='2' style='padding-left:10px;font-weight:bold;font-size:16px;'>Criteria</td>");
    tb.append(tr);
    for (var j = 0; j < params.length; j++) {
        var param = params[j];
        var tr_param = $("<tr></tr>");
        tb.append(tr_param);
        tr_param.append($("<td></td>").addClass('td_paramtype').html(param.Caption));
        var td = $("<td></td>");

        var ipt = createParameterInput(param, type, j);
        parameterinput.push(ipt);
        if (param.DataType == 3 && param.DisplayStyle != 1 && param.DisplayStyle != 2) {
            setParameterDatimeTimePicker(ipt);
        }
        td.append(ipt);
        tr_param.append(td);
    }
}

function FALSE() { return false; }

function createParameterInput(param, type) {
    var paramvalue = getParameterValue(param.ID, type);
    if (paramvalue == null)
        paramvalue = param.DefaultValue;

    if (param.DisplayStyle == 0) {//inputbox
        return $("<input type='text' />").val(paramvalue).data("parameter", param).data('commoninput', true)
            .attr("paramcaption", param.Name.toLowerCase())
            .keyup(function () {
                $("[paramcaption='" + param.Name.toLowerCase() + "']").val($(this).val());
            }).change(function () {
                $("[paramcaption='" + param.Name.toLowerCase() + "']").val($(this).val());
            });
    }
    else if (param.DisplayStyle == 1 || param.DisplayStyle == 2) {//Dropdown or Combobox
        var defaultcheckall = false;
        if (param.IsAllAllowed && paramvalue === ALL_VALUE)
            defaultcheckall = true;
        if (param.IsField && param.MutipleSelect) {//多选
            var divcontrol = $('<div class="div_filter"></div>').data("parameter", param);
            var seldiv = $('<div class="left dropdown"></div>');
            var span = $('<span class="text_span"></span>');
            var spanimg = $('<span class="fa dropdown_button">&#xf078;</span>');
            var divpanel = $('<div class="div_panel" style="display: none;z-index:10;margin-top:20px;margin-left:-1px;"></div>');
            var ul = $('<ul></ul>');
            divpanel.append(ul).mousedown(FALSE);
            seldiv.append(span).append(spanimg).append(divpanel);
            seldiv.mousedown(function () {
                $('.div_panel').each(function () {
                    var t = $(this);
                    if (!t.is(divpanel))
                        t.css('display', 'none');
                });

                var display = divpanel.css('display');
                if (display == 'none') {
                    divpanel.css({ 'display': 'block' });
                } else {
                    divpanel.css('display', 'none');
                }
                return false;
            });

            var itemclick = function (isall, checked) {
                var chks = ul.find('input');
                if (isall) {
                    chks.prop('checked', checked);
                    if (checked) {
                        span.attr('title', ALL_TEXT).text(ALL_TEXT);
                        param.ParameterValue = ALL_VALUE;
                    }
                    else {
                        span.attr('title', "").text("");
                        param.ParameterValue = "";
                    }
                    return;
                }
                else {
                    if (chkall)
                        chkall.prop('checked', false);//(ALL)取消选中
                }

                var texts = [];
                var paramvalues = [];
                for (var i = 0; i < chks.length; i++) {
                    var c = $(chks[i]);
                    if (c.prop('checked')) {
                        var text = c.next('label').text();
                        if (!text) text = c.val();
                        texts.push(text);
                        paramvalues.push(c.val());
                    }
                }
                texts = texts.join(', ');
                span.attr('title', texts).text(texts);
                paramvalues = paramvalues.join('^');
                param.ParameterValue = paramvalues;
            };

            var chkall = undefined;
            if (param.IsAllAllowed) {
                var liall = $('<li></li>');
                chkall = $('<input type="checkbox" id="chkall" style="width:16px;"/>');
                if (defaultcheckall)
                    chkall.attr('checked', true);
                chkall.change(function () {//全选
                    itemclick(true, $(this).prop('checked'));
                });
                liall.append(chkall);
                liall.append($('<label for="chkall"></label>').text(ALL_TEXT));
                ul.append(liall);
            }
            var ds = getLookupDatasource(param.LookupDatasourceID)
            if (ds && ds.Items) {
                var paramvalueAry = paramvalue.split("^");
                var texts = [];
                for (var s = 0; s < ds.Items.length; s++) {
                    var item = ds.Items[s];
                    var txt = param.DisplayCaptionField ? item.Value : item.Key;
                    var li = $('<li></li>');
                    var chk = $('<input type="checkbox" style="width:16px;"/>').val(item.Key).attr("id", "chkp" + ++paramindex);
                    chk.change(function () {
                        itemclick(false, $(this).prop('checked'));
                    });
                    li.append(chk);
                    li.append($('<label for=' + ("chkp" + paramindex) + '></label>').text(txt));
                    ul.append(li);

                    if (defaultcheckall || paramvalueAry.indexOf(item.Key) > -1) {//选中默认值
                        chk.attr('checked', true);
                        var text = chk.next('label').text();
                        if (!text) text = chk.val();
                        texts.push(text);
                    }
                }

                if (defaultcheckall)
                    texts = ALL_TEXT;
                else
                    texts = texts.join(', ');
                span.attr('title', texts).text(texts);
                param.ParameterValue = paramvalue;
            }

            divcontrol.append(seldiv);

            return divcontrol;
        }
        else {
            var sel = $("<select></select>").data("parameter", param).data('commoninput', true)
                .attr("paramcaption", param.Name.toLowerCase())
                .change(function () {
                    $("[paramcaption='" + param.Name.toLowerCase() + "']").val($(this).val());
                });
            var ds = getLookupDatasource(param.LookupDatasourceID)
            if (ds && ds.Items) {
                if (param.IsField && param.IsAllAllowed) {
                    var opall = $("<option></option>").val(ALL_VALUE).text(ALL_TEXT);
                    sel.append(opall);
                }
                for (var s = 0; s < ds.Items.length; s++) {
                    var item = ds.Items[s];
                    var opt = $("<option></option>").val(item.Key);
                    var txt = param.DisplayCaptionField ? item.Value : item.Key;
                    opt.text(txt);

                    sel.append(opt);
                }
                sel.val(paramvalue);
            }
            return sel;
        }
    }
}

function getLookupDatasource(dsid) {
    var mal = $("#selMapAlertLayer").find("option:selected").data("mal");
    if (mal && mal.LookupDataSources) {
        for (var i = 0; i < mal.LookupDataSources.length; i++) {
            var ds = mal.LookupDataSources[i];
            if (ds.ID.toLowerCase() == dsid.toLowerCase())
                return ds;
        }
    }
    return null;
}

function layerclick(e) {
    $('#ul_parameter li').removeClass("selected");
    $(this).addClass("selected");
    var index = e.data;
    var tbs = $('.tb_parameter');
    tbs.hide();
    $(tbs[index]).show();

}

function getParameterValue(paramid, paramtype) {
    if (parametervalues && parametervalues.length > 0) {
        for (var i = 0; i < parametervalues.length; i++) {
            var layer = parametervalues[i];
            var params;
            if (paramtype == 1)
                params = layer.CriteriaSQLParameters;
            else
                params = layer.AlertSQLParameters;

            if (layer && (params || params)) {
                for (var j = 0; j < params.length; j++) {
                    var param = params[j];
                    if (param.ID == paramid)
                        return param.ParameterValue;
                }
            }
        }
    }
    return null;
}

function openSetAlertLayerParameters() {
    setAlertLayerParameters();
    showmaskbg(true);
    $('#dialog_parameter .dialog-title span.title').text('Pivots');
    $('#dialog_parameter')
        .attr('act', 'edit')
        .css({
            'width': 570,
            'top': (document.documentElement.clientHeight - $('#dialog_parameter').height()) / 4,
            'left': (document.documentElement.clientWidth - $('#dialog_parameter').width()) / 2
        })
        .showDialog();
    pivotsDialogOpend = true;
}

var parametervalues;
function setParameterCompleted() {
    parametervalues = getAlertLayerParameters();
    machineObject.searchMachine(false);
    $('#dialog_parameter').hideDialog();
    showmaskbg(false);
    pivotsDialogOpend = false;
}