//<h1>Dan's Drag and Drop: the dnd function</h1>	
//<textarea rows="40" cols="90" style="font-size: 16pt; background-color: AliceBlue; font-weight: bold;" onfocus="this.select()">	



(function(){



 
//JSON2 library:
if(!this.JSON){this.JSON={}}(function(){var P="prototype";function l(c){return c<10?"0"+c:c}if(!Date[P].toJSON){Date[P].toJSON=function(c){return isFinite(this.valueOf())?this.getUTCFullYear()+"-"+l(this.getUTCMonth()+1)+"-"+l(this.getUTCDate())+"T"+l(this.getUTCHours())+":"+l(this.getUTCMinutes())+":"+l(this.getUTCSeconds())+"Z":null};String[P].toJSON=Number[P].toJSON=Boolean[P].toJSON=function(c){return this.valueOf()}}var o=/[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,p=/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,h,m,r={'\b':"\\b",'\t':"\\t",'\n':"\\n",'\f':"\\f",'\r':"\\r",'"':"\\\"",'\\':"\\\\"},j;function q(a){p.lastIndex=0;return p.test(a)?"\""+a.replace(p,function(c){var f=r[c];return typeof f==="string"?f:"\\u"+("0000"+c.charCodeAt(0).toString(16)).slice(-4)})+"\"":"\""+a+"\""}function n(c,f){var a,e,d,i,k=h,g,b=f[c];if(b&&typeof b==="object"&&typeof b.toJSON==="function"){b=b.toJSON(c)}if(typeof j==="function"){b=j.call(f,c,b)}switch(typeof b){case"string":return q(b);case"number":return isFinite(b)?String(b):"null";case"boolean":case"null":return String(b);case"object":if(!b){return"null"}h+=m;g=[];if(Object[P].toString.apply(b)==="[object Array]"){i=b.length;for(a=0;a<i;a+=1){g[a]=n(a,b)||"null"}d=g.length===0?"[]":h?"[\n"+h+g.join(",\n"+h)+"\n"+k+"]":"["+g.join(",")+"]";h=k;return d}if(j&&typeof j==="object"){i=j.length;for(a=0;a<i;a+=1){e=j[a];if(typeof e==="string"){d=n(e,b);if(d){g.push(q(e)+(h?": ":":")+d)}}}}else{for(e in b){if(Object.hasOwnProperty.call(b,e)){d=n(e,b);if(d){g.push(q(e)+(h?": ":":")+d)}}}}d=g.length===0?"{}":h?"{\n"+h+g.join(",\n"+h)+"\n"+k+"}":"{"+g.join(",")+"}";h=k;return d;default:}}if(!JSON.stringify){JSON.stringify=function(c,f,a){var e;h="";m="";if(typeof a==="number"){for(e=0;e<a;e+=1){m+=" "}}else if(typeof a==="string"){m=a}j=f;if(f&&typeof f!=="function"&&(typeof f!=="object"||typeof f.length!=="number")){throw new Error("JSON.stringify");}return n("",{'':c})}}if(!JSON.parse){JSON.parse=function(i,k){var g;function b(c,f){var a,e,d=c[f];if(d&&typeof d==="object"){for(a in d){if(Object.hasOwnProperty.call(d,a)){e=b(d,a);if(e!==undefined){d[a]=e}else{delete d[a]}}}}return k.call(c,f,d)}o.lastIndex=0;if(o.test(i)){i=i.replace(o,function(c){return"\\u"+("0000"+c.charCodeAt(0).toString(16)).slice(-4)})}if(/^[\],:{}\s]*$/.test(i.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g,"@").replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g,"]").replace(/(?:^|:|,)(?:\s*\[)+/g,""))){g=eval("("+i+")");return typeof k==="function"?b({'':g},""):g}throw new SyntaxError("JSON.parse");}}}());




var IE = "\v"=="v";// false;   //@cc_on; IE=true; //dnd by dandavis. creative commons attribution-only license applies.
var oldIE= IE && document.documentMode < 8;

dnd.ie=IE;

  var branch = IE ? "srcElement" : "target";


	if(IE){	var xy=function xy(e){xy.y=event.clientY; xy.x=event.clientX;}
	}else{
	  	var xy=function xy(e) {xy.x=e.pageX; xy.y=e.pageY;};
	}


	merge(dnd,{ 
		items:		[],
		z: 		500,
		hlColor:	"",
		dndTags: 	{},
		customEvents:	false,
		persist:	true,
		baseOutline:	"8px double",
		branch: 	branch
	}); // end CONFIG


	var D = document;
	var PI = parseInt;
	function el(tid) {
	  return D.getElementById(tid);
	}
	var GC = function (k) {
	  var d = D.cookie || "";
	  var pairs = d.split(k + "=");
	  if (pairs && pairs[1]) {
		return unescape(pairs[pairs.length - 1].split(";")[0]);
	  }
	}
	var SC = function (nm, valu) {
	  var e2 = (new Date(2019, 1, 1)).toGMTString();
	  D.cookie = nm + "=" + escape(valu) + "; expires=" + e2;
	}



function merge(o,ob){for(var z in ob){if(ob.hasOwnProperty(z)){o[z]=ob[z];}}return o;}


if(!window.globalStorage && window.localStorage){
	window.globalStorage={};
      globalStorage[document.domain]=window.localStorage;
}//end webkit+ie8  patch




if(window.globalStorage){
 var gso=globalStorage[document.domain];
	if(!gso['dndItems']){gso['dndItems']="{}";}
	try{
	  dnd.holder=JSON.parse(String(gso.dndItems))||{};
	}catch(y){dnd.holder={};}
  //dnd.gso=holder;
  var tim=0;
  GC=function(k){  var t = dnd.holder[k]; return t; }
  SC=function(k,v){ dnd.holder[k] = v; clearTimeout(dnd.tim);dnd.tim=setTimeout(function _dndSaver(){
		 	 globalStorage[document.domain]['dndItems']=JSON.stringify(dnd.holder);}, 4700); return ""; }

}//end if globalstorage

//end of support code, begin main dnd routine:

/*
	if (!dnd.dndTags) {
	  dnd.dndTags = {};
	}
	if (!dnd.z) {
	  dnd.z = 500;
	}

	if (!dnd.hlColor) {
	  dnd.hlColor = "";
	}



	*/



function dnd(elm) {

	var PS = dnd.useFixed ? "fixed" : "absolute";

	if (!drag.items) {
	  drag.items = [];
	}

	if (typeof elm==="string") {
	  elm2 = el(elm);
	} else {
	  elm2 = elm;
	}
	if (!elm2) {
	  return;
	}
	if (!elm2.id) {
	  var tgn = elm2.tagName.toLowerCase();
	  if (!dnd.dndTags[tgn]) {
		dnd.dndTags[tgn] = 0;
	  } else {
		dnd.dndTags[tgn]++;
	  }
	  elm2.id = tgn + dnd.dndTags[tgn];
	}
	var myevent;
	if(myevent=elm2.getAttribute("ondnd")){elm2.ondnd=Function("event",myevent); }
	elm2.tabIndex=-1;
	dnd.items.push(elm2.id);
	elm2.style.cursor = "pointer";
	var ds7 = elm2.style;
	if (!ds7.position) {
	  ds7.position = PS;
	  ds7.left = elm2.offsetLeft + "px";
	  ds7.top = elm2.offsetTop + "px";
	}
	ds7.oldCursor = ds7.cursor || "";
	if (GC) {
	  var od = GC(elm2.id);
	  if (od) {
		try {
			oP = eval(String(od));
		} catch (yy) {
			oP = [ds7.left, ds7.top, dnd.z++];
		}
		if (oP[2] > dnd.z) {
			dnd.z = oP[2];
		}
		ds7.left = oP[0];
		ds7.top = oP[1];
		ds7.zIndex = oP[2] || dnd.z;
// console.info([oP,ds7]);
	  }


	} 
	function drag(d, e) {
	  e=e||window.event;
//	  alert("DD"+d.id)
	  var that = e[branch], D=document, PI=parseInt, ds=d.style;
	  if (0 && that != d) {
		if (that && that.focus) {
			that.focus();
			return true;
		}
		return false;
	  }



	  if (! "position" in ds) {
	       	xy(e);
		  ds.position = PS;
		ds.left = ds.left ? ds.left : xy.x + "px";
		ds.top = ds.top ? ds.top : xy.y + "px";
	  }

	  ds.cursor = "move";
	  d.buc = d.opacity;// [ds.outineColor, ds.outlineStyle, ds.outlineWidth, d.opacity];
	  ds.outline=dnd.baseOutline+" "+dnd.hlColor;
//	  ds.outlineColor = dnd.hlColor;
	  ds.opacity="0.6";
//	  stop2 = 0;
//	  0.131ms on drag1

	  var oX = PI(ds.left), oY = PI(ds.top), tpp=xy(e), eX = xy.x, eY=xy.y, tX, tY;

	  //	function xy(e) {xy.x=e.pageX; xy.y=e.pageY;};
	  //	var xp=xy(e);
	//	if (1!==stop2) {
/*
 	  function dragI(e) {
			ds.top = e.pageY  + oY - eY + "px";
			ds.left = e.pageX + oX - eX + "px";
		return false;
	  }

*/

	var DSC=String;
	  if(IE){ DSC=document.selection.clear;}


var ieCore=!oldIE ?
	 (function _dndIE8Core(e,v){ds.top=window.event.clientY+"px"; ds.left=window.event.clientX+"px"; DSC();})	:
	 (function _dndIE6Core(e,v){ds.top=(window.event.clientY-3)+"px"; ds.left=(window.event.clientX-3)+"px"; DSC();})	;//end IE core

	  D.onmousemove = IE ? ieCore :
		  (function _dndCore(e){ds.top=e.pageY+oY-eY+"px"; ds.left=e.pageX+oX-eX+"px";return false;} );

	   	//	ds.top = xy(e, 1) + oY - eY + "px";
		//	ds.left = xy(e) + oX - eX + "px";


	   function mouseup3(event) {
		var e =event|| window.event, targ=e.srcElement||e.target, ds=d.style;
		if(!event){event=e;}
		D.onmousemove = D.onmouseup = "";
		if (ds.left < "/") {
			ds.left = "1px";
		}
		if (ds.top < "/") {
			ds.top = "1px";
		}
		if (dnd.snap) {
			var dsl = PI(ds.left),
			 dst = PI(ds.top),
			 tfactor = PI(dsl % dnd.snap),
			 toff = (PI(dnd.snap / 2) > tfactor) ? tfactor : tfactor * -1;
			ds.left = (dsl - toff) + "px";
			 tfactor = dst % dnd.snap;
			 toff = (PI(dnd.snap / 2) > tfactor) ? tfactor : tfactor * -1;
			ds.top = dst - toff + "px";
		}
		if(dnd.persist){d._saveNewPos();}
/*		if (!event.srcElement) {
			event.srcElement = event.target;
		}
		if (!event.target) {
			event.target = event.srcElement;
		}
*/
		event.target?event.srcElement=targ : event.target=targ;
		if (dnd.customEvents && D.elementFromPoint) {

			var onElm = D.elementFromPoint(PI(ds.left) - 2, (PI(ds.top) + D.body.scrollTop) - 2);
			if (onElm && onElm.getAttribute) {
			//	console.info("landed on:"+onElm.id);
			  d.landedOn = onElm;
			  var od =onElm.ondnd || onElm.getAttribute("ondnd");
			  if ( !onElm.dnd && od && event.target==d) {
				if (typeof od==='string') {
					od = new Function("event", od);
				}
				od.apply(onElm, [event]);
			  }
			}
		}//end of custom event handlers
	  if(dnd.customEvents && d.ondnd){d.ondnd.call(d,e);}
		drag.items[d.id] = [PI(ds.left), PI(ds.top)];
		ds.outline="";
		ds.opacity =d.buc||1;
		ds.cursor = ds.oldCursor || "default";
	//	if(IE){ ds.float="left"; ds.clear="";   }
			d.focus();
	  }//end mouseUp3

	   D.onmouseup = mouseup3;
	  return false;
	}
	drag.items[elm2.id] = [PI(ds7.left), PI(ds7.top)];
	var elm3=elm2;
	elm2.onmousedown = function _onmd(event2) {
			var ts = elm3.style;
			elm3._saveOldPos();
			ts.zIndex = dnd.z++;
			drag(elm3, event2 || window.event);

		return false;
	};

	//	dnd.eva = function (a) {return eval(a);};
	elm2.oldPos = [{left: ds7.left, top: ds7.top, z: ds7.zIndex}];
	elm2.oldSize = [{width: ds7.width, height: ds7.height}];
	elm2.landedOn = {};
	elm2.dnd = true;

	elm2.moveTo = function (x, y) {var es = this.style;es.top = PI(y) + "px";es.left = PI(x) + "px";return this;};
	elm2.moveBy = function (right, up) {var es = this.style;es.top = PI(es.top) + PI(up) + "px";es.left = PI(es.left) + PI(right) + "px";return this;};
	elm2.resizeTo = function (w, h) {var es = this.style;es.width = PI(w) + "px";es.height = PI(h) + "px";return this;};

	function F(s){return Function("var es=this.style;\n"+s+" ; return this;");}
	elm2.unMove=F("var ts=this.oldPos.pop();if(!ts){return this;}es.top=ts.top;es.left=ts.left;es.zIndex=ts.z");
	elm2.hide = F('es.display="none"');
	elm2.show = F('es.display="inline"');
	elm2.undelete =F("this.show();this.unMove()");


	elm2._saveOldPos=function(){var es=this.style;this.oldPos.push({left:es.left,top:es.top,z:es.zIndex});dnd.currentElement=elm2;return this;};
	elm2._saveNewPos=function(){var es=this.style;SC(this.id,"['"+es.left+"', '"+es.top+"', '"+es.zIndex+"']");return this;};
	elm2.unSize=function(){var es=this.style;var ts=this.oldSize.pop();if(!ts){return 0;}es.width=ts.width;es.height=ts.height;return this;};



	dnd.reset = function () {if (!confirm("Are you sure you want to remove the saved layout ?")) {return;}
		if(globalStorage && globalStorage[document.domain]){
			document.title="reloading...";
			 globalStorage[document.domain]['dndItems']="{}"; return setTimeout(" globalStorage[document.domain]['dndItems']='{}';location.href = location.href;", 300);
		}
		var b = dnd.items;for (var i = 0; i < b.length; i++) {SC(b[i], "");location.href = location.href;}};
	return elm2;
	};//end dnd()

	  dnd.baseOutline="8px double";


this.dnd=dnd;

}());//end wrap