/** 
 * BDM Loader 
 * 
 */
;(function(){
	
	if(typeof console === "undefined") {
		console = { log: function() { } };
	}
	
	/**
	 * Overwrites obj1's values with obj2's and adds obj2's if non existent in obj1
	 * @param obj1
	 * @param obj2
	 * @returns obj3 a new object based on obj1 and obj2
	 * 
	 * @see http://stackoverflow.com/questions/171251/how-can-i-merge-properties-of-two-javascript-objects-dynamically
	 */
	function merge_options(obj1,obj2){
		var obj3 = {};
		for (var attrname in obj1) { obj3[attrname] = obj1[attrname]; }
		for (var attrname in obj2) { obj3[attrname] = obj2[attrname]; }
		return obj3;
	}
	
	// Localize jQuery variable
	var jQuery;
	
	var Loader = function(options){
		var self = this;
		
		self.options = merge_options(
			{
				debug: false,
				mode: 'popup',
				target: 'body',
				libsUrl: '',
				cssUrl: '',
				contentUrl: '',
				origin: '' // TODO
			}, 
			options || {}
		);
		
		self.$widget         = null;
		self.messageHandler  = null;
		self.isShown         = null;
		self.originalBodyPad = null;
		self.scrollbarWidth  = 0;
	};
	Loader.prototype = {
	
		/*
		 * initialize loader
		 */
		init: function(){
			var self = this;
			
			// load jquery and iframeResizer and run main() handler afterwards...
			self.loadScript(self.options.libsUrl, function(){ 
				self.main();
			});		
		},
		
		/*
		 * main handler
		 */
		main: function(){
			var self = this;
			
			// Restore $ and window.jQuery to their previous values and store the new jQuery in our local jQuery variable
			jQuery = window.jQuery.noConflict(true);
			
			// Load css
			jQuery("<link>", {rel: "stylesheet", type: "text/css", href: self.options.cssUrl}).appendTo('head');	
			
			// register message handler for cross-document communication with iframe 
			self.registerMessageHandler();
			
			// Append widget to target
			self.$widget = jQuery(self.options.widgetMarkup);
			jQuery(self.options.target).eq(0).prepend(self.$widget);
			
			// some shortcuts
			self.$body = jQuery(document.body);
			self.$element = self.$widget;
			self.$dialog = self.$widget.find('.zone35-bdm-widget-content');
			self.$backdrop = self.$widget.find('.zone35-bdm-widget-overlay');
			
			// make iframe autoresize to its content height
			self.$widget.find('.zone35-bdm-widget-iframe').iFrameResize({
			 	log: self.options.debug,
			 	heightCalculationMethod: 'taggedElement',
			 	checkOrigin: false,	// TODO
			 	minHeight: 600,
			 	resizedCallback: function(data){
					// data.height...
					jQuery(window).resize();
			 	}
			});
			
			// adjust modal and overlay on window resize
			jQuery(window).resize(function(){
				self.handleUpdate();
				if(self.$backdrop.length > 0){
					var height = Math.max(self.$dialog.height(), jQuery(window).height());	
					if(jQuery(window).width() > 768){
						self.$backdrop.height(height+60);
					} else {
						self.$backdrop.height(height);
					}
				}
				
				self.$widget.find('.zone35-bdm-widget-iframe').width(
					self.$widget.find('.zone35-bdm-widget-content .zone35-bdm-widget-inner2').width()
				);
				
			});
		   
			// register click handlers
			self.registerClickHandler();
			self.registerMessengerHandler();
		},
		
		/* 
		 * Script loader
		 */
		loadScript: function(scriptUrl, afterCallback) {
			var firstScriptElement = document.getElementsByTagName('script')[0]; 
			var scriptElement = document.createElement('script');
			scriptElement.type = 'text/javascript';
			scriptElement.async = false;
			scriptElement.src = scriptUrl;

			var ieLoadBugFix = function (scriptElement, callback) {
				if ( scriptElement.readyState == 'loaded' || scriptElement.readyState == 'complete' ) {
					callback();
				} else {
					setTimeout(function() { ieLoadBugFix(scriptElement, callback); }, 100);
				}
			}

			if ( typeof afterCallback === "function" ) {
				if ( typeof scriptElement.addEventListener !== "undefined" ) {
					scriptElement.addEventListener("load", afterCallback, false)
				} else {
					scriptElement.onreadystatechange = function(){
						scriptElement.onreadystatechange = null;
						ieLoadBugFix(scriptElement, afterCallback);
					}
				}
			}
			firstScriptElement.parentNode.insertBefore(scriptElement, firstScriptElement);
		},
		
		open: function(){
			var self = this;
			
			this.isShown = true;
			
			this.checkScrollbar();
			this.setScrollbar();
	
			// Workaround um bei position:fixed nicht mehrere Scrollbars zu haben
			// Der Scrollbar der einbettenden Seite wird ausgeblendet.
			jQuery('body').addClass('zone35-bdm-widget-open');
			
			this.resize();
			 
			self.$widget.scrollTop(0);
			
			this.adjustDialog();
			
			self.$widget.find('.zone35-bdm-widget-iframe').attr('src', self.options.contentUrl);
			self.$widget.addClass('in');

			// Workaround für das Scrollen Ding. IFrame darf nciht größer als viewport sein.
			//if (window.innerHeight < 640) {
			//	self.$widget.find('.zone35-bdm-widget-iframe').height(window.innerHeight);
			//}

		},
		
		close: function(){
			var self = this;
			self.$widget.removeClass('in');
			
			this.isShown = false;
			
			this.resize();
			
			// Workaround um bei position:fixed nicht mehrere Scrollbars zu haben
			// Der Scrollbar der einbettenden Seite wird wieder eingeblendet.
			jQuery('body').removeClass('zone35-bdm-widget-open');
			
			this.resetAdjustments();
			this.resetScrollbar();
		},
		
		toggle: function(){
			var self = this;
			if(self.$widget.hasClass('in')){
				self.close();
			} else {
				self.open();
			}
		},
		
		registerMessageHandler: function(){
			var self = this;
			
			self.messageHandler = function(event){
				// TODO: Do we trust the sender of this message?
				//if (event.origin !== self.options.origin){ return; }
				// Can we handle the message?
				switch(event.data){
					case 'bdmWidgetOpen':
						self.open();
						break;
					case 'bdmWidgetClose':
						self.close();
						break;
					case 'bdmWidgetToggle':
						self.toggle();
						break;
					case 'bdmWidgetReady':
						//...
						break;
				}

			};
			
			// register message event-handler
			if (window.addEventListener) {
				window.addEventListener("message", self.messageHandler , false);
			}else {	// for ie
				window.attachEvent("onmessage", self.messageHandler );
			}
		},
		
		registerClickHandler: function(){
			var self = this;
			
			jQuery(document).find('[data-bdmwidget-click]').each(function(){
				var $self = jQuery(this);
				var handler = $self.data('bdmwidgetClick');
				var allowedHandlers = ['open', 'close', 'toggle'];
				if(
					(!$self.data('bdmwidgetHandlerAttached')) && 
					(jQuery.inArray(handler, allowedHandlers) > -1)
				){
					var handlerFn = function(){ self[handler](); return false; };
					$self.bind('click', handlerFn);
					$self.data('bdmwidgetHandlerAttached', true);
				}
			});
		},

		registerMessengerHandler: function(){
			var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
			var eventer = window[eventMethod];
			var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";

			eventer(messageEvent, function(e) {				
				if(e.data.scrollTop) {
					jQuery('.zone35-bdm-widget-popup').scrollTop(0);
				}
			});
		},
		
		
		resize: function () {
			if (this.isShown) {
				jQuery(window).on('resize', jQuery.proxy(this.handleUpdate, this));
			} else {
				jQuery(window).off('resize');
			}
		},
		
		// these following methods are used to handle overflowing modals
		
		handleUpdate: function () {
			this.adjustDialog();
		},

		adjustDialog: function () {
			var modalIsOverflowing = this.$element[0].scrollHeight > document.documentElement.clientHeight;

			this.$element.css({
				paddingLeft:  !this.bodyIsOverflowing && modalIsOverflowing ? this.scrollbarWidth : '',
				paddingRight: this.bodyIsOverflowing && !modalIsOverflowing ? this.scrollbarWidth : ''
			});
		},

		resetAdjustments: function () {
			this.$element.css({
				paddingLeft: '',
				paddingRight: ''
			});
		},

		checkScrollbar: function () {
			var fullWindowWidth = window.innerWidth;
			if (!fullWindowWidth) { // workaround for missing window.innerWidth in IE8
				var documentElementRect = document.documentElement.getBoundingClientRect();
				fullWindowWidth = documentElementRect.right - Math.abs(documentElementRect.left);
			}
			this.bodyIsOverflowing = document.body.clientWidth < fullWindowWidth;
			this.scrollbarWidth = this.measureScrollbar();
		},

		setScrollbar: function () {
			var bodyPad = parseInt((this.$body.css('padding-right') || 0), 10);
			this.originalBodyPad = document.body.style.paddingRight || '';
			if (this.bodyIsOverflowing) this.$body.css('padding-right', bodyPad + this.scrollbarWidth);
		},

		resetScrollbar: function () {
			this.$body.css('padding-right', this.originalBodyPad);
		},

		measureScrollbar: function () { // thx walsh
			var scrollDiv = document.createElement('div');
			scrollDiv.className = 'zone35-bdm-widget-scrollbar-measure';
			this.$body.append(scrollDiv);
			var scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;
			this.$body[0].removeChild(scrollDiv);
			return scrollbarWidth;
		}
		
	};
	
	// namespace
	if(typeof window.Zone35 === "undefined") {
		window.Zone35 = {};
	}
	if(typeof window.Zone35.Bdm === "undefined") {
		window.Zone35.Bdm = {};
	}
	if(typeof window.Zone35.Bdm.Loader === "undefined") {
		window.Zone35.Bdm.Loader = Loader;
	}
	
})();

var bdmWidget = new Zone35.Bdm.Loader({"debug":false,"mode":"popup","target":"body","contentUrl":"https:\/\/audibkk.sps-prien.de\/","libsUrl":"https:\/\/audibkk.sps-prien.de\/typo3conf\/ext\/zone35_bdm\/Resources\/Public\/Scripts\/Loader\/libs.js","cssUrl":"https:\/\/audibkk.sps-prien.de\/typo3conf\/ext\/zone35_bdm\/Resources\/Public\/Stylesheets\/Loader\/styles.css","widgetMarkup":"\n\n\n\n\t\t\n\n\t\t<div class=\"zone35-bdm-widget zone35-bdm-widget-popup fade\">\n\t\t\t<div class=\"zone35-bdm-widget-content\">\n\t\t\t\t<div class=\"zone35-bdm-widget-inner1\">\n\t\t\t\t\t<div class=\"zone35-bdm-widget-inner2\">\n\t\t\t\t\t\t<iframe class=\"zone35-bdm-widget-iframe\" width=\"100%\" frameborder=\"0\" allow=\"camera *\"><\/iframe>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t<div class=\"zone35-bdm-widget-overlay\"><\/div>\n\t\t<\/div>\n\n\t\n"});
bdmWidget.init();