/**
 * NM_YouTube.js
 *
 * @mootols		V 1.0
 * @swfobject	V 1.5
 * @author		Steffen Heinzelmann <shi@dmc.de>
 * @copyright   Copyright (c) dmc - digital media center GmbH
 * @version 	$Id: NM_YouTube.js 2274 2007-10-17 11:52:17Z drothacker $
 **/
var NM_YouTube = {

	/**
	 * inialization flag
	 **/
	blnInitialize: false,

	/**
	 * detection flag for old ie browsers
	 **/
	blnOldIE: false,

	/**
	 * language id
	 **/
	strLangId: 'nl',

	/**
	 * parmeters: language
	 **/
	objLang: {
		nl: {
			close_window: 'Venster sluiten'
		},
		fr: {
			close_window: 'Fermer la fenêtre'
		}
	},

	/**
	 * SWFObject object
	 **/
	objSWF: null,

	/**
	 * parameters: background layer
	 **/
	objBGParam: {
		width: 	984,
		height: 700
	},

	/**
	 * parameters: content layer
	 **/
	objContentParam: {
		width: 	440,
		height: 390
	},

	/**
	 * parameters: flash video
	 **/
	objVideoParam: {
		width: 			429,
		height: 		340,
		SWFId: 		 	'YouTubeSWF',
		flashVersion:	7,
		bgColor:		'#FFFFFF',
		transparent: 	1,
		contentId:		'YouTubeContentSWF'
	},

	/**
	 * element: background layer
	 **/
	objElmYouTubeBG: new Element( 'div' ).setStyles( {
			'position':				'absolute',
			'top': 					0,
			'left': 				0,
			'z-index':				'1001',
			'width':				0,
			'height':				0,
			'display': 				'none',
			'background-color': 	'#000000',
			'opacity': 				'0.6'
		} ).setProperty( 'id', 'YouTube' ),

	/**
	 * element: content layer
	 **/
	objElmYouTubeContent: new Element( 'div' ).setStyles( {
			'position':				'absolute',
			'top': 					0,
			'left': 				0,
			'z-index':				'1002',
			'width':				0,
			'height':				0,
			'visibility': 			'visible',
			'display': 				'block',
			'border':				'1px solid #555555',
			'background-color':		'#FFFFFF',
			'background-image':		'url(/img/youtube/nm_logo.gif)',
			'background-position':	'5px 5px',
			'background-repeat': 	'no-repeat'
		} ).setProperty( 'id', 'YouTubeContent' ),

	/**
	 * element: swf file
	 **/
	objElmYouTubeContentSWF: new Element( 'div' ).setStyles( {
			'position':				'absolute',
			'top': 					'25px',
			'left': 				'5px',
			'z-index':				'1005',
			'width':				0,
			'height':				0,
			'visibility':			'hidden',
			'background-image':		'url(/img/youtube/loading.gif)',
			'background-position': 	'center',
			'background-repeat': 	'no-repeat',
			'border':				'1px solid #999999'
		} ).setProperty( 'id', 'YouTubeContentSWF' ),

	/**
	 * element: title
	 **/
	objElmYouTubeContentTitle: new Element( 'div' ).setStyles( {
			'position':				'absolute',
			'top': 					'6px',
			'left': 				'25px',
			'z-index':				'1003',
			'visibility': 			'visible',
			'display': 				'block',
			'width':				'300px',
			'height':				'20px',
			'text-align':			'left'
		} ).setProperty( 'id', 'YouTubeContentTitle' ),

	/**
	 * element: close button
	 **/
	objElmYouTubeContentCloseTop: new Element( 'div' ).setStyles( {
			'position':				'absolute',
			'top': 					'5px',
			'right': 				'5px',
			'z-index':				'1003',
			'width':				'20px',
			'height':				'20px',
			'background-image':		'url(/img/youtube/close.gif)',
			'background-position': 	'top right',
			'background-repeat': 	'no-repeat',
			'cursor':			 	'pointer'
		} ).setProperty( 'id', 'YouTubeContentCloseTop' ),

	/**
	 * form elements to hide in "opener"
	 **/
	arrFormElmListToHidden: [
		'lhAdviserBox',
		'NM_CrossSellingProduct',
		'NM_ComBasketBox',
		'NM_ComProductBasketBox',
		'product'

	],

	objEffectFadeInContent: null,

	/**
	 * initialize
 	 **/
	initialize: function( objParam ) {

		this.blnInitialize = true;

		this.blnOldIE = this.detectOldIE();

		//init effect
		this.objEffectFadeInContent = this.objElmYouTubeContent.effects( {duration: 1500, transition: Fx.Transitions.quintOut } );

		//init language
		if( objParam.langId != '' && objParam.langId != undefined ) {
			this.strLangId = objParam.langId;
		}
		this.objLang = this.objLang[ this.strLangId ];

		//init bg layer
		var intBGHeight = this.getWindowHeight();
		if( intBGHeight < this.objBGParam.height ) {
			intBGHeight = this.objBGParam.height;
		}

		var intBGWidth = this.getWindowWidth();
		if( intBGWidth < this.objBGParam.width ) {
			intBGWidth = this.objBGParam.width;
		}

		var intBGLeft = this.objBGParam.left;
		if( true == window.ie ) {
			intBGLeft = 0;
		}

		this.objElmYouTubeBG.setStyles( {
			'left': 	intBGLeft+'px',
			'width': 	intBGWidth+'px',
			'height': 	intBGHeight+'px'
		} );

		window.addEvent( 'load', function() {
			//workaround: firefox need a little more time ;-)
			this.objElmYouTubeBG.setStyle( 'height', this.getWindowHeight() + 'px' );
		}.bind( this ) );

		//init content layer
		this.objElmYouTubeContent.setStyles( {
			'left':  ( ( this.objBGParam.width /2 ) - ( this.objContentParam.width / 2 ) ) + 'px',
			'width': this.objContentParam.width + 'px'
		} );

		this.objElmYouTubeContent.setProperty( 'defaultTop', ( parseInt( this.objElmYouTubeContent.getStyle( 'top' ) ) + 50 ) + 'px' );
		this.objElmYouTubeContent.setProperty( 'defaultLeft', this.objElmYouTubeContent.getStyle( 'left' ) );

		//init swf layer
		this.objElmYouTubeContentSWF.setStyles( {
			'width':  ( this.objVideoParam.width - 1 )  + 'px',
			'height': ( this.objVideoParam.height - 1 ) + 'px'
		} );

		//register event handler
		this.objElmYouTubeBG.addEvent( 'click', this.close.bind( this ) );
		this.objElmYouTubeContentCloseTop.addEvent( 'click', this.close.bind( this ) );

		//draggable
		/*this.objElmYouTubeContent.makeDraggable( {
			onDrag: function() {
				this.setOpacity( 0.7 );
			}.bind( this.objElmYouTubeContent ),
			onComplete: function() {
				this.setOpacity( 1.0 );
			}.bind( this.objElmYouTubeContent )
		} );*/

		this.objElmYouTubeContentTitle.addEvent( 'dblclick', function() {
			this.setStyles( { left: this.getProperty( 'defaultLeft' ) , top: this.getProperty( 'defaultTop' ) } );
		}.bind( this.objElmYouTubeContent ) );


		//set close button title
		this.objElmYouTubeContentCloseTop.setProperty( 'title', this.objLang.close_window );

		//insert in dom tree
		this.objElmYouTubeBG.injectInside( document.body );
		this.objElmYouTubeContentTitle.injectInside( this.objElmYouTubeContent );
		this.objElmYouTubeContentCloseTop.injectInside( this.objElmYouTubeContent );
		this.objElmYouTubeContentSWF.injectInside( this.objElmYouTubeContent );
		this.objElmYouTubeContent.injectInside(  document.body )

	},

	/**
	 * playVideo
	 **/
	play: function( objParam ) {

		//if not initialize, initalize
		if( false == this.blnInitialize ) {
			this.initialize( objParam );
		}

		this.objElmYouTubeContentTitle.setHTML( decodeURIComponent( objParam.title ) );

		//hide form elements in "opener"
		if( true == this.blnOldIE ) {
			try {
				for( var intIdCnt=0; intIdCnt < this.arrFormElmListToHidden.length; intIdCnt++ ) {
					if( $type( $( this.arrFormElmListToHidden[ intIdCnt ] ) ) == 'element' ) {
						$( this.arrFormElmListToHidden[ intIdCnt ] ).setStyle( 'display', 'none' );
					}
				}
			}
			catch( e ) {
				//
			}
		}

		//display elements
		this.objElmYouTubeBG.setStyles( { 'display': 'block' } );
		this.objElmYouTubeContent.setStyles( { 'top': 		(window.getScrollTop()+50)+'px',
											   'display': 	'block'
												} );


		this.objEffectFadeInContent.start( { 'opacity': [0, 1], 'height': [ 0, this.objContentParam.height ] } ).chain( function() {

			this.objElmYouTubeContentSWF.setStyle( 'visibility', 'visible' );

			//initialize SWF object
			this.initSWF( {
				url: 			objParam.url,
				autoPlay:		objParam.autoPlay,
				SWFId: 			this.objVideoParam.SWFId,
				width: 			this.objVideoParam.width,
				height:		 	this.objVideoParam.height,
				flashVersion:	this.objVideoParam.SWFId,
				bgColor:		this.objVideoParam.bgColor,
				transparent:	this.objVideoParam.transparent,
				contentId:		this.objVideoParam.contentId
			} );

		}.bind( this ) );

	},

	/**
	 * closeVideo
	 **/
	close: function( objParam ) {

		//fade out content layer
		this.objElmYouTubeContent.effects( { duration: 500 } ).custom( { 'opacity': [1, 0] } ).chain( function() {

			this.objElmYouTubeContentSWF.setStyle( 'visibility', 'hidden' );
			this.objElmYouTubeContentSWF.setHTML( '' );
			this.objElmYouTubeContent.setStyles( { 	'display': 'none',
													'visibility': 'hidden' } );
			this.objElmYouTubeBG.setStyle( 'display', 'none' );
			this.objSWF = null;

			//redisplay hidden form elements in "opener"
			if( true == this.blnOldIE ) {
				try {
					for( var intIdCnt=0; intIdCnt < this.arrFormElmListToHidden.length; intIdCnt++ ) {
						if( $type( $( this.arrFormElmListToHidden[ intIdCnt ] ) ) == 'element' )
						{
							$( this.arrFormElmListToHidden[ intIdCnt ] ).setStyle( 'display', 'block' );
						}
					}
				}
				catch( e ) {
					//
				}
			}

		}.bind( this ) );

	},

	/**
	 * initSWF
	 **/
	initSWF: function( objParam ) {
		var autoload = '&autoplay=1';

		if (objParam.autoPlay == false) {
			autoload = '';
		}
		this.objSWF = new SWFObject(
							objParam.url + autoload,
							objParam.SWFId,
							objParam.width,
							objParam.height,
							objParam.flashVersion,
							objParam.bgColor
							);

		if( true == objParam.transparent ) {
			this.objSWF.addParam( "wmode", "transparent" );
		}
		this.objSWF.write( objParam.contentId );
	},

	/**
	 * getWindowHeight
	 **/
	getWindowHeight: function()	{

		if( document.body && document.body.offsetHeight )
		{
			return document.body.offsetHeight;
		}
		else if( window.scrollMaxY > 0 )
		{
			return window.scrollMaxY;
		}
		else if( window.innerHeight > 0 )
		{
			return window.innerHeight;
		}
		else
		{
			return 0;
		}
	},

	/**
	 * getWindowWidth
	 **/
	getWindowWidth: function()	{
		var intWidth = window.getWidth();
		if( intWidth > 0 )
		{
			return intWidth;
		}
		else if( document.body && document.body.offsetWidth )
		{
			return document.body.offsetWidth;
		}
		else if( window.innerWidth > 0 )
		{
			return window.innerWidth;
		}
		else
		{
			return 0;
		}
	},

	/**
	* getOffsetLeft
	**/
	getOffsetLeft: function()	{
		var intWidthMax = window.getWidth();
		var intWidth = 0;
		if( document.body && document.body.offsetWidth )
		{
			intWidth = document.body.offsetWidth;
		}
		else if( window.innerWidth > 0 )
		{
			intWidth = window.innerWidth;
		}

		return ( intWidth - intWidthMax );
	},

	/**
	* detectOldIE
	**/
	detectOldIE: function() {
		if( true == window.ie && window.ie7 == undefined ) {
			return true;
		}
		else
		{
			return false;
		}

	}

};