var Slider = function (parent) {
    this.Parent = parent;
    this.Timer = null;

    this.Startup = function () {
        $(".calc-list").attr("count", $(".calc-list ul").find('li').length);
        $(".calc-list ul").find('li').each(function (index, element) {
            $(element).attr('index', index);
        });

        $(".calc-list ul li").on('click', this.OnThumbImageClick.bind(this));
        $('#prev').on('click', this.ActivePrevImage.bind(this));
        $('#next').on('click', this.ActiveNextImage.bind(this));
        $('#play').on('click', this.OnPlayButtonClick.bind(this));
        $('#pause').on('click', this.OnPauseButtonClick.bind(this));

        var now = new Date();
        this.SetActiveImage(now.getHours());
    };

    this.SetActiveImage = function (index) {
        $(".calc-list ul").find('li.action').removeClass("action");
        $(".calc-list ul").find('li').eq(index).addClass("action");
        $(".calc-list").attr("index", index);

        var selected = $(".calc-list ul").find('li.action');
        this.Parent.Map.ReloadData(selected.attr('time'));
    };

    this.ActivePrevImage = function () {
        var index = parseInt($(".calc-list").attr("index"));
        var count = parseInt($(".calc-list").attr("count"));
        var prevIndex = index > 0 ? index - 1 : count - 1;
        this.SetActiveImage(prevIndex);
    };

    this.ActiveNextImage = function () {
        var index = parseInt($(".calc-list").attr("index"));
        var count = parseInt($(".calc-list").attr("count"));
        var nextIndex = index < count - 1 ? index + 1 : 0;
        this.SetActiveImage(nextIndex);
    };

    this.OnThumbImageClick = function (e) {
        var index = $(e.target).attr("index");
        this.SetActiveImage(index);

        $('.calc-list ul li').removeClass("action");
        $(e.target).addClass("action");
    };

    this.AutoPlay = function () {
        this.Timer = setInterval(this.ActiveNextImage.bind(this), 1500);
    };

    this.OnPlayButtonClick = function () {
        this.AutoPlay();
        $('.btn-group div.pause').show();
        $('.btn-group div.play').hide();
    };

    this.OnPauseButtonClick = function () {
        clearInterval(this.Timer);
        $('.btn-group div.pause').hide();
        $('.btn-group div.play').show();
    };
};