YtIoT/WebRoot/res/usky/usky.js

/**
 * UskyJS
 * Create By yaoqiang2003@126.com
 */

Date.prototype.Format = function(fmt)
{ //author: meizz
    var o = {
        "M+" : this.getMonth()+1,                 //月份
        "d+" : this.getDate(),                    //日
        "h+" : this.getHours(),                   //小时
        "m+" : this.getMinutes(),                 //分
        "s+" : this.getSeconds(),                 //秒
        "q+" : Math.floor((this.getMonth()+3)/3), //季度
        "S"  : this.getMilliseconds()             //毫秒
    };
    if(/(y+)/.test(fmt))
        fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
    for(var k in o)
        if(new RegExp("("+ k +")").test(fmt))
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
    return fmt;
}

var removeDIV=function(id){
	var obj = document.getElementById(id);
	var parent = obj.parentNode;
	parent.removeChild(obj);
}

var setDivPosition = function(div,left,top){
	if(div!=null){
		div.style.position = 'absolute';
		div.style.top =(div.parentNode.offsetTop+ Number(top))+'px';
		div.style.left =(div.parentNode.offsetLeft+ Number(left))+'px';
	}
};

var maxZIndex = function(div){
	var max = 0;
	var divs = div.children;
	for(var n=0;n<divs.length;n++){
		if(divs[n].style.zIndex!=undefined){
			if(divs[n].style.zIndex>max)
				max = divs[n].style.zIndex;
		}
	}
	return Number(max);
}

