/*================================================================================================================\
+
+ Project     : GODATA-EICHER
+ Filename    : DealerWiseDashboard.js
+ Module Name : Tile Dashboard Module
+ Purpose     : To show Tile Dashboard KPIs between 2 dates.
+ Coded By    : Pankaj Khandal
+
+================================================================================================================*/

/**
* To show Tile Dashboard KPIs between 2 dates.
* @module Dashboard
*/


/**
* To show Tile Dashboard KPIs between 2 dates.
* @class TileDashboard
* @constructor
*/


/**
* Global References: To store Ajax Request's XHR object.
* @for TileDashboard
*/
var xhr_refreshDashboard = null;

// 
/**
* Global References: Setting countUp options (To change the gradient of tiles and slowly incresing the numbers on tiles)
* @for TileDashboard
*/
var options = {
    useEasing: true, // toggle easing
    useGrouping: true, // 1,000,000 vs 1000000
    separator: '', // character to use as a separator
    decimal: '.', // character to use as a decimal
};
var demo;

/**
* Global References: To store color-combinations to show gradient effect on tiles.
* @for TileDashboard
*/
var startingColor11 = 'rgb(47,128,227)', // dark blue color code
startingColor12 = 'rgb(109,192,254)', // light blue color code
endColor11 = 'rgb(200,36,27)', // red color code
endColor12 = 'rgb(254,112,69)', // red
startingColor21 = 'rgb(125,188,29)', // light green
startingColor22 = 'rgb(42,169,28)', // green
warningColor11 = 'rgb(249, 140, 29)',// yellow
warningColor21 = 'rgb(254, 180, 44)';// yellow

lightOcean = 'rgb(0, 171, 169)';    // light ocean
darkOcean = 'rgb(46, 98, 98)';  // dark ocean
lightBlue = 'rgb(66, 146, 234)';    // light blue
darkBlue = 'rgb(24, 57, 134)';  // dark blue



/**
* Convert HH:mm format to Minutes.
* @method convertToMin
* @param {String} time input timei in HH:mm format
* @for TileDashboard
*/
function convertToMin(time) {
    var timeArray = time.split(":");
    return parseInt(timeArray[0], 10) * 60 + parseInt(timeArray[1], 10);
}

