/**
* asynchron video loading
*/

$(function() {
    $(".youtube").each(function() {
        var raw = $(this).attr("name");
        var data = raw.split("|#|");
        $(this).
        html("<object width='" + data[1] + "' height='" + data[2] + "'><param name='movie' value='http://www.youtube.com/v/" + data[0] + "&rel=1'></param><param name='wmode' value='transparent'></param><embed src='http://www.youtube.com/v/" + data[0] + "&rel=1' type='application/x-shockwave-flash' wmode='transparent' width='" + data[1] + "' height='" + data[2] + "'></embed></object>").
        attr("style", "width:" + data[1] + "px; margin:0 auto; background-color:transparent");
    });

	$(".vthumb").click(function() {
        var raw = $(this).attr("name");
        var data = raw.split("|#|");
		//var x =  ( $(window).width()-data[1] )/2;
		//var y =  ( $(window).height()-data[2] )/2;

        // getPageScroll() by quirksmode.com
        var xScroll, yScroll;
        if (self.pageYOffset) {
            yScroll = self.pageYOffset;
            xScroll = self.pageXOffset;
        } else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
            yScroll = document.documentElement.scrollTop;
            xScroll = document.documentElement.scrollLeft;
        } else if (document.body) {// all other Explorers
            yScroll = document.body.scrollTop;
            xScroll = document.body.scrollLeft;	
        }
        
        // adapter from getPageSize() by quirksmode.com
        var windowHeight
        if (self.innerHeight) {	// all except Explorer
            windowHeight = self.innerHeight;
        } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
            windowHeight = document.documentElement.clientHeight;
        } else if (document.body) { // other Explorers
            windowHeight = document.body.clientHeight;
        }	        
        
     
        var y =	yScroll + (windowHeight / 10);
        var x = ( $(window).width()-data[1] )/2;
		
        var container = $("#overlay");
		var div = $("#zoomvideo");

		container.
        attr("style", "position:absolute; top:0px; left:0px; width:" + $(document).width() + "px; height:" + $(document).height() + "px; background:#000; filter:alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;");
			
		div.
		html("<object width='" + data[1] + "' height='" + data[2] + "'><param name='movie' value='http://www.youtube.com/v/" + data[0] + "&rel=1'></param><param name='wmode' value='transparent'></param><embed src='http://www.youtube.com/v/" + data[0] + "&rel=1' type='application/x-shockwave-flash' wmode='transparent' width='" + data[1] + "' height='" + data[2] + "'></embed></object>").
		attr("style", "position:absolute; width:" + data[1] + "px; height:" + data[2] +"px; top:" + y + "px; left:" + x + "px; background:#fff url(/docs/design/loading.gif) no-repeat center center; padding:5px 10px 25px 10px; display:block").
		append("<div id='close_zoomvideo' style='position:absolute; right:10px; bottom:0;'><img style='border:0; cursor:pointer;' src='/docs/design/closelabel.gif' alt='' /></div>");
        
        $("#close_zoomvideo").click(function(){
            div.
            html("").
            attr("style", "display:none;");
            	
    		container.
    		attr("style", "display:none;");    
        });
        
        $("#overlay").click(function(){
            div.
            html("").
            attr("style", "display:none;");

    		container.
    		attr("style", "display:none;");
        });
	});
});