var App = function () {
    this.Map = new Map(this);
    this.RealtimePanel = new RealtimePanel(this);
    this.HistoryPanel = new HistoryPanel(this);

    this.Startup = function () {
        moment.locale();
        this.Relayout();
        
        this.Map.Startup();
        this.RealtimePanel.Startup();
        this.HistoryPanel.Startup();

        window.onresize = this.Relayout.bind(this);
        $('#real-time').on('click', this.OnRealtimeTabClick.bind(this));
        $('#history-time').on('click', this.OnHistoryTabClick.bind(this));
    };

    this.Relayout = function () {
        var width = $(window).width();
        var height = $(window).height();

        $('.main').width(width - 280);
        $('.main').height(height - 58);
        $('.right').height(height - 58);

        this.RealtimePanel.Relayout();
        this.HistoryPanel.Relayout();
    };

    this.OnRealtimeTabClick = function (event) {
        $(event.target).addClass("active").siblings().removeClass('active');
        $(".right-content .param").eq(0).css("display", "block").siblings().css("display", "none");

        this.Map.MultiLayers = false;
    };

    this.OnHistoryTabClick = function (event) {
        $(event.target).addClass("active").siblings().removeClass('active');
        $(".right-content .param").eq(1).css("display", "block").siblings().css("display", "none");
        $("#task-grid").datagrid("resize");

        this.Map.MultiLayers = true;
        this.HistoryPanel.Relayout();
    };

    this.ShowDialog = function () {
        $('.dialog').show();
    };

    this.HideDialog = function () {
        $('.dialog').hide();
    };
};

$(document).ready(function () {
    var app = new App();
    app.Startup();
});