fastkey_tool_manage

feng547
于 2011-11-11 08:53:39 发布
阅读量508
点赞数
文章标签： jquery function stylesheet button null 工具
本文链接：https://blog.youkuaiyun.com/feng547/article/details/6958457
版权
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<html>
<head>
<title>IBUS</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />


<%@ include file="common/tablib.jsp" %>

<link rel="stylesheet" type="text/css" href="css/skins/ibusblue/dhtmlxwindows_dhx_ibusblue.css" />

<link rel="STYLESHEET" type="text/css" href="css/dhtmlxtree.css">
<link rel="stylesheet" type="text/css" href="css/dhtmlxwindows.css" />
<link rel="stylesheet" type="text/css" href="css/css.css" />




<script src="js/dhtmlx/dhtmlxcommon.js"></script>
<script src="js/dhtmlx/dhtmlxcontainer.js"></script>
<script src="js/dhtmlx/dhtmlxwindows.js"></script>
<script  src="js/dhtmlx/dhtmlxtree.js"></script>

<script src="js/dhtmlx/dhtmlxtoolbar.js"></script>

<script src="js/util/ibus_util.js"></script>
<script src="js/util/jquery-1.4.4.js"></script>
<script src="js/ibus/boc_invoker.js"></script>
<script src="js/ibus/ToolEntity.js"></script>
<script src="js/ibus/ToolBarEntity.js"></script>
<script src="js/ibus/FastkeyEntity.js"></script>

</head>

<body style="background:#f1f8ff; ">
<form id="form1" name="form1" method="post" action="">
<input type="hidden" id="buttonArray" value=""/>
<input type="hidden" id="updateButtonId" value=""/>
<input type="hidden" id="targetId" value="<%=request.getParameter("targetId") %>"/>


<table width="500" border="0" cellspacing="0" cellpadding="0" style="margin:3px 0 0 3px;">
  <tr style="height:30px;">
  	<td width="200">系统菜单</td>
  	<td width="100"> </td>
  	<td width="200">当前显示快捷键</td>
  </tr>
  
  <tr>
	
  <td valign="top">
		<div id="templatemo">
			<div id="templatemo_tooltree" style="height:300px; width:200px">
				
			</div>
		</div>
	</td>
    
    
	<td align="center">
	  <p>
	    <input type="button" id="addButton" 		value="添加->" 	rel="no_init_style" 	class="toolbarbnt" 	οnclick="onClickAddButton()"/>
	    <input type="button" id="upButton"  		value="上  移" 		rel="no_init_style" 	class="toolbarbnt" 	οnclick="onClickUpButton()"/>
	    <input type="button" id="downButton"  		value="下  移" 		rel="no_init_style" 	class="toolbarbnt" 	οnclick="onClickDownButton()"/>    
	    <input type="button" id="removeButton" 		value="<-移除" 	rel="no_init_style" 	class="toolbarbnt" 	οnclick="onClickRemoveButton()"/>
	  </p>
    </td>
        
        
        <td style=" vertical-align:top">
		<div id="templatemo">
			<div id="templatemo_menu" onDragStart= "return   false "   onSelectStart= "return   false " >
				<ul id="currentButtonUl">
 
				</ul>
			</div>
		</div>
	</td>
    
    
  </tr>
</table>


<div id="srcDiv" style="position: relative;padding-top:5px; text-align:center; width:500px;">
	<table width="500" border="0" cellpadding="0" cellspacing="0">
  <tr>
	<td align="center">
		<input type="button" name="ensure" value="确 定" rel="no_init_style" class="winensurebnt" οnclick="ensureButton()"/>
		 
		<input type="button" name="cancel" value="取 消" rel="no_init_style" class="winclosedbnt" οnclick="closeWindow();"/>
    	 
    	<input type="button" name="apply" value="应 用" rel="no_init_style" class="winapplybnt" οnclick="applyButton();"/>
    </td>
  </tr>
</table>
</div>

</form>

