// - - - - - - - - - - - - - - - - - - - - -
//
// Title : Dynamic Resolution Dependent Layout Demo
// Author : Kevin Hale
// URL : http://particletree.com
//
// Description : This is a demonstration of a dynamic 
// resolution dependent layout in action. Change your browser 
// window size to see the layout respond to your changes. To 
// preserve the separation of the presentation and behavior 
// layers, this implementation delegates all the presentation 
// details to external CSS stylesheets instead of changing 
// each style property through JavaScript.
//
// Created : July 30, 2005
// Modified : November 15, 2005
//
// - - - - - - - - - - - - - - - - - - - - -

// getBrowserWidth is taken from The Man in Blue Resolution Dependent Layout Script
// http://www.themaninblue.com/experiment/ResolutionLayout/
function getBrowserWidth(){
		if (window.innerWidth){
			return window.innerWidth;}	
		else if (document.documentElement && document.documentElement.clientWidth != 0){
			return document.documentElement.clientWidth;	}
		else if (document.body){return document.body.clientWidth;}		
			return 0;
	}

// dynamicLayout by Kevin Hale
function dynamicLayout(){
	var browserWidth = getBrowserWidth();
	//alert(browserWidth);

	//Load Wider CSS Rules
	if (browserWidth > 1024){
		changeLayout("above1024");
	}
}

// changeLayout is based on setActiveStyleSheet function by Paul Sowdon 
// http://www.alistapart.com/articles/alternate/
function changeLayout(description){
	var i, a;
	for(i=0; (a = document.getElementsByTagName("link")[i]); i++){
		if(a.getAttribute("title") != "default"){
			a.disabled = true;
			//alert(a.getAttribute("title") + '.disabled = true');
		}
   }

	for(i=0; (a = document.getElementsByTagName("link")[i]); i++){
		if(a.getAttribute("title") == description){
			a.disabled = false;
			//alert(a.getAttribute("title") + '.disabled = false');
		}
   }
}

//addEvent() by John Resig
function addEvent( obj, type, fn ){ 
   if (obj.addEventListener){ 
	  obj.addEventListener( type, fn, false );
   }
   else if (obj.attachEvent){ 
	  obj["e"+type+fn] = fn; 
	  obj[type+fn] = function(){ obj["e"+type+fn]( window.event ); } 
	  obj.attachEvent( "on"+type, obj[type+fn] ); 
   } 
} 
	
//Run dynamicLayout function when page loads and when it resizes.
addEvent(window, 'load', dynamicLayout);
addEvent(window, 'resize', dynamicLayout);	 




//for open vidio's
var win = null;

function NewWinIM(mypage,myname,compname)
{
	var embedcode = '<div align="center"><embed id="VideoPlayback" style="width:400px;height:326px" allowFullScreen="true" src="http://video.google.com/googleplayer.swf?docid=-'+mypage+'&hl=en&fs=true"  type="application/x-shockwave-flash"> </embed></div>';
	LeftPosition = (screen.width) ? (screen.width-400)/2 : 0;
	TopPosition = (screen.height) ? (screen.height-326)/2 : 0;
	
	var settings = 'width=440';
	settings += ', height=366';
	settings += ', top='+TopPosition+', left='+LeftPosition;
	settings += ', directories=no';
	settings += ', location=no';
	settings += ', menubar=no';
	settings += ', resizable=no';
	settings += ', scrollbars=no';
	settings += ', status=no';
	settings += ', toolbar=no';
	
	win = window.open("",myname,settings);
	win.document.write('<HTML><HEAD><TITLE>'+compname+' Video</TITLE></HEAD><BODY BGCOLOR="#000000"><DIV style="color:white;font-size:11px;font-family:arial" align="center">Video by '+compname+'</DIV>'+embedcode+'</BODY></HTML>');
}
