function Box() {
	this.header = null;
	this.footer = null;
	this.footerContent = null;
	this.footerRight = null;
	this.imageIntro = null;
	this.imageProducts = null;
	this.imageApps = null;
	this.bubble = null;
	this.bubbleWait = 1000;
	this.bubbleInterval = 3000;
	this.bubbleTimeout = null;

	this.init = function(referer) {	
		this.header = document.getElementById('box-header');
		this.footer = document.getElementById('box-footer-background');
		this.footerContent = document.getElementById('box-footer-centre');
		this.footerRight = document.getElementById('box-footer-right');
		this.imageIntro = document.getElementById('box-intro');
		this.imageProducts = document.getElementById('box-products');
		this.imageApps = document.getElementById('box-apps');
		this.bubble = document.getElementById('box-bubble')		

		if(referer) {
			if(referer.indexOf('cjelectrical.co.uk') != -1) {
				this.doProducts();
			}
			else {
				this.doIntroduction();
			}
		}
		else {
			this.doIntroduction();
		}	
	}

	this.doIntroduction = function() {
		var element = null;

		this.header.style.backgroundImage = 'url(images/banners/elements_brochure.jpg)';
		this.imageIntro.src = 'images/box-intro-on.gif';
		this.imageProducts.src = 'images/box-products.gif';
		this.imageApps.src = 'images/box-apps.gif';
		this.footerContent.className = 'box-footer-right-margin';

		this.clearHeaderContent();
	  	this.clearFooterContent();	 

		element = document.getElementById('IntroHeader');
		element.style.display = 'block';
		element = null;

		element = document.getElementById('IntroFooter');
		element.style.display = 'block';
		element = null;
	}

	this.doProducts = function() {
		var element = null;

		this.imageIntro.src = 'images/box-intro.gif';
		this.imageProducts.src = 'images/box-products-on.gif';
		this.imageApps.src = 'images/box-apps.gif';
		this.footerContent.className = 'box-footer-right-margin box-footer-left-margin';

		this.clearFooterContent();
		this.doDisplayP1();

		element = document.getElementById('ProductsFooterLeft');
		element.style.display = 'block';
		element = null;
	}

	this.doApplications = function() {
		var element = null;

		this.header.style.backgroundImage = 'url(images/banners/applications.jpg)';
		this.imageIntro.src = 'images/box-intro.gif';
		this.imageProducts.src = 'images/box-products.gif';
		this.imageApps.src = 'images/box-apps-on.gif';
		this.footerContent.className = 'box-footer-right-margin box-footer-left-margin';

		this.clearHeaderContent();
	  	this.clearFooterContent();	 

		element = document.getElementById('AppsHeader');
		element.style.display = 'block';
		element = null;

		element = document.getElementById('AppsFooterLeft');
		element.style.display = 'block';
		element = null;
	}

	this.clearHeaderContent = function() {
		var element = null;

		element = document.getElementById('IntroHeader');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('AppsHeader');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP1');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP2');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP3');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP4');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP5');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP6');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayHeaderP7');
		element.style.display = 'none';
		element = null;
	}

	this.clearFooterContent = function() {
	 	var element = null; 
	 	
	 	element = document.getElementById('IntroFooter');
		element.style.display = 'none';
		element = null; 

		element = document.getElementById('AppsFooterLeft');
		element.style.display = 'none';
		element = null; 

		element = document.getElementById('ProductsFooterLeft');
		element.style.display = 'none';
		element = null;

		this.clearFooterContentCentre();
	}

	this.clearFooterContentCentre = function() {
	 	var element = null; 
	 	
		element = document.getElementById('DisplayFooterP1');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP2');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP3');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP4');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP5');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP6');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP7');
		element.style.display = 'none';
		element = null;
	}

	this.cleanUp = function() {
		this.header = null;
		this.footer = null;
		this.footerContent = null;
		this.footerRight = null;
		this.imageIntro = null;
		this.imageProducts = null;
		this.imageApps = null;
		this.bubble = null;
	}

	this.doDisplayP1 = function() {
		var element = null;

		this.header.style.backgroundImage = 'url(images/banners/products_devimat.jpg)';

		this.clearHeaderContent();
	  	this.clearFooterContentCentre();		
		this.clearFooterContentRightP1();

		element = document.getElementById('DisplayHeaderP1');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP1');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP2 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_cable_1.jpg)';

		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
		this.clearFooterContentRightP2();

		element = document.getElementById('DisplayHeaderP2');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP2');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP3 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_mirror_demisters_1.jpg)';	
	
		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
	  	this.clearFooterContentRightP3();	

		element = document.getElementById('DisplayHeaderP3');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP3');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP4 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_panel_heaters_1.jpg)';

		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
		this.clearFooterContentRightP4();

		element = document.getElementById('DisplayHeaderP4');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP4');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP5 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_insulation_1.jpg)';
		
		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
		this.clearFooterContentRightP5();
	  	
	  	element = document.getElementById('DisplayHeaderP5');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP5');
		element.style.display = 'block';
		element = null;	
	}

	this.doDisplayP6 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_thermostat_1.jpg)';

		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
		this.clearFooterContentRightP6();

		element = document.getElementById('DisplayHeaderP6');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP6');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP7 = function() {
		this.header.style.backgroundImage = 'url(images/banners/products_devirail.jpg)';

		this.clearHeaderContent();
	  	this.clearFooterContentCentre();
		this.clearFooterContentRightP7();

		element = document.getElementById('DisplayHeaderP7');
		element.style.display = 'block';
		element = null;	

		element = document.getElementById('DisplayFooterP7');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP1R1 = function () {
		var element = null;

		this.clearFooterContentRightP1();

		element = document.getElementById('DisplayFooterP1R1');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP1R2 = function () {
		var element = null;
		
		this.clearFooterContentRightP1();

		element = document.getElementById('DisplayFooterP1R2');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP1R3 = function () {
		var element = null;
		
		this.clearFooterContentRightP1();

		element = document.getElementById('DisplayFooterP1R3');
		element.style.display = 'block';
		element = null;
	}

	this.doDisplayP5R1 = function () {
		var element = null;
		
		this.clearFooterContentRightP1();

		element = document.getElementById('DisplayFooterP5R1');
		element.style.display = 'block';
		element = null;
	}

	this.clearFooterContentRightP1 = function() {
		var element = null;

		element = document.getElementById('DisplayFooterP1R1');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP1R2');
		element.style.display = 'none';
		element = null;

		element = document.getElementById('DisplayFooterP1R3');
		element.style.display = 'none';
		element = null;
	}

	this.clearFooterContentRightP2 = function() {
		var element = null;
	}

	this.clearFooterContentRightP3 = function() {
		var element = null;
	}

	this.clearFooterContentRightP4 = function() {
		var element = null;
	}

	this.clearFooterContentRightP5 = function() {
		var element = null;

		element = document.getElementById('DisplayFooterP5R1');
		element.style.display = 'none';
		element = null;
	}

	this.clearFooterContentRightP6 = function() {
		var element = null;
	}

	this.clearFooterContentRightP7 = function() {
		var element = null;
	}

	this.showBubble = function(instant, offset) {
		var self = this;

		this.hideBubble();

		if(this.bubbleTimeout) {
			clearTimeout(this.bubbleTimeout);
		}

		if(offset) {
			this.bubble.style.left = '338px';
		}
		else {
			this.bubble.style.left = '194px';
		}
	
		if(instant) {
			this.bubble.style.display = 'block';

			this.bubbleTimeout = setTimeout(function() {
				self.hideBubble();
			}, this.bubbleInterval);
		}
		else {
			this.bubbleTimeout = setTimeout(function() {
 				self.bubble.style.display = 'block';
				self.bubbleTimeout = setTimeout(function() {
					self.hideBubble();
				}, self.bubbleInterval);
			}, this.bubbleWait);	
		}
	}

	this.hideBubble = function() {
		this.bubble.style.display = 'none';

		if(this.bubbleTimeout) {
			clearTimeout(this.bubbleTimeout);
		}
	}
}