ShopgateMobileHeader = function (userSettings) {
	var userSettings = userSettings;
	var protocol = (("https:" == document.location.protocol) ? "https://" : "http://");
	
	// "Konstanten" für verschiedene Smartphone Plattformen
	var CONST_IPHONE = 0;
		
	var scriptParams = null,
		stores = null,
		headerTexts = null;
	
	this.create = function() {
		// Script nur ausführen, wenn die Seite auf einer der unterstützen Plattformen aufgerufen wurde
		if (getUserAgent() !== false) {
			// Defaultwerte für die Scriptfunktionen
			scriptParams = {
				mobileHeaderId: 'shopgate_mobile_header',
				buttonWrapperId: 'shopgate_mobile_button',
				buttonPanelText: '',
				buttonBelowHeader: true,
				btnImageSrcOn: protocol + 'shopgate-static.s3.amazonaws.com/api/ios_icons/button_on.png',
				btnImageSrcOff: protocol + 'shopgate-static.s3.amazonaws.com/api/ios_icons/button_off.png',
				btnClassNameOn: 'sg_mobile_button_on',
				btnClassNameOff: 'sg_mobile_button_off',
				mobileHeaderText: '',
				storeLink: null,
				storeLogoSrc: null,
				cookieName: 'shopgate_show_mobile_header',
				cookieDefault: 1,
				cookieExpires: 10,
				headerParent: 'body',
				buttonParent: 'body'
			};
			
			headerTexts = {
				marketplace: 'Shopgate als<br/>iPhone-App laden',
				standalone: 'Diesen Shop als<br/>{PLATFORM}-App laden',
				buttonPanelText: 'Hinweis auf App anzeigen'
			};
					
			// Icons und Marktplatz-App-Links für die veschiedenen Plattformstores
			stores = new Array();
			stores[CONST_IPHONE] = {
				logo: protocol + 'shopgate-static.s3.amazonaws.com/api/mobile_header/logo_app_store.png', 
				marketplaceLink: 'http://itunes.apple.com/de/app/id365287459?mt=8',
				platformName: 'iPhone'
			}
		
			// Neues Dom-Event definieren, um IE Eigenheiten zu kompensieren
			addDomReadyEvent();
			// Wenn das DOM fertig gerendert ist, wird das Script ausgeführt
			window.onDomReady(initShopgateMobileHeader);
		}
	}
	
	// Script initialisieren
	function initShopgateMobileHeader() {
	
		if (getUserAgent() !== false && setOptions() !== false) {
			// Button erzeugen
			var button = new ShopgateMobileHeaderButton(scriptParams);
			
			if (scriptParams.buttonBelowHeader == true) {
				var firstChild = document.querySelector(scriptParams.headerParent).firstChild;
				document.querySelector(scriptParams.headerParent).insertBefore(button.create(), firstChild);	
			} else {
				document.querySelector(scriptParams.buttonParent).appendChild(button.create());
			}						
		}
	}
	
	/**
	 * Überträgt User-Parameter in die Script-Parameter und setzt die passenden Shop-Links und -Logos
	 * @returns {Boolean} TRUE wenn Optionen korrekt gesetzt wurden, FALSE im Fehlerfall
	*/
	function setOptions() {
		var client = getUserAgent();
		
		if (typeof userSettings != 'object') {userSettings = new Object()}
		
		scriptParams.buttonPanelText = headerTexts.buttonPanelText;
		
		if (userSettings.header_parent) {
			scriptParams.headerParent = userSettings.header_parent;
			scriptParams.buttonParent = userSettings.header_parent;
		}
		
		if (userSettings.button_parent) {
			scriptParams.buttonParent = userSettings.button_parent;
		}
	
		// iPhone
		if (client == CONST_IPHONE) {
			// Plattformlogo setzen
			scriptParams.storeLogoSrc = stores[CONST_IPHONE].logo;
			
			// Shop verfügt über eine Einzel-App
			if (userSettings.iphone_standalone && userSettings.iphone_url) {
				scriptParams.storeLink = userSettings.iphone_url;	
				scriptParams.mobileHeaderText = headerTexts.standalone.replace(/{PLATFORM}/, stores[CONST_IPHONE].platformName);
			// Shop nimmt am Marktplatz teil und es existiert eine App für die aktuelle Plattform
			} else if (stores[CONST_IPHONE].marketplaceLink != null) {
				scriptParams.storeLink = stores[CONST_IPHONE].marketplaceLink;
				scriptParams.mobileHeaderText = headerTexts.marketplace;
			} else {
				return false;	
			}
			
			return true;
		}
	}
		
	/**
	 * Prüft, ob die Seite mit auf einem Gerät der unterstützen Plattformen aufgerufen wurde
	 * @returns {Mixed} Plattformkonstante bei Erfolg, FALSE bei Misserfolg
	 */	
	function getUserAgent() {
		var userAgent = navigator.userAgent;
		
		if (userSettings.debug == true && typeof userSettings.debug_platform == 'number') {
			return userSettings.debug_platform
		}
					
		if (userAgent.match(/iPhone|iPod/)) {
			return CONST_IPHONE;
		} else {
			return false;
		}
	}	

	/**
	 * Definiert ein neues DOMReady-Ereignis um Probleme mit IE zu kompensieren 
	 */		
	function addDomReadyEvent() {
		// create onDomReady Event
		window.onDomReady = initReady;
	
		// Initialize event depending on browser
		function initReady(fn) {
			//W3C-compliant browser
			if (document.addEventListener) {
				document.addEventListener("DOMContentLoaded", fn, false);
			} else { // IE
				document.onreadystatechange = function(){readyState(fn)}
			}
		}
	
		// IE execute function
		function readyState(func) {
			// DOM is ready
			if (document.readyState == "interactive" || document.readyState == "complete") {
				func();
			}
		}
	}
		
	/**
	 * Erzeugt ein Panel mit Button über den der ShopgateMobileHeader ein- / ausgeblendet werden kann
	 * @class
	 * @param {object} scriptParams JS-Objekt mit Scriptparametern
	 */
	ShopgateMobileHeaderButton = function(scriptParams) {
		var params = scriptParams,
			cookie = new CookieManager(params),
			mobileHeader = new ShopgateMobileHeader(params);
		
		/**
		 * MobileHeaderButton erzeugen
		 * @public
		 * @returns {object} Panel mit Button
		 */
		this.create = function() {
			var textElement = document.createTextNode(params.buttonPanelText),
				wrapper = createButtonWrapper();
			
			wrapper.appendChild(textElement);
			wrapper.appendChild(createButton(cookie.getStatus()));
				
			return wrapper;
		}

		/**
		 * Erzeugt ein DIV-Panel, das den Button umschließt
		 * @returns {object} HTML-Element
		 */		
		function createButtonWrapper() {
			var wrapper = document.createElement('div');
			
			wrapper.id = params.buttonWrapperId;
			
			// Styles für ButtonWrapper setzen
			wrapper.style.lineHeight = '30px';
			wrapper.style.fontSize = '30px';
			wrapper.style.fontFamily = '"Helvetica Neue", Helvetica, Arial, sans-serif';
			wrapper.style.fontWeight = 'bold';
			wrapper.style.textAlign = 'left';
			wrapper.style.backgroundColor = '#FFF';
			wrapper.style.border = '1px solid #ADADAD';
			wrapper.style.clear = 'both';
			wrapper.style.color = '#222';
			wrapper.style.margin = '20px auto';
			wrapper.style.marginBottom = '40px';
			wrapper.style.padding = '15px';
			wrapper.style.position = 'relative';
			wrapper.style.width = '545px';
			wrapper.style.borderRadius = '8px';
			wrapper.style.WebkitBorderRadius = '8px';
			wrapper.style.MozBorderRadius = '8px';
			
			return wrapper;
		}
		
		/**
		 * Erzeugt einen Button mit dem der ShopgateMobileHeader an-/ ausgeschaltet werden kann
		 * @param {boolean} switchedOn Setzt den Status des Buttons (TRUE -> An / FALSE -> Aus) 
		 * @returns {object} HTML-Element
		 */
		function createButton(switchedOn) {
			var btnImage = document.createElement('img');
			
			// Button-Grafik für den gewüschten Zustand setzen
			if (switchedOn) {
				btnImage.src = params.btnImageSrcOn;
				btnImage.className = params.btnClassNameOn;
				// mobileHeader erzeugen
				mobileHeader.create();				
			} else {
				btnImage.src = params.btnImageSrcOff;
				btnImage.className = params.btnClassNameOff;
			}
			
			// Styles für Button-Grafik setzen
			btnImage.style.background = 'none';
			btnImage.style.margin = '0px';
			btnImage.style.padding = '0px';
			btnImage.style.border = 'medium none';
			btnImage.style.verticalAlign = 'baseline';
			btnImage.style.height = '45px';
			btnImage.style.position = 'absolute';
			btnImage.style.right = '15px';
			btnImage.style.top = '7px';
			
			// Click-Event erzeugen, um den Zustand des Buttons zu wechseln 
			btnImage.onclick = function(event) {
				// Button ist momentan auf 'an' gestellt
				if (this.className == params.btnClassNameOn) {
					// Button-Klasse und Grafik in 'aus'-Zustand wechseln 
					this.className = params.btnClassNameOff;
					this.src = params.btnImageSrcOff;	
					
					// Cookie-Status anpassen und MobileHeader entfernen
					cookie.setStatusOff();
					mobileHeader.destroy();

				// Button ist momentan auf 'aus' gestellt
				} else if (this.className == params.btnClassNameOff) {
					// Button-Klasse und Grafik in 'an'-Zustand wechseln 
					this.className = params.btnClassNameOn;
					this.src = params.btnImageSrcOn;
					
					// Cookie-Status anpassen und MobileHeader erzeugen
					cookie.setStatusOn();
					mobileHeader.create();
				}
			}
			
			return btnImage;
		}
	}
	
	/**
	 * Klasse zur Erzeugung eines ShopgateMobileHeaders
	 * @class
	 * @param {object} scriptParams JS-Objekt mit Scriptparametern
	 */	
	ShopgateMobileHeader = function(scriptParams) {
		var params = scriptParams,
			cookie = new CookieManager(params);
		/**
		 * Erzeugt den MobileHeader und platziert ihn als erstes Kind des Body-Elements
		 * @public
		 */	
		this.create = function() {
			var headerWrapper = createMobileHeaderWrapper();
				storeLink = createStoreLink();
			
			storeLink.appendChild(createStoreIcon());
			storeLink.appendChild(createText());
			headerWrapper.appendChild(storeLink);
			
			var firstChild = document.querySelector(params.headerParent).firstChild;
			
			document.querySelector(params.headerParent).insertBefore(headerWrapper, firstChild);
		}
		
		/**
		 * Entfert den MobileHeader soweit er vorhanden ist
		 * @public
		 */			
		this.destroy = function() {
			var mobileHeader = document.getElementById(params.mobileHeaderId);
			
			if (mobileHeader) {
				mobileHeader.parentNode.removeChild(mobileHeader);
			}
		}
		
		/**
		 * Erzeugt einen Wrapper für die Elemente des MobileHeaders
		 * @returns {object} HTML-Element
		 */
		function createMobileHeaderWrapper() {
			var wrapper = document.createElement('div');

			wrapper.id = params.mobileHeaderId;

			wrapper.style.width = '950px';
			wrapper.style.height = '280px';
			wrapper.style.margin = '20px auto';
			wrapper.style.padding = '10px';
			wrapper.style.background = '#fff';
			wrapper.style.boxShadow = '5px 5px 10px rgba(52,60,72,0.3), -2px -2px 15px rgba(52,60,72,0.3)';
			wrapper.style.WebkitBoxShadow = '5px 5px 10px rgba(52,60,72,0.3), -2px -2px 15px rgba(52,60,72,0.3)';
			wrapper.style.MozBoxShadow = '5px 5px 10px rgba(52,60,72,0.3), -2px -2px 15px rgba(52,60,72,0.3)';
			wrapper.style.borderRadius = '15px';
			wrapper.style.WebkitBorderRadius = '15px';	
			wrapper.style.MozBorderRadius = '15px';

			return wrapper;
		}
		
		/**
		 * Erzeugt ein Link-Element das auf den Store für die aktuelle Plattform verweist. 
		 * Ein Klick setzt das MobileHeader-Cookie auf "verbergen"
		 * @returns {object} HTML-Element
		 */
		function createStoreLink() {
			var storeLink = document.createElement('a');
			
			storeLink.href = params.storeLink;
						
			storeLink.style.display = 'block';
			storeLink.style.textDecoration = 'none';
			storeLink.style.border = 'none';
			storeLink.style.height = '100%';
			storeLink.style.background = '#7CBD7B';
			storeLink.style.background = '-moz-linear-gradient(top,#339933,#57AB56 50%,#7CBD7B)';
			storeLink.style.background = '-webkit-gradient(linear,left top, left bottom,from(#339933),color-stop(0.5, #57AB56),to(#7CBD7B))';
			storeLink.style.borderRadius = '11px';
			storeLink.style.WebkitBorderRadius = '11px';	
			storeLink.style.MozBorderRadius = '11px';
			
			// Cookie des MobileHeaders bei Click auf 'aus' stellen
			storeLink.onclick = function() {
			//	cookie.setStatusOff();
			}

			return storeLink;
		}

		/**
		 * Erzeugt ein verlinktes Bild-Element mit dem Download-Icon für die aktuelle Plattform
		 * @returns {object} HTML-Element des Bildes
		 */			
		function createStoreIcon() {
			var wrapper = document.createElement('div'),
				image = document.createElement('img');

			wrapper.style.height = '100%';
			wrapper.style.width = '300px';
			wrapper.style.cssFloat = 'left';
			wrapper.style.textAlign = 'center';
			
			image.src = params.storeLogoSrc;
			image.style.position = 'relative';
			image.style.width = '310px';
			image.style.height = '115px';
			image.style.left = '13px';
			image.style.paddingTop = '84px';
			image.style.border = 'none';
			
			wrapper.appendChild(image);

			return wrapper;
		}

		/**
		 * Erzeugt ein DIV mit Textinhalt
		 * @returns {object} HTML-Element
		 */		
		function createText() {
			var text = document.createElement('div');
			
			text.style.color = '#fff';
			text.style.fontFamily = '"Helvetica Neue", Helvetica, Arial, sans-serif';
			text.style.fontSize = '57px';
			text.style.lineHeight = '68px';
			text.style.fontWeight = 'bold';
			text.style.textAlign = 'center';
			text.style.padding = '65px 15px 0px 337px';
			text.style.textShadow = '0px 2px 3px #4C6A4E';
			
			text.innerHTML = params.mobileHeaderText;
			
			return text;
		}	
	}
	
	/**
	 * Klasse zur Verwaltung des MobileHeader-Cookies
	 * @class
	 * @param {object} scriptParams JS-Objekt mit Scriptparametern
	 */		
	CookieManager = function (scriptParams) {
		var params = scriptParams,
			cookieRegExp = new RegExp(params.cookieName),			// regExp-Objekt für die Suche nach dem Cookie
			cookieRegExpOn = new RegExp(params.cookieName+'=1'),	// regExp-Objekt für die Suche nach einem aktivierten Cookie
			expires = '; expires=';									// String-Rumpf für das Ablaufdatum
		
		this.status = construct();
		
		/**
		 * Cookiestatus auslesen / Cookie neu anlegen
		 * @returns {Boolean} Cookie-Status TRUE wenn der Header angezeigt werden soll, FALSE wenn nicht
		 */	
		function construct() {
			// Ablaufdatum generieren
			var expiryDate = new Date();
			expiryDate.setTime(expiryDate.getTime() + (params.cookieExpires * 24 * 60 * 60 * 1000));
			expires += expiryDate.toGMTString();
			
			// auslesen / anlegen
			if (document.cookie && document.cookie.match(cookieRegExp)) {
				if (document.cookie.match(cookieRegExpOn)) {
					return true;
				} else {
					return false;
				}
			} else {
				document.cookie = params.cookieName + '=' + params.cookieDefault + expires;
				return params.cookieDefault == 1 ? true : false;
			}		
		}

		/**
		 * Gibt den aktuellen Status für die Headeranzeige zurück
		 * @public
		 * @returns {Boolean} TRUE wenn der Header angezeigt werden soll, FALSE wenn nicht
		 */		
		this.getStatus = function () {
			return this.status;
		}
		
		/**
		 * Setzt den Status auf 'Header anzeigen'
		 * @public
		 */	
		this.setStatusOn = function() {
			document.cookie = params.cookieName +'=1' + expires;	
			this.status = true;
		}
		/**
		 * Setzt den Status auf 'Header verbergen'
		 * @public
		 */	
		this.setStatusOff = function() {
			document.cookie = params.cookieName +'=0' + expires;
			this.status = false;
		}
	}	
}