/**
 * @file win.js
 * @version 20170907 ms
  * @type JS
 * GUI-Komponente zur Darstellung ein oder mehrerer DIV-basierter Fenster
 */

function KWin(){
	var m=this;
	if("ontouchstart" in document){
		document.addEventListener("touchstart",function(e){e.button=0;e.clientX=e.touches[0].clientX;e.clientY=e.touches[0].clientY;m.MouseDown(e)});
		document.addEventListener("touchmove",function(e){e.clientX=e.touches[0].clientX;e.clientY=e.touches[0].clientY;m.MouseMove(e)});
		document.addEventListener("touchend",function(e){m.MouseUp(e)});
	}
	document.addEventListener("mousedown",function(e){m.MouseDown(e)});
	document.addEventListener("mousemove",function(e){m.MouseMove(e)});
	document.addEventListener("mouseup",function(e){m.MouseUp(e)});
};

/**
 * @fn Html2Object
 * @memberof KWin 
 * @param html
 * @return DOMnode of the first ChildNode of div
 * Private static method.
 * Create a div with fnparam html as content.
 */
KWin.Html2Object=function(html){
	var p=document.createElement("div");p.innerHTML=html;
	return p.firstChild;
}

KWin.prototype.windows=[];

KWin.TemplateDefault={
	bg:"<div style='z-index:9999;background-color:rgba(255,255,255,0.5);cursor:not-allowed'></div>",
	win:"<div style='z-index:9999;background-color:#FFFFFF;border:#ACACAC solid 1px;box-shadow:0 4px 16px rgba(0, 0, 0, 0.2)'></div>",
	bar:"<div style='padding:6px;padding-left:10px;background-color:#F6F6F6'><span style='font-size:15px;font-weight:bold;margin-right:24px'>{title}</span>{close}</div>",
	close:"<img src='data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTQiIHdpZHRoPSIxNCIgdmVyc2lvbj0iMS4xIj48cGF0aCBzdHlsZT0iZmlsbDojNzM4NDhjIiBkPSJNIDAuNTAwMDAwMDIsMTAuODk5OTk5IDQuMzk5OTk5OCw3IDAuNTAwMDAwMDIsMy4xMDAwMDAyIDMuMDk5OTk5OSwwLjUwMDAwMDI4IDYuOTk5OTk5Nyw0LjQwMDAwMDEgMTAuODk5OTk5LDAuNTAwMDAwMjggMTMuNSwzLjEwMDAwMDIgOS41OTk5OTk2LDcgMTMuNSwxMC44OTk5OTkgMTAuODk5OTk5LDEzLjUgNi45OTk5OTk3LDkuNjAwMDAwMiAzLjA5OTk5OTksMTMuNSBaIiAvPjwvc3ZnPg==' style='position:absolute;right:6px;top:6px;width:16px;height:16px'>",
	body:"<div style='padding:6px'>{body}</div>"
}
KWin.TemplateOrange={
	bg:"<div style='z-index:9999;background-color:rgba(0,0,0,0.5);cursor:not-allowed'></div>",
	win:"<div style='z-index:9999;background-color:#FFF6C3;border:#F9CD02 solid 1px;border-radius:5px 5px 5px 5px;box-shadow:0 0 6px 0 black'></div>",
	bar:"<div style='padding:6px;background-color:#FCCE54'><span style='font-weight:bold;margin-right:40px'>{title}</span>{close}</div>",
	close:"<div style='position:absolute;right:3px;top:3px;width:26px;background-color:#FF1F1F;border:#C80000 solid 1px;border-radius:5px 5px 5px 5px;color:#FFFFFF;font-size:12pt;font-weight:bold;text-align:center'>X</div>",
	body:"<div style='padding:6px'>{body}</div>"
}

/**
 * @fn Open
 * @memberof KWin
 * @param {any} type
 * @param {any} id
 * @param {object} opts: title (string), modal (boolean), autoclose (boolean), borderless (boolean), iframe (boolean), scrollbars (boolean - iframe content only), x, y, w, h, template
 * @returns {object:window}
 * Public method.
 */
