//-----------------------------------------------------------------------
// Copyright (C) Motorwebs Corporation. All rights reserved.
//-----------------------------------------------------------------------
// Button Block Class

Type.registerNamespace('Motorwebs.UI');

Motorwebs.UI.ButtonBlock = function(element) {
    Motorwebs.UI.ButtonBlock.initializeBase(this, [element]);

    // elements
    this._buttonBlock = this._element;
    this._previous = null;
    this._next = null;
    this._blocks = null;
    this._view = null;

    // properties
    this._enableSmoothSlide = false;
    this._animateSlice = 0;
    this._animateInterval = 0;
    this._blockWidth = 0;
    this._blockHeight = 0;
    this._blockInterval = 0;
    this._blockTotal = 0;
    this._viewMargin = 0;
    this._viewBlocks = 0;
    this._blocksWidth = 0;
    this._blocksHtml = "";

    //vars
    this._left = 0;
    this._index = 1;
    this._leftTotal = 0;
    this._blockTimer = null;
    this._blockTickHandler = null;
    this._animateTimer = null;
    this._animateTickHandler = null;
    this._animating = false;
    this._moveRight = false;
}

Motorwebs.UI.ButtonBlock.prototype = {

    initialize: function() {
        Motorwebs.UI.ButtonBlock.callBaseMethod(this, 'initialize');
        if (this._enableSmoothSlide) {
            this._animateTickHandler = Function.createDelegate(this, this._animateSmooth);
            this._animateTimer = new Sys.Timer();
            this._animateTimer.add_tick(this._animateTickHandler);
            this._animateTimer.set_interval(this._animateInterval);
        }
        else {
            this._blockTickHandler = Function.createDelegate(this, this._play);
            this._blockTimer = new Sys.Timer();
            this._blockTimer.add_tick(this._blockTickHandler);
            this._blockTimer.set_interval(this._blockInterval);
            this._animateTickHandler = Function.createDelegate(this, this._animate);
            this._animateTimer = new Sys.Timer();
            this._animateTimer.add_tick(this._animateTickHandler);
            this._animateTimer.set_interval(this._animateInterval);
        }
        this._hookup();
    },

    dispose: function() {
        if (this._blockTimer) {
            this._blockTimer.dispose();
            this._blockTimer = null;
        }
        if (this._animateTimer) {
            this._animateTimer.dispose();
            this._animateTimer = null;
        }
        Motorwebs.UI.ButtonBlock.callBaseMethod(this, 'dispose');
    },

    // event handlers ////////////////////////////////////////////////////////////////
    _onPreviousClick: function(e) {
        if (this._enableSmoothSlide) {
            this._moveRight = false;
            if (!this._animateTimer.get_enabled()) {
                this._leftTotal = 0;
                this._animateTimer.set_enabled(true);
            }
            return;
        }
        if (this._animating) return;
        this._moveRight = false;
        this._blockTimer.set_enabled(false);
        if (this._index == this._blockTotal + 1) {
            this._index = 2;
            this._leftTotal = 0;
            this._blocks.style.left = "";
        }
        else
            this._index += 1;
        this._animateTimer.set_enabled(true);
    },

    _onNextClick: function(e) {
        if (this._enableSmoothSlide) {
            this._moveRight = true;
            return;
        }
        if (this._animating) return;
        this._moveRight = true;
        this._blockTimer.set_enabled(false);
        if (this._index <= 1)
            this._blocks.style.left = "";
        else {
            this._animateTimer.set_enabled(true);
            this._index -= 1;
        }
    },

    _onBlockClick: function(e) {
        this._blockTimer.set_enabled(false);
    },

    // private methods //////////////////////////////////////////////////////////////
    _hookup: function() {
        // calc view port width
        var viewPortWidth = (this._viewBlocks == 1) ? this._blockWidth : ((this._blockWidth * this._viewBlocks) + (this._viewMargin * (this._viewBlocks - 1)));

        // set element size
        //var borderBox = getBorderBox
        var prevWidth = $common.parseUnit($common.getCurrentStyle(this._previous, "width"));
        var elementWidth = viewPortWidth + (prevWidth.size * 2) + (this._viewMargin * 2);
        var elementHeight = this._blockHeight + (this._viewMargin * 2);
        if (this._viewMargin > 4) elementHeight -= 4;
        this._buttonBlock.style.width = elementWidth + "px";
        this._buttonBlock.style.height = elementHeight + "px";

        // set next / previous
        this._next.style.height = elementHeight + "px";
        this._previous.style.height = elementHeight + "px";
        $addHandlers(this._next, { click: this._onNextClick }, this);
        $addHandlers(this._previous, { click: this._onPreviousClick }, this);

        // set view port wrapper
        this._viewWrap.style.width = (viewPortWidth + (this._viewMargin * 2)) + "px";
        this._viewWrap.style.height = elementHeight + "px";

        // set view port
        this._view.style.width = viewPortWidth + "px";
        this._view.style.height = this._blockHeight + "px";
        this._view.style.marginTop = (this._viewMargin > 4) ? (this._viewMargin - 2) + "px" : (this._viewMargin) + "px";

        // set blocks
        var block = null;
        this._blocks.innerHTML = this._blocksHtml;
        this._blocks.style.width = this._blocksWidth + "px";
        this._blocks.style.height = this._blockHeight + "px";
        for (var i = 0; i < this._blocks.childNodes.length; i++) {
            block = this._blocks.childNodes[i];
            if (block.nodeType == 1) {
                block.style.marginRight = this._viewMargin + "px";
                $addHandlers(block, { click: this._onBlockClick }, this);
            }
        }

        if (this._blockTotal > this._viewBlocks) {
            if (this._enableSmoothSlide)
                this._animateTimer.set_enabled(true);
            else
                this._blockTimer.set_enabled(true);
        }
    },

    _play: function() {
        //Sys.Debug.trace("left total - " + this._leftTotal);
        if (this._index == this._blockTotal + 1) {
            this._index = 2;
            this._leftTotal = 0;
            this._blocks.style.left = "";
        }
        else
            this._index += 1;
        this._animateTimer.set_enabled(true);
    },

    _animate: function() {
        this._animating = true;
        if (this._left == this._blockWidth + this._viewMargin) {
            this._left = 0;
            this._animateTimer.set_enabled(false);
            this._animating = false;
            return;
        }
        this._left += this._viewMargin;
        if (this._moveRight)
            this._leftTotal -= this._animateSlice;
        else
            this._leftTotal += this._animateSlice;
        this._blocks.style.left = (this._leftTotal * -1) + "px";
    },

    _animateSmooth: function() {
        if (this._leftTotal > (this._blocksWidth / 2)) {
            this._leftTotal = 0;
            this._blocks.style.left = "";
        }
        if (this._leftTotal < 0) {
            this._animateTimer.set_enabled(false);
            this._leftTotal = 0;
            return;
        }
        if (this._moveRight)
            this._leftTotal -= this._animateSlice;
        else
            this._leftTotal += this._animateSlice;

        this._blocks.style.left = (this._leftTotal * -1) + "px";
    },

    // public methods //////////////////////////////////////////////////////////////
    // public properties /////////////////////////////////////////////////////////////

    get_previous: function() { return this._previous; },
    set_previous: function(value) { this._previous = value; },

    get_next: function() { return this._next; },
    set_next: function(value) { this._next = value; },

    get_viewWrap: function() { return this._viewWrap; },
    set_viewWrap: function(value) { this._viewWrap = value; },

    get_view: function() { return this._view; },
    set_view: function(value) { this._view = value; },

    get_blocks: function() { return this._blocks; },
    set_blocks: function(value) { this._blocks = value; },

    get_enableSmoothSlide: function() { return this._enableSmoothSlide; },
    set_enableSmoothSlide: function(value) { this._enableSmoothSlide = value; },

    get_animateSlice: function() { return this._animateSlice; },
    set_animateSlice: function(value) { this._animateSlice = value; },

    get_animateInterval: function() { return this._animateInterval; },
    set_animateInterval: function(value) { this._animateInterval = value; },

    get_blockWidth: function() { return this._blockWidth; },
    set_blockWidth: function(value) { this._blockWidth = value; },

    get_blockHeight: function() { return this._blockHeight; },
    set_blockHeight: function(value) { this._blockHeight = value; },

    get_blockInterval: function() { return this._blockInterval; },
    set_blockInterval: function(value) { this._blockInterval = value; },

    get_blocksWidth: function() { return this._blocksWidth; },
    set_blocksWidth: function(value) { this._blocksWidth = value; },

    get_blocksHtml: function() { return this._blocksHtml; },
    set_blocksHtml: function(value) { this._blocksHtml = value; },

    get_blockTotal: function() { return this._blockTotal; },
    set_blockTotal: function(value) { this._blockTotal = value; },

    get_viewMargin: function() { return this._viewMargin; },
    set_viewMargin: function(value) { this._viewMargin = value; },

    get_viewBlocks: function() { return this._viewBlocks; },
    set_viewBlocks: function(value) { this._viewBlocks = value; }

}

Motorwebs.UI.ButtonBlock.registerClass('Motorwebs.UI.ButtonBlock', Sys.UI.Control);