/*************************************************
*
* $Id: fadeout_effect.js 9 2009-02-16 15:20:36Z yalpedoc $
* $Author: yalpedoc $
* $Date: 2009-02-16 23:20:36 +0800 (Mon, 16 Feb 2009) $
* $Rev: 9 $
*
**************************************************/
if(!codeplay.image.FadeOutEffect)	codeplay.image.FadeOutEffect = function(){};
codeplay.image.FadeOutEffect.prototype = new codeplay.image.TransitionEffectBase();
/**
* Constructor
*/
codeplay.image.FadeOutEffect.prototype.init = function() {
    codeplay.common.Utils.log("In FadeOutEffect.init()");
    this.isBrowserSupported = true; //support all browsers
    if (!this.isCurrentBrowserSupported()) return;
    this.currentImgDiv = document.createElement('div');
    this.nextImgDiv = document.createElement('div');
    this.currentImgDiv = this.transitionMgr.imagesDiv.appendChild(this.currentImgDiv);
    this.nextImgDiv = this.transitionMgr.imagesDiv.appendChild(this.nextImgDiv);
    this.setUp();
};

codeplay.image.FadeOutEffect.prototype.setUp = function() {
    codeplay.common.Utils.log("In FadeOutEffect.setUp()");
    this.currentImgDiv.style.position = 'absolute';
    this.nextImgDiv.style.position = 'absolute';
    this.currentImgDiv.style.width = this.imgWidth + 'px';
    this.currentImgDiv.style.height = this.imgHeight + 'px';
    this.nextImgDiv.style.width = this.imgWidth + 'px';
    this.nextImgDiv.style.height = this.imgHeight + 'px';
    this.currentImgDiv.style.left = this.x + 'px';
    this.currentImgDiv.style.top = this.y + 'px';
    this.nextImgDiv.style.left = this.x + 'px';
    this.nextImgDiv.style.top = this.y + 'px';
    this.currentImgDiv.style.backgroundRepeat = 'no-repeat';
    this.nextImgDiv.style.backgroundRepeat = 'no-repeat';
    this.currentImgOpacity = 100;
    this.finish = false;
    this.currentImgDiv.style.zIndex = 1;
    codeplay.common.Utils.setOpacity(this.currentImgDiv, this.currentImgOpacity);
};

codeplay.image.FadeOutEffect.prototype.update = function() {
    if (this.finish) return;
    this.currentImgOpacity = Math.max(0, this.currentImgOpacity - 1);
    if (this.currentImgOpacity <= 0) {
        this.finish = true;
        this.pauseForUserView();
    }
    codeplay.common.Utils.setOpacity(this.currentImgDiv, this.currentImgOpacity);
};

/**
* Override parent one
*/
codeplay.image.FadeOutEffect.prototype.isCurrentBrowserSupported = function(){
	//This effect support Firefox, Chrome, Opera, Safari; Not support IE currently
	return this.isBrowserSupported;
};

/**
* Override parent one
*/
codeplay.image.FadeOutEffect.prototype.displayImg = function(imgId){
	codeplay.common.Utils.log("In FadeOutEffect.displayImg()");
	this.setUp();
	this.currentImg = this.transitionMgr.images[imgId];
	this.currentImgDiv.style.backgroundImage = 'url('+this.currentImg.src+')';
	this.nextImg = this.transitionMgr.images[this.transitionMgr.nextImgId];
	this.nextImgDiv.style.backgroundImage = 'url('+this.nextImg.src+')';
};

codeplay.image.FadeOutEffect.prototype.onStop = function() {
    this.currentImgDiv.style.backgroundImage = '';
    this.currentImgDiv.style.width = '0px';
    this.finish = true;
}

/**
* Override parent one
*/
codeplay.image.FadeOutEffect.prototype.hideImg = function(){
	codeplay.common.Utils.log("In FadeOutEffect.hideImg()");
	this.nextImgDiv.style.backgroundImage='';
	this.nextImgDiv.style.width = '0px';
	this.currentImgDiv.style.backgroundImage = '';
	this.currentImgDiv.style.width = '0px';
};