/*
 © Copyright (c) 2006-2008 Apple Inc.  All rights reserved.
 
 IMPORTANT:  This Apple software ("Apple Software") is supplied to you in consideration of your agreement to the following terms. Your use, installation and/or redistribution of this Apple Software constitutes acceptance of these terms. If you do not agree with these terms, please do not use, install, or redistribute this Apple Software.
 
 Provided you comply with all of the following terms, Apple grants you a personal, non-exclusive license, under Apple’s copyrights in the Apple Software, to use, reproduce, and redistribute the Apple Software for the sole purpose of creating Dashboard widgets for Mac OS X. If you redistribute the Apple Software, you must retain this entire notice in all such redistributions.
 
 You may not use the name, trademarks, service marks or logos of Apple to endorse or promote products that include the Apple Software without the prior written permission of Apple. Except as expressly stated in this notice, no other rights or licenses, express or implied, are granted by Apple herein, including but not limited to any patent rights that may be infringed by your products that incorporate the Apple Software or by other works in which the Apple Software may be incorporated.
 
 The Apple Software is provided on an "AS IS" basis.  APPLE MAKES NO WARRANTIES, EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE, REGARDING THE APPPLE SOFTWARE OR ITS USE AND OPERATION ALONE OR IN COMBINATION WITH YOUR PRODUCTS.
 
 IN NO EVENT SHALL APPLE BE LIABLE FOR ANY SPECIAL, INDIRECT, INCIDENTAL OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) ARISING IN ANY WAY OUT OF THE USE, REPRODUCTION, AND/OR DISTRIBUTION OF THE APPLE SOFTWARE, HOWEVER CAUSED AND WHETHER UNDER THEORY OF CONTRACT, TORT (INCLUDING NEGLIGENCE), STRICT LIABILITY OR OTHERWISE, EVEN IF APPLE HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */

// Note: Properties and methods beginning with underbar ("_") are considered private and subject to change in future Dashcode releases.

// Currently supported transition types
Transition.NONE_TYPE = 'none';
Transition.PUSH_TYPE = 'push';
Transition.CROSS_FADE_TYPE = 'cross-fade';

// Transition timing functions that are defined as part of WebKit CSS animation specification. These are made available for your convenience.
Transition.DEFAULT_TIMING = 'default';
Transition.LINEAR_TIMING = 'linear';
Transition.EASE_IN_TIMING = 'ease-in';
Transition.EASE_OUT_TIMING = 'ease-out';
Transition.EASE_IN_OUT_TIMING = 'ease-in-out';

// These are extra properties for Transition.PUSH_TYPE
Transition.RIGHT_TO_LEFT_DIRECTION = 'right-left';
Transition.LEFT_TO_RIGHT_DIRECTION = 'left-right';
Transition.TOP_TO_BOTTOM_DIRECTION = 'top-bottom';
Transition.BOTTOM_TO_TOP_DIRECTION = 'bottom-top';

//
// Constructor for Transtition object. You can also use the convenience method CreateTransitionWithProperties()
//
// type         - any of the Transition type constants
// duration     - a float in seconds
// timing       - a valid CSS animation timing function value. For example, 'linear' or 'ease-in-out'
//
function Transition(type, duration, timing)
{
    this.type = type;
    this.duration = duration;
    this.timing = timing;
    
    this._useTransforms = (window.WebKitCSSMatrix || window.CSSMatrix) ? true : false;
}

//
// Create a new Transition object and fill its internal properties from the dictionary parameter
//
function CreateTransitionWithProperties(properties)
{
    var transition = new Transition();
    for (var property in properties) {
        transition[property] = properties[property];
    }
    return transition;
}