var createSubMenu = function(div,items,target,dir){
	var mdiv = div;//document.createElement('div');
	for(var n=0;n<items.length;n++){
		var item = items[n];
		if(item.type=='leaf'){
			var link = document.createElement('a');
			if((item.disabled!=undefined)&&(item.disabled=='disabled')){
				link.setAttribute('class','dropdown-item disabled');
				link.setAttribute('disabled','');
			}else{
				link.setAttribute('class','dropdown-item');
				if(item.action!=undefined)
					link.setAttribute('onclick',item.action);
			}
			link.setAttribute('href',item.href);
			link.setAttribute('target',target);
			link.innerHTML=item.name;
			mdiv.appendChild(link);
		}else if(item.type=='logout'){
			var link = document.createElement('div');
			if((item.disabled!=undefined)&&(item.disabled=='disabled')){
				link.setAttribute('class','dropdown-item disabled');
				link.setAttribute('disabled','');
			}else{
				link.setAttribute('class','dropdown-item');
				if(item.action!=undefined)
					link.setAttribute('onclick',item.action);
			}
			link.setAttribute('onclick','window.parent.document.location="'+baseUrl+'"');
			link.innerHTML=item.name;
			mdiv.appendChild(link);
		}else if(item.type=='checkbox'){
			var table = document.createElement('table');
			table.setAttribute('border',0);
			mdiv.appendChild(table);
			var tr = document.createElement('tr');
			table.appendChild(tr);
			var td1 = document.createElement('td');
			td1.setAttribute('item_id',item.id);
			if((item.disabled!=undefined)&&(item.disabled=='disabled')){
				td1.setAttribute('class','gray');
				td1.setAttribute('disabled','');
			}else{
				td1.setAttribute('onclick',item.action);
			}
			td1.setAttribute('style','width:32px;height:32px;background:url('+baseUrl+'res/img/common/'+(item.checked=='checked'?'check.gif':'uncheck.gif')+');background-repeat:no-repeat;background-position:center;');
			tr.appendChild(td1);
			var td2 = document.createElement('td');
			td2.setAttribute('item_id',item.id);
			td2.innerHTML=item.name;
			if((item.disabled!=undefined)&&(item.disabled=='disabled')){
				td2.setAttribute('disabled','');
			}else{
				td2.setAttribute('style','cursor:pointer;');
				td2.setAttribute('onclick',item.action);
			}
			tr.appendChild(td2);
		}else if(item.type=='group'){
			var subdiv = document.createElement('div');
			subdiv.setAttribute('class','dropdown '+dir+' dropdown-submenu');
			mdiv.appendChild(subdiv);
			var link = document.createElement('a');
			link.setAttribute('class','dropdown-item dropdown-toggle');
			link.innerHTML=item.name;
			subdiv.appendChild(link);
			var s_div = document.createElement('div');
			s_div.setAttribute('class','dropdown-menu');
			subdiv.appendChild(s_div);
			if(item.items!=undefined){
				createSubMenu(s_div,item.items,target,dir);
			}
		}
	}
}
var UNote = function(){
	this.id='';
	this.isMoving=false;
	this.config={
			title:'Title',
			titleColor:'#ffffff',
			titleBackgroundColor:'rgba(255,255,255,0.2)',
			backgroundColor:'rgba(255,255,255,0.1)',
			border:'1px solid #ffffff',
			borderRadius:'5px',
			position:'absolute',
			width:400,
			hieght:100,
			bottom:-100,
			right:100,
			zIndex:990,
			bodyText:'Test'
	}
	this.create=function(id,parentid,config){
		var found = false;
		var titlebar;
		var title_text;
		var close_icon;
		var body_html;
		if((id==undefined)||(parentid==undefined))
			return;
		if(config!=undefined)
			this.config=config;
		this.id=id;
		var parent = document.getElementById(parentid);
		if(parent==undefined)
			return;
		var self = document.getElementById(id);
		if(self!=undefined){
			if(self.parentNode!=parent){
				removeDIV(id);
			}else
				found = true;
		}
		if(!found){
			self = document.createElement('div');
			self.setAttribute('id',this.id);
			self.setAttribute('nativeheight',this.config.height);
			self.setAttribute('floding','false');
			self.setAttribute('flodable','false');
			parent.appendChild(self);
			title = document.createElement('div');
			title.setAttribute('id',this.id+'_titlebar');
			self.appendChild(title);
			body_html = document.createElement('div');
			body_html.setAttribute('id',this.id+'_bodytext');
			self.appendChild(body_html);
			body_html.innerHTML=this.config.bodyText;
			var table = document.createElement('table');
			table.border='0';
			table.style.border='0px solid #000';
			title.appendChild(table);
			var tr = document.createElement('tr');
			table.appendChild(tr);
			title_text = document.createElement('td');
			title_text.setAttribute('id',this.id+'_titlebar_text');
			title_text.setAttribute('widget_id',this.id);
			title_text.innerHTML=this.config.title;
			tr.appendChild(title_text);
			close_icon = document.createElement('td');
			close_icon.setAttribute('id',this.id+'_titlebar_close_icon');
			close_icon.innerHTML='<div style="width:16px;height:16px;background-image:url(../../res/img/common/close-tmp.gif)"></div>';
			close_icon.setAttribute('widget_id',this.id);
			close_icon.setAttribute('nativeBackgroundColor',this.config.titleBackgroundColor);
			close_icon.setAttribute('nativeColor',this.config.titleColor);
			tr.appendChild(close_icon);
			close_icon.onclick=function(){
				removeDIV('"'+this.widget_id+'"');
			}
		}
		var stylestr = 'width:'+this.config.width+'px;height:'+this.config.height+'px;position:'+this.config.position+((this.config.top!=undefined)?(';top:'+this.config.top+'px;'):(';bottom:'+this.config.bottom+'px;'))+((this.config.left!=undefined)?('left:'+this.config.left+'px;'):('right:'+this.config.right+'px;'))+'border:'+this.config.border+';border-radius:'+this.config.borderRadius+";background-color:"
		+this.config.backgroundColor+";display:none;z-index:"+this.config.zIndex+';overflow:hidden;background-image:'+this.config.backgroundImage+';'
		self.setAttribute('style',stylestr);
		title.setAttribute('style','width:'+(this.config.width-2)+'px;height:24px;position:absolute;top:0px;left:0px;background-color:'+this.config.titleBackgroundColor+';padding:5px 0px 0px 10px;border-radius:'+this.config.borderRadius+' '+this.config.borderRadius+' 0px 0px;font-size:11px;font-weight:bold;z-index:'+(this.config.zIndex+500)+';');
		body_html.setAttribute('style','width:'+(this.config.width-2)+'px;height:'+(this.config.height-26)+'px;position:absolute;top:24px;left:0px;padding:10px;border-radius:0px 0px '+this.config.borderRadius+' '+this.config.borderRadius+';z-index:0;');
		title_text.setAttribute('style','width:'+(this.config.width-30)+'px;color:'+this.config.titleColor+';overflow:hidden;cursor:pointer;font-size:12pt;font-weight:bold;');
		close_icon.setAttribute('style','color:'+this.config.titleBackgroundColor+';font-weight:bold;cursor:pointer;width:28px;text-align:center;');
	}
	this.setTitle=function(text){
		this.config.title=text;
		var title = document.getElementById(this.id+'_titlebar_text');
		if(title!=undefined)
			title.innerHTML=this.config.title;
	}
	this.setBody=function(text){
		this.config.bodyText=text;
		var bodyHtml = document.getElementById(this.id+'_bodytext');
		if(bodyHtml!=undefined)
			bodyHtml.innerHTML=this.config.bodyText;
	}
	this.show=function(){
		var self = document.getElementById(this.id);
		if(self!=undefined)
			self.style.display='block';
	}
}
var UWindow = function(){
	this.id='';
	this.isMoving=false;
	this.config={
		title:'Title',
		titleColor:'#ffffff',
		titleIconColor:'#ffffff',
		titleBackgroundColor:'rgba(255,255,255,0.2)',
		backgroundColor: 'rgba(255,255,255,0.1)',
		border: '1px solid #ffffff',
		borderRadius:'5px',
		position:'absolute',
		width:400,
		height:300,
		top:0,
		left:0,
		zIndex:200,
		bodyText:'测试内容'
	}
	this.create=function(id,parentid,config){
		var found = false;
		var titlebar;
		var title_text;
		var close_icon;
		var body_html;
		if((id==undefined)||(parentid==undefined))
			return;
		if(config!=undefined)
			this.config=config;
		this.id=id;
		var parent = document.getElementById(parentid);
		if(parent==undefined)
			return;
		var self = document.getElementById(id);
		if(self!=undefined){
			if(self.parentNode!=parent){
				removeDIV(id);
			}else
				found = true;
		}
		if(!found){
			self = document.createElement('div');
			self.setAttribute('id',this.id);
			self.setAttribute('nativeheight',this.config.height);
			self.setAttribute('floding','false');
			self.setAttribute('flodable','false');
			parent.appendChild(self);
			title = document.createElement('div');
			title.setAttribute('id',this.id+'_titlebar');
			self.appendChild(title);
			body_html = document.createElement('div');
			body_html.setAttribute('id',this.id+'_bodytext');
			self.appendChild(body_html);
			body_html.innerHTML=this.config.bodyText;
			var table = document.createElement('table');
			table.border='0';
			table.style.border='0px solid #000';
			title.appendChild(table);
			var tr = document.createElement('tr');
			table.appendChild(tr);
			title_text = document.createElement('td');
			title_text.setAttribute('id',this.id+'_titlebar_text');
			title_text.setAttribute('widget_id',this.id);
			title_text.innerHTML=this.config.title;
			tr.appendChild(title_text);
			close_icon = document.createElement('td');
			close_icon.setAttribute('id',this.id+'_titlebar_close_icon');
			close_icon.innerHTML='▲';
			close_icon.setAttribute('widget_id',this.id);
			close_icon.setAttribute('nativeBackgroundColor',this.config.titleBackgroundColor);
			close_icon.setAttribute('nativeColor',this.config.titleColor);
			tr.appendChild(close_icon);
			close_icon.onclick=function(){
				var id = this.getAttribute('widget_id');
				var floding = $("#"+id).attr('floding');
				if(floding=='true'){
					$("#"+id+'_titlebar_close_icon').html('▲');
					$("#"+id).attr('floding','false');
					$("#"+id).attr('flodable','false');
					$("#"+id+"-title-hiden").css({
						display:'none'
					});
					$("#"+id+"-label-hidden").css({
						display:"none"
					});
					$("#"+id).animate({
						height:($("#"+id).attr('nativeheight')+'px')
					},250);
				}else{
					$("#"+id+'_titlebar_close_icon').html('▼');
					$("#"+id).attr('floding','true');
					$("#"+id).attr('flodable','true');
					$("#"+id+"-title-hiden").css({
						display:'block'
					});
					$("#"+id+"-label-hidden").css({
						display:"block"
					});
					$("#"+id).animate({
						height:'34px'
					},250);
				}
			}
			title_text.onmouseover=function(){
				var id = this.getAttribute('widget_id');
				var floding = $("#"+id).attr('floding');
				var flodable = $("#"+id).attr('flodable');
				if(flodable=='true'){
					if(floding=='true'){
						$("#"+id).animate({
							height:($("#"+id).attr('nativeheight')+'px')
						},250);
					}
				}
			}
			title_text.onmouseout=function(){
				var id = this.getAttribute('widget_id');
				var floding = $("#"+id).attr('floding');
				var flodable = $("#"+id).attr('flodable');
				if(flodable=='true'){
					if(floding=='false'){
						$("#"+id).animate({
							height:'34px'
						},250);
					}
				}
			}
		}
		var stylestr = 'width:'+this.config.width+'px;height:'+this.config.height+'px;position:'+this.config.position+((this.config.top!=undefined)?(';top:'+this.config.top+'px;'):(';bottom:'+this.config.bottom+'px;'))+((this.config.left!=undefined)?('left:'+this.config.left+'px;'):('right:'+this.config.right+'px;'))+'border:'+this.config.border+';border-radius:'+this.config.borderRadius+";background-color:"
		+this.config.backgroundColor+";display:none;z-index:"+this.config.zIndex+';overflow:hidden;background-image:'+this.config.backgroundImage+';'
		self.setAttribute('style',stylestr);
		title.setAttribute('style','width:'+(this.config.width-2)+'px;height:24px;position:absolute;top:0px;left:0px;background-color:'+this.config.titleBackgroundColor+';padding:5px 0px 0px 10px;border-radius:'+this.config.borderRadius+' '+this.config.borderRadius+' 0px 0px;font-size:11px;font-weight:bold;z-index:'+(this.config.zIndex+500)+';');
		body_html.setAttribute('style','width:'+(this.config.width-2)+'px;height:'+(this.config.height-26)+'px;position:absolute;top:24px;left:0px;padding:10px;border-radius:0px 0px '+this.config.borderRadius+' '+this.config.borderRadius+';z-index:0;');
		title_text.setAttribute('style','width:'+(this.config.width-30)+'px;color:'+this.config.titleColor+';overflow:hidden;cursor:pointer;font-size:12pt;font-weight:bold;');
		close_icon.setAttribute('style','color:'+this.config.titleBackgroundColor+';font-weight:bold;cursor:pointer;width:28px;text-align:center;');
		title_text.onmousedown=function(e){
			var e = e || window.event; 
            var pageX = e.pageX || e.clientX + document.documentElement.scrollLeft;
            var pageY = e.pageY || e.clientY + document.documentElement.scrollTop;
            var boxX = pageX - self.offsetLeft;
            var boxY = pageY - self.offsetTop;
            document.onmousemove = function(e){
                var e = e || window.event;
                var pageX = e.pageX || e.clientX + document.documentElement.scrollLeft;
                var pageY = e.pageY || e.clientY + document.documentElement.scrollTop;
                self.style.left = pageX - boxX +'px';
                self.style.top = pageY - boxY + 'px';
            }
            document.onmouseup = function () {
                document.onmousemove = null;
            };
		}
		title_text.onmouseover=function(){
			self.style.zIndex = maxZIndex(self.parentNode)+1;
			var id = this.getAttribute('widget_id');
			var color = $("#"+id+"_titlebar_close_icon").attr('nativeColor');
			$("#"+id+"_titlebar_close_icon").css('color',color);
			$("#"+id).attr('BorderSet', $("#"+id).css('border'));
			$("#"+id).css({
				border:'1px solid #007bff'
			});
		}
		title_text.onmouseout=function(){
			var id = this.getAttribute('widget_id');
			var color = $("#"+id+"_titlebar_close_icon").attr('nativeBackgroundColor');
			$("#"+id+"_titlebar_close_icon").css('color',color);
			$("#"+id).css({
				border: $("#"+id).attr('BorderSet')
			});
		}
		close_icon.onmouseover=function(){
			self.style.zIndex = maxZIndex(self.parentNode)+1;
			var id = this.getAttribute('id');
			var color = $("#"+id).attr('nativeColor');
			$("#"+id).css('color',color);
			$("#"+this.getAttribute('widget_id')).attr('BorderSet', $("#"+id).css('border'));
			$("#"+this.getAttribute('widget_id')).css({
				border:'1px solid #007bff'
			});
		}
		close_icon.onmouseout=function(){
			var id = this.getAttribute('id');
			var color = $("#"+id).attr('nativeBackgroundColor');
			$("#"+id).css('color',color);
			$("#"+this.getAttribute('widget_id')).css({
				border: $("#"+this.getAttribute('widget_id')).attr('BorderSet')
			});
		}
		if((this.config.floding!=undefined)&&(this.config.floding=='true')){
			$("#"+id+'_titlebar_close_icon').html('▼');
			$("#"+id).attr('floding','true');
			$("#"+id).attr('flodable','true');
			$("#"+id).css({
				height:'34px'
			});
			$("#"+id+"-title-hiden").css({
				display:'block'
			});
			$("#"+id+"-label-hidden").css({
				display:"block"
			});
		}
	}
	this.setTitle=function(text){
		this.config.title=text;
		var title = document.getElementById(this.id+'_titlebar_text');
		if(title!=undefined)
			title.innerHTML=this.config.title;
	}
	this.setBody=function(text){
		this.config.bodyText=text;
		var bodyHtml = document.getElementById(this.id+'_bodytext');
		if(bodyHtml!=undefined)
			bodyHtml.innerHTML=this.config.bodyText;
	}
	this.show=function(){
		var self = document.getElementById(this.id);
		if(self!=undefined)
			self.style.display='block';
	}
}