<script type="text/javascript">

	var tabarId = document.getElementById("targetId").value;
	
	var designerObj = parent.getSelfDesigner(tabarId);
	var appid = designerObj.appid;

	var add_newbutton_frame = null;
	var update_newButton_frame = null;
	var dhxWins = designerObj.dhxWins;
	var userMenusArray=new Array();//存放当前显示工具对象
	var userMenusMap=new Map();//存放菜单项对象
	
	var toolTree = new dhtmlXTreeObject("templatemo_tooltree" ,"100%","100%",0);
	toolTree.setImagePath("imgs/ibus/system/");

	loadSystemTreeXml();
	
	//加载当前显示工具
	loadUserToolEntity();
	//初始化按扭样式
	initButtonCss();
	
	
	//点击树节点触发事件（设置按扭的样式）
	toolTree.attachEvent("onSelect", function(id){
		
		initButtonCss();
		var selectLevel=toolTree.getLevel(id);
		var img = toolTree.getItemImage(id,0,null);
		
		if(selectLevel==4 || img=="toolimg02.gif"){
			jQuery("#addButton").removeAttr("disabled");
		}		
	});
	
	
	
	//双击树节点时添加工具到当前显示工具列表
	toolTree.attachEvent("onDblClick", function(curId){
		
		var selectLevel=toolTree.getLevel(curId);
		var img = toolTree.getItemImage(curId,0,null);
	    
		if(selectLevel==4 || img=="toolimg02.gif"){

			for(var i=0;i<userMenusArray.length;i++){
			
				if(curId == userMenusArray[i].id){
					alert("当前显示工具列表中已包括事件，不能重复添加！");
					return false;
				}
			}
			
			userMenusArray.push(userMenusMap.get(curId));
			viewUserTool();
			return true;
		}
	});
	

	//添加
	function onClickAddButton(){
	    var curId=toolTree.getSelectedItemId(); 
		var selectLevel=toolTree.getLevel(curId);
		var img = toolTree.getItemImage(curId,0,null);
	    
		if(selectLevel==4 || img=="toolimg02.gif"){

			for(var i=0;i<userMenusArray.length;i++){
			
				if(curId == userMenusArray[i].id){
					alert("当前显示工具列表中已包括事件，不能重复添加！");
					return false;
				}
			}
			
			userMenusArray.push(userMenusMap.get(curId));
			viewUserTool();
			return true;
		}
	}
	
	
	//上移
	function onClickUpButton(){
		var curElement = jQuery(".current");
		if(curElement == null);
		var curId=jQuery(curElement).attr("id");
		
		var tempElement = null;
		var tempIndex = -1;
		
		for(var i=0;i<userMenusArray.length;i++){
		
			if(curId == userMenusArray[i].id){
				tempIndex = i-1;
				tempElement = userMenusArray[i];
				userMenusArray[i] = userMenusArray[i-1];
				userMenusArray[i-1] = tempElement;
				break;
			}
		}
		viewUserTool();
		initButtonCss();
		jQuery(jQuery("li[name='currentButton']")[tempIndex]).trigger("onclick");
	}
	

	//下移
	function onClickDownButton(){
	    
		var curElement = jQuery(".current");
		if(curElement == null) return;
		
		var curId=jQuery(curElement).attr("id");
		
		var tempElement = null;
		var tempIndex = 0;
		
		for(var i=0; i<userMenusArray.length; i++){
		
			if(curId == userMenusArray[i].id){
				tempIndex = i+1;
				tempElement = userMenusArray[i];
				userMenusArray[i] = userMenusArray[i+1];
				userMenusArray[i+1] = tempElement;
				break;
			}
		}
		viewUserTool();
		initButtonCss();
		jQuery(jQuery("li[name='currentButton']")[tempIndex]).trigger("onclick");
	}
	
		
	//移除
	function onClickRemoveButton(){
	
		var curElement = jQuery(".current");
		if(curElement == null) return;
		
		
		var curId=jQuery(curElement).attr("id");
		var tempArray=new Array();
		for(var i=0;i<userMenusArray.length;i++){
		
			if(curId != userMenusArray[i].id){
					tempArray.push(userMenusArray[i]);
			}
		}
		
		userMenusArray=tempArray;
		viewUserTool();
		initButtonCss();
		
		if(jQuery("li[name='currentButton']").length < 1){
			jQuery("li").removeClass("current");
		}else{
			jQuery(jQuery("li[name='currentButton']")[0]).trigger("onclick");
		}	
		
	}

	
	
	//设置当前显示工具 选中状态CSS
	function setItemSelected(curElement){

		jQuery("li").removeClass("current");
		curElement.className = "current";
		
		initButtonCss();
		
		var buttonArray = jQuery("li[name='currentButton']");
		
		var curId=jQuery(curElement).attr("id");
		var firstId = jQuery(buttonArray[0]).attr("id");
		var lastID = jQuery(buttonArray[buttonArray.length-1]).attr("id");
			
		jQuery("#removeButton").removeAttr("disabled");
		if(curId != firstId){
			jQuery("#upButton").removeAttr("disabled");
		}
			
		if(curId != lastID){
			jQuery("#downButton").removeAttr("disabled");
		}			
	}


	//设置当前显示工具 的双击响应事件
	function moveToAnotherSize(element){
	
		var curId=jQuery(element).attr("id");
		var tempArray=new Array();
		for(var i=0;i<userMenusArray.length;i++){
		
			if(curId != userMenusArray[i].id){
					tempArray.push(userMenusArray[i]);
			}
		}
		
		userMenusArray=tempArray;
		viewUserTool();
		initButtonCss();
		
		if(jQuery("li[name='currentButton']").length < 1){
			jQuery("li").removeClass("current");
		}else{
			jQuery(jQuery("li[name='currentButton']")[0]).trigger("onclick");
		}	
	}
	
	//从父页面designerObj对象中读取快捷键数据， 采用复制方式加载数据
	function loadUserToolEntity(){

		var userArray=new Array();

		if (designerObj.fastkeyEntity.menusArray==null) {
			return;
		}
	
		for(var i=0; i<designerObj.fastkeyEntity.menusArray.length; i++){
			//userArray[i]=designerObj.fastkeyEntity.menusArray[i];
			userArray.push(designerObj.fastkeyEntity.menusArray[i]);
		}
		
		userMenusArray=userArray;
		viewUserTool();
	}
	
	//加载菜单项对象
	function loadMenusObject(treeXmlString){
	    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
	    xmlDoc.loadXML(treeXmlString);
		//alert(serializeXml(xmlDoc));
		
		var mNodes = xmlDoc.childNodes[1].childNodes;
		if (mNodes!=null) {
		    treeXml(mNodes);	
		}
	}
	
	//递归解析树XML
	function treeXml(el){
	    for ( var i = 0; i < el.length; i++) {
			var menuEntity = new FastMenuEntity()
			menuEntity.id = el[i].getAttribute("id");
			menuEntity.code = el[i].getAttribute("code");
			menuEntity.name = el[i].getAttribute("text");
			menuEntity.img = el[i].getAttribute("img");
			menuEntity.targer = el[i].getAttribute("url");
			userMenusMap.put(menuEntity.id,menuEntity);
			var mNodes = el[i].childNodes;
			if (mNodes!=null) {
		        treeXml(mNodes);	
		    }
				
		}
	}
	
	//根据用户工具数组对象，显示工具
	function viewUserTool(){
		
		var innerHTML="";
		for(var i = 0; i < userMenusArray.length; i++){
			
			var menuEntity=userMenusArray[i];
			innerHTML=innerHTML+"<li name=\"currentButton\"  id=\""+menuEntity.id+"\"  οnclick=\"setItemSelected(this)\" οndblclick=\"moveToAnotherSize(this)\"><a><b><img src=\"imgs/ibus/system/toolimg02.gif" + "\" align=\"absmiddle\" /> "+menuEntity.name+"</b></a></li>";
		}
		jQuery("ul[id='currentButtonUl']").empty();
		jQuery(innerHTML).appendTo(jQuery("ul[id='currentButtonUl']"));	
		return true;
	}
	
	
	
	
	//加载系统菜单树数据
	function loadSystemTreeXml(){
		
		var clientController = new ClientBOController("fastkey_boc","loadTreeXml");
		clientController.addParameter("appid",appid);
		bocInvoker.bocName = "BOControllerAction";
		bocInvoker.bocMethod = "executeBoc";
	    var treeXml = bocInvoker.invokeSynchronized(clientController);
		toolTree.loadXMLString(treeXml,null);
		
		//加载菜单项对象
	    loadMenusObject(treeXml);
	}
	
	function initButtonCss(){
		
		jQuery("#addButton").attr("disabled","true");
		jQuery("#upButton").attr("disabled","true");
		jQuery("#downButton").attr("disabled","true");
		jQuery("#removeButton").attr("disabled","true");
		//jQuery("#updateButton").attr("disabled","true");
		//jQuery("#deleteButton").attr("disabled","true");
		
	}
	
	//点击取消时关闭窗口
	function closeWindow() {
		dhxWins.window("fastkey").close();				
	}



	//点击应用按钮
	function applyButton(){
		
		var toolbarObj = designerObj.ibusFastkey;
		toolbarObj.clearAll();
		
		parent.viewFastkey(toolbarObj, userMenusArray);
		
		var tempArray=new Array();
		designerObj.fastkeyEntity.menusArray = new Array();
		
		for(var j=0; j<userMenusArray.length; j++){
			tempArray[j]=userMenusArray[j];
			designerObj.fastkeyEntity.menusArray.push(userMenusArray[j]);
		}
		
		//designerObj.fastkeyEntity.menusArray=tempArray;
		var xmlStr = getFastkeyEntityXmlStr(designerObj.fastkeyEntity);
		//alert(xmlStr);
		//alert(designerObj.fastkeyEntity.menusArray);
		
		//alert(getFastkeyEntityXmlStr(designerObj.fastkeyEntity));
		
		var clientController = new ClientBOController("fastkey_boc","save");
		clientController.addParameter("xmlStr",xmlStr);
		bocInvoker.bocName = "BOControllerAction";
		bocInvoker.bocMethod = "executeBoc";
	    var returnStr = bocInvoker.invokeSynchronized(clientController);
	    alert(returnStr);
	}
	
	
	
	//点击确定按钮
	function ensureButton(){
		applyButton();
		closeWindow();
	}
	
	
</script>

</body>
</html>