/**
* To bind values on infra tile dashboard for selected circles.
* @method refreshDashboard
* @for TileDashboard
*/
function refreshDashboard() {







    SecurityToken = securityToken;
    utcMinutes = parseInt(UtcMinutes, 10);

    //UserId = userId;
    UserId = $("#DealerId").data("kendoComboBox").value();
    // Getting first and last date from a month
    var startDate = $("#monthpickerFrom").val();
    var endDate = $("#monthpickerTo").val();

    // Sending the Ajax Request for showing the dashboard values and handling its completion.
    if (xhr_refreshDashboard && xhr_refreshDashboard.readystate != 4) {
        xhr_refreshDashboard.abort();
    }
    xhr_refreshDashboard = $.ajax({
        type: "POST",
        url: WCFRESTURL.GetGlobalDashboard,
        data: { Token: SecurityToken, UtcMinutes: utcMinutes, UserId: UserId, FromDate: startDate + ' 00:00:00', ToDate: endDate + ' 23:59:59' },
        dataType: "json",
        success: function (model) {
            console.log(model);
            // Setting KPI values in each tile, formatting and creating links for redirections.
            for (var i = 0; i < model.length; i++) {
                // Getting and setting value for total_van
                if (model[i].Key == "total_van") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#total_van").text(model[i].KeyValue);
                    $("#textFor_total_van").text(model[i].KeyName);
                }
                    // Getting and setting value for average response time
                else if (model[i].Key == "average_response_time") {
                    $("#average_response_time").text(model[i].KeyValue);
                    $("#textFor_average_response_time").text(model[i].KeyName);

                    if (parseInt(convertToMin(model[i].KeyValue, 10)) > 120) {
                        $("#average_response_time").css('background-color', 'red');
                    } else {
                        $("#average_response_time").css('background-color', '#669999');
                    }
                }
                    // Getting and setting value for total vans on service
                else if (model[i].Key == "total_vans_on_service") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#total_vans_on_service").text(model[i].KeyValue);
                    $("#textFor_total_vans_on_service").text(model[i].KeyName);

                    // gradient-coloring the tile
                    var parentOfTarget = $('#' + model[i].Key).parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkOcean, lightOcean, 2);
                }
                    // Getting and setting value for no of dealer tickets
                else if (model[i].Key == "no_of_dealer_tickets") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#no_of_dealer_tickets").text(model[i].KeyValue);
                    $("#textFor_no_of_dealer_tickets").text(model[i].KeyName);
                    // gradient-coloring the tile
                    var parentOfTarget = $('#' + model[i].Key).parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for total breakdowns
                else if (model[i].Key == "total_breakdowns") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#total_breakdowns").text(model[i].KeyValue);
                    $("#textFor_total_breakdowns").text(model[i].KeyName);
                    // gradient-coloring the tile
                    var parentOfTarget = $('#' + model[i].Key).parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for no of van on duty
                else if (model[i].Key == "no_of_van_on_duty") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#no_of_van_on_duty").text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);
                    // gradient-coloring the tile
                    var parentOfTarget = $('#' + model[i].Key).parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for no of dealer open tickets
                else if (model[i].Key == "no_of_dealer_open_tickets") {
                    if (parseFloat(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                }
                    // Getting and setting value for no of dealer closed tickets
                else if (model[i].Key == "no_of_dealer_closed_tickets") {
                    if (parseFloat(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                }
                    // Getting and setting value for no of van open ticket
                else if (model[i].Key == "no_of_van_open_ticket") {
                    if (parseFloat(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                }
                    // Getting and setting value for no of van closed ticket
                else if (model[i].Key == "no_of_van_closed_ticket") {
                    if (parseFloat(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                }
                    // Getting and setting value for no of van closed ticket
                else if (model[i].Key == "no_of_open_tickets") {
                    if (parseFloat(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                    if (parseInt(model[i].KeyValue, 10) >= 1) {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, endColor11, endColor12, 2);
                    } else {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, endColor12, endColor11, startingColor22, startingColor21, 2);
                    }
                }
                    // Getting and setting value for call distribution hd
                else if (model[i].Key == "call_distribution_hd") {
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                    var parentOfTarget = $('#' + model[i].Key).parent().parent().parent().parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkOcean, lightOcean, 2);
                }
                    // Getting and setting value for call distribution lmd
                else if (model[i].Key == "call_distribution_lmd") {
                    $("#" + model[i].Key).text(model[i].KeyValue);

                }
                    // Getting and setting value for call distribution bus
                else if (model[i].Key == "call_distribution_bus") {
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                }
                    // Getting and setting value for call closed within 24hrs hd 
                else if (model[i].Key == "call_closed_within_24hrs_hd") {
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                    var parentOfTarget = $('#' + model[i].Key).parent().parent().parent().parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for call closed within 24hrs lmd 
                else if (model[i].Key == "call_closed_within_24hrs_lmd") {
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                    var parentOfTarget = $('#' + model[i].Key).parent().parent().parent().parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for call closed within 24hrs bus
                else if (model[i].Key == "call_closed_within_24hrs_bus") {
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);

                    var parentOfTarget = $('#' + model[i].Key).parent().parent().parent().parent();
                    colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, darkBlue, lightBlue, 2);
                }
                    // Getting and setting value for All other tiles which needs to be animated and changing in color
                else if (model[i].Key == "least_response_time") {
                    if (model[i].KeyValue != '') {
                        $("#least_response_time").text(model[i].KeyValue);
                        $("#labelFor_least_response_time").show();
                    } else {
                        $("#least_response_time").text("-");
                        $("#labelFor_least_response_time").hide();
                    }
                    $("#textFor_least_response_time").text(model[i].KeyName);

                    // if least response time is more than 120 minutes then make the tile red (gradient-coloring)
                    if (parseInt(convertToMin(model[i].KeyValue), 10) > 120) {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, endColor11, endColor12, 2);
                    } else {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, endColor12, endColor11, startingColor22, startingColor21, 2);
                    }
                }
                    // Getting and setting value for highest response time
                else if (model[i].Key == "highest_response_time") {
                    if (parseInt(model[i].KeyValue, 10) >= 0) {
                        $("#highest_response_time").text(model[i].KeyValue);
                        $("#labelFor_worst_response_time").show();
                    } else {
                        $("#highest_response_time").text("-");
                        $("#labelFor_worst_response_time").hide();
                    }
                    $("#textFor_highest_response_time").text(model[i].KeyName);

                    // if highest response time is more than 120 minutes then make the tile red (gradient-coloring)
                    if (parseInt(convertToMin(model[i].KeyValue), 10) > 120) {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, endColor11, endColor12, 2);
                    } else {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, endColor12, endColor11, startingColor22, startingColor21, 2);
                    }
                }
                    // Getting and setting value for All other tiles which needs to be animated and changing in color
                else if (model[i].Key == "minimum_response_time_dealer_ticket") {
                    if (model[i].KeyValue != '') {
                        $("#minimum_response_time_dealer_ticket").text(model[i].KeyValue);
                        $("#labelFor_minimum_response_time_dealer_ticket").show();
                    } else {
                        $("#minimum_response_time_dealer_ticket").text("-");
                        $("#labelFor_minimum_response_time_dealer_ticket").hide();
                    }
                    $("#textFor_minimum_response_time_dealer_ticket").text(model[i].KeyName);

                    // if least response time is more than 120 minutes then make the tile red (gradient-coloring)
                    if (parseInt(convertToMin(model[i].KeyValue), 10) > 120) {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, endColor11, endColor12, 2);
                    } else {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, endColor12, endColor11, startingColor22, startingColor21, 2);
                    }
                }
                    // Getting and setting value for highest response time
                else if (model[i].Key == "highest_response_time_dealer_ticket") {
                    if (parseInt(model[i].KeyValue, 10) >= 0) {
                        $("#highest_response_time_dealer_ticket").text(model[i].KeyValue);
                        $("#labelFor_highest_response_time_dealer_ticket").show();
                    } else {
                        $("#highest_response_time_dealer_ticket").text("-");
                        $("#labelFor_highest_response_time_dealer_ticket").hide();
                    }
                    $("#textFor_highest_response_time_dealer_ticket").text(model[i].KeyName);

                    // if highest response time is more than 120 minutes then make the tile red (gradient-coloring)
                    if (parseInt(convertToMin(model[i].KeyValue), 10) > 120) {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, startingColor21, startingColor22, endColor11, endColor12, 2);
                    } else {
                        var parentOfTarget = $('#' + model[i].Key).parent();
                        colorAnimationTheDiv(parentOfTarget, endColor12, endColor11, startingColor22, startingColor21, 2);
                    }
                }
                    // Getting and setting value for closur within 24hrs
                else if (model[i].Key == "closur_within_24hrs") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);
                    // if % closure within 24 hrs is less than 90% then make the tile red
                    if (parseFloat(model[i].KeyValue, 10) < 90) {
                        $("#closur_within_24hrs").css('background-color', 'red');
                    } else {
                        $("#closur_within_24hrs").css('background-color', '#669999');
                    }
                }
                    // Getting and setting value for response within 2hrs
                else if (model[i].Key == "response_within_2hrs") {
                    if (parseInt(model[i].KeyValue, 10) > 0) {
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);
                    // if % response within 2 hrs is less than 90% then make the tile red
                    if (parseFloat(model[i].KeyValue, 10) < 90) {
                        $("#response_within_2hrs").css('background-color', 'red');
                    } else {
                        $("#response_within_2hrs").css('background-color', '#669999');
                    }
                }
                    // Getting and setting value for least response time state
                else if (model[i].Key == "least_response_time_state") {
                    var valueToShow = model[i].KeyValue;
                    // if text is larger than 23 characters then make it short

                    if (model[i].KeyValue.length > 23) {
                        valueToShow = valueToShow.substring(0, 23) + '..';
                    }
                    $("#" + model[i].Key).text(valueToShow);
                    $("#" + model[i].Key).attr("title", model[i].KeyValue);
                }
                    // Getting and setting value for highest response time state
                else if (model[i].Key == "highest_response_time_state") {
                    var valueToShow = model[i].KeyValue;
                    // if text is larger than 23 characters then make it short
                    if (model[i].KeyValue.length > 23) {
                        valueToShow = valueToShow.substring(0, 23) + '..';
                    }
                    $("#" + model[i].Key).text(valueToShow);
                    $("#" + model[i].Key).attr("title", model[i].KeyValue);
                }
                    // Getting and setting value for least response time state
                else if (model[i].Key == "least_response_time_dealer_state") {
                    var valueToShow = model[i].KeyValue;
                    // if text is larger than 23 characters then make it short
                    if (model[i].KeyValue.length > 23) {
                        valueToShow = valueToShow.substring(0, 23) + '..';
                    }
                    $("#" + model[i].Key).text(valueToShow);
                    $("#" + model[i].Key).attr("title", model[i].KeyValue);
                }
                    // Getting and setting value for highest response time state
                else if (model[i].Key == "maximum_response_time_dealer_state") {
                    var valueToShow = model[i].KeyValue;
                    // if text is larger than 23 characters then make it short
                    if (model[i].KeyValue.length > 23) {
                        valueToShow = valueToShow.substring(0, 23) + '..';
                    }
                    $("#" + model[i].Key).text(valueToShow);
                    $("#" + model[i].Key).attr("title", model[i].KeyValue);
                }
                else if (model[i].Key == "total_vehicles" || model[i].Key == "total_breakdown" || model[i].Key == "total_breakdown_last_6_month" || model[i].Key == "total_breakdown_last_1_year") {
                }

                else {
                    // Increasing numbers will show only for numbers 
                    if ((parseInt(model[i].KeyValue, 10) != 'NaN') && (parseInt(model[i].KeyValue, 10) > 0)) {
                        //slowing increasing numbers on tiles
                        demo = new countUp(model[i].Key, 0, parseInt(model[i].KeyValue, 10), 0, 0, options);
                        demo.start();
                    }
                    $("#" + model[i].Key).text(model[i].KeyValue);
                    $("#textFor_" + model[i].Key).text(model[i].KeyName);
                }
            }
        },
        complete: function () {
        },
        error: function (data) {
            console.log("Error");
        }
    });
}


/**
* To show Tile dashboard.
* @method showTileDashboard
* @for TileDashboard
*/
function showTileDashboard() {
    refreshDashboard();
}


//==========================DOCUMNET READY=========================
/**
* To do some initial functionality on page when Document is ready.
* @event document.ready
* @for TileDashboard
*/
$(document).ready(function () {
    // Loading Dashboard data.
    showTileDashboard();
    //Refresh Dashboard every-hour
    setInterval("showTileDashboard()", 1000 * 60 * 60);

    // for image cycle.
    $('#defaultCube,#defaultCube1,#defaultCube2,#defaultCube3,#defaultCube4').cycle({
        fx: 'slideY',   // vertical scroll
        speed: 1000,    // speed to scroll the image
        timeout: 20000// set your time b/w every image scrolldown effect
    });
});
//==========================DOCUMNET READY END=======================