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

    this.Startup = function () {
        this.ReLayout();
        window.onresize = this.ReLayout.bind(this);

        this.Map.Startup();
        this.ResetTimeList();
        this.Slider.Startup();

        $('.particle-switch a').on('click', this.OnParticleSwitchButtonClick.bind(this));
        $('#calc-btn').on('click', this.OnRefreshButtonClick.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);
        $('.calc-list').height(height - 420);
    };

    this.ResetTimeList = function () {
        var list = $('#calc-list ul');
        list.empty();

        var now = new Date();
        var fromHour = new Date(now.getFullYear(), now.getMonth(), now.getDate());
        for (var i = 0; i < 48; i++) {
            var time = moment(fromHour).add('hours', i);
            var label = "<li time='{0}'>{1}</li>".format(time.format("YYYYMMDDHH"), time.format("YYYY-MM-DD HH:mm"));
            list.append(label);
        }
    };

    this.OnParticleSwitchButtonClick = function () {
        $('.particle-switch').toggleClass('switch-on');
    };
    
    this.OnRefreshButtonClick = function () {
        this.ResetTimeList();
        this.Slider.Startup();
    };
};

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