<%@ include file="/frame/commoninclude.inc"%>
<script src= "js/workflow/contextmenu.js" ></script> <!--右键菜单-->
<script src= "js/workflow/ieemu.js" ></script>
<script src= "js/workflow/const.js" ></script><!--系统常量-->
<script src= "js/workflow/bar.js" ></script><!--工具栏类-->
<script src= "js/workflow/property.js" ></script><!--属性类-->
<script src= "js/workflow/changeproperty.js" ></script><!--更改属性类-->
<script src= "js/workflow/draw.js" ></script><!--图形类-->
<script src= "js/workflow/observer.js" ></script><!--观察类-->
<script src= "js/workflow/createxml.js" ></script><!--创建xml-->
<html xmlns:v><head>
<title>chart</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link type="text/css" rel="StyleSheet" href="css/workflow/main.css" />
</head>
<body bgcolor=buttonface oncontextmenu=" return false">
<!--流程图-->
<div id=drawCanvas onselectstart="return false" style='position:absolute;left:50; top:40; width:760; height:560;background-color:white;border:1 solid gray;color:black;background-image:url("images/workflow/workflow4.gif")' >
<select name="sltObjArray" style="display:none">
<option value="w0">w0</option>
</select>
<input name="iptCtlNum" value="1" style="display:none">
<v:shape id=w0 ctlType="initial" ctlName="initial" view="" style="LEFT: 20px; WIDTH: 80px; POSITION: absolute; TOP:20px; HEIGHT: 40px" line="" ctlNodeType="node" auto="no" coordsize = "1000,1000" path = "m 8,65 l 72,65,92,11,112,65,174,65,122,100,142,155,92,121,42,155,60,100 x e">
<v:shadow style="CURSOR: default" ctlNodeType="childNode" on = "t" type = "single" color = "#b3b3b3" offset = "2.25pt,2.25pt"></v:shadow>
<v:TextBox style="MARGIN-TOP: 7.875pt; FONT-SIZE: 10.2pt; LEFT: auto; MARGIN-LEFT: 0.375pt; OVERFLOW: visible; WIDTH: 60.75pt; CURSOR: default; TOP: auto; HEIGHT: 23.25pt" ctlNodeType="childNode" inset = "-1.5pt,6pt,0,0">开始</v:TextBox></v:shape>
</div>
<!--右边的属性显示菜单-->
<span id=spnRightBar style='position:absolute;left:815;top:27;width:175;height:573;padding:6;z-index:100;border-left:2px outset;border-top:2px outset;border-right:2px outset;border-bottom:2px outset;background:buttonface'>
<span style=padding:2;background:#0A246A;color:white;width:163;>属性-<label id=lbCtlName></label></span>
<span style='width:164;height:480;background:buttonface;border:2px inset;overflow:auto'>
<table id=tbProperty cellpadding=0 border=1 bordercolor=gray cellspacing=0 style='width:100%;border-collapse:collapse'>
</table>
</span>
</span>
<!------------------------------------------------------------------------------
| 绘图,拖动 |
| |
| |
------------------------------------------------------------------------------->
<script language="JavaScript">
/**
* onmousedown 绘图,选择
*/
function drawCanvas.onmousedown(){
if ( fLiftButton=="select" ) { //选择
var selectDrawState = new SelectDrawState();
selectDrawState.clickEvent = event;
drawContext.setDrawState(selectDrawState);
} else if ( fLiftButton=="steps" ) { //步骤
drawContext.setDrawState(new StepsDrawState());
} else if ( fLiftButton=="joins" ) { //合并
drawContext.setDrawState(new JoinsDrawState());
} else if ( fLiftButton=="splits" ) { //分支
drawContext.setDrawState(new SplitsDrawState());
} else if ( fLiftButton=="line" ) { //画线
var lineDrawState = new LineDrawState();
lineDrawState.clickEvent = event;
drawContext.setDrawState(lineDrawState);
} else {
alert("请选择左边工具栏进行绘图");
return;
}
var tag = drawContext.draw(drawCanvas,event);
if (tag == true) { //如果返回为真
drawCanvas.style.cursor='default';
leftToolBar.clickBtn(0); //按下左边工具栏第一个按钮
controlSubject.notifyObservers(); //通知所有的观察者
}
}
/**
* onmousemove 改变被拖动元素在页面上的位置
*/
function drawCanvas.onmousemove() {
if (event.button==1&&fDragApproved&&fSelectedObj!=null) {
//移动到当前坐标
fSelectedObj.style.pixelLeft=event.clientX+fx;
fSelectedObj.style.pixelTop=event.clientY+fy;
//是否超出范围
var rx = fSelectedObj.style.pixelLeft;
var ry = fSelectedObj.style.pixelTop;
var sx = drawCanvas.clientWidth-(fSelectedObj.style.pixelLeft+20);
var sy = drawCanvas.clientHeight-(fSelectedObj.style.pixelTop+15);
if( rx<0 ) fSelectedObj.style.left = 0;
if( ry<0 ) fSelectedObj.style.top = 0;
if( sx<0 ) fSelectedObj.style.left = drawCanvas.clientWidth-20;
if( sy<0 ) fSelectedObj.style.top = drawCanvas.clientHeight-15;
//通知拖动观察者
movecontrolSubject.notifyObservers();
return false;
}
}
/**
* onmouseup 鼠标左键放开时,拖动停止
*/
function drawCanvas.onmouseup() {
if (fDragApproved&&fSelectedObj!=null) {
moveObjToline(fSelectedObj); //跟表格对齐
controlSubject.notifyObservers(); //通知所有的观察者
}
fDragApproved=false;
}
</script>
<!------------------------------------------------------------------------------
| 系统对象的初始化 |
| |
| |
------------------------------------------------------------------------------->
<script language="JavaScript">
/**
* 创建左边的工具条
*/
var leftToolBar = new ToolBar("select,steps,joins,splits,line",0,27,44,573);
leftToolBar.clickBtn(0); //按下左边工具栏第一个按钮
function leftToolBarClick(aBtnName) {
fLiftButton = aBtnName;
if ( fLiftButton=="line" ) { //画线
fAddLineFlag=1;
drawCanvas.style.cursor='hand';
alert("请先选择线条的起点");
} else {
fAddLineFlag=0;
drawCanvas.style.cursor='default';
}
}
/**
* 上边的工具条对象
*/
//var bar1 = new bar("new,open,save,|,code,|,play");
/**
* 创建控件主题对象
*/
var controlSubject = new ControlSubject();
var propertyLabelObserver = new PropertyLabelObserver();//加入 右边的属性标签
propertyLabelObserver.setObject(document.all.lbCtlName);
controlSubject.attach(propertyLabelObserver);
controlSubject.attach(new PropertyListObserver());//加入 右边的属性列表
controlSubject.attach(new focusCtlObserver());//加入 获得焦点
controlSubject.attach(new LinesObserver());//加入 线条重绘
/**
* 创建控件主题对象 用于拖动中 轻量级的主题
*/
var movecontrolSubject = new ControlSubject();
movecontrolSubject.attach(new leftTopPropertyObserver());//加入 显示left和top两个属性
movecontrolSubject.attach(new LinesObserver());//加入 线条重绘
/**
* 创建画图环境对象
*/
var drawContext = new DrawContext();
/**
* 创建属性显示环境对象
*/
var propertyContext = new PropertyContext();
/**
* 创建属性改变环境对象
*/
var changePropertyContext = new ChangePropertyContext();
</script>
<!------------------------------------------------------------------------------
| 右键菜单 |
| |
| |
------------------------------------------------------------------------------->
<script language="JavaScript">
//初始化右键菜单
ContextMenu.intializeContextMenu();
var dm ;
function contextForThis(obj) {
var eobj,popupoptions;
dm = new ContextItem("删除",function(){changedis(obj)},false);
popupoptions = [dm
];
ContextMenu.display(popupoptions);
}
function changedis(aobj) {
removeFromObjArray(aobj);
aobj.removeNode(true);
}
</script>
<script language="JavaScript">
fCtlNum = iptCtlNum.value; //初始控件数量
</script>
<input type="submit" name="Submit" value="Submit" oncli
javascript版本的工作流下载
需积分: 9 146 浏览量
2008-11-10
14:00:44
上传
评论
收藏 31KB RAR 举报
javascript_workflow.rar （53个子文件） 
flow_next.jsp 1KB
css workflow contextmenu.css 2KB main.css 245B flow_result.jsp 1KB flow_condition.jsp 1KB chart.htm 8KB images workflow 
workflow4.gif 79B hdl.gif 53B img.gif 183B splits.gif 208B hdl_dis.gif 53B rd.gif 126B line.gif 98B btClose.gif 110B combo.gif 157B more.gif 101B new.gif 147B start.gif 301B joins.gif 211B select.gif 88B sel.gif 88B begin.gif 301B save.gif 113B ico_form.gif 109B frm.gif 125B code.gif 128B field_error.gif 1KB list.gif 149B lb.gif 96B process.gif 101B more_hit.gif 111B play.gif 72B steps.gif 86B bt.gif 133B ck.gif 138B split2.gif 67B tx.gif 175B end.gif 306B head_bg.gif 888B split.gif 69B drop.gif 111B open.gif 126B js workflow bar.js 8KB observer.js 4KB draw.js 8KB const.js 5KB changeproperty.js 4KB createxml.js 2KB ieemu.js 8KB property.js 13KB contextmenu.js 4KB flow_role.jsp 1KB flow_prv.jsp 1KB workflow 资源评论
