var UITool = function(){}
UITool.makeMenu = function(target,width,menulist){
	var len = menulist.length;
	var wid = Math.ceil(width/len);
	for(var i = 0;i<len ; i++){
		var obj = menulist[i];
		var div = document.createElement('div');
		div.id = 'menu';
		div.style.left = wid * i -1;
		div.style.width = wid;
		div.style.backgroundImage = 'url(../img/menubtn.png)';
		div.innerHTML = obj.label;
		div.onclick = obj.action;
		target.appendChild(div);
	}
}

UITool.createModalPanel = function(target,width,height,params){
	var panel = document.createElement('div');
	panel.id = 'modalPanel';
	panel.style.width = width;
	panel.style.height = height;
	
	var bg = document.createElement('div');
	bg.id = 'bg';
	bg.style.width = width;
	bg.style.height = height;
	
	var content = document.createElement('div');
	content.id = 'content';
	content.style.width = width;
	content.innerHTML = '';
	
	var text = document.createElement('div');
	text.id = 'text';
	if(params.image){
		var img = document.createElement('img');
		img.src = params.image;
		img.width = 72;
		img.height = 72;
		text.appendChild(img);
	}
	if(params.title){
		text.innerHTML += '<h1>' + params.title + '</h1>';
	}
	text.innerHTML +=  params.text;
	
	content.appendChild(text);
	
	var btn_container = document.createElement('div');
	for(var i = 0; i<params.button.length;i++){
		var btn = UITool.createButton(params.button[i].label);
		btn.onclick = (function(){
			var func = params.button[i].func;
			return function(){
				func.apply(this);
				panel.parentNode.removeChild(panel);
			}
		})();
		btn_container.appendChild(btn);
	}
	content.appendChild(btn_container);
	content.style.position = 'absolute';
	content.style.top = params.margin || 0;
	content.style.left = 0;
	
	panel.appendChild(bg);
	panel.appendChild(content);
	
	target.appendChild(panel);
}

UITool.createButton =function(label){
	var btn = document.createElement('div');
	btn.id = 'button';
	btn.innerHTML = label;
	return btn;
}