/**
 * @file input-presets.js
 * @version 20170906 ms
 * @type JS
 * Funktionen zum Patchen von Text-Input-Feldern mit vordefinierten Werten
 */

/**
 * @fn KInputAttachPresets
 *  
 * @param {object} o
 * @param {array} presets
 * @param flags  1 - mark non-preset-values red
 * @param presetId
 * 
 * @return null
 * @return element of param presets
 */
function KInputAttachPresets(o,presets,flags,presetId){
	o.presetId=0;

	/**
	 * @fn searchForId() 
	 * @memberof {o}
	 * @return null, 
	 * @return element of presets
	 */
	o.searchForId=function(id){
		for(var a=0;a<presets.length;a++) if(presets[a].id==id) return presets[a];
		return null;
	};

	/**
	 * @fn searchForCaption(caption) 
	 * @memberof {o}
	 * @param caption
	 */ 
	o.searchForCaption=function(caption){
		for(var a=0;a<presets.length;a++) if(presets[a].caption==caption) return presets[a];
		return null;
	};

	/**
	 * @fn setPresetId id,withEvent
	 * @memberof {o}
	 * @params id,withEvent
	 * @return undefined
	 * @call {o}.searchForId(),  {o}.findByValue()
	 */
	o.setPresetId=function(id,withEvent){
		if(this.presetId!=id){
			var p=this.searchForId(id);
			if(!p){this.value="";this.presetId=0;return;}
			this.value=p.caption;
			this.findByValue();
			if(withEvent) this.dispatchEvent(new Event("input"));
		}
	};

	/**
	 * @fn findByValue()
	 * @member {o}
	 * @call {o}.searchByCaption()
	 */
	o.findByValue=function(){
		var p=this.searchForCaption(this.value);
		this.presetId=p?p.id:0;
		this.style.fontStyle=p?"normal":"italic";
		if(flags & 1) this.style.color=p?"":"red";
	};
	if(presetId) o.setPresetId(presetId); else o.findByValue();

	/// add DOMEvent::input
	o.addEventListener("input",function(){this.findByValue();this.showPresets()});

	/**
	 * @fn showPresets()
	 * @member {o}
	 */
	o.showPresets=function(){
		if(this.timer) clearTimeout(this.timer);
		if(this.selector){document.body.removeChild(this.selector);delete this.selector;}
		var sel=document.createElement("select");
		var v=this.value.toLowerCase();
		for(var a=0;a<presets.length;a++)
			if(v=="" || presets[a].caption.toLowerCase().indexOf(v)>-1){
				var opt=new Option(presets[a].caption,presets[a].id);
				if(presets[a].tip) opt.title=presets[a].tip;
				sel.add(opt);
			}
		if(sel.length==0){delete sel;return;}
		sel.size=Math.max(2,Math.min(16,sel.length));

		/// @var selector @memberof {o}
		this.selector=sel;
		var st=sel.style;st.backgroundColor="#FBFBED";st.position="absolute";st.left=(this.getBoundingClientRect().left+pageXOffset)+"px";st.top=(this.getBoundingClientRect().bottom+pageYOffset)+"px";
		document.body.appendChild(sel);
		if(sel.offsetWidth<this.offsetWidth) sel.style.width=this.offsetWidth+"px";
		this.focus();

		var m=this;
		///add DOMEvent click, keydown, focus, blur
		sel.addEventListener("click",function(){m.setPresetId(this.value,true);m.hidePresetsDo();m.focus()});
		sel.addEventListener("keydown",function(e){
			if(e.keyCode==13){m.setPresetId(this.value,true);m.hidePresetsDo();m.focus()}
			if(e.keyCode==27){m.focus();m.hidePresetsDo();m.focus()}
			if(e.keyCode==38 && this.selectedIndex==0) m.focus();
		});
		sel.addEventListener("focus",function(){if(m.timer) clearTimeout(m.timer)});
		sel.addEventListener("blur",function(){m.hidePresets()});
	};

	/**
	 * @fn hidePreset()
	 * @memberof {o}
	 * @call {o}.hidePresetsDo()
	 * 
	 */
	o.hidePresets=function(){
		if(this.timer) clearTimeout(this.timer);
		var m=this;
		this.timer=setTimeout(function(){m.hidePresetsDo()},100)
	};

	/**
	 * @fn hidePresetsDo()
	 * @memberof {o}
	 * @see {o}.hidePresets()
	 * 
	 */
	o.hidePresetsDo=function(){
		if(this.timer){clearTimeout(this.timer);delete this.timer;}
		if(this.selector){document.body.removeChild(this.selector);delete this.selector;}
	};

	/// add DOMEvent::focus  
	o.addEventListener("focus",function(){this.showPresets()});
	/// add DOMEvent::blur
	o.addEventListener("blur",function(){this.hidePresets()});
	/// add DOMEvent::keydown
	o.addEventListener("keydown",function(e){
		if(e.keyCode==27) this.hidePresetsDo();
		if(e.keyCode==40 && this.selector){this.selector.focus();e.preventDefault();}
	});
};

/**
 * @fn KInputPresetsOnly
 * @params o,presets,presetId
 * 
 * @see ???
 */
function KInputPresetsOnly(o,presets,presetId){
	var hidden=document.createElement("input");
	hidden.type="hidden";
	hidden.id=o.id;
	hidden.name=o.name;
	o.parentNode.insertBefore(hidden,o);
	o.id=null;
	o.name=null;
	KInputAttachPresets(o,presets,1,presetId);
	hidden.value=o.presetId;
	o.addEventListener("input",function(){
		hidden.value=o.presetId;
	});
};

/**
 * @fn KInputPresetsOnlyArra
 * @param o
 * @param presets
 * @param items
 * 
 * @see ???
 */
