/**
 * TSP functions library
 */

	var cmtForm = Class.create();

	cmtForm.prototype = {
		initialize: function(params) {

			this.defaultParams = new Object ({
				selectSelector : '.cmtFormSelect'
			});

			// Parameter zusammenführen
			params = this.mergeParams(params);

			// Interne Variablen
			this.formElements = new Object();
			Element.extend(this.formElements);
			this.formElementCurrent = '';

			// Select-Felder ersetzen
			this.replaceSelect(params);

			// Klick auf Dokument schließt alle Select-Felder
			Event.observe(document, 'click', this.closeAllSelect.bindAsEventListener(this));
		},

		replaceSelect: function(params) {

			/*
			if (typeof(params) != 'object') {
				params = this.replaceSelectDefaultParams
			}
			*/
			formSelect = $$(params.selectSelector);
			
			// Alle ausgewählten Select-Felder bearbeiten
			for (i = 0; i < formSelect.length; i++) {

				select = formSelect[i];
				headlineContent = '';
				isSelected = false;

				selectID = select.readAttribute('id')

				// Liste erstellen
				ul = Element.extend(document.createElement('ul'));
				ul.writeAttribute('id', 'cmtFormSelectContent_'+selectID);
				ul.writeAttribute('class', select.readAttribute('class'));

				// Listenelemente aus Options erstellen
				formSelectOptions = select.select('option');
//alert(typeof select.selectedIndex)
				for (c = 0; c < formSelectOptions.length; c++) {

					option = formSelectOptions[c];
					li =  Element.extend(document.createElement('li'));
					//li.writeAttribute('cmtFormSelectOption_'+selectID+$(option).getAttribute('value'));
					li.writeAttribute('id', 'cmtFormSelectOption_'+selectID+'_'+$(option).readAttribute('value'));
					li.update($(option).innerHTML);
					Event.observe(li, 'click', this.clickSelectOption.bindAsEventListener(this));

					isSelected = $(option).readAttribute('selected');
					if (isSelected === 'selected' || isSelected === true) {
						
						li.addClassName('cmtFormSelectOptionSelected');
						headlineContent = $(option).innerHTML;
						//alert($(option)+" => "+headlineContent+": "+isSelected+", Index: "+select.selectedIndex)
					}

					// Zusätzliche
					/*
					a = Element.extend(document.createElement('a'));

					a.update($(option).innerHTML);
					a.writeAttribute('href','test.html');
					$(li).insert(a);
					*/
					$(ul).insert(li)
				}

				// Headline?
				headline = Element.extend(document.createElement('h6'));
				
				if (headlineContent) {
					headline.update(headlineContent);
				} else {
					headline.update(select.readAttribute('title'));
				}
				headlineHeight = headline.getHeight();

				// Handle?
				handle = Element.extend(document.createElement('div'));
				handle.writeAttribute('class', 'cmtFormSelectHandle');
				handle.writeAttribute('id', 'cmtFormSelectHandle_'+selectID);
				Event.observe(handle, 'click', this.toggleMenu.bindAsEventListener(this));

				handleHeight = handle.getHeight();

				// Außencontainer erstellen
				menuContainer = Element.extend(document.createElement('div'));
				menuContainer.writeAttribute('class', 'cmtFormSelectContainer');
				menuContainer.writeAttribute('id', 'cmtFormElement_'+selectID);

				// Menü registrieren
				this.formElements[selectID] = new Object({
					formElementType: 'select',
					menuID: menuContainer.readAttribute('id'),
					menuHeadline: headline,
					menuHandle: handle,
					menuContent: ul,
					formElement: select
				});

				// Aktionen bei Wertänderung oder Klick?
				if (typeof(params.selectProperties) != 'undefined' && typeof(params.selectProperties[selectID]) != 'undefined'){
					this.formElements[selectID].onChange = params.selectProperties[selectID].onChange;
					this.formElements[selectID].addValue = params.selectProperties[selectID].addValue;
				}
				
				// Fertiges Menü einfügen
				selectParent = select.up();
				
				menuContainer.insert(headline);
				menuContainer.insert(ul);
				menuContainer.insert(handle);

				selectParent.insert(menuContainer);

				// CSS-Eigenschaften zur Positionierung übernehmen
				selectParent.setStyle({position: 'relative'});		// WICHTIG!!! Da sonst selectPosition falsch
				
				// Primäre CSS-Eigenschaften 
				selectPosition = select.positionedOffset();
				selectWidth = select.getStyle('width');
				if (!selectWidth) {
					selectWidth = select.getWidth+'px';
				}
				cssProperties = new Object({
											position: 'absolute',
											width: selectWidth,
											left: selectPosition[0]+'px',
											top: selectPosition[1]+'px'
										});

				if (typeof(params.selectProperties) != 'undefined' && typeof(params.selectProperties[selectID].css) != 'undefined') {
					Object.extend(cssProperties, params.selectProperties[selectID].css);
				}

				menuContainer.setStyle(cssProperties);

				// Höhe anpassen
				selectParent.setStyle({
										height: (handle.getHeight()+headline.getHeight())+'px'
									});

				// Menüs zuklappen, bzw. verstecken
				select.hide();
				ul.hide();

			}
		},

		/*
		 * Click Select Option
		 * event => Klick auf Listenelement,
		 * ID z.B. 'cmtFormSelectOption_office_2' => 'cmtFormSelectOption_'+ ID des Select-Feldes+'_'+Wert der Option (value)
		 */
		clickSelectOption: function(ev) {

			el = Event.element(ev);
			Event.stop(ev);

			IDParts = el.readAttribute('id').split('_');
			menuData = this.formElements[IDParts[1]];
			selectedValue = IDParts[2];

			//menuData.formElement.writeAttribute('value',IDParts[2]);
			menuData.menuHeadline.update(el.innerHTML);

			options = menuData.formElement.select('option');
			for (i = 0; i < options.length; i++) {

				if (options[i].readAttribute('value') == IDParts[2]) {
					options[i].writeAttribute('selected', 'selected');
					break;
				}
			}

			this.resetSelection(menuData)
			el.addClassName('cmtFormSelectOptionSelected');

			this.toggleMenu(menuData.menuContent, 'object');

			// Zusätzliche Aktionen nötig?
			if (menuData.onChange) {

				v = eval('this.'+menuData.onChange+'("'+selectedValue+'","'+menuData.addValue+'")');

			}

		},

		/*
		 * Open Menu
		 */
		toggleMenu: function(ev, type) {
			
			if (!type) type='';
			
			switch (type) {
				// Falls direkt eine Referenz auf das Objekt übergeben wird
				case 'object':
					
					el = ev;
					menuIDElements = el.readAttribute('id').split(/_/);
					menuID = 'cmtFormSelectContent_'+menuIDElements[1];

					this.toggleHandle('cmtFormSelectHandle_'+menuIDElements[1]);
					break;

				// Falls Event oder Objekt-ID übergeben wird.
				default:
					if (typeof(ev) == 'object') {
						el = Event.element(ev);
						Event.stop(ev);

						menuIDElements = el.readAttribute('id').match(/^[^_]*_(.*)/);
						menuID = 'cmtFormSelectContent_'+menuIDElements[1];

						this.toggleHandle(el.id);
					} else {
						menuID = ev;
						this.toggleHandle(ev.replace(/Content/, 'Handle'));
					}

					break;
			}


			Effect.toggle($(menuID), 'blind', {duration: 0.3});

			// close submenu when open
			/*
			if ($(this.menuContentID).getStyle('display') != 'block' && $(this.submenuContentContainerID).getStyle('display') == 'block') {
				this.hideMenu(this.submenuContentContainerID);
				this.toggleHandle(this.submenuHandleID);
			}
			*/

			
		},

		toggleHandle: function(elID) {
			el = $(elID);

			if (el.hasClassName('cmtFormSelectHandleClose')) {
				el.removeClassName('cmtFormSelectHandleClose')
			} else {
				el.addClassName('cmtFormSelectHandleClose')
			}
		},

		closeAllSelect: function(ev) {

			for (a in this.formElements) {
				menuData = this.formElements[a];
				if (menuData.formElementType == 'select' && menuData.menuContent.visible()) {
					Effect.BlindUp(menuData.menuContent, {duration: 0.1});
					menuData.menuHandle.removeClassName('cmtFormSelectHandleClose')
				}
			}
			this.formElementCurrent = '';

		},

		resetSelection: function(menuData) {
			liElements = menuData.menuContent.select('li');
			liElements.each(
				function(el){el.removeClassName('cmtFormSelectOptionSelected')}
			);
		},

		/**
		 * function hideAllSelect(prefix)
		 * verstecke alle Menüs
		 *
		 * @param value string Wert des Optionsfeldes
		 * @param prefix string Optionaler, nur Selectfelder mit diesem Prefix vor der ID werden ausgeblendet
		 *
		 * @return void
		 */
		showDependentElement: function(value, prefix) {
			this.hideAllDependentElements(prefix);
			menuID = this.formElements[prefix + value].menuID;
			// console.info(this.formElements[prefix + value]);
			if (typeof(menuID) != 'undefined') {
				$(menuID).show();
			}
		},

		/**
		 * function hideAllSelect(prefix)
		 * verstecke alle Menüs
		 *
		 * @param prefix string Optionaler, nur Selectfelder mit diesem Prefix vor der ID werden ausgeblendet
		 *
		 * @return void
		 */
		hideAllDependentElements: function(prefix) {
			if (typeof(prefix) == 'undefined') {
				prefix = '';
			}
			regEx = '_'+prefix+'';
			
			for (a in this.formElements) {
			
				if (this.formElements[a].menuID.search(regEx) != -1) {
					$(this.formElements[a].menuID).hide();
				}
			}
		},


		mergeParams: function(params) {
			return Object.extend(this.defaultParams, params);
		},

		/**
		 * function addFormElement(params)
		 * Fügt der automatisch generierten, internen Formularfeldliste einen Formularfeldcontainer an.
		 *
		 * @param params object Object mit allen relevanten Parametern
		 *
		 * @return void
		 */
		addFormElement: function(params) {

			// Menü registrieren
			newID = 'cmtFormElement_'+params.menuID;

			this.formElements[params.menuID] = new Object({
				formElementType: params.formElementType,
				menuID: newID,
				menuHeadline: $(params.menuHeadline),
				menuHandle: $(params.menuHandle),
				menuContent: $(params.menuContent),
				formElement: $(params.formElement)
			});
			$(params.menuID).writeAttribute('id', newID);
		},

		/**
		 * function submitForm(params)
		 * Fügt der automatisch generierten, internen Formularfeldliste einen Formularfeldcontainer an.
		 *
		 * @param params object Object mit allen relevanten Parametern
		 *
		 * @return void
		 */
		submitForm: function(value, formID) {
			$(formID).submit();
		},

/* ----------- */
		/*
		 * Open Menu
		 */
		selectMenu: function(menuNr) {
			this.showMenuTitle(menuNr);
		},

		/*
		 * Open Menu
		 */
		selectSubmenu: function(menuNr, submenuNr) {
			this.showSubmenu(menuNr);
			this.showSubmenuTitle(menuNr,submenuNr);
		},

		/*
		 * Open Menu
		 */
		hideMenu: function(menuID) {
			$(menuID).hide();
		},

		/*
		 * Open Menu
		 */
		show: function(params) {

		},

		showMenuTitle: function(menuNr) {
			refMenuHeadline = $(this.menuID).select('h5');
			refMenuHeadline[0].update(this.menuSelectionTitles[menuNr]);

			refSubmenuHeadline = $(this.submenuID).select('h5');
			refSubmenuHeadline[0].update(this.submenuSelectionTitles[menuNr]);
		},

		showSubmenuTitle: function(menuNr,submenuNr) {
			
			refSubmenuHeadline = $(this.submenuID).select('h5');
			refSubmenuTitles = $(this.submenuContentIDs[menuNr]).select('#var_'+submenuNr);
			refSubmenuHeadline[0].update(refSubmenuTitles[0].innerHTML);

		},

		/*
		 * Change Submenu
		 */
		changeSubmenu: function(ev) {
			this.hideAllSubmenus();
			el = Event.element(ev);

			modeNr = el.id.match(/([0-9]*)$/);
			menuNr = parseInt(modeNr);
			if (menuNr >= 0) {
				this.showSubmenu(menuNr);
				this.showMenuTitle(menuNr);
				this.toggleMenu(this.menuContentID);
			}
		},

		showSubmenu: function(submenuNr) {
			if (submenuNr >= 0) {
				$(this.submenuContentIDs[submenuNr]).show();
			}
		},

		/*
		 * Hide all submenues
		 */
		hideAllSubmenus: function() {
			for (i = 0; i < this.submenuContentIDs.length; i++) {
				el = this.submenuContentIDs[i];
				$(el).hide();
			}
		},

		/*
		 * Helper: check params
		 */
		checkObject: function(params) {
			if (typeof(params) == 'undefined') {
				return new Object;
			} else {
				return params;
			}
		}
	}