📄 webflow1.js
字号:
}
drawObject(vmlHTML);
if(removeFlag) FlowXML.value = xmlRoot.xml;
}
}
function clearXML(){
var FlowXML = document.all.FlowXML;
AUTODRAW = false;
FlowXML.value = '';
}
function clearVML(){
var FlowVML = document.all.FlowVML;
FlowVML.innerHTML = '';
FOCUSEDOBJID = '';
FOCUSEDOBJTYPE = '';
}
function drawObject(ObjHTML){
var FlowVML = document.all.FlowVML;
FlowVML.innerHTML+= ObjHTML;
}
function removeXMLNode(objId){
var FlowXML = document.all.FlowXML;
if(FlowXML.value!=''){
xmlDoc = new ActiveXObject('MSXML2.DOMDocument');
xmlDoc.async = false;
xmlDoc.loadXML(FlowXML.value);
var xmlRoot = xmlDoc.documentElement;
var Steps = xmlRoot.getElementsByTagName("Steps").item(0);
var Actions = xmlRoot.getElementsByTagName("Actions").item(0);
var findFlag = false;
for ( var i = 0;i < Steps.childNodes.length;i++ )
{
Step = Steps.childNodes.item(i);
id = Step.getElementsByTagName("BaseProperties").item(0).getAttribute("id");
if(id==objId) {
Steps.removeChild(Step);
findFlag = true;break;
}
}
if (!findFlag) {
for ( var i = 0;i < Actions.childNodes.length;i++ ){
Action = Actions.childNodes.item(i);
id = Action.getElementsByTagName("BaseProperties").item(0).getAttribute("id");
if(id==objId) {
Actions.removeChild(Action);
findFlag = true;break;
}
}
}
if (findFlag) {AUTODRAW = true;FlowXML.value = xmlRoot.xml;}
}
}
function getStepHTML(stepType,z_index,id,text,textColor,strokeColor,shadowColor,isShadow,width,height,X,Y,strokeWeight,textWeight,color1,color2,is3D,step3DDepth){
var stepHTML = '';
var styleHTML = 'id='+id+' title="'+id+'" style="z-index:'+z_index+';position:absolute;width:'+width+';height:'+height+';left:'+X+';top:'+Y+';" strokecolor="'+strokeColor+'" strokeweight="'+strokeWeight+'" onmouseover=\'this.style.cursor="hand";\' onmousedown=\'cleancontextMenu();objFocusedOn(this.id,"'+stepType+'");moveStep(this);\' oncontextmenu=\'objFocusedOn(this.id,"'+stepType+'");stepContextMenu("'+id+'","'+stepType+'");return false;\'';
var textStyleHTML = 'style="text-align:center; color:'+textColor+'; font-size:'+textWeight+';"';
var shadowHTML = '<v:shadow on="'+isShadow+'" type="single" color="'+shadowColor+'" offset="5px,5px"/>';
var gradientHTML = '<v:fill type="gradient" color="'+color1+'" color2="'+color2+'" />';
var step3DHTML = '<v:extrusion on="'+is3D+'" backdepth="'+step3DDepth+'" />';
if(stepType=='BeginStep' || stepType=='EndStep'){
stepHTML = '<v:Oval '+styleHTML+'>'+shadowHTML+step3DHTML+gradientHTML+'<v:TextBox inset="6pt,10pt,6pt,10pt" '+textStyleHTML+'>'+text+'</v:TextBox></v:Oval>';
}else{
stepHTML = '<v:RoundRect '+styleHTML+'>'+shadowHTML+step3DHTML+gradientHTML+'<v:TextBox inset="2pt,5pt,2pt,5pt" '+textStyleHTML+'>'+text+'</v:TextBox></v:RoundRect>';
}
return stepHTML;
}
function getActionHTML(actionType,z_index,id,actionText,fromStep,toStep,strokeColor,strokeWeight,startArrow,endArrow){
var actionHTML = '';
if(actionType == 'Line'){
actionHTML = '<v:line id='+id+' title="'+id+'" style="z-index:'+z_index+';position:absolute;" '+getActionPoints(actionType,fromStep,toStep)+' strokecolor="'+strokeColor+'" strokeweight="'+strokeWeight+'" onmousedown=\'cleancontextMenu();objFocusedOn(this.id,"Action");\' oncontextmenu=\'objFocusedOn(this.id,"Action");actionContextMenu("'+id+'");return false;\'><v:stroke StartArrow="'+startArrow+'" EndArrow="'+endArrow+'"/></v:line>';
}else{
actionHTML = '<v:PolyLine id='+id+' title="'+id+'" filled="false" Points="'+getActionPoints(actionType,fromStep,toStep)+'" style="z-index:'+z_index+';position:absolute;" strokecolor="'+strokeColor+'" strokeweight="'+strokeWeight+'" onmousedown=\'cleancontextMenu();objFocusedOn(this.id,"Action");\' oncontextmenu=\'objFocusedOn(this.id,"Action");actionContextMenu("'+id+'");return false;\'><v:stroke StartArrow="'+startArrow+'" EndArrow="'+endArrow+'"/></v:PolyLine>';
}
return actionHTML;
}
function ifRepeatStep(fromStepX,fromStepY,fromStepWidth,fromStepHeight,toStepX,toStepY,toStepWidth,toStepHeight){
return (fromStepX + fromStepWidth >= toStepX) && (fromStepY + fromStepHeight >= toStepY) && (toStepX + toStepWidth >= fromStepX) && (toStepY + toStepHeight >= fromStepY);
}
function getActionPoints(actionType,fromStep,toStep){
if (fromStep==null || toStep==null) return '';
var pointsHTML = '';
var fromStepWidth = parseInt(fromStep.style.width);
var fromStepHeight = parseInt(fromStep.style.height);
var toStepWidth = parseInt(toStep.style.width);
var toStepHeight = parseInt(toStep.style.height);
var fromStepX = parseInt(fromStep.style.left);
var fromStepY = parseInt(fromStep.style.top);
var toStepX = parseInt(toStep.style.left);
var toStepY = parseInt(toStep.style.top);
//FromStep Center X,Y
fromCenterX = fromStepX + parseInt(fromStepWidth/2);
fromCenterY = fromStepY + parseInt(fromStepHeight/2);
//ToStep Center X,Y
toCenterX = toStepX + parseInt(toStepWidth/2);
toCenterY = toStepY + parseInt(toStepHeight/2);
if(actionType=='Line' && fromStep!=toStep){//以下是Line的画线算法
//ToStep：左上顶点
toStepX1 = toStepX;
toStepY1 = toStepY;
//ToStep：右上顶点
toStepX2 = toStepX + toStepWidth;
toStepY2 = toStepY;
//ToStep：左下顶点
toStepX3 = toStepX;
toStepY3 = toStepY + toStepHeight;
//ToStep：右下顶点
toStepX4 = toStepX + toStepWidth;
toStepY4 = toStepY + toStepHeight;
//如果ToStep在FromStep的右下方，则取ToStep的左上顶点
if (toStepX>fromStepX && toStepY>fromStepY) {toX = toStepX1;toY = toStepY1;}
//如果ToStep在FromStep的左下方，则取ToStep的右上顶点
if (toStepX<fromStepX && toStepY>fromStepY) {toX = toStepX2;toY = toStepY2;}
//如果ToStep在FromStep的右上方，则取ToStep的左下顶点
if (toStepX>fromStepX && toStepY<fromStepY) {toX = toStepX3;toY = toStepY3;}
//如果ToStep在FromStep的左上方，则取ToStep的右下顶点
if (toStepX<fromStepX && toStepY<fromStepY) {toX = toStepX4;toY = toStepY4;}
pointsHTML = 'from="'+fromX+','+fromY+'" to="'+toX+','+toY+'"';
}else{//以下是PolyLine的画线算法
if(fromStep!=toStep){
//步骤是否叠盖: 叠盖就不画连线
if (ifRepeatStep(fromStepX,fromStepY,fromStepWidth,fromStepHeight,toStepX,toStepY,toStepWidth,toStepHeight)) {
return "";
}
point2X = fromCenterX;
point2Y = toCenterY;
if (toCenterX > fromCenterX) {
absY = toCenterY>=fromCenterY?toCenterY-fromCenterY:fromCenterY-toCenterY;
if (parseInt(fromStepHeight/2)>=absY) {
point1X = fromStepX + fromStepWidth;
point1Y = toCenterY;
point2X = point1X;
point2Y = point1Y;
}else{
point1X = fromCenterX;
point1Y = fromCenterY<toCenterY?fromStepY+fromStepHeight:fromStepY;
}
absX = toCenterX-fromCenterX;
if (parseInt(fromStepWidth/2)>=absX) {
point3X = fromCenterX;
point3Y = fromCenterY<toCenterY?toStepY:toStepY+toStepHeight;
point2X = point3X;
point2Y = point3Y;
}else{
point3X = toStepX;
point3Y = toCenterY;
}
}
if (toCenterX < fromCenterX) {
absY = toCenterY>=fromCenterY?toCenterY-fromCenterY:fromCenterY-toCenterY;
if (parseInt(fromStepHeight/2)>=absY) {
point1X = fromStepX;
point1Y = toCenterY;
point2X = point1X;
point2Y = point1Y;
}else{
point1X = fromCenterX;
point1Y = fromCenterY<toCenterY?fromStepY+fromStepHeight:fromStepY;
}
absX = fromCenterX-toCenterX;
if (parseInt(fromStepWidth/2)>=absX) {
point3X = fromCenterX;
point3Y = fromCenterY<toCenterY?toStepY:toStepY+toStepHeight;
point2X = point3X;
point2Y = point3Y;
}else{
point3X = toStepX + toStepWidth;
point3Y = toCenterY;
}
}
if (toCenterX == fromCenterX) {
point1X = fromCenterX;
point1Y = fromCenterY>toCenterY?fromStepY:fromStepY+fromStepHeight;
point3X = fromCenterX;
point3Y = fromCenterY>toCenterY?toStepY+toStepHeight:toStepY;
point2X = point3X;point2Y = point3Y;
}
if (toCenterY == fromCenterY) {
point1X = fromCenterX>toCenterX?fromStepX:fromStepX+fromStepWidth;
point1Y = fromCenterY;
point3Y = fromCenterY;
point3X = fromCenterX>toCenterX?toStepX+toStepWidth:toStepX;
point2X = point3X;point2Y = point3Y;
}
pointsHTML = point1X+','+point1Y+' '+point2X+','+point2Y+' '+point3X+','+point3Y;
}else{
var constLength = 30;
point0X = fromStepX+fromStepWidth-constLength;
point0Y = fromStepY+fromStepHeight;
point1X = point0X;
point1Y = point0Y+constLength;
point2X = fromStepX+fromStepWidth+constLength;
point2Y = point1Y;
point3X = point2X;
point3Y = point0Y-constLength;
point4X = fromStepX+fromStepWidth;
point4Y = point3Y;
pointsHTML = point0X+','+point0Y+' '+point1X+','+point1Y+' '+point2X+','+point2Y+' '+point3X+','+point3Y+' '+point4X+','+point4Y;
}
}
return pointsHTML;
}
function flowContextMenu(){
//菜单源文本
var menuSrc = '<menu><entity id="c0"><description>Add New Step</description><image>inc/contextMenu/images/add_step.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();newStep("NormalStep");</onClick><contents></contents></entity>';
menuSrc+= '<entity id="c1"><description>Add New Action</description><image>inc/contextMenu/images/add_action.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();newAction();</onClick><contents></contents></entity>';
menuSrc+= '<entity id="c2"><description>Refresh</description><image>inc/contextMenu/images/refresh_vml.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();redrawVML();</onClick><contents></contents></entity></menu>';
showContextMenu(menuSrc);
}
function stepContextMenu(stepId,stepType){
//菜单源文本
var menuSrc = '<menu><entity id="c0"><description>Edit Step['+stepId+']</description><image>inc/contextMenu/images/edit_obj.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();editStep("'+stepId+'","'+stepType+'");</onClick><contents></contents></entity>';
if(stepType!='BeginStep' && stepType!='EndStep') menuSrc+= '<entity id="c1"><description>Delete Step['+stepId+']</description><image>inc/contextMenu/images/del_obj.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();delStep("'+stepId+'");</onClick><contents></contents></entity>';
menuSrc+= '<entity id="c2"><description>Refresh</description><image>inc/contextMenu/images/refresh_vml.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();redrawVML();</onClick><contents></contents></entity></menu>';
showContextMenu(menuSrc);
}
function actionContextMenu(actionId){
//菜单源文本
var menuSrc = '<menu><entity id="c0"><description>Edit Action['+actionId+']</description><image>inc/contextMenu/images/edit_obj.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();editAction("'+actionId+'");</onClick><contents></contents></entity>';
menuSrc+= '<entity id="c1"><description>Delete Action['+actionId+']</description><image>inc/contextMenu/images/del_obj.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();delAction("'+actionId+'");</onClick><contents></contents></entity>';
menuSrc+= '<entity id="c2"><description>Refresh</description><image>inc/contextMenu/images/refresh_vml.gif</image><fontcolor>'+MenuTextColor_enable+'</fontcolor><onClick>cleancontextMenu();redrawVML();</onClick><contents></contents></entity></menu>';
showContextMenu(menuSrc);
}
function showContextMenu(menuSrc){
// //生成右键菜单
// xmlMenu = new ActiveXObject('MSXML2.DOMDocument')
// xmlMenu.async = false
// xmlMenu.loadXML(menuSrc)
// var root = xmlMenu.documentElement
//
// var menuText=''+root.xml+''
// loadContextMenu(menuText,'inc/contextMenu/contextmenu.xsl')
}
var dialogURL = "";
function workFlowDialog(id,type){
switch (type){
case 'NormalStep': dialogURL = id==null?'_stepdialog.html':'_stepdialog.html?stepid='+id;break;
case 'BeginStep': dialogURL = id==null?'_stepdialog.html':'_stepdialog.html?stepid='+id;break;
case 'EndStep': dialogURL = id==null?'_stepdialog.html':'_stepdialog.html?stepid='+id;break;
case 'Action': dialogURL = id==null?'_actiondialog.html':'_actiondialog.html?actionid='+id;break;
case 'Flow': dialogURL = id==null?'_flowdialog.html':'_flowdialog.html?flowid='+id;break;
}
var dialog = window.showModalDialog(dialogURL, window, "dialogWidth:373px; dialogHeight:460px; center:yes; help:no; resizable:no; status:no") ;
}
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -