/**
 * @overview  Merkzettel-Widget
 * @name      DL.Widget.Leaflet
 * @version   1.0 ($Revision: 1.0 $)
 * @updated   2010/02/10
 * @author    Alexander Ließmann <a href="mailto:al@dreamway.com">al@dreamway.com</a>
 * @copyright Copyright (c) 2010, <a href="http://dreamway.com/">Eberl Online GmbH</a>.
 */


/**
 * Leaflet-Widget
 * @name DL.Widget.Leaflet
 * @constructor
 * @type {DL.Class}
 */
DL.Widget.Leaflet = new DL.Class({
	
	/**
	 * Anzahl der gemerkten Einträge
	 * @name index
	 * @memberof DL.Widget.Leaflet
	 * @type {Integer}
	 */
	index: 0,
	
	/**
	 * XHR Instanzen kommen hier rein
	 * @name xhrs
	 * @memberof DL.Widget.Leaflet
	 * @type {Array}
	 */
	xhrs: [],
	
	/**
	 * Arrays in denen die Indexe der zugehörigen Einträge liegen
	 * @name urlIndex, hostIndex, offerIndex
	 * @memberof DL.Widget.Leaflet
	 * @type {Array}
	 */
	urlIndex: [],
	hostIndex: [],
	offerIndex: [],
	
	/**
	 * Initialize
	 * @name initialize
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	initialize: function(options)
	{
		/**
		 * Optionen
		 * @name options
		 * @memberof DL.Widget.Leaflet
		 * @type {Object}
		 */
		this.options = {
			
			/**
			 * Referenz auf das Element, welches den Merkzettelinhalt enthalten soll
			 * @name content
			 * @memberof DL.Widget.Leaflet.options
			 * @type {HTMLElement}
			 */
			content: null,
			
			/**
			 * Referenz auf das Element, in welchem die Tabs generiert werden sollen
			 * @name tabs
			 * @memberof DL.Widget.Leaflet.options
			 * @type {HTMLElement}
			 */
			tabs: null,
			
			/**
			 * Bezeichnungen der Tabs
			 * @name Tab Ids
			 * @memberof DL.Widget.Leaflet.options
			 * @type {String}
			 */
			tabUrlId: 'lltaburl',
			tabHostId: 'lltabgg',
			tabOfferId: 'lltabps',
			
			/**
			 * ID des Übersichtslinks
			 * @name overviewLink
			 * @memberof DL.Widget.Leaflet.options
			 * @type {String}
			 */
			overviewLink: 'leafletOverview',
			
			/**
			 * Numerische ID des geöffneten Tabs
			 * 0 = URL
			 * 1 = Gastgeber
			 * 2 = Pauschalen
			 * @name activeTab
			 * @memberof DL.Widget.Leaflet.options
			 * @type {Integer}
			 */
			activeTab: 1,
			
			/**
			 * Anzahl der max. Zeichen in der Beschreibung
			 * @name textLength
			 * @memberof DL.Widget.Leaflet.options
			 * @type {Integer}
			 */
			textLength: 20,
			
			noUrlText: 'Sie haben noch keine Seite zum Merkzettel hinzugefügt.',
			noHostText: 'Sie haben noch keinen Gastgeber zum Merkzettel hinzugefügt.',
			noOfferText: 'Sie haben noch keine Pauschale zum Merkzettel hinzugefügt.',
			
			lifetime: 14 * 24 * 60 * 60 * 1000 // 2 Wochen
		};
		
		var o = this.setOptions(options);
		
		this.options.tabs = [o.tabUrlId, o.tabHostId, o.tabOfferId];
		this.options.tabContent = [o.tabUrlId + 'Content', o.tabHostId + 'Content', o.tabOfferId + 'Content'];
		
		this.c = DL.Cookie;
		this.c.saveAs = 'leaflet';
		this.c.lifetime = this.options.lifetime;
		
		DL.Element.addNode(o.content, DL.$C('div', {'id': this.options.tabContent[0], 'className': 'container'}, DL.$C('p', o.noUrlText)));
		DL.Element.addNode(o.content, DL.$C('div', {'id': this.options.tabContent[1], 'className': 'container'}, DL.$C('p', o.noHostText)));
		DL.Element.addNode(o.content, DL.$C('div', {'id': this.options.tabContent[2], 'className': 'container'}, DL.$C('p', o.noOfferText)));

		DL.Event.addHandler(DL.$(o.tabUrlId), 'click', DL.bind(function(e) {
			this.displayTab(0, DL.Event.target(e));
		}, this));
		
		DL.Event.addHandler(DL.$(o.tabHostId), 'click', DL.bind(function(e) {
			this.displayTab(1, DL.Event.target(e));
		}, this));
		
		DL.Event.addHandler(DL.$(o.tabOfferId), 'click', DL.bind(function(e) {
			this.displayTab(2, DL.Event.target(e));
		}, this));
		
		var at = this.options.activeTab;
		
		this.getLeaflet();
		
		this.displayTab(at);
		
		this.displayOverviewLink();
		
	},
	
	/**
	 * Ausgabe des Merkzettelinhalts (vorerst nur Gastgeber)
	 * @name output
	 * @memberof DL.Widget.Leaflet
	 * @param {String} Target Element for Hosts
	 * @param {String} Target Element for Offers
	 * @param {String} Target Element for URLs
	 */
	output: function() {

		var targetHost = ( typeof(arguments[0]) != 'undefined' ) ? arguments[0] : false;
		var targetOffer = ( typeof(arguments[1]) != 'undefined' ) ? arguments[1] : false;
		var targetURL = ( typeof(arguments[2]) != 'undefined' ) ? arguments[2] : false;
		
		DL.Object.each(this.c.values, DL.bind(function(val, index) {
				switch ( this._detectType(val) ) {
					case 0:
						// TODO: Was machen wir mit URLs in der Gesamtübersicht?
						break;
					case 1:
						if ( targetHost == false ) break;
						this.xhrs[this.xhrs.length] = new DL.XHR({
							method: 'post',
							url: '/cgi-bin/siteengine.pl?Travel::Extern::GetGastgeber',
							oncomplete: function(result) { 
								DL.$(targetHost).innerHTML = DL.$(targetHost).innerHTML + result;
							}
						});
						this.xhrs[this.xhrs.length - 1].send({data: 'gid=' + val.h});
						break;
					case 2:
						if ( targetOffer == false ) break;
						this.xhrs[this.xhrs.length] = new DL.XHR({
							method: 'post',
							url: '/cgi-bin/siteengine.pl?Travel::Extern::GetPauschale',
							oncomplete: function(result) { 
								DL.$(targetOffer).innerHTML = DL.$(targetOffer).innerHTML + result;
							}
						});
						this.xhrs[this.xhrs.length - 1].send({data: {gid: val.h, o: val.o}});
						break;
				};
			}, 
		this));
	},
	
	/**
	 * Merken
	 * @name displayLeaflet
	 * @memberof DL.Widget.Leaflet
	 * @param {String} Titel
	 * @param {String} Beschreibung
	 * @param {String} URL
	 * @param {Integer} Gastgeber ID
	 * @param {Integer} Pauschalen ID
	 * @function
	 */
	notice: function(title, description, url, gID, pID) {
		var o = this.options;
		
		var notice = {
			't': ( title ) ? title : document.title,
			'd': ( description ) ? description.substr(0, o.textLength) + '...' : this._getDescription(),
			'u': ( url ) ? url : window.location.href,
			'o': ( pID ) ? pID : false,
			'h': ( gID ) ? gID : false
		};
		
		if ( this._filterEntries(notice) == true ) {
			// Kodieren
			notice.u = encodeURIComponent(notice.u);
			notice.t = encodeURIComponent(notice.t);
			notice.d = encodeURIComponent(notice.d);
			
			this.c.set(this.index, notice);
			this.genLink(notice);
			this.index++;
		}
		
		this.displayOverviewLink();
	},
	
	/**
	 * Übersichtslink ein- / ausblenden
	 * @name displayOverviewLink
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	displayOverviewLink: function() {
		if ( DL.Object.keys(this.c.values).length > 0 ) {
			DL.$(this.options.overviewLink).style.display = 'block';
		} else {
			DL.$(this.options.overviewLink).style.display = 'none';
		}
	},
	
	/**
	 * Gemerkte Daten auslesen
	 * @name getLeaflet
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	getLeaflet: function() {
		var o = this.options;
		
		this.c.load();

		var notices = this.c.get('leaflet');
		// this.c.clear();

		// Umsortieren
		DL.Object.each(notices, function(notice, index) {

			// this.c.set(this.index, notice);
			
			this.genLink(notice);
			this.index++;
		}, this);
	},
	
	/**
	 * Linkelement generieren, Tabs verfügbar machen und Tab-Indexe erstellen
	 * @name _getLink
	 * @memberof DL.Widget.Leaflet
	 * @param {Object} Notiz-Daten
	 * @function
	 */
	genLink: function(notice) {
		var o = this.options;
		var url;
		var t;
		var index = [];

		var type = this._detectType(notice);
		
		if ( typeof(type) == 'undefined' ) return;
		
		switch ( type ) {

			case 0:
				index = this.urlIndex;
				url = decodeURIComponent(notice.u);
				break;

			case 1:
				index = this.hostIndex;
				url = 'http://' + window.location.host + '/travel/' + notice.h + '/' + notice.u;
				break;

			case 2:
				index = this.offerIndex;
				url = 'http://' + window.location.host + '/travel/' + notice.h + '/pauschalen.html?id=' + notice.o;
				break;
		}

		t = this.options.tabContent[type];
		
		if ( index.length == 0 ) DL.Element.removeChildNodes(DL.$(t));
		index.push(this.index);
		
		// Decodieren für IE
		notice.t = decodeURIComponent(notice.t);
		notice.d = decodeURIComponent(notice.d);
		
		var elements = DL.$C('div', {'className': 'clear'},
					DL.$C('span', {
						'className': 'lldelnotice', 
						'id': 'lln' + this.index, 
						'onclick': DL.bind(function(e) {
							this.removeLink(e);
						}, this)
					}),
					DL.$C('a', {'href': url, 'title': notice.t}, notice.t),
					DL.$C('br'),
					DL.$C('span', notice.d)
				);

		DL.Element.addNode(DL.$(t), elements);
		
	},
	
	removeLink: function(e) {
		var item = DL.Event.target(e);
		var index = parseInt(item.id.substr(3));
		
		// Wert aus Cookie entfernen
		this.c.remove(index);
		this.c.save();
		
		// Wert aus Index entfernen
		if ( DL.Array.indexOf(this.urlIndex, index) >= 0 ) {
			DL.Array.removeValue(this.urlIndex, index);
			if ( this.urlIndex.length == 0 ) { 
				DL.Element.addNode(DL.$(this.options.tabContent[0]), DL.$C('p', this.options.noUrlText)); 
			};
		}
		
		if ( DL.Array.indexOf(this.hostIndex, index) >= 0 ) {
			DL.Array.removeValue(this.hostIndex, index);
			if ( this.hostIndex.length == 0 ) { 
				DL.Element.addNode(DL.$(this.options.tabContent[1]), DL.$C('p', this.options.noHostText)); 
			};
		}
		
		if ( DL.Array.indexOf(this.offerIndex, index) >= 0 ) {
			DL.Array.removeValue(this.offerIndex, index);
			if ( this.offerIndex.length == 0 ) { 
				DL.Element.addNode(DL.$(this.options.tabContent[2]), DL.$C('p', this.options.noOfferText)); 
			};
		}
		
		//HTML Element entfernen
		DL.Element.removeNode(item.parentNode);
		
		// Merkzettelübersicht ein-/ausblenden
		this.displayOverviewLink();
	},
	
	/**
	 * Description einer Seite ermitteln
	 * @name _getDescription
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	displayTab: function(i) {
		DL.Element.removeClass(DL.$(this.options.tabs[this.options.activeTab]), 'active');
		DL.Element.addClass(DL.$(this.options.tabs[i]), 'active');

		DL.$(this.options.tabContent[this.options.activeTab]).style.display = 'none';
		DL.$(this.options.tabContent[i]).style.display = 'block';

		this.options.activeTab = i;
	},

	/**
	 * Typ eines Merkzetteleintrags ermitteln
	 * @name _detectType
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	_detectType: function(notice) {
		// URL
		if ( notice.u && ! ( notice.h || notice.o ) ) return 0;
		
		// Gastgeber
		if ( notice.h && ! notice.o ) return 1;
		
		// Pauschale
		if ( notice.o && notice.h ) return 2;
	},
	
	/**
	 * Description einer Seite ermitteln
	 * @name _getDescription
	 * @memberof DL.Widget.Leaflet
	 * @function
	 */
	_getDescription: function() {
		var o = this.options;
		var m = document.getElementsByTagName('meta');
		for ( i = 0; i < m.length; i++ ) {
			if ( m[i].getAttribute('name').toLowerCase() == 'description' ) {
				return m[i].getAttribute('content').substr(0, o.textLength) + '...';
			}
		}
	},
	
	/**
	 * Filtert die Einträge um Doubletten zu vermeiden
	 * @name _filterEntries
	 * @memberof DL.Widget.Leaflet
	 * @param {Object} Notiz-Daten
	 * @function
	 * @return {Bool}
	 */
	_filterEntries: function(cur) {
		var insert = true;
		DL.Object.each(
			this.c.values,
			function(val, i) {
				if ( val.t == cur.t && 
					 val.d == cur.d && 
					 ( decodeURIComponent(val.u) == cur.u || val.u == cur.u ) && 
					 val.o == cur.o && val.h == cur.h ) {
					insert = false;
				}
			}
		);
		return insert;
	}
});


DL.Widget.Leaflet.implement(new DL.Class.Options);