﻿/**
* Masque Layout Library 0.0.1.0
* Copyright(c) 2008, 青岛领创网络科技有限公司
* @author Lookingon Team
*/

/// <reference path="Jquery/jquery.js" />
/// <reference path="MBase.js" />

//使用说明，必须保证控件加载完成后再调用类进行操作。

if (!Masque.L) {
    Masque.L = {};
}
if (!Masque.L.MoveDirection) {
    Masque.L.MoveDirection = {};
}
Object.extend(Masque.L.MoveDirection, {
    UpDown: 100, //上下滚动
    LeftRight: 101 //左右滚动
});

Masque.L.ElementScrollor = Class();
Masque.L.ElementScrollor.extend({
    option: {
        Speed: 500, //滚动效果时间。int类型
        Interval: 0, //滚动间隔。
        Direction: Masque.L.MoveDirection.LeftRight, //滚动方向， 枚举自Masque.L.MoveDirection。也可以为0-3的整数。
        Roll: false, //是否循环滚动（仿marquee），可以调用SetRoll控制。bool类型
        OneStep: true, //在鼠标移到到容器时，是否自动停止滚动,可以调用SetAutoStop进行控制。bool类型
        PrveCSS: "", //向前滚动按钮可用时的样式。
        PrveDisableCSS: "", //向前滚动按钮不可用时的样式。
        NextCSS: "", //向后滚动按钮不可用时的样式。
        NextDisableCSS: "", //向后滚动按钮不可用时的样式。
        SeparatorWidth: 0 //分隔符宽度
    },
    initialize: function(ScrollBox, PrveButton, NextButton, options) {
        this.ScrollBox = $(ScrollBox);
        this.__ElementBox = this.ScrollBox.children(":first");
        this.PrveButton = $(PrveButton);
        this.NextButton = $(NextButton);
        this.option.PrveCSS = this.PrveButton.attr("class");
        this.option.NextCSS = this.NextButton.attr("class");
        this.SetOption(options);
        this.__bindEvents();

        //左右按钮的状态
        this.__calcButtonState();
    },
    __bindEvents: function() {
        var me = this;
        if (this.option.OneStep) { //只移动一个
            if (this.PrveButton != null)
                this.PrveButton.click(function() { me.__MovePrve(); });
            if (this.NextButton != null)
                this.NextButton.click(function() { me.__MoveNext(); });
        }
        else { //连续移动
            if (this.PrveButton != null) {
                this.PrveButton.mousedown(me.__RollMovePrve);
                this.PrveButton.mouseup(me.__StopRollMovePrve);
            }
            if (this.NextButton != null) {
                this.NextButton.mousedown(me.__RollMoveNext);
                this.NextButton.mouseup(me.__RollMovePrve);
            }
        }
    },
    __calcButtonState: function() {
        if (this.__CanMoveNext()) {
            this.NextButton.attr("class", this.option.NextCSS);
        } else {
            this.NextButton.attr("class", this.option.NextDisableCSS);
        }
        if (this.__CanMovePrve()) {
            this.PrveButton.attr("class", this.option.PrveCSS);
        } else {
            this.PrveButton.attr("class", this.option.PrveDisableCSS);
        }
    },
    __MoveList: new Array(),
    __MovePrve: function() {
        this.__MoveList.push(1);
        this.__DoMove();
    },
    __IsMoveing: false,
    __DoMove: function() {
        if (!this.__IsMoveing) {
            if (this.__MoveList.length > 0) {
                this.__IsMoveing = true;
                var d = this.__MoveList.pop();
                if (d > 0) {
                    this.____MovePrve();
                } else if (d < 0) {
                    this.____MoveNext();
                }
            }
        }
    },
    ____MovePrve: function() {
        if (this.__CanMovePrve()) {
            var me = this;
            var _mleft = 0;
            var _moveStep = 0;
            if (this.option.Direction == Masque.L.MoveDirection.UpDown) {
                _mleft = this.__ElementBox.css("top").replace("px", "");
                _moveStep = this.__ElementBox.children("[ishidden!='true']:first").attr("scrollWidth");
            }
            else if (this.option.Direction == Masque.L.MoveDirection.LeftRight) {
                _mleft = this.__ElementBox.css("left").replace("px", "");
                _moveStep = this.__ElementBox.children("[ishidden!='true']:first").attr("scrollWidth");
            }
            if (isNaN(_mleft))
                _mleft = 0;
            this.__ElementBox.animate({ left: _mleft - _moveStep - this.option.SeparatorWidth }, me.option.Speed, function() {
                me.__ElementBox.children("[ishidden!='true']:first").attr("ishidden", "true");
                me.__calcButtonState();
                me.__IsMoveing = false;
                me.__DoMove();
            });
        } else {
            this.__IsMoveing = false;

            this.__calcButtonState();
        }
    },
    __CanMoveNext: function() {
        var _mleft = 0;
        var _boxWidth = 0;
        var _contentWidth = 0;
        if (this.option.Direction == Masque.L.MoveDirection.UpDown) {
            _mleft = this.__ElementBox.css("top").replace("px", "");
            //            _boxWidth = this.ScrollBox.outerHeight(false);
            //            _contentWidth = this.__ElementBox.outerHeight(false);
        }
        else if (this.option.Direction == Masque.L.MoveDirection.LeftRight) {
            _mleft = this.__ElementBox.css("left").replace("px", "");
            //            _boxWidth = this.ScrollBox.outerWidth(false);
            //            _contentWidth = this.__ElementBox.outerWidth(false);
        }
        if (isNaN(_mleft))
            _mleft = 0;
        return _mleft < 0;
    },
    __CanMovePrve: function() {
        var _mleft = 0;
        var _boxWidth = 0;
        var _contentWidth = 0;
        if (this.option.Direction == Masque.L.MoveDirection.UpDown) {
            _mleft = this.__ElementBox.css("top").replace("px", "");
            _boxWidth = this.ScrollBox.outerHeight(false);
            _contentWidth = this.__ElementBox.outerHeight(false);
        }
        else if (this.option.Direction == Masque.L.MoveDirection.LeftRight) {
            _mleft = this.__ElementBox.css("left").replace("px", "");
            _boxWidth = this.ScrollBox.attr("clientWidth");
            _contentWidth = this.__ElementBox.attr("scrollWidth");
        }
        if (isNaN(_mleft))
            _mleft = 0;

        return Math.abs(_mleft) < _contentWidth - _boxWidth;
    },
    __MoveNext: function() {
        this.__MoveList.push(-1);
        this.__DoMove();
    },
    ____MoveNext: function() {

        if (this.__CanMoveNext()) {
            var me = this;
            var _mleft = 0;
            var _moveStep = 0;
            if (this.option.Direction == Masque.L.MoveDirection.UpDown) {
                _mleft = parseInt(this.__ElementBox.css("top").replace("px", ""));
                _moveStep = this.__ElementBox.children("[ishidden='true']:last").outerHeight(false);
            }
            else if (this.option.Direction == Masque.L.MoveDirection.LeftRight) {
                _mleft = parseInt(this.__ElementBox.css("left").replace("px", ""));
                _moveStep = this.__ElementBox.children("[ishidden='true']:last").outerWidth(false);
            }
            if (isNaN(_mleft))
                _mleft = 0;
            this.__ElementBox.animate({ left: _mleft + _moveStep + this.option.SeparatorWidth }, me.option.Speed, function() {
                me.__ElementBox.children("[ishidden='true']:last").attr("ishidden", "false");
                me.__calcButtonState();
                me.__IsMoveing = false;
                me.__DoMove();
            });
        } else {
            this.__IsMoveing = false;

            this.__calcButtonState();
        }

    },
    __RollMovePrve: function() {
    },
    __StopRollMovePrve: function() {
    },
    __RollMoveNext: function() {
    },
    __StopRollMoveNext: function() {
    }

});