var UTabBar = function(){
	var found = false;
	this.id='';
	this.isflodable=true;
	this.isfloding=false;
	this.config={
		title:'Title',
		titleColor:'#ffffff',
		titleBackgroundColor:'rgba(255,255,255,0.2)',
		backgroundColor: 'rgba(255,255,255,0.1)',
		dockside:'left',
		border: '1px solid #ffffff',
		borderRadius:'5px',
		position:'absolute',
		top:500,
		width:400,
		height:300,
		zIndex:200,
		bodyText:'测试内容'
	}
	this.create=function(id,parentid,config){
		var title_text;
		var close_icon;
		if((id==undefined)||(parentid==undefined))
			return;
		if(config!=undefined)
			this.config=config;
		this.id=id;
		if((this.config.dockside!='right')&&(this.config.dockside!='left'))
			return;
		var parent = document.getElementById(parentid);
		if(parent==undefined)
			return;
		var self = document.getElementById(id);
		if(self!=undefined){
			if(self.parentNode!=parent){
				removeDIV(id);
			}else
				found = true;
		}
		if(!found){
			self = document.createElement('div');
			self.setAttribute('id',this.id);
			self.setAttribute('flodable','false');
			self.setAttribute('floding','false');
			self.setAttribute('nativewidth',this.config.width);
			parent.appendChild(self);
			title = document.createElement('div');
			title.setAttribute('id',this.id+'_titlebar');
			self.appendChild(title);
			close_icon = document.createElement('div');
			close_icon.setAttribute('id',this.id+'_titlebar_close_icon');
			if(this.config.dockside=='left')
				close_icon.innerHTML='◄';
			else
				close_icon.innerHTML='►';
			close_icon.setAttribute('nativeBackgroundColor',this.config.titleBackgroundColor);
			close_icon.setAttribute('nativeColor',this.config.titleColor);
			close_icon.setAttribute('widget_id',this.id);
			title.appendChild(close_icon);
			close_icon.setAttribute('style','position:absolute;top:0px;left:0px;width:24px;height:24px;padding:3px;cursor:pointer;color:'+this.config.titleBackgroundColor+';')
			title_text = document.createElement('div');
			title_text.setAttribute('id',this.id+'_titlebar_text');
			title_text.setAttribute('widget_id',this.id);
			title.appendChild(title_text);
			title_text.setAttribute('style','position:absolute;top:24px;left:0px;width:24px;height:'+(this.config.height-26)+'px;padding:10px 3px;cursor:pointer;')
			body_html = document.createElement('div');
			body_html.setAttribute('id',this.id+'_bodytext');
			self.appendChild(body_html);
			title_text.innerHTML=this.config.title;
			body_html.innerHTML=this.config.bodyText;
			close_icon.onclick=function(){
				var flodable = self.getAttribute('flodable');
				var floding = self.getAttribute('floding');
				if(floding=='true'){
					var id = this.getAttribute('widget_id');
					$("#"+id).attr('flodable','false');
					$("#"+id).attr('floding','false');
					if($("#"+id).css('left')=='0px')
						$("#"+id+'_titlebar_close_icon').html('◄');
					else
						$("#"+id+'_titlebar_close_icon').html('►');
					$("#"+id).animate({
						width:($("#"+id).attr('nativewidth')+'px')
					},250);
				}else{
					var id = this.getAttribute('widget_id');
					$("#"+id).attr('flodable','true');
					$("#"+id).attr('floding','true');
					if($("#"+id).css('left')=='0px')
						$("#"+id+'_titlebar_close_icon').html('►');
					else
						$("#"+id+'_titlebar_close_icon').html('◄');
					$("#"+id).animate({
						width:'24px'
					},250);
				}
			}
			close_icon.onmouseover=function(){
				var id = this.getAttribute('id');
				var color = $("#"+id).attr('nativeColor');
				$("#"+id).css('color',color);
			}
			close_icon.onmouseout=function(){
				var id = this.getAttribute('id');
				var color = $("#"+id).attr('nativeBackgroundColor');
				$("#"+id).css('color',color);
			}
			title_text.onmouseover=function(){
				var flodable = self.getAttribute('flodable');
				var floding = self.getAttribute('floding');
				var id = this.getAttribute('widget_id');
				if(flodable=='true'){
					if(floding=='true'){
						$("#"+id).attr('floding','false');
						$("#"+id).animate({
							width:($("#"+id).attr('nativewidth')+'px')
						},250);
					}
				}
				var color = $("#"+id+"_titlebar_close_icon").attr('nativeColor');
				$("#"+id+"_titlebar_close_icon").css('color',color);
				self.style.zIndex = maxZIndex(self.parentNode)+1;
			}
			title_text.onmouseout=function(){
				var flodable = self.getAttribute('flodable');
				var floding = self.getAttribute('floding');
				var id = this.getAttribute('widget_id');
				if(flodable=='true'){
					if(floding=='false'){
						$("#"+id).attr('floding','true');
						$("#"+id).animate({
							width:'24px'
						},250);
					}
				}
				var color = $("#"+id+"_titlebar_close_icon").attr('nativeBackgroundColor');
				$("#"+id+"_titlebar_close_icon").css('color',color);
			}
			title_text.onmousedown=function(e){
				var e = e || window.event; 
	            var pageY = e.pageY || e.clientY + document.documentElement.scrollTop;
	            var boxY = pageY - self.offsetTop;
	            document.onmousemove = function(e){
	                var e = e || window.event;
	                var pageY = e.pageY || e.clientY + document.documentElement.scrollTop;
	                self.style.top = pageY - boxY + 'px';
	            }
	            document.onmouseup = function () {
	                document.onmousemove = null;
	            };
			}
		}
		self.setAttribute('style','width:'+this.config.width+'px;height:'+this.config.height+'px;position:absolute;top:'+this.config.top+'px;overflow:hidden;'
				+((this.config.dockside=='left')?'left:0px;':(this.config.dockside=='right')?'right:0px;':'')+'background-color:'+this.config.backgroundColor+';'
				+'border:'+this.config.border+';border-radius:0px '+this.config.borderRadius+' '+this.config.borderRadius+' 0px;display:none;z-index:'+this.config.zIndex+';');
		if(this.config.dockside=='left'){
			title.setAttribute('style','text-align:center;width:24px;height:'+this.config.height+'px;position:absolute;left:0px;top:0px;background-color:'+this.config.titleBackgroundColor+';color:'+this.config.titleColor+';overflow:hidden;font-size:11px;font-weight:bold;');
			body_html.setAttribute('style','width:'+(this.config.width-26)+'px;height:'+this.config.height+'px;padding:10px;position:absolute;left:24px;top:0px;border:'+this.config.border+';border-radius:0px '+this.config.borderRadius+' '+this.config.borderRadius+' 0px;border-width:1px;border-style:solid;border-top-color:#707070;border-right-color:#e0e0e0;border-bottom-color:#e0e0e0;border-left-color:#707070;border-radius:0px '+this.config.borderRadius+' '+this.config.borderRadius+' 0px;')
		}else if(this.config.dockside=='right'){
			title.setAttribute('style','text-align:center;width:24px;height:'+this.config.height+'px;position:absolute;right:0px;top:0px;background-color:'+this.config.titleBackgroundColor+';color:'+this.config.titleColor+';overflow:hidden;font-size:11px;font-weight:bold;');
			body_html.setAttribute('style','width:'+(this.config.width-26)+'px;height:'+this.config.height+'px;padding:10px;position:absolute;right:24px;top:0px;border:'+this.config.border+';border-radius:0px '+this.config.borderRadius+' '+this.config.borderRadius+' 0px;border-width:1px;border-style:solid;border-top-color:#707070;border-right-color:#e0e0e0;border-bottom-color:#e0e0e0;border-left-color:#707070;border-radius:0px '+this.config.borderRadius+' '+this.config.borderRadius+' 0px;')
		}

	}
	this.setTitle=function(text){
		this.config.title=text;
		var title_text = document.getElementById(this.id+'_titlebar_text');
		if(title_text!=undefined)
			title_text.innerHTML=this.config.title;
	}
	this.setBody=function(text){
		this.config.bodyText=text;
		var bodyHtml = document.getElementById(this.id+'_bodytext');
		if(bodyHtml!=undefined)
			bodyHtml.innerHTML=this.config.bodyText;
	}
	this.show=function(){
		var self = document.getElementById(this.id);
		if(self!=undefined)
			self.style.display='block';
	}
	this.hide=function(){
		var self = document.getElementById(this.id);
		if(self!=undefined)
			self.style.display='none';
	}
}