function KInputPresetsOnlyArray(o,presets,items){
	if(o.tabIndex!=undefined) var tabIndex=parseInt(o.tabIndex); else tabIndex=undefined;
	var lastFocussed;
	var minimized=false;
	var inputs=[];
	var parentNode=o.parentNode;
	var block=true;
	if(!(items instanceof Array)) items=[];

	var hidden=document.createElement("input");
	hidden.type="hidden";
	hidden.id=o.id;
	hidden.name=o.name;
	parentNode.insertBefore(hidden,o);
	o.id=null;
	o.name=null;
	o.style.display="block";

	/**
	 * @fn focus()
	 * @memberof input#hidden
	 */
	hidden.focus=function(){inputs[0].focus()};

	/**
	 * @fn minimize(yes)
	 * @memberof input#hidden
	 */
	hidden.minimize=function(yes){
		minimized=yes;
		this.Store();
	};

	/**
	 * @fn Store
	 * @memberof input#hidden
	 */
	hidden.Store=function(){
		if(block) return;
		items=[];
		var del=[];
		for(var a=0;a<inputs.length;a++) if(inputs[a].presetId) items.push(inputs[a].presetId); else if(inputs[a].value=="" && a<inputs.length-(minimized && inputs.length>1?0:1)) del.push(a);
		var setFocus=false;
		for(a=del.length-1;a>=0;a--){if(inputs[del[a]].tabIndex==lastFocussed) setFocus=true;inputs[del[a]].hidePresetsDo();parentNode.removeChild(inputs[del[a]]);inputs.splice(del[a],1);}
		if(inputs[inputs.length-1].presetId && !minimized) inputs[0].clone(inputs.length);
		if(setFocus) inputs[del[del.length-1]].focus();
		hidden.value=items.join(",");
	};

	/**
	 * @fn GraftInput
	 * @memberof input#hidden
	 */
	hidden.GraftInput=function(o,index){
		if(tabIndex!=undefined) o.tabIndex=""+(++tabIndex);
		o.value="";
		KInputAttachPresets(o,presets,1,index<items.length?items[index]:0);
		/// add DOMEvent::input
		o.addEventListener("input",function(){hidden.Store()});
		/// add DOMEvent::focus
		o.addEventListener("focus",function(){lastFocussed=tabIndex});
		/// add DOMEvent::blur
		o.addEventListener("blur",function(){lastFocussed=undefined});
		/**
		 * @fn clone(index)
		 * @memberof {o}
		 */
		o.clone=function(index){
			var o=inputs[0].cloneNode(true);
			parentNode.appendChild(o);
			hidden.GraftInput(o,index);
		};
		inputs.push(o);
	};

	hidden.GraftInput(o,0);
	for(var a=1;a<items.length+1;a++) o.clone(a);

	block=false;
	hidden.Store();	// populate hidden.value
};

/**
 * @fn KInputSelectArray
 * @param o
 * @param presets
 * @param items
 * 
 * @see offer-edit_html.php:225
 */
function KInputSelectArray(o,presets,items){
	if(o.tabIndex!=undefined) var tabIndex=parseInt(o.tabIndex); else tabIndex=undefined;
	var lastFocussed;
	var minimized=false;
	var inputs=[];
	var parentNode=o.parentNode;
	var block=true;
	if(!(items instanceof Array)) items=[];

	var hidden=document.createElement("input");
	hidden.type="hidden";
	hidden.id=o.id;
	hidden.name=o.name;
	parentNode.insertBefore(hidden,o);
	o.id=null;
	o.name=null;
	o.style.display="block";
	hidden.focus=function(){inputs[0].focus()};
	hidden.minimize=function(yes){
		minimized=yes;
		this.Store();
	};

	hidden.Store=function(){
		if(block) return;
		items=[];
		var del=[];
		for(var a=0;a<inputs.length;a++) if(inputs[a].selectedIndex) items.push(inputs[a].value); else if(a<inputs.length-(minimized && inputs.length>1?0:1)) del.push(a);
		var setFocus=false;
		for(a=del.length-1;a>=0;a--){if(inputs[del[a]].tabIndex==lastFocussed) setFocus=true;parentNode.removeChild(inputs[del[a]]);inputs.splice(del[a],1);}
		if(inputs[inputs.length-1].selectedIndex && !minimized) inputs[0].clone(inputs.length);
		if(setFocus) inputs[del[del.length-1]].focus();
		hidden.value=items.join(",");
	};
	hidden.GraftInput=function(o,index){
		if(tabIndex!=undefined) o.tabIndex=""+(++tabIndex);

		if(index<items.length) o.value=items[index]; else o.selectedIndex=0;
		o.addEventListener("change",function(){hidden.Store()});
		o.addEventListener("click",function(){hidden.Store()});
		o.addEventListener("keyup",function(){hidden.Store()});

		o.addEventListener("focus",function(){lastFocussed=tabIndex});
		o.addEventListener("blur",function(){lastFocussed=undefined});
		o.clone=function(index){
			var o=inputs[0].cloneNode(true);
			parentNode.appendChild(o);
			hidden.GraftInput(o,index);
		};
		inputs.push(o);
	};

	o.add(new Option(navigator.userAgent.toLowerCase().indexOf('chrome')>-1?"":"\u2063","",false,false));
	for(var a=0;a<presets.length;a++) {
		var opt=new Option(presets[a].caption,presets[a].id);
		if(presets[a].tip) opt.title=presets[a].tip;
		o.add(opt);
	}

	hidden.GraftInput(o,0);
	for(var a=1;a<items.length+1;a++) o.clone(a);

	block=false;
	hidden.Store();	// populate hidden.value
};