// - - - - - - - - - - - - - - - - - - - - -
//
// 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();

	//Load Thin CSS Rules
	if (browserWidth < 750){
		changeLayout("fixed");
	}
	//Load Wide CSS Rules
	if ((browserWidth >= 750) && (browserWidth <= 950)){
		changeLayout("fixed");
	}
	//Load Wider CSS Rules
	if (browserWidth > 950){
		changeLayout("default");
	}
}

// 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("rel").indexOf("style") != -1	&& a.getAttribute("title")) {
			a.disabled = true;
			if(a.getAttribute("title") == description){ a.disabled = false; }
			else if(a.getAttribute("title") != "default"){ a.disabled = true; }
		}
	}
}
function removeBorderCollapse() {
	for(i=0; (a = document.getElementsByTagName("table")[i]); i++) {
		if(a.getAttribute("style")) {
			a.style.borderCollapse = "separate";
			a.style.borderSpacing = "0";
		}
	}	
}

//Setup style needed for printing receipts for payments
function PrintPaymentReceipt(printButton)
{
    //Set Font Style and Size
    document.body.style.fontFamily = "Arial Narrow";
    document.body.style.fontSize = "0.7em";
    
    //Hide Top Header
    document.getElementById('slogan').style.visibility = "hidden";
    
    //Hide Bottom Navigation
    var divCollection = document.getElementsByTagName("div");
    for (var i=0; i<divCollection.length; i++) {
        if(divCollection[i].className == "btmnav") { 
            divCollection[i].style.visibility = "hidden";
        } 
    }
    
    //Hide Print button
    printButton.style.visibility = "hidden";
    
    //Print Page
    window.print();
}
            
// addEvent() by John Resig
// http://ejohn.org/projects/flexible-javascript-events/
function addEvent( obj, type, fn ) {
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]); }
else { obj.addEventListener(type, fn, false); } }
function removeEvent( obj, type, fn ) {
if(obj.detachEvent) {
obj.detachEvent('on'+type, obj[type+fn]);
obj[type+fn] = null; }
else { obj.removeEventListener(type, fn, false); } }
	
// Run dynamicLayout function when page loads and when it resizes.
addEvent(window, 'load', removeBorderCollapse);
addEvent(window, 'load', dynamicLayout);
addEvent(window, 'resize', dynamicLayout);