//
// Both newView and oldView must share the same common parent container element. The transition is constrained by
// the dimensions of the parent container. In particular, the container has 'overflow: hidden'. This is especially
// important when the container edges are not lined with the edge of the device viewport.
//
// isReverse - if flag is true, it will perform the transition in reverse. Some transitions, for example, the push transition has a reverse.
//
Transition.prototype.perform = function(newView, oldView, isReverse)
{
    var containerElement = oldView ? oldView.parentNode : ( newView ? newView.parentNode : null);
    if (!containerElement) return;
    
    if (oldView && newView) {
        // Got to execute in the same container
        if (oldView.parentNode != newView.parentNode) return;
		if (oldView == newView) return;
    }
    
    // Make sure that container is constraining the transitions for overflow content
    containerElement.style.overflow = 'hidden';
    var computedStyle = document.defaultView.getComputedStyle(containerElement, null);
    if ((computedStyle.getPropertyValue('position') != 'absolute') && (computedStyle.getPropertyValue('position') != 'relative')) {
        // Assume 'static' since we don't support 'fixed'. 'relative' is less obtrusive then.
        containerElement.style.position = 'relative';
    }
    
    var newStyle = newView.style;
    if (oldView) {
        var oldStyle = oldView.style;
        // Reset
        oldStyle.zIndex = 0;
        oldStyle.position = 'absolute';
        // Since oldView is just taken out of the document flow, make sure its width still looks good
        oldStyle.width = containerElement.offsetWidth+'px';
        
        if (this._useTransforms && this.type && this.type != 'none') {
            if (this.type == 'fade' || this.type == 'cross-fade') {
                newStyle.opacity = 0;
            }
        }
        else {
            oldStyle.display = 'none';
        }
    }
    
    // Performing the transition now
    if (this._useTransforms && this.type && this.type != 'none') {
		var self = this;
        var resetOldViewTop = false;
        if (this.type == 'fade') {
            if (oldView) {
                Transition._addDelayedTransitionCallback(function() {
                    newStyle.webkitTransitionProperty = 'opacity';
                    newStyle.webkitTransitionDuration = self._parseDuration(self.duration);
                    newStyle.webkitTransitionTimingFunction = self.timing;
                    newStyle.opacity = 1;
                });
                
                resetOldViewTop = true;
            }
            else {
                newStyle.opacity = 1;
            }
        }
        else if (this.type == 'cross-fade') {
            if (oldView) {
                var duration = this._parseDuration(this.duration);
                if (duration) {
                    // looks better with slightly longer timing
                    duration = parseFloat(duration)*1.5 + 's';
                }
                
                Transition._addDelayedTransitionCallback(function() {
                    oldStyle.webkitTransitionProperty = 'opacity';
                    oldStyle.webkitTransitionDuration = duration;
                    oldStyle.webkitTransitionTimingFunction = self.timing;
                    oldStyle.opacity = 0;

                    newStyle.webkitTransitionProperty = 'opacity';
                    newStyle.webkitTransitionDuration = duration;
                    newStyle.webkitTransitionTimingFunction = self.timing;
                    newStyle.opacity = 1;
                });
                
                resetOldViewTop = true;
            }
            else {
                newStyle.opacity = 1;
            }
        }
        else if (this.type == 'push') {
            var transformOp = 'translateX';
            if (oldView) {
                var edge = 'left';
                var factor = isReverse ? -1 : 1;
                var dimension = containerElement.offsetWidth;
                if (this.direction == 'bottom-top') {
                    transformOp = 'translateY';
                    edge = 'top';
                    dimension = isReverse ? newView.offsetHeight : oldView.offsetHeight;
                } else if (this.direction == 'top-bottom') {
                    transformOp = 'translateY';
                    edge = 'top';
                    dimension = isReverse ? oldView.offsetHeight : newView.offsetHeight;
                }

                if (this.direction == 'left-right' || this.direction == 'top-bottom') factor *= -1;
                
                if (!oldStyle.webkitTransform) {
                    // This makes sure that we start with an identity matrix to avoid initial performance problem
                    oldStyle.webkitTransform = 'translate(0px, 0px)';
                }
                this._disableTransitions(newStyle);
                newStyle.webkitTransform = transformOp + '(' + factor*dimension + 'px)';
                
                Transition._addDelayedTransitionCallback(function() {
                    var parsedDuration = self._parseDuration(self.duration) + ' !important';
                    oldStyle.webkitTransitionProperty = '-webkit-transform';
                    oldStyle.webkitTransitionDuration = parsedDuration;
                    oldStyle.webkitTransitionTimingFunction = self.timing;
                    // +1 to make it different from previous value, else it will not show up in bottom-top
                    oldStyle.webkitTransform = transformOp + '(' + -1*factor*(dimension+1) + 'px)';
                    
                    newStyle.webkitTransitionProperty = '-webkit-transform';
                    newStyle.webkitTransitionDuration = parsedDuration;
                    newStyle.webkitTransitionTimingFunction = self.timing;
                    newStyle.webkitTransform = 'translate(0px, 0px)';
                });
                
                resetOldViewTop = (edge == 'left');
            }
        }
        
        if (resetOldViewTop) {
            // This is especially important for reverse since the original value of 'top' is 'auto', which for a view lower in the document flow means that it will come after the newly restored view. Hence, let's set it to a right value before newView is put to 'relative' again.
            oldStyle.top = oldView.offsetTop + 'px';
        }
    }
    newStyle.zIndex = 1;
    newStyle.position = 'relative';
    newStyle.display = 'block';
}

Transition.prototype._parseDuration = function(duration)
{
    var value = parseFloat(duration);
    if (!isNaN(value)) {
        value += 's';
    }
    else {
        value = '0s'
    }
    return value;
}

// For most reliable result (especially currently for opacity), this function should be called before a new transition is performed.
Transition.prototype._disableTransitions = function(style)
{
    style.webkitTransitionProperty = 'none';
    style.webkitTransitionDuration = '0';
    style.webkitTransitionTimingFunction = '';
}

// Accumulate transitions that will be executed after a 0 delay
Transition._addDelayedTransitionCallback = function(callback) {
	if (!Transition._delayedCallbacks) {
		Transition._delayedCallbacks = new Array();
		var performDelayedCallbacks = function () {
            var length = Transition._delayedCallbacks.length;
			for (var f=0; f<length; f++) {
				Transition._delayedCallbacks[f]();
			}
			delete Transition._delayedCallbacks;
		}
		setTimeout(performDelayedCallbacks, 0);
	}
	Transition._delayedCallbacks.push(callback);
}