var UMenuBar = function(){
	this.config={
		id:'menubar',
		target:'mainframe',
		brand_icon:{
			url:'logo.png',
			width:160,
			height:20
		},
		items:[{
			name:'菜单组一',
			type:'group',
			side:'left',
			items:[{
				name:'菜单一',
				type:'leaf',
				href:'http://www.baidu.com'
			},{
				name:'菜单二',
				type:'leaf',
				href:'http://www.yahoo.com'
			}]
		},{
			name:'菜单三',
			type:'leaf',
			side:'split',
			href:'http://www.sohu.com'
		},{
			name:'菜单组二',
			type:'group',
			side:'right',
			items:[{
				name:'菜单四',
				type:'leaf',
				href:'http://www.baidu.com'
			},{
				name:'菜单五',
				type:'leaf',
				href:'http://www.yahoo.com'
			}]
		}]
	}
	this.create=function(config){
		if(config!=undefined)
			this.config = config;
		var mroot = document.getElementById(this.config.id);
		if(mroot==undefined)
			return;
		var nav = document.createElement('nav');
		nav.setAttribute('class','navbar navbar-expand-md navbar-dark bg-dark');
		mroot.appendChild(nav);
		if(this.config.brand_icon!=undefined){
			var link = document.createElement('a');
			link.href='#';
			link.setAttribute('class','navbar-brand');
			link.setAttribute('style','margin-top:-15px;')
			nav.appendChild(link);
			var brand_icon = document.createElement('img');
			brand_icon.src=this.config.brand_icon.url;
			brand_icon.width=this.config.brand_icon.width;
			brand_icon.height=this.config.brand_icon.height;
			brand_icon.setAttribute('style','opacity:0.4;filter:alpha(opacity=40);')
			link.appendChild(brand_icon);
			var btn = document.createElement('button');
			btn.setAttribute('class','navbar-toggler');
			btn.setAttribute('type','button');
			btn.setAttribute('data-toggle','collapse');
			btn.setAttribute('data-target','.navbar-collapse');
			nav.appendChild(btn);
			var span = document.createElement('span');
			span.setAttribute('class','navbar-toggler-icon');
			btn.appendChild(span);
		}
		if(this.config.items!=undefined){
			var menus = this.config.items;
			var div = document.createElement('div');
			div.setAttribute('class','collapse navbar-collapse');
			nav.appendChild(div);
			for(var n=0;n<menus.length;n++){
				var ul = document.createElement('ul');
				if((menus[n].side!=undefined)&&(menus[n].side=='split'))
					ul.setAttribute('class','navbar-nav mr-auto');
				else
					ul.setAttribute('class','navbar-nav');
				div.appendChild(ul);
				if(menus[n].type=='leaf'){
					var li = document.createElement('li');
					li.setAttribute('class','nav-item');
					ul.appendChild(li);
					var link = document.createElement('a');
					if((menus[n].disabled!=undefined)&&(menus[n].disabled=='disabled')){
						link.setAttribute('class','nav-link disabled');
						link.setAttribute('disabled','');
					}else{
						link.setAttribute('class','nav-link');
						if(menus[n].action!=undefined)
							link.setAttribute('onclick',menus[n].action);
					}
					link.setAttribute('target',this.config.target);
					link.setAttribute('href',menus[n].href);
					link.innerHTML=menus[n].name;
					li.appendChild(link);
				}else if(menus[n].type=='systitle_label'){
					var li = document.createElement('li');
					li.setAttribute('class','nav-item');
					ul.appendChild(li);
					var datediv = document.createElement('a');
					datediv.setAttribute('class','nav-link active');
					datediv.innerHTML='<span id="'+menus[n].divid+'" style="margin-top:-25px;font-size:14pt;font-weight:bold;">'+menus[n].name+'</span>';
					datediv.disabled='disabled';
					li.appendChild(datediv);
				}else if(menus[n].type=='systime_label'){
					var li = document.createElement('li');
					li.setAttribute('class','nav-item');
					ul.appendChild(li);
					var datediv = document.createElement('a');
					datediv.setAttribute('class','nav-link active');
					datediv.innerHTML='<span id="'+menus[n].divid+'">'+(new Date()).Format("yyyy-MM-dd hh:mm:ss")+'</span>';
					datediv.disabled='disabled';
					li.appendChild(datediv);
				}else if(menus[n].type=='group'){
					var dir = (menus[n].side=='right')?'dropleft':'dropright';
					var li = document.createElement('li');
					li.setAttribute('class','nav-item dropdown');
					ul.appendChild(li);
					var link = document.createElement('a');
					link.setAttribute('class','nav-link dropdown-toggle');
					link.setAttribute('data-toggle','dropdown');
					link.setAttribute('data-submenu','');
					link.innerHTML=menus[n].name;
					li.appendChild(link);
					var subdiv = document.createElement('div');
					if(menus[n].side=='right')
						subdiv.setAttribute('class','dropdown-menu dropdown-menu-right');
					else
						subdiv.setAttribute('class','dropdown-menu');
					li.appendChild(subdiv);
					if(menus[n].items!=undefined){
						createSubMenu(subdiv,menus[n].items,this.config.target,dir);
					}
				}
			}
		}
	}
}
var UDockBar = function(){
	
}