KWin.prototype.Open=function(type,id,opts){
	if(!opts) opts={};
	var template=KWin.TemplateDefault;
	if(opts.template) template=opts.template;
	this.CloseById(type,id);
	var win={type:type,id:id,opts:opts,centerX:!opts.x,centerY:!opts.y};
	var m=this;

	if(opts.modal){
		win.bg=KWin.Html2Object(template.bg);
		var st=win.bg.style;st.position="absolute";st.left="0";st.top="0";st.width="100%";st.height="100%";
		document.body.appendChild(win.bg);
		win.bg.ondblclick=function(){m.Close(win)};
	}

	win.win=KWin.Html2Object(template.win);
	var st=win.win.style;st.position="absolute";st.left=opts.x?opts.x+"px":"0";st.top=opts.y?opts.y+"px":"0";
	document.body.appendChild(win.win);
	win.win.onmousedown=function(e){e.stopPropagation()};	// prevent document.mousedown

	if(!opts.borderless){
		var bar=KWin.Html2Object(template.bar.replace(/{title}/g,opts.title?opts.title:"").replace(/{close}/g,"<div id='KWinDummy'></div>"));
		var st=bar.style;st.cursor="default";st.userSelect="none";st.MozUserSelect="none";st.MsUserSelect="none";st.WebkitUserSelect="none";
		win.win.appendChild(bar);
		if("ontouchstart" in bar) bar.addEventListener("touchstart",function(e){m.WinDrag(win)});
		bar.onmousedown=function(e){m.mx=e.clientX;m.my=e.clientY;m.WinDrag(win)};

		var close=KWin.Html2Object(template.close);
		var dummy=document.getElementById("KWinDummy");
		dummy.parentNode.replaceChild(close,dummy);
	}

	if(opts.iframe){
		win.o=document.createElement("iframe");st=win.o.style;st.display="block";st.border="0";st.overflow=opts.scrollbars?"auto":"hidden";
		win.o.scrolling="no";	// Needed for Firefox - it ignores style.overflow="hidden";
	}else
		win.o=document.createElement("div");
	if(typeof opts.w!="undefined") win.o.style.width=opts.w+"px";
	if(typeof opts.h!="undefined") win.o.style.height=opts.h+"px";

	var body=KWin.Html2Object(template.body.replace(/{body}/g,"<div id='KWinDummy'></div>"));
	if(opts.borderless) body.style.padding="0";
	win.win.appendChild(body);
	dummy=document.getElementById("KWinDummy");
	dummy.parentNode.replaceChild(win.o,dummy);

	if(opts.borderless){
		close=KWin.Html2Object(template.close);
		win.win.appendChild(close);
	}

	close.style.cursor="pointer";
	close.onclick=function(e){m.Close(win)};

	this.windows.push(win);
	setTimeout(function(){m.Resize(win)},0);
	return win;
}

/**
 * @fn Resize
 * @memberof KWin
 * @param {object:window} win
 * @param {int} w
 * @param {int} h
 * Public method.
 */
KWin.prototype.Resize=function(win,w,h){
	if(win){
		if(w>0) win.o.style.width=w+"px";
		if(h>0) win.o.style.height=h+"px";
		if(win.centerX) win.win.style.left=(pageXOffset+(window.innerWidth-win.win.offsetWidth)/2)+"px";
		if(win.centerY) win.win.style.top=(pageYOffset+(window.innerHeight-win.win.offsetHeight)/2)+"px";
	}
};

/**
 * @fn Close
 * @memberof KWin
 * @param {object:window} win
 * Public method.
 */
KWin.prototype.Close=function(win){
	if(win){
		document.body.removeChild(win.win);
		if(win.bg) document.body.removeChild(win.bg);
		for(var a=0;a<this.windows.length;a++) if(this.windows[a]==win){this.windows.splice(a,1);break}
		delete win;
	}
};

/**
 * @fn
 * @memberof KWin
 * @param {any} type
 * @param {any} id
 * Public method.
 */
KWin.prototype.CloseById=function(type,id){
	this.Close(this.Find(type,id));
};

/**
 * @fn Find
 * @memberof KWin
 * @param {any} type 
 * @param {any} id
 * @return {object:window} or {false} if not found
 * Public method.
 */
KWin.prototype.Find=function(type,id){
	for(var a=0;a<this.windows.length;a++) if(this.windows[a].type==type && (typeof id=="undefined" || this.windows[a].id==id)) return this.windows[a];
	return false;
};

KWin.prototype.currentWin=null;
KWin.prototype.dragging=false;

/**
 * @fn WinDrag
 * @memberof KWin
 * @param {object:window} win
 * Private method.
 */
KWin.prototype.WinDrag=function(win){
	this.currentWin=win;
	this.wx=win.win.offsetLeft;this.wy=win.win.offsetTop;
	this.dragging=true;
};

/**
 * @fn MouseDown
 * @memberof KWin
 * @param e
 * Private method.
 */
KWin.prototype.MouseDown=function(e){
	for(var a=0;a<this.windows.length;a++) if(this.windows[a].opts.autoclose) return this.Close(this.windows[a]);
};

/**
 * @fn MouseMove
 * @memberof KWin
 * @param e
 * Private method.
 */
KWin.prototype.MouseMove=function(e){
	if(this.dragging){
		var eX=e.clientX,eY=e.clientY;
		var st=this.currentWin.win.style;
		st.left=(Math.max(0,Math.min(document.documentElement.clientWidth-this.currentWin.win.offsetWidth,this.wx+eX-this.mx)))+"px";
		st.top=(Math.max(0,Math.min(document.documentElement.clientHeight-this.currentWin.win.offsetHeight,this.wy+eY-this.my)))+"px";
		delete this.currentWin.centerX;
		delete this.currentWin.centerY;
		e.preventDefault();
	}
};

/**
 * @fn MouseUp
 * @memberof KWin
 * @param e
 * Private method.
 */
KWin.prototype.MouseUp=function(e){
	this.dragging=false;
};