var zoomed = false;
var zoomCo = 2;
var controlHeight = 80;
function toggleZoom()
{
	zoomed ? unzoomPlayer() : zoomPlayer();
}

function zoomPlayer()
{
	if(zoomed) return;
	zoomed = true;

	element = document.getElementById(playerId);

	var blackScreen = Builder.node
	(
		'div',
		{
			id:     'overlay',
			style:  'position: absolute;'+
					'display: none;'+
					'z-index: 498;'+
					'top: 0px;'+
					'left: 0px;'+
					'width: 100%;'+
					'height: 100%;'+
					'background-color: black;'+
					'filter: alpha(opacity=80);'+
					'-moz-opacity: 0.8;'+
					'opacity: .80;'
		}
	)
	$('body').appendChild(blackScreen);
        // $('body').appendChild(document.getElementById('videoPlayer_container'));

       //Dolly = document.getElementById("videoPlayer_container").cloneNode(true);
       //$('body').appendChild(Dolly);

       //document.body.replaceChild(document.getElementById('videoPlayer_container'), document.body.firstChild);

       if (document.getElementById('collection')) document.getElementById('collection').style.visibility= 'hidden'; // hide combo box


	var arrayPageSize = overlay();
	if (document.documentElement && document.documentElement.scrollTop){
		yScroll = document.documentElement.scrollTop;
	} else if (document.body) {
		yScroll = document.body.scrollTop;
	}else {
		yScroll = 0;
	}
	elementS = document.getElementById('overlay');
	new Effect.Scale
    (
        playerId, 100,
        {
            scaleMode: {originalHeight:(((element.offsetHeight-controlHeight)*zoomCo)+controlHeight), originalWidth:(element.offsetWidth*zoomCo)},
            duration: (0.4),
            fps: 10,
            beforeStart: function()
            {		
                               //$('body').appendChild(document.getElementById('videoPlayer_container')); 
				new Effect.Appear(blackScreen, {from: 0, to: 0.8, fps: 10, duration: 1.0});
				element.style.zIndex   = 500;
				element.style.top   = yScroll + 20 + 'px';
				element.style.left = (arrayPageSize[2]-(element.offsetWidth*zoomCo))/2 + 'px';
            }
        }
    )	
}

function unzoomPlayer()
{
	if(!zoomed) return;
	zoomed = false;
       // $('video_template').appendChild(document.getElementById('videoPlayer_container'));
	element = document.getElementById(playerId);

       if (document.getElementById('collection')) document.getElementById('collection').style.visibility= 'visible'; // show combo box

	element.style.zIndex   = 0;
	element.style.top = '';
	element.style.left = '';
	new Effect.Scale(playerId, 100, {scaleMode: {originalHeight:(((element.offsetHeight-controlHeight)/zoomCo)+controlHeight), originalWidth:(element.offsetWidth/zoomCo)}, fps: 10, duration: 0.4});
	new Effect.Fade
	(
		'overlay',
		{
			fps: 10,
			afterFinish: function()
			{
				Element.remove('overlay');
			}
		}
	)
}

function getPageSize(){
	var xScroll, yScroll;
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}
	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 
	return arrayPageSize;
}
function overlay(){
		var arrayPageSize = getPageSize();	
		var objOverlay = document.getElementById('overlay');
		objOverlay.style.height = (arrayPageSize[1] + 'px');	
		return(arrayPageSize);
} 

