last demo import - cleaned

This commit is contained in:
ycc
2023-08-26 22:04:56 +02:00
parent 0ab5dd5e38
commit f3c3c67e2c
884 changed files with 301494 additions and 1 deletions

View File

@@ -0,0 +1,333 @@
<mxEditor defaultGroup="group" defaultEdge="connector">
<include name="config/editor-commons.xml"/>
<add as="onInit"><![CDATA[
function ()
{
onInit(this);
}
]]></add>
<ui>
<add as="graph" element="graph"/>
<add as="status" element="status"/>
<add as="toolbar" element="toolbar"/>
</ui>
<Array as="templates">
<add as="group">
<Group label="" href="">
<mxCell vertex="1" style="group" connectable="0"/>
</Group>
</add>
<add as="connector">
<Connector label="" href="">
<mxCell edge="1">
<mxGeometry as="geometry" relative="1"/>
</mxCell>
</Connector>
</add>
<add as="container">
<Container label="Container" href="">
<mxCell vertex="1" style="swimlane" connectable="0">
<mxGeometry as="geometry" width="200" height="200"/>
</mxCell>
</Container>
</add>
<add as="rectangle">
<Rect label="Rectangle" href="">
<mxCell vertex="1">
<mxGeometry as="geometry" width="80" height="40"/>
</mxCell>
</Rect>
</add>
<add as="text">
<Text label="Text Here" href="">
<mxCell vertex="1" style="text">
<mxGeometry as="geometry" width="80" height="20"/>
</mxCell>
</Text>
</add>
<add as="image">
<Image label="" href="">
<mxCell vertex="1" style="image">
<mxGeometry as="geometry" width="80" height="50"/>
</mxCell>
</Image>
</add>
<add as="rounded">
<Roundrect label="Rounded" href="">
<mxCell vertex="1" style="rounded">
<mxGeometry as="geometry" width="80" height="40"/>
</mxCell>
</Roundrect>
</add>
<add as="shape">
<Shape label="Shape" href="">
<mxCell vertex="1" style="ellipse">
<mxGeometry as="geometry" width="60" height="60"/>
</mxCell>
</Shape>
</add>
<add as="actor">
<Shape label="Shape" href="">
<mxCell vertex="1" style="actor">
<mxGeometry as="geometry" width="40" height="60"/>
</mxCell>
</Shape>
</add>
<add as="cloud">
<Shape label="Shape" href="">
<mxCell vertex="1" style="cloud">
<mxGeometry as="geometry" width="80" height="60"/>
</mxCell>
</Shape>
</add>
<add as="hline">
<Shape label="" href="">
<mxCell vertex="1" style="ellipse">
<mxGeometry as="geometry" width="60" height="10"/>
</mxCell>
</Shape>
</add>
</Array>
<mxGraph as="graph" alternateEdgeStyle="verticalConnector" allowLoops="1" dropEnabled="1">
<add as="isAutoSizeCell"><![CDATA[
function(cell)
{
return mxUtils.isNode(this.model.getValue(cell), 'text');
}
]]></add>
<add as="isSwimlane"><![CDATA[
function (cell)
{
return mxUtils.isNode(this.model.getValue(cell), 'container');
}
]]></add>
<add as="getTooltipForCell"><![CDATA[
function(cell)
{
var label = cell.getAttribute('label');
var style = cell.getStyle();
return ((label != null) ? ('<b>' + label +
'</b> (' + cell.getId() + ')<br>') : '') +
((style != null) ? ('<br>Style: ' + style + '<br>') : '') +
'Connections: ' + cell.getEdgeCount()+
'<br>Children: ' + cell.getChildCount();
}
]]></add>
<add as="convertValueToString"><![CDATA[
function(cell)
{
return cell.getAttribute('label');
}
]]></add>
<mxStylesheet as="stylesheet">
<add as="text">
<add as="shape" value="rectangle"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="12"/>
<add as="align" value="left"/>
<add as="verticalAlign" value="top"/>
<add as="shadow" value="0"/>
<add as="strokeColor" value="none"/>
<add as="fillColor" value="none"/>
<add as="gradientColor" value="none"/>
</add>
<add as="defaultVertex" extend="text">
<add as="shape" value="rectangle"/>
<add as="fontSize" value="11"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="shadow" value="1"/>
<add as="strokeColor" value="#C3D9FF"/>
<add as="fillColor" value="#C3D9FF"/>
<add as="gradientColor" value="white"/>
</add>
<add as="group">
<add as="shape" value="rectangle"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="strokeColor" value="gray"/>
<add as="dashed" value="1"/>
</add>
<add as="defaultEdge">
<add as="shape" value="connector"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="rounded" value="1"/>
<add as="labelBackgroundColor" value="white"/>
<add as="strokeColor" value="#36393D"/>
<add as="strokeWidth" value="1"/>
<add as="edgeStyle" value="elbowEdgeStyle"/>
<add as="endArrow" value="classic"/>
</add>
<add as="verticalConnector">
<add as="elbow" value="vertical"/>
</add>
<add as="straightConnector">
<add as="shape" value="connector"/>
<add as="endArrow" value="classic"/>
<add as="edgeStyle">null</add>
</add>
<add as="arrowConnector">
<add as="shape" value="arrow"/>
<add as="fillColor" value="#C3D9FF"/>
<add as="endSize" value="20"/>
<remove as="edgeStyle"/>
</add>
<add as="swimlane">
<add as="shape" value="swimlane"/>
<add as="shadow" value="0"/>
<add as="startSize" value="23"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="top"/>
<add as="strokeColor" value="#EEEEEE"/>
<add as="fillColor" value="#D4D4D4"/>
</add>
<add as="rounded">
<add as="rounded" value="1"/>
</add>
<add as="ellipse">
<add as="shape" value="ellipse"/>
<add as="perimeter" value="ellipsePerimeter"/>
<add as="strokeColor" value="#CDEB8B"/>
<add as="fillColor" value="#CDEB8B"/>
</add>
<add as="doubleEllipse" extend="ellipse">
<add as="shape" value="doubleEllipse"/>
</add>
<add as="rhombus">
<add as="shape" value="rhombus"/>
<add as="perimeter" value="rhombusPerimeter"/>
<add as="strokeColor" value="#FFCF8A"/>
<add as="fillColor" value="#FFCF8A"/>
</add>
<add as="triangle" extend="rhombus">
<add as="shape" value="triangle"/>
<add as="perimeter" value="trianglePerimeter"/>
<add as="align" value="left"/>
</add>
<add as="hexagon">
<add as="shape" value="hexagon"/>
</add>
<add as="actor">
<add as="shape" value="actor"/>
<add as="strokeColor" value="#FFC7C7"/>
<add as="fillColor" value="#FFC7C7"/>
</add>
<add as="cloud">
<add as="shape" value="cloud"/>
<add as="perimeter" value="ellipsePerimeter"/>
<add as="strokeColor" value="#CDEB8B"/>
<add as="fillColor" value="#CDEB8B"/>
</add>
<add as="cylinder">
<add as="shape" value="cylinder"/>
<add as="spacingTop" value="10"/>
<add as="strokeColor" value="#4096EE"/>
<add as="fillColor" value="#4096EE"/>
</add>
<add as="hline">
<add as="shape" value="line"/>
<add as="strokeWidth" value="3"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontColor" value="black"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="bottom"/>
<add as="strokeColor" value="#36393D"/>
</add>
<add as="image">
<add as="shape" value="image"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="image" value="images/draw/mxlogo.jpg"/>
</add>
</mxStylesheet>
<mxGraphModel as="model">
<add as="valueForCellChanged"><![CDATA[
function(cell, value)
{
var previous = null;
if (value == null || isNaN(value.nodeType))
{
previous = cell.value.getAttribute('label');
if (value == null)
{
cell.value.removeAttribute('label');
}
else
{
cell.setAttribute('label', value);
}
}
else
{
previous = cell.value;
cell.value = value;
}
return previous;
}
]]></add>
<root>
<Diagram label="My Diagram" href="http://www.jgraph.com/" id="0">
<mxCell/>
</Diagram>
<Layer label="Default Layer" id="1">
<mxCell parent="0"/>
</Layer>
</root>
</mxGraphModel>
</mxGraph>
<mxDefaultToolbar as="toolbar">
<add as="connect" mode="connect" icon="images/connect.gif"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = null;
}
}
]]></add>
<add as="connect" mode="connect" icon="images/straight.gif"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = 'straightConnector';
}
}
]]></add>
<add as="connect" mode="connect" icon="images/arrow.gif"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = 'arrowConnector';
}
}
]]></add>
<br/><br/>
<add as="Text" template="text" icon="images/text.gif"/>
<add as="Container" template="container" icon="images/swimlane.gif"/>
<add as="Rectangle" template="rectangle" icon="images/rectangle.gif"/>
<add as="Rounded" template="rounded" icon="images/rounded.gif"/>
<add as="Ellipse" template="shape" style="ellipse" icon="images/ellipse.gif"/>
<add as="Double Ellipse" template="shape" style="doubleEllipse" icon="images/doubleellipse.gif"/>
<add as="Rhombus" template="shape" style="rhombus" icon="images/rhombus.gif"/>
<add as="Triangle" template="actor" style="triangle" icon="images/triangle.gif"/>
<add as="Hexagon" template="cloud" style="hexagon" icon="images/hexagon.gif"/>
<add as="Actor" template="actor" style="actor" icon="images/actor.gif"/>
<add as="Cylinder" template="shape" style="cylinder" icon="images/cylinder.gif"/>
<add as="Cloud" template="cloud" style="cloud" icon="images/cloud.gif"/>
<add as="Line" template="hline" style="hline" icon="images/hline.gif"/>
<add as="Image" template="image" icon="images/image.gif"/>
</mxDefaultToolbar>
</mxEditor>

View File

@@ -0,0 +1,267 @@
<mxEditor>
<ui>
<resource basename="resources/app"/>
</ui>
<mxDefaultPopupMenu as="popupHandler">
<add as="cut" action="cut" icon="images/cut.gif"/>
<add as="copy" action="copy" icon="images/copy.gif"/>
<add as="paste" action="paste" icon="images/paste.gif"/>
<separator/>
<add as="delete" action="delete" icon="images/delete.gif" if="cell"/>
<separator/>
<add as="exitGroup" action="exitGroup" icon="images/up.gif" if="notRoot"/>
<add as="enterGroup" action="enterGroup" icon="images/down.gif" if="validRoot"/>
<separator/>
<add as="shape" if="cell">
<add as="group" action="group" icon="images/group.gif" if="ncells"/>
<add as="ungroup" action="ungroup" icon="images/ungroup.gif" if="cell"/>
<separator/>
<add as="removeFromParent" action="removeFromParent" if="cell"/>
<separator/>
<add as="collapse" action="collapse" icon="images/collapse.gif" if="expandable"/>
<add as="expand" action="expand" icon="images/expand.gif" if="collapsable"/>
<separator/>
<add as="toFront" action="toFront" icon="images/tofront.gif" if="cell"/>
<add as="toBack" action="toBack" icon="images/toback.gif" if="cell"/>
<separator/>
<add as="editStyle" action="editStyle" if="cell"/>
</add>
<add as="format" if="cell">
<add as="fillColor" action="fillColor" icon="images/fillcolor.gif" if="cell"/>
<add as="gradientColor" action="gradientColor" if="cell"/>
<add as="strokeColor" action="strokeColor" icon="images/linecolor.gif" if="cell"/>
<separator/>
<add as="toggleRounded" action="toggleRounded" if="cell"/>
<add as="toggleShadow" action="toggleShadow" if="cell"/>
</add>
<add as="font" if="cell">
<add as="fontColor" action="fontColor" icon="images/fontcolor.gif" if="cell"/>
<add as="fontFamily" action="fontFamily" if="cell"/>
<add as="fontSize" action="fontSize" if="cell"/>
<separator/>
<add as="bold" action="bold" icon="images/bold.gif" if="cell"/>
<add as="italic" action="italic" icon="images/italic.gif" if="cell"/>
</add>
<separator/>
<add as="properties" action="showProperties" icon="images/properties.gif"/>
<separator/>
<add as="openHref" action="openHref" icon="images/link.gif"/>
</mxDefaultPopupMenu>
<include name="config/keyhandler-commons.xml"/>
<Array as="actions">
<add as="open"><![CDATA[
function (editor)
{
editor.open(mxUtils.prompt('Enter filename', 'workflow.xml'));
}
]]></add>
<add as="openHref"><![CDATA[
function (editor, cell)
{
cell = cell || editor.graph.getSelectionCell();
if (cell == null)
{
cell = editor.graph.getCurrentRoot();
if (cell == null)
{
cell = editor.graph.getModel().getRoot();
}
}
if (cell != null)
{
var href = cell.getAttribute('href');
if (href != null && href.length > 0)
{
window.open(href);
}
else
{
mxUtils.alert('No URL defined. Showing properties...');
editor.execute('showProperties', cell);
}
}
}
]]></add>
<add as="editStyle"><![CDATA[
function (editor)
{
var cell = editor.graph.getSelectionCell();
if (cell != null)
{
var model = editor.graph.getModel();
var style = mxUtils.prompt(mxResources.get('enterStyle'), model.getStyle(cell) || '');
if (style != null)
{
model.setStyle(cell, style);
}
}
}
]]></add>
<add as="fillColor"><![CDATA[
function (editor)
{
var color = mxUtils.prompt(mxResources.get('enterColorname'), 'red');
if (color != null)
{
editor.graph.model.beginUpdate();
try
{
editor.graph.setCellStyles("strokeColor", color);
editor.graph.setCellStyles("fillColor", color);
}
finally
{
editor.graph.model.endUpdate();
}
}
}
]]></add>
<add as="gradientColor"><![CDATA[
function (editor)
{
var color = mxUtils.prompt(mxResources.get('enterColorname'), 'white');
if (color != null)
{
editor.graph.setCellStyles("gradientColor", color);
}
}
]]></add>
<add as="strokeColor"><![CDATA[
function (editor)
{
var color = mxUtils.prompt(mxResources.get('enterColorname'), 'red');
if (color != null)
{
editor.graph.setCellStyles("strokeColor", color);
}
}
]]></add>
<add as="fontColor"><![CDATA[
function (editor)
{
var color = mxUtils.prompt(mxResources.get('enterColorname'), 'red');
if (color != null)
{
editor.graph.setCellStyles("fontColor", color);
}
}
]]></add>
<add as="fontFamily"><![CDATA[
function (editor)
{
var family = mxUtils.prompt(mxResources.get('enterFontfamily'), 'Arial');
if (family != null && family.length > 0)
{
editor.graph.setCellStyles("fontFamily", family);
}
}
]]></add>
<add as="fontSize"><![CDATA[
function (editor)
{
var size = mxUtils.prompt(mxResources.get('enterFontsize'), '10');
if (size != null && size > 0 && size < 999)
{
editor.graph.setCellStyles("fontSize", size);
}
}
]]></add>
<add as="image"><![CDATA[
function (editor)
{
var image = mxUtils.prompt(mxResources.get('enterImageUrl'),
'examples/images/image.gif');
if (image != null)
{
editor.graph.setCellStyles("image", image);
}
}
]]></add>
<add as="opacity"><![CDATA[
function (editor)
{
var opacity = mxUtils.prompt(mxResources.get('enterOpacity'), '100');
if (opacity != null && opacity >= 0 && opacity <= 100)
{
editor.graph.setCellStyles("opacity", opacity);
}
}
]]></add>
<add as="straightConnector"><![CDATA[
function (editor)
{
editor.graph.setCellStyle("straightEdge");
}
]]></add>
<add as="elbowConnector"><![CDATA[
function (editor)
{
editor.graph.setCellStyle("");
}
]]></add>
<add as="arrowConnector"><![CDATA[
function (editor)
{
editor.graph.setCellStyle("arrowEdge");
}
]]></add>
<add as="toggleOrientation"><![CDATA[
function (editor, cell)
{
editor.graph.toggleCellStyles(mxConstants.STYLE_HORIZONTAL, true);
}
]]></add>
<add as="toggleRounded"><![CDATA[
function (editor)
{
editor.graph.toggleCellStyles(mxConstants.STYLE_ROUNDED);
}
]]></add>
<add as="toggleShadow"><![CDATA[
function (editor)
{
editor.graph.toggleCellStyles(mxConstants.STYLE_SHADOW);
}
]]></add>
<add as="horizontalTree"><![CDATA[
function (editor, cell)
{
cell = cell || editor.graph.getSelectionCell();
if (cell == null)
{
cell = editor.graph.getDefaultParent();
}
editor.treeLayout(cell, true);
}
]]></add>
<add as="verticalTree"><![CDATA[
function (editor, cell)
{
cell = cell || editor.graph.getSelectionCell();
if (cell == null)
{
cell = editor.graph.getDefaultParent();
}
editor.treeLayout(cell, false);
}
]]></add>
</Array>
</mxEditor>

View File

@@ -0,0 +1,27 @@
<mxEditor>
<mxDefaultKeyHandler as="keyHandler">
<add as="8" action="collapse"/>
<add as="13" action="expand"/>
<add as="33" action="exitGroup"/>
<add as="34" action="enterGroup"/>
<add as="35" action="refresh"/>
<add as="36" action="home"/>
<add as="37" action="selectPrevious"/>
<add as="38" action="selectParent"/>
<add as="40" action="selectChild"/>
<add as="39" action="selectNext"/>
<add as="46" action="delete"/>
<add as="65" control="1" action="selectAll"/>
<add as="90" control="1" action="undo"/>
<add as="89" control="1" action="redo"/>
<add as="88" control="1" action="cut"/>
<add as="67" control="1" action="copy"/>
<add as="86" control="1" action="paste"/>
<add as="71" control="1" action="group"/>
<add as="85" control="1" action="ungroup"/>
<add as="113" action="edit"/>
<add as="123" action="showProperties"/>
<add as="107" action="zoomIn"/>
<add as="109" action="zoomOut"/>
</mxDefaultKeyHandler>
</mxEditor>

View File

@@ -0,0 +1,16 @@
<mxEditor>
<mxDefaultKeyHandler as="keyHandler">
<add as="35" action="refresh"/>
<add as="37" action="selectPrevious"/>
<add as="38" action="selectParent"/>
<add as="40" action="selectChild"/>
<add as="39" action="selectNext"/>
<add as="46" action="delete"/>
<add as="65" control="1" action="selectAll"/>
<add as="90" control="1" action="undo"/>
<add as="89" control="1" action="redo"/>
<add as="113" action="edit"/>
<add as="107" action="zoomIn"/>
<add as="109" action="zoomOut"/>
</mxDefaultKeyHandler>
</mxEditor>

View File

@@ -0,0 +1,36 @@
<mxEditor layoutDiagram="1" layoutSwimlanes="1" maintainSwimlanes="1">
<include name="config/wfeditor-commons.xml"/>
<ui>
<add as="graph" element="graph"
style="left:70px;right:20px;top:20px;bottom:40px"/>
<add as="status" element="status"
style="height:20px;bottom:20px;left:20px;right:20px"/>
<add as="toolbar" x="10" y="20" width="54"/>
</ui>
<Array as="templates">
<add as="swimlane">
<Swimlane label="Swimlane" customAttribute="text value">
<mxCell vertex="1" style="swimlane;horizontal=1" connectable="0">
<mxGeometry as="geometry" width="190" height="400"/>
</mxCell>
</Swimlane>
</add>
</Array>
<mxGraph as="graph" swimlaneNesting="0">
<include name="config/wfgraph-commons.xml"/>
<mxStylesheet as="stylesheet">
<add as="defaultEdge">
<add as="shape" value="connector"/>
<add as="elbow" value="vertical"/>
<add as="fontSize" value="10"/>
<add as="strokeColor" value="black"/>
<add as="rounded" value="1"/>
<add as="edgeStyle" value="elbowEdgeStyle"/>
<add as="endArrow" value="classic"/>
</add>
</mxStylesheet>
</mxGraph>
<mxDefaultToolbar as="toolbar">
<include name="config/wftoolbar-commons.xml"/>
</mxDefaultToolbar>
</mxEditor>

View File

@@ -0,0 +1,333 @@
<mxEditor defaultGroup="group" defaultEdge="edge"
layoutDiagram="1" maintainSwimlanes="1"
swimlaneRequired="1" forcedInserting="1"
helpWindowImage="images/help.gif"
tasksWindowImage="images/tasks.gif">
<include name="config/editor-commons.xml"/>
<add as="onInit"><![CDATA[
function ()
{
// Disables removing cells from parents
this.graph.graphHandler.setRemoveCellsFromParent(false);
this.showTasks();
this.showHelp();
}
]]></add>
<ui>
<stylesheet name="css/process.css"/>
<add as="graph" element="graph"/>
<add as="status" element="status"/>
<add as="toolbar" element="toolbar"/>
</ui>
<Array as="cycleAttributeValues">
<add value="#83027F"/>
<add value="#66B922"/>
<add value="#808913"/>
<add value="#CF0056"/>
<add value="#4679B6"/>
</Array>
<Array as="templates">
<add as="group">
<Group label="" description="">
<mxCell vertex="1" style="group" connectable="0"/>
</Group>
</add>
<add as="edge">
<Edge label="" description="">
<mxCell edge="1">
<mxGeometry as="geometry" isRelative="1"/>
</mxCell>
</Edge>
</add>
<add as="swimlane">
<Swimlane label="Role" customAttribute="text value">
<mxCell vertex="1" style="swimlane" connectable="0">
<mxGeometry as="geometry" width="220" height="480"/>
</mxCell>
</Swimlane>
</add>
<add as="task">
<Task label="Task">
<mxCell vertex="1">
<mxGeometry as="geometry" width="80" height="30"/>
</mxCell>
</Task>
</add>
<add as="subprocess">
<Subprocess label="Subprocess">
<mxCell vertex="1" style="rounded">
<mxGeometry as="geometry" width="80" height="30"/>
</mxCell>
</Subprocess>
</add>
<add as="shape">
<Shape label="Element">
<mxCell vertex="1" style="ellipse">
<mxGeometry as="geometry" width="60" height="50"/>
</mxCell>
</Shape>
</add>
<add as="hline">
<Shape label="">
<mxCell vertex="1" style="ellipse">
<mxGeometry as="geometry" width="60" height="10"/>
</mxCell>
</Shape>
</add>
</Array>
<add as="createTasks"><![CDATA[
function (div)
{
var off = 30;
if (this.graph != null)
{
var layer = this.graph.getModel().getRoot().getChildAt(0);
if (layer == null || layer.getChildCount() == 0)
{
mxUtils.para(div, 'Examples:');
mxUtils.linkInvoke(div, 'Withdrawal', this, 'open',
'diagrams/withdrawal.xml', off);
mxUtils.br(div);
}
else
{
mxUtils.para(div, 'Clipboard:');
if (!this.graph.isSelectionEmpty())
{
mxUtils.linkAction(div, 'Copy to Clipboard', this, 'copy', off);
mxUtils.br(div);
}
mxUtils.linkAction(div, 'Paste from Clipboard', this, 'paste', off);
mxUtils.br(div);
if (!this.graph.isSelectionEmpty())
{
mxUtils.linkAction(div, 'Delete Selected Cells', this, 'delete', off);
mxUtils.br(div);
mxUtils.linkAction(div, 'Clear Selection', this, 'selectNone', off);
mxUtils.br(div);
}
else
{
mxUtils.linkAction(div, 'Select All Cells', this, 'selectAll', off);
mxUtils.br(div);
}
mxUtils.para(div, 'History:');
mxUtils.linkAction(div, 'Undo Last Change', this, 'undo', off);
mxUtils.br(div);
mxUtils.linkAction(div, 'Redo Last Change', this, 'redo', off);
mxUtils.br(div);
}
mxUtils.br(div);
}
}
]]></add>
<mxGraph as="graph" alternateEdgeStyle="verticalEdge"
swimlaneNesting="0" dropEnabled="1">
<add as="isAutoSizeCell"><![CDATA[
function(cell)
{
return this.isSwimlane(cell);
}
]]></add>
<add as="isValidRoot"><![CDATA[
function(cell)
{
return !this.isSwimlane(cell);
}
]]></add>
<add as="isCellFoldable"><![CDATA[
function(cell, collapse)
{
return !this.isSwimlane(cell) &&
cell.getChildCount() > 0;
}
]]></add>
<add as="isSwimlane">
function (cell)
{
return mxUtils.isNode(this.model.getValue(cell), 'swimlane');
}
</add>
<add as="isAllowOverlapParent">
function(cell)
{
return !this.isSwimlane(cell.parent);
}
</add>
<add as="getTooltipForCell"><![CDATA[
function(cell)
{
return '<b>'+cell.getAttribute('label')+
'</b> ('+cell.getId()+')'+
'<br>Style: '+cell.getStyle()+
'<br>Edges: '+cell.getEdgeCount()+
'<br>Children: '+cell.getChildCount();
}
]]></add>
<add as="convertValueToString"><![CDATA[
function(cell)
{
return cell.getAttribute('label');
}
]]></add>
<mxStylesheet as="stylesheet">
<add as="defaultVertex">
<add as="shape" value="rectangle"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontColor" value="black"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="fillColor" value="indicated"/>
<add as="indicatorColor" value="swimlane"/>
<add as="gradientColor" value="white"/>
</add>
<add as="group">
<add as="shape" value="rectangle"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="strokeColor" value="gray"/>
<add as="dashed" value="1"/>
</add>
<add as="defaultEdge">
<add as="shape" value="connector"/>
<add as="fontSize" value="10"/>
<add as="rounded" value="1"/>
<add as="strokeColor" value="gray"/>
<add as="edgeStyle" value="elbowEdgeStyle"/>
<add as="endArrow" value="classic"/>
</add>
<add as="verticalEdge">
<add as="elbow" value="vertical"/>
</add>
<add as="swimlane">
<add as="shape" value="swimlane"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="12"/>
<add as="startSize" value="36"/>
<add as="rounded" value="1"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="top"/>
<add as="spacingTop" value="8"/>
<add as="fontColor" value="white"/>
<add as="separatorColor" value="#c0c0c0"/>
</add>
<add as="rounded">
<add as="rounded" value="1"/>
</add>
<add as="ellipse">
<add as="shape" value="label"/>
<add as="indicatorShape" value="ellipse"/>
<add as="indicatorWidth" value="34"/>
<add as="indicatorHeight" value="34"/>
<add as="imageVerticalAlign" value="top"/>
<add as="imageAlign" value="center"/>
<add as="spacingTop" value="40"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="top"/>
<add as="indicatorColor" value="swimlane"/>
<add as="indicatorGradientColor" value="white"/>
<add as="fillColor" value="none"/>
<add as="gradientColor" value="none"/>
</add>
<add as="rhombus" extend="ellipse">
<add as="indicatorShape" value="rhombus"/>
</add>
<add as="actor" extend="ellipse">
<add as="indicatorShape" value="actor"/>
<add as="indicatorWidth" value="26"/>
</add>
<add as="cylinder" extend="actor">
<add as="indicatorShape" value="cylinder"/>
<add as="imageVerticalAlign" value="bottom"/>
<add as="indicatorHeight" value="30"/>
<add as="verticalAlign" value="top"/>
<add as="spacingTop" value="0"/>
</add>
<add as="hline">
<add as="shape" value="line"/>
<add as="strokeWidth" value="3"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="fontColor" value="black"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="bottom"/>
<add as="strokeColor" value="indicated"/>
</add>
</mxStylesheet>
<mxGraphModel as="model">
<add as="valueForCellChanged"><![CDATA[
function(cell, value)
{
var previous = null;
if (isNaN(value.nodeType))
{
previous = cell.getAttribute('label');
cell.setAttribute('label', value);
}
else
{
previous = cell.value;
cell.value = value;
}
return previous;
}
]]></add>
<root>
<Workflow label="MyWorkflow" id="0"/>
<Layer label="Default Layer">
<mxCell parent="0"/>
</Layer>
</root>
</mxGraphModel>
</mxGraph>
<mxDefaultToolbar as="toolbar">
<add as="Save" action="save" icon="images/save.gif"/>
<separator/>
<add as="Undo" action="undo" icon="images/undo.gif"/>
<add as="Redo" action="redo" icon="images/redo.gif"/>
<add as="Cut" action="cut" icon="images/cut.gif"/>
<add as="Copy" action="copy" icon="images/copy.gif"/>
<add as="Paste" action="paste" icon="images/paste.gif"/>
<add as="Delete" action="delete" icon="images/delete.gif"/>
<add as="Group" action="group" icon="images/group.gif"/>
<add as="Ungroup" action="ungroup" icon="images/ungroup.gif"/>
<separator/>
<add as="Select" mode="select" icon="images/select.gif"/>
<add as="Pan" mode="pan" icon="images/pan.gif"/>
<add as="Connect" mode="connect" icon="images/connect.gif"/>
<separator/>
<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"/>
<add as="Task" template="task" icon="images/rectangle.gif"/>
<add as="Subprocess" template="subprocess" icon="images/rounded.gif"/>
<add as="Ellipse" template="shape" style="ellipse" icon="images/ellipse.gif"/>
<add as="Rhombus" template="shape" style="rhombus" icon="images/rhombus.gif"/>
<add as="Actor" template="shape" style="actor" icon="images/actor.gif"/>
<add as="Cylinder" template="shape" style="cylinder" icon="images/cylinder.gif"/>
<add as="Line" template="hline" style="hline" icon="images/hline.gif"/>
<separator/>
<add as="Fit" action="fit" icon="images/zoom.gif"/>
<add as="Zoom In" action="zoomIn" icon="images/zoomin.gif"/>
<add as="Zoom Out" action="zoomOut" icon="images/zoomout.gif"/>
<add as="Actual Size" action="actualSize" icon="images/zoomactual.gif"/>
<add as="Zoom" action="zoom" icon="images/zoom.gif"/>
<separator/>
<add as="outline" action="toggleOutline" icon="images/outline.gif"/>
<add as="Tasks" action="toggleTasks" icon="images/tasks.gif"/>
<add as="Help" action="toggleHelp" icon="images/help.gif"/>
<add as="Console" action="toggleConsole" icon="images/console.gif"/>
</mxDefaultToolbar>
</mxEditor>

View File

@@ -0,0 +1,184 @@
<mxEditor defaultGroup="group" defaultEdge="edge"
helpWindowImage="images/help.gif"
tasksWindowImage="images/tasks.gif"
forcedInserting="0"
swimlaneRequired="0">
<include name="config/editor-commons.xml"/>
<add as="onInit">
function ()
{
this.showTasks();
}
</add>
<Array as="cycleAttributeValues">
<add value="#83027F"/>
<add value="#66B922"/>
<add value="#808913"/>
<add value="#CF0056"/>
<add value="#4679B6"/>
</Array>
<Array as="templates">
<add as="group">
<Group label="" description="" href="">
<mxCell vertex="1" style="group" connectable="0"/>
</Group>
</add>
<add as="edge">
<Edge label="" description="">
<mxCell edge="1">
<mxGeometry as="geometry" relative="1"/>
</mxCell>
</Edge>
</add>
<add as="swimlane">
<Swimlane label="Swimlane" description="" href="">
<mxCell vertex="1" style="swimlane" connectable="0">
<mxGeometry as="geometry" width="300" height="160"/>
</mxCell>
</Swimlane>
</add>
<add as="task">
<Task label="Task" description="" href="">
<mxCell vertex="1">
<mxGeometry as="geometry" width="72" height="32"/>
</mxCell>
</Task>
</add>
<add as="subprocess">
<Subprocess label="Subprocess" description="" href="">
<mxCell vertex="1" style="rounded">
<mxGeometry as="geometry" width="72" height="32"/>
</mxCell>
</Subprocess>
</add>
<add as="shape">
<Shape label="" description="" href="">
<mxCell vertex="1" style="ellipse">
<mxGeometry as="geometry" width="32" height="32"/>
</mxCell>
</Shape>
</add>
<add as="symbol">
<Symbol label="Symbol" description="" href="">
<mxCell vertex="1" style="symbol;image=images/symbols/event.png">
<mxGeometry as="geometry" width="32" height="32"/>
</mxCell>
</Symbol>
</add>
</Array>
<add as="createTasks"><![CDATA[
function (div)
{
var off = 30;
if (this.graph != null)
{
var layer = this.graph.model.root.getChildAt(0);
mxUtils.para(div, mxResources.get('examples'));
mxUtils.linkInvoke(div, mxResources.get('newDiagram'), this,
'open', 'diagrams/empty.xml', off);
mxUtils.br(div);
mxUtils.linkInvoke(div, mxResources.get('swimlanes'), this,
'open', 'diagrams/swimlanes.xml', off);
mxUtils.br(div);
mxUtils.linkInvoke(div, mxResources.get('travelBooking'), this,
'open', 'diagrams/travel-booking.xml', off);
mxUtils.br(div);
if (!this.graph.isSelectionEmpty())
{
var cell = this.graph.getSelectionCell();
if (this.graph.getSelectionCount() == 1 &&
(this.graph.model.isVertex(cell) &&
cell.getEdgeCount() > 0) || this.graph.isSwimlane(cell))
{
mxUtils.para(div, 'Layout');
mxUtils.linkAction(div, mxResources.get('verticalTree'),
this, 'verticalTree', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('horizontalTree'),
this, 'horizontalTree', off);
mxUtils.br(div);
}
mxUtils.para(div, 'Format');
if (mxUtils.isNode(cell.value, 'Symbol'))
{
mxUtils.linkAction(div, mxResources.get('image'),
this, 'image', off);
mxUtils.br(div);
}
else
{
mxUtils.linkAction(div, mxResources.get('opacity'),
this, 'opacity', off);
mxUtils.br(div);
if (this.graph.model.isVertex(cell) ||
(cell.style != null &&
cell.style.indexOf("arrowEdge") >= 0))
{
mxUtils.linkAction(div, mxResources.get('gradientColor'),
this, 'gradientColor', off);
mxUtils.br(div);
}
if (this.graph.model.isEdge(cell))
{
mxUtils.linkAction(div, 'Straight Connector', this, 'straightConnector', off);
mxUtils.br(div);
mxUtils.linkAction(div, 'Elbow Connector', this, 'elbowConnector', off);
mxUtils.br(div);
mxUtils.linkAction(div, 'Arrow Connector', this, 'arrowConnector', off);
mxUtils.br(div);
}
}
mxUtils.linkAction(div, 'Rounded', this, 'toggleRounded', off);
mxUtils.br(div);
if (this.graph.isSwimlane(cell) || this.graph.model.isEdge(cell))
{
mxUtils.linkAction(div, 'Orientation', this, 'toggleOrientation', off);
mxUtils.br(div);
}
if (this.graph.getSelectionCount() > 1)
{
mxUtils.para(div, mxResources.get('align'));
mxUtils.linkAction(div, mxResources.get('left'),
this, 'alignCellsLeft', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('center'),
this, 'alignCellsCenter', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('right'),
this, 'alignCellsRight', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('top'),
this, 'alignCellsTop', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('middle'),
this, 'alignCellsMiddle', off);
mxUtils.br(div);
mxUtils.linkAction(div, mxResources.get('bottom'),
this, 'alignCellsBottom', off);
mxUtils.br(div);
}
mxUtils.para(div, mxResources.get('selection'));
mxUtils.linkAction(div, mxResources.get('clearSelection'),
this, 'selectNone', off);
mxUtils.br(div);
}
else if (layer.getChildCount() > 0)
{
mxUtils.para(div, mxResources.get('selection'));
mxUtils.linkAction(div, mxResources.get('selectAll'),
this, 'selectAll', off);
mxUtils.br(div);
}
mxUtils.br(div);
}
}
]]></add>
</mxEditor>

View File

@@ -0,0 +1,152 @@
<mxGraph alternateEdgeStyle="verticalEdge" dropEnabled="1">
<add as="isAutoSizeCell"><![CDATA[
function(cell)
{
return this.isSwimlane(cell);
}
]]></add>
<add as="isSwimlane"><![CDATA[
function (cell)
{
return mxUtils.isNode(this.model.getValue(cell), 'swimlane');
}
]]></add>
<add as="isAllowOverlapParent"><![CDATA[
function(cell)
{
return !this.isSwimlane(cell.parent);
}
]]></add>
<add as="getTooltipForCell"><![CDATA[
function(cell)
{
var href = cell.getAttribute('href');
href = (href != null && href.length > 0) ?
'<br>'+href : '';
var maxlen = 30;
var desc = cell.getAttribute('description');
if (desc == null || desc.length == 0)
{
desc = '';
}
else if (desc.length < maxlen)
{
desc = '<br>'+desc;
}
else
{
desc = '<br>'+desc.substring(0, maxlen)+'...';
}
return '<b>'+cell.getAttribute('label')+
'</b> ('+cell.getId()+')'+href+desc+
'<br>Edges: '+cell.getEdgeCount()+
'<br>Children: '+cell.getChildCount();
}
]]></add>
<add as="convertValueToString">
function(cell)
{
return cell.getAttribute('label');
}
</add>
<mxGraphModel as="model">
<add as="valueForCellChanged"><![CDATA[
function(cell, value)
{
var previous = null;
if (isNaN(value.nodeType))
{
previous = cell.getAttribute('label');
cell.setAttribute('label', value);
}
else
{
previous = cell.value;
cell.value = value;
}
return previous;
}
]]></add>
<root>
<Workflow label="MyWorkflow" description="" href="" id="0"/>
<Layer label="Default Layer">
<mxCell parent="0"/>
</Layer>
</root>
</mxGraphModel>
<mxStylesheet as="stylesheet">
<add as="defaultVertex">
<add as="shape" value="label"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="labelBackgroundColor" value="white"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="strokeColor" value="black"/>
</add>
<add as="defaultEdge">
<add as="shape" value="connector"/>
<add as="labelBackgroundColor" value="white"/>
<add as="rounded" value="1"/>
<add as="edgeStyle" value="elbowEdgeStyle"/>
<add as="endArrow" value="classic"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="middle"/>
<add as="strokeColor" value="black"/>
</add>
<add as="verticalEdge">
<add as="elbow" value="vertical"/>
</add>
<add as="straightEdge">
<add as="shape" value="connector"/>
<add as="endArrow" value="classic"/>
</add>
<add as="arrowEdge">
<add as="shape" value="arrow"/>
<add as="fillColor" value="red"/>
</add>
<add as="swimlane">
<add as="shape" value="swimlane"/>
<add as="fontSize" value="12"/>
<add as="startSize" value="23"/>
<add as="horizontal" value="0"/>
<add as="verticalAlign" value="top"/>
<add as="fontColor" value="white"/>
<add as="labelBackgroundColor" value="none"/>
</add>
<add as="group">
<add as="shape" value="rectangle"/>
<add as="rounded" value="1"/>
<add as="verticalAlign" value="top"/>
<add as="strokeColor" value="black"/>
<add as="dashed" value="1"/>
<add as="opacity" value="50"/>
</add>
<add as="rounded">
<add as="rounded" value="1"/>
</add>
<add as="ellipse">
<add as="shape" value="ellipse"/>
<add as="perimeter" value="ellipsePerimeter"/>
</add>
<add as="rhombus">
<add as="shape" value="rhombus"/>
<add as="perimeter" value="rhombusPerimeter"/>
</add>
<add as="actor">
<add as="shape" value="actor"/>
</add>
<add as="symbol">
<add as="shape" value="image"/>
<add as="perimeter" value="rectanglePerimeter"/>
<add as="labelBackgroundColor" value="white"/>
<add as="fontSize" value="10"/>
<add as="align" value="center"/>
<add as="verticalAlign" value="top"/>
<add as="verticalLabelPosition" value="bottom"/>
</add>
</mxStylesheet>
</mxGraph>

View File

@@ -0,0 +1,74 @@
<mxDefaultToolbar>
<add as="save" action="save" icon="images/save.gif"/>
<add as="show" action="show" icon="images/preview.gif"/>
<add as="print" action="print" icon="images/print.gif"/>
<add as="exportImage" action="exportImage" icon="images/image.gif"/>
<br/><hr/>
<add as="select" mode="select" icon="images/select.gif"/>
<add as="pan" mode="pan" icon="images/pan.gif"/>
<add as="connect" mode="connect" icon="images/connect.gif"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = null;
}
}
]]></add>
<add as="connect" mode="connect" icon="images/straight.gif"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = 'straightEdge';
}
}
]]></add>
<br/><hr/>
<add as="undo" action="undo" icon="images/undo.gif"/>
<add as="redo" action="redo" icon="images/redo.gif"/>
<br/><hr/>
<add as="cut" action="cut" icon="images/cut.gif"/>
<add as="copy" action="copy" icon="images/copy.gif"/>
<add as="paste" action="paste" icon="images/paste.gif"/>
<add as="delete" action="delete" icon="images/delete.gif"/>
<br/><hr/>
<add as="group" action="group" icon="images/group.gif"/>
<add as="ungroup" action="ungroup" icon="images/ungroup.gif"/>
<br/><hr/>
<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"/>
<add as="Task" template="task" icon="images/rectangle.gif"/>
<add as="Subprocess" template="subprocess" icon="images/rounded.gif"/>
<add as="Ellipse" template="shape" style="ellipse" icon="images/ellipse.gif"/>
<add as="Rhombus" template="shape" style="rhombus" icon="images/rhombus.gif"/>
<add as="Actor" template="shape" style="actor" icon="images/actor.gif"/>
<br/><hr/>
<add as="Event" template="symbol" style="symbol;image=images/symbols/event.png" icon="images/symbols/small_event.gif"/>
<add as="Event (Intermediate)" template="symbol" style="symbol;image=images/symbols/event_intermediate.png" icon="images/symbols/small_event_intermediate.gif"/>
<add as="Event (End)" template="symbol" style="symbol;image=images/symbols/event_end.png" icon="images/symbols/small_event_end.gif"/>
<add as="Timer" template="symbol" style="symbol;image=images/symbols/timer.png" icon="images/symbols/small_timer.gif"/>
<add as="Message" template="symbol" style="symbol;image=images/symbols/message.png" icon="images/symbols/small_message.gif"/>
<add as="Message (Intermediate)" template="symbol" style="symbol;image=images/symbols/message_intermediate.png" icon="images/symbols/small_message_intermediate.gif"/>
<add as="Message (End)" template="symbol" style="symbol;image=images/symbols/message_end.png" icon="images/symbols/small_message_end.gif"/>
<add as="Terminate" template="symbol" style="symbol;image=images/symbols/terminate.png" icon="images/symbols/small_terminate.gif"/>
<add as="Link" template="symbol" style="symbol;image=images/symbols/link.png" icon="images/symbols/small_link.gif"/>
<add as="Rule" template="symbol" style="symbol;image=images/symbols/rule.png" icon="images/symbols/small_rule.gif"/>
<add as="Multiple" template="symbol" style="symbol;image=images/symbols/multiple.png" icon="images/symbols/small_multiple.gif"/>
<add as="Error" template="symbol" style="symbol;image=images/symbols/error.png" icon="images/symbols/small_error.gif"/>
<add as="Cancel (End)" template="symbol" style="symbol;image=images/symbols/cancel_end.png" icon="images/symbols/small_cancel_end.gif"/>
<add as="Cancel (Intermediate)" template="symbol" style="symbol;image=images/symbols/cancel_intermediate.png" icon="images/symbols/small_cancel_intermediate.gif"/>
<add as="Fork" template="symbol" style="symbol;image=images/symbols/fork.png" icon="images/symbols/small_fork.gif"/>
<add as="Merge" template="symbol" style="symbol;image=images/symbols/merge.png" icon="images/symbols/small_merge.gif"/>
<add as="Inclusive" template="symbol" style="symbol;image=images/symbols/inclusive.png" icon="images/symbols/small_inclusive.gif"/>
<br/><hr/>
<add as="fit" action="fit" icon="images/zoom.gif"/>
<add as="zoomIn" action="zoomIn" icon="images/zoomin.gif"/>
<add as="zoomOut" action="zoomOut" icon="images/zoomout.gif"/>
<add as="actualSize" action="actualSize" icon="images/zoomactual.gif"/>
<add as="zoom" action="zoom" icon="images/zoom.gif"/>
<br/><hr/>
<add as="outline" action="toggleOutline" icon="images/outline.gif"/>
<add as="tasks" action="toggleTasks" icon="images/tasks.gif"/>
<add as="help" action="toggleHelp" icon="images/help.gif"/>
<add as="console" action="toggleConsole" icon="images/console.gif"/>
</mxDefaultToolbar>

View File

@@ -0,0 +1,16 @@
<mxEditor>
<include name="config/wfeditor-commons.xml"/>
<ui>
<add as="graph" element="graph"
style="left:70px;right:20px;top:20px;bottom:40px"/>
<add as="status" element="status"
style="height:20px;bottom:20px;left:20px;right:20px"/>
<add as="toolbar" x="16" y="20" width="50" style="padding:5px;padding-top:8px;padding-right:0px;"/>
</ui>
<mxGraph as="graph">
<include name="config/wfgraph-commons.xml"/>
</mxGraph>
<mxDefaultToolbar as="toolbar">
<include name="config/wftoolbar-commons.xml"/>
</mxDefaultToolbar>
</mxEditor>

View File

@@ -0,0 +1,3 @@
img.mxToolbarMode {
margin-right: 7px;
}

View File

@@ -0,0 +1,599 @@
/* Begin Typography & Colors */
body {
font-size: 62.5%; /* Resets 1em to 10px */
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
background: #d5d6d7 url('../images/draw/drawbgcolor.jpg');
color: #333;
text-align: center;
}
#page {
background-color: white;
border: 1px solid #959596;
text-align: left;
}
#header {
background: #73a0c5 url('../images/draw/drawheader.jpg') no-repeat bottom center;
}
#headerimg {
margin: 7px 9px 0;
height: 62px;
width: 740px;
}
#content {
font-size: 1.2em
}
.widecolumn .entry p {
font-size: 1.05em;
}
.narrowcolumn .entry, .widecolumn .entry {
line-height: 1.4em;
}
.widecolumn {
line-height: 1.6em;
}
.narrowcolumn .postmetadata {
text-align: center;
}
.alt {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
pre {
background: #f8f8f8;
font-size: 12px;
padding: 8px;
}
#footer {
background: #eee url('../images/draw/drawfooter.jpg') no-repeat top;
border: none;
}
small {
font-family: Arial, Helvetica, Sans-Serif;
font-size: 0.9em;
line-height: 1.5em;
}
h1, h2, h3 {
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-weight: bold;
}
h1 {
font-size: 2em;
text-align: center;
}
#headerimg .description {
font-size: 1.2em;
text-align: center;
}
h2 {
font-size: 1.6em;
}
h2.pagetitle {
font-size: 1.6em;
}
#sidebar h2 {
font-family: 'Lucida Grande', Verdana, Sans-Serif;
font-size: 1.2em;
}
h3 {
font-size: 1.3em;
}
h1, h1 a, h1 a:hover, h1 a:visited, #headerimg .description {
text-decoration: none;
color: white;
}
h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
color: #333;
}
h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
text-decoration: none;
}
.entry p a:visited {
color: #b85b5a;
}
.commentlist li, #commentform input, #commentform textarea {
font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
.commentlist li {
font-weight: bold;
}
.commentlist cite, .commentlist cite a {
font-weight: bold;
font-style: normal;
font-size: 1.1em;
}
.commentlist p {
font-weight: normal;
line-height: 1.5em;
text-transform: none;
}
#commentform p {
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
.commentmetadata {
font-weight: normal;
}
#sidebar {
font: 1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
color: #777;
}
code {
font: 1.1em 'Courier New', Courier, Fixed;
}
acronym, abbr, span.caps
{
font-size: 0.9em;
letter-spacing: .07em;
}
a, h2 a:hover, h3 a:hover {
color: #06c;
text-decoration: none;
}
a:hover {
color: #147;
text-decoration: underline;
}
#wp-calendar #prev a {
font-size: 9pt;
}
#wp-calendar a {
text-decoration: none;
}
#wp-calendar caption {
font: bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
text-align: center;
}
#wp-calendar th {
font-style: normal;
text-transform: capitalize;
}
/* End Typography & Colors */
/* Begin Structure */
body {
margin: 0 0 20px 0;
padding: 0;
}
#page {
background-color: white;
margin: 20px auto;
padding: 0;
width: 760px;
border: 1px solid #959596;
}
#header {
background-color: #73a0c5;
margin: 0 0 0 1px;
padding: 0;
height: 70px;
width: 758px;
}
#headerimg {
margin: 0;
height: 70px;
width: 100%;
}
.narrowcolumn {
float: left;
padding: 0 0 20px 45px;
margin: 0px 0 0;
width: 450px;
}
.widecolumn {
padding: 10px 0 20px 0;
margin: 5px 0 0 150px;
width: 450px;
}
.post {
margin: 0 0 40px;
/* text-align: justify; */
}
.widecolumn .post {
margin: 0;
}
.narrowcolumn .postmetadata {
padding-top: 5px;
}
.widecolumn .postmetadata {
margin: 30px 0;
}
.widecolumn .smallattachment {
text-align: center;
float: left;
width: 128px;
margin: 5px 5px 5px 0px;
}
.widecolumn .attachment {
text-align: center;
margin: 5px 0px;
}
.postmetadata {
clear: left;
}
#footer {
padding: 0;
margin: 0 auto;
width: 760px;
clear: both;
}
#footer p {
margin: 0;
padding: 20px 0;
text-align: center;
}
/* End Structure */
/* Begin Headers */
h1 {
padding-top: 30px;
margin: 0;
}
h2 {
margin: 30px 0 0;
}
h2.pagetitle {
margin-top: 30px;
text-align: center;
}
#sidebar h2 {
margin: 5px 0 0;
padding: 0;
}
h3 {
padding: 0;
margin: 30px 0 0;
}
h3.comments {
padding: 0;
margin: 40px auto 20px ;
}
/* End Headers */
/* Begin Images */
p img {
padding: 0;
max-width: 100%;
}
/* Using 'class="alignright"' on an image will (who would've
thought?!) align the image to the right. And using 'class="centered',
will of course center the image. This is much better than using
align="center", being much more futureproof (and valid) */
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left
}
/* End Images */
/* Begin Lists
Special stylized non-IE bullets
Do not work in Internet Explorer, which merely default to normal bullets. */
html>body .entry ul {
margin-left: 0px;
padding: 0 0 0 30px;
list-style: none;
padding-left: 10px;
text-indent: -10px;
}
html>body .entry li {
margin: 7px 0 8px 10px;
}
.entry ul li:before, #sidebar ul ul li:before {
content: "\00BB \0020";
}
.entry ol {
padding: 0 0 0 35px;
margin: 0;
}
.entry ol li {
margin: 0;
padding: 0;
}
.postmetadata ul, .postmetadata li {
display: inline;
list-style-type: none;
list-style-image: none;
}
#sidebar ul, #sidebar ul ol {
margin: 0;
padding: 0;
}
#sidebar ul li {
list-style-type: none;
list-style-image: none;
margin-bottom: 15px;
}
#sidebar ul p, #sidebar ul select {
margin: 5px 0 8px;
}
#sidebar ul ul, #sidebar ul ol {
margin: 5px 0 0 10px;
}
#sidebar ul ul ul, #sidebar ul ol {
margin: 0 0 0 10px;
}
ol li, #sidebar ul ol li {
list-style: decimal outside;
}
#sidebar ul ul li, #sidebar ul ol li {
margin: 3px 0 0;
padding: 0;
}
/* End Entry Lists */
/* Begin Form Elements */
#searchform {
margin: 10px auto;
padding: 5px 3px;
text-align: center;
}
#sidebar #searchform #s {
width: 108px;
padding: 2px;
}
#sidebar #searchsubmit {
padding: 1px;
}
.entry form { /* This is mainly for password protected posts, makes them look better. */
text-align:center;
}
select {
width: 130px;
}
#commentform input {
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
}
#commentform textarea {
width: 100%;
padding: 2px;
}
#commentform #submit {
margin: 0;
float: right;
}
/* End Form Elements */
/* Begin Comments*/
.alt {
margin: 0;
padding: 10px;
}
.commentlist {
padding: 0;
/* text-align: justify; */
}
.commentlist li {
margin: 15px 0 3px;
padding: 5px 10px 3px;
list-style: none;
}
.commentlist p {
margin: 10px 5px 10px 0;
}
#commentform p {
margin: 5px 0;
}
.nocomments {
text-align: center;
margin: 0;
padding: 0;
}
.commentmetadata {
margin: 0;
display: block;
}
/* End Comments */
/* Begin Sidebar */
#sidebar
{
padding: 20px 0 10px 0;
margin-left: 545px;
width: 190px;
}
#sidebar form {
margin: 0;
}
/* End Sidebar */
/* Begin Calendar */
#wp-calendar {
empty-cells: show;
margin: 10px auto 0;
width: 155px;
}
#wp-calendar #next a {
padding-right: 10px;
text-align: right;
}
#wp-calendar #prev a {
padding-left: 10px;
text-align: left;
}
#wp-calendar a {
display: block;
}
#wp-calendar caption {
text-align: center;
width: 100%;
}
#wp-calendar td {
padding: 3px 0;
text-align: center;
}
#wp-calendar td.pad:hover { /* Doesn't work in IE */
background-color: #fff; }
/* End Calendar */
/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
cursor: help;
}
acronym, abbr {
border-bottom: 1px dashed #999;
}
blockquote {
margin: 15px 30px 0 10px;
padding-left: 20px;
border-left: 5px solid #ddd;
}
blockquote cite {
margin: 5px 0 0;
display: block;
}
.center {
text-align: center;
}
a img {
border: none;
}
.navigation {
display: block;
text-align: center;
margin-top: 10px;
margin-bottom: 60px;
}
/* End Various Tags & Classes*/

View File

@@ -0,0 +1,347 @@
<html>
<head>
<title>mxDraw Example</title>
<link rel="stylesheet" href="css/wordpress.css" type="text/css" media="screen" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css" media="screen">
#page { background: url("images/draw/drawbg.jpg") repeat-y top; border: none; }
</style>
<script type="text/javascript">
var mxBasePath = '../../src';
var urlParams = (function(url)
{
var result = new Object();
var params = window.location.search.slice(1).split('&');
for (var i = 0; i < params.length; i++)
{
idx = params[i].indexOf('=');
if (idx > 0)
{
result[params[i].substring(0, idx)] = params[i].substring(idx + 1);
}
}
return result;
})(window.location.href);
var mxLanguage = urlParams['lang'];
</script>
<script type="text/javascript" src="../../src/js/mxClient.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript">
// Program starts here. The document.onLoad executes the
// createEditor function with a given configuration.
// In the config file, the mxEditor.onInit method is
// overridden to invoke this global function as the
// last step in the editor constructor.
function onInit(editor)
{
// Enables rotation handle
mxVertexHandler.prototype.rotationEnabled = true;
// Enables guides
mxGraphHandler.prototype.guidesEnabled = true;
// Alt disables guides
mxGuide.prototype.isEnabledForEvent = function(evt)
{
return !mxEvent.isAltDown(evt);
};
// Enables snapping waypoints to terminals
mxEdgeHandler.prototype.snapToTerminals = true;
// Defines an icon for creating new connections in the connection handler.
// This will automatically disable the highlighting of the source vertex.
mxConnectionHandler.prototype.connectImage = new mxImage('images/connector.gif', 16, 16);
// Enables connections in the graph and disables
// reset of zoom and translate on root change
// (ie. switch between XML and graphical mode).
editor.graph.setConnectable(true);
// Clones the source if new connection has no target
editor.graph.connectionHandler.setCreateTarget(true);
// Updates the title if the root changes
var title = document.getElementById('title');
if (title != null)
{
var f = function(sender)
{
title.innerHTML = 'mxDraw - ' + sender.getTitle();
};
editor.addListener(mxEvent.ROOT, f);
f(editor);
}
// Changes the zoom on mouseWheel events
mxEvent.addMouseWheelListener(function (evt, up)
{
if (!mxEvent.isConsumed(evt))
{
if (up)
{
editor.execute('zoomIn');
}
else
{
editor.execute('zoomOut');
}
mxEvent.consume(evt);
}
});
// Defines a new action to switch between
// XML and graphical display
var textNode = document.getElementById('xml');
var graphNode = editor.graph.container;
var sourceInput = document.getElementById('source');
sourceInput.checked = false;
var funct = function(editor)
{
if (sourceInput.checked)
{
graphNode.style.display = 'none';
textNode.style.display = 'inline';
var enc = new mxCodec();
var node = enc.encode(editor.graph.getModel());
textNode.value = mxUtils.getPrettyXml(node);
textNode.originalValue = textNode.value;
textNode.focus();
}
else
{
graphNode.style.display = '';
if (textNode.value != textNode.originalValue)
{
var doc = mxUtils.parseXml(textNode.value);
var dec = new mxCodec(doc);
dec.decode(doc.documentElement, editor.graph.getModel());
}
textNode.originalValue = null;
// Makes sure nothing is selected in IE
if (mxClient.IS_IE)
{
mxUtils.clearSelection();
}
textNode.style.display = 'none';
// Moves the focus back to the graph
editor.graph.container.focus();
}
};
editor.addAction('switchView', funct);
// Defines a new action to switch between
// XML and graphical display
mxEvent.addListener(sourceInput, 'click', function()
{
editor.execute('switchView');
});
// Create select actions in page
var node = document.getElementById('mainActions');
var buttons = ['group', 'ungroup', 'cut', 'copy', 'paste', 'delete', 'undo', 'redo', 'print', 'show'];
// Only adds image and SVG export if backend is available
// NOTE: The old image export in mxEditor is not used, the urlImage is used for the new export.
if (editor.urlImage != null)
{
// Client-side code for image export
var exportImage = function(editor)
{
var graph = editor.graph;
var scale = graph.view.scale;
var bounds = graph.getGraphBounds();
// New image export
var xmlDoc = mxUtils.createXmlDocument();
var root = xmlDoc.createElement('output');
xmlDoc.appendChild(root);
// Renders graph. Offset will be multiplied with state's scale when painting state.
var xmlCanvas = new mxXmlCanvas2D(root);
xmlCanvas.translate(Math.floor(1 / scale - bounds.x), Math.floor(1 / scale - bounds.y));
xmlCanvas.scale(scale);
var imgExport = new mxImageExport();
imgExport.drawState(graph.getView().getState(graph.model.root), xmlCanvas);
// Puts request data together
var w = Math.ceil(bounds.width * scale + 2);
var h = Math.ceil(bounds.height * scale + 2);
var xml = mxUtils.getXml(root);
// Requests image if request is valid
if (w > 0 && h > 0)
{
var name = 'export.png';
var format = 'png';
var bg = '&bg=#FFFFFF';
new mxXmlRequest(editor.urlImage, 'filename=' + name + '&format=' + format +
bg + '&w=' + w + '&h=' + h + '&xml=' + encodeURIComponent(xml)).
simulate(document, '_blank');
}
};
editor.addAction('exportImage', exportImage);
// Client-side code for SVG export
var exportSvg = function(editor)
{
var graph = editor.graph;
var scale = graph.view.scale;
var bounds = graph.getGraphBounds();
// Prepares SVG document that holds the output
var svgDoc = mxUtils.createXmlDocument();
var root = (svgDoc.createElementNS != null) ?
svgDoc.createElementNS(mxConstants.NS_SVG, 'svg') : svgDoc.createElement('svg');
if (root.style != null)
{
root.style.backgroundColor = '#FFFFFF';
}
else
{
root.setAttribute('style', 'background-color:#FFFFFF');
}
if (svgDoc.createElementNS == null)
{
root.setAttribute('xmlns', mxConstants.NS_SVG);
}
root.setAttribute('width', Math.ceil(bounds.width * scale + 2) + 'px');
root.setAttribute('height', Math.ceil(bounds.height * scale + 2) + 'px');
root.setAttribute('xmlns:xlink', mxConstants.NS_XLINK);
root.setAttribute('version', '1.1');
// Adds group for anti-aliasing via transform
var group = (svgDoc.createElementNS != null) ?
svgDoc.createElementNS(mxConstants.NS_SVG, 'g') : svgDoc.createElement('g');
group.setAttribute('transform', 'translate(0.5,0.5)');
root.appendChild(group);
svgDoc.appendChild(root);
// Renders graph. Offset will be multiplied with state's scale when painting state.
var svgCanvas = new mxSvgCanvas2D(group);
svgCanvas.translate(Math.floor(1 / scale - bounds.x), Math.floor(1 / scale - bounds.y));
svgCanvas.scale(scale);
var imgExport = new mxImageExport();
imgExport.drawState(graph.getView().getState(graph.model.root), svgCanvas);
var name = 'export.svg';
var xml = encodeURIComponent(mxUtils.getXml(root));
new mxXmlRequest(editor.urlEcho, 'filename=' + name + '&format=svg' + '&xml=' + xml).simulate(document, "_blank");
};
editor.addAction('exportSvg', exportSvg);
buttons.push('exportImage');
buttons.push('exportSvg');
};
for (var i = 0; i < buttons.length; i++)
{
var button = document.createElement('button');
mxUtils.write(button, mxResources.get(buttons[i]));
var factory = function(name)
{
return function()
{
editor.execute(name);
};
};
mxEvent.addListener(button, 'click', factory(buttons[i]));
node.appendChild(button);
}
// Create select actions in page
var node = document.getElementById('selectActions');
mxUtils.write(node, 'Select: ');
mxUtils.linkAction(node, 'All', editor, 'selectAll');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'None', editor, 'selectNone');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'Vertices', editor, 'selectVertices');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'Edges', editor, 'selectEdges');
// Create select actions in page
var node = document.getElementById('zoomActions');
mxUtils.write(node, 'Zoom: ');
mxUtils.linkAction(node, 'In', editor, 'zoomIn');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'Out', editor, 'zoomOut');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'Actual', editor, 'actualSize');
mxUtils.write(node, ', ');
mxUtils.linkAction(node, 'Fit', editor, 'fit');
}
window.onbeforeunload = function() { return mxResources.get('changesLost'); };
</script>
</head>
<body onload="createEditor('config/diagrameditor.xml');">
<div id="page">
<div id="header">
<div id="headerimg" style="overflow:hidden;">
<h1 id="title">mxDraw</h1>
</div>
</div>
<div id="mainActions"
style="width:100%;padding-top:8px;padding-left:24px;padding-bottom:8px;">
</div>
<div id="selectActions" style="width:100%;padding-left:54px;padding-bottom:4px;">
</div>
<table border="0" width="730px">
<tr>
<td id="toolbar" style="width:16px;padding-left:20px;" valign="top">
<!-- Toolbar Here -->
</td>
<td valign="top" style="border-width:1px;border-style:solid;border-color:black;">
<div id="graph" tabindex="-1" style="position:relative;height:480px;width:684px;overflow:hidden;cursor:default;">
<!-- Graph Here -->
<center id="splash" style="padding-top:230px;">
<img src="images/loading.gif">
</center>
</div>
<textarea id="xml" style="height:480px;width:684px;display:none;border-style:none;"></textarea>
</td>
</tr>
</table>
<span style="float:right;padding-right:36px;">
<input id="source" type="checkbox"/>Source
</span>
<div id="zoomActions" style="width:100%;padding-left:54px;padding-top:4px;">
</div>
<div id="footer">
<p id="status">
<!-- Status Here -->Loading...
</p>
<br/>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,8 @@
<mxGraphModel>
<root>
<Workflow label="MyWorkflow" description="" id="0"/>
<Layer label="Default Layer" description="">
<mxCell parent="0"/>
</Layer>
</root>
</mxGraphModel>

View File

@@ -0,0 +1,119 @@
<mxGraphModel>
<root>
<Workflow label="Swimlanes" description="" href="" id="0">
<mxCell />
</Workflow>
<Layer label="Default Layer" description="" href="" id="1">
<mxCell parent="0" />
</Layer>
<Swimlane label="Customer Service&#xa;Representative"
customAttribute="text value" description="" href="" id="2">
<mxCell style="swimlane;fillColor=#83027F;startSize=38"
vertex="1" connectable="0" parent="1">
<mxGeometry x="20" y="20" width="620" height="160"
as="geometry" />
</mxCell>
</Swimlane>
<Subprocess label="Enter Order" description="" href="" id="5">
<mxCell style="rounded" vertex="1" parent="2">
<mxGeometry x="80" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Communicate&#xa;Delay&#xa;To Customer" description="" href="" id="13">
<mxCell style="rounded" vertex="1" parent="2">
<mxGeometry x="230" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Swimlane label="Warehouse&#xa;Engineer"
customAttribute="text value" description="" href="" id="3">
<mxCell style="swimlane;fillColor=#66B922;startSize=38"
vertex="1" connectable="0" parent="1">
<mxGeometry x="20" y="180" width="620" height="160"
as="geometry" />
</mxCell>
</Swimlane>
<Subprocess label="Receive Order" description="" href="" id="9">
<mxCell style="rounded" vertex="1" parent="3">
<mxGeometry x="80" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Shape label="Check Inventory" description="" href="" id="11">
<mxCell style="rhombus" vertex="1" parent="3">
<mxGeometry x="240" y="50" width="92" height="50"
as="geometry" />
</mxCell>
</Shape>
<Edge description="" href="" id="12">
<mxCell edge="1" parent="3" source="9" target="11">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Subprocess label="Ship Product&#xa;To Customer" description="" href="" id="15">
<mxCell style="rounded" vertex="1" parent="3">
<mxGeometry x="400" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Edge description="" href="" id="16">
<mxCell edge="1" parent="3" source="11" target="15">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Swimlane label="Supplier&#xa;" customAttribute="text value"
id="4">
<mxCell style="swimlane;fillColor=#808913;startSize=38"
vertex="1" connectable="0" parent="1">
<mxGeometry x="20" y="340" width="620" height="160"
as="geometry" />
</mxCell>
</Swimlane>
<Subprocess label="Manufacture Product" description="" href="" id="19">
<mxCell style="rounded" vertex="1" parent="4">
<mxGeometry x="230" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Ship Product&#xa;To Partner" description="" href="" id="23">
<mxCell style="rounded" vertex="1" parent="4">
<mxGeometry x="400" y="50" width="102" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Edge description="" href="" id="24">
<mxCell edge="1" target="23" parent="4" source="19">
<mxGeometry x="-20" y="-180" as="geometry">
<mxPoint x="332" y="75" as="sourcePoint" />
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="10">
<mxCell edge="1" parent="1" source="5" target="9">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Edge label="no" description="" href="" id="14">
<mxCell edge="1" parent="1" source="11" target="13">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Edge label="no" description="" href="" id="20">
<mxCell edge="1" target="19" parent="1" source="11">
<mxGeometry x="-20" y="-30" as="geometry">
<mxPoint x="286" y="200" as="sourcePoint" />
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="25">
<mxCell edge="1" parent="1" source="23" target="15">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
</root>
</mxGraphModel>

View File

@@ -0,0 +1,226 @@
<mxGraphModel>
<root>
<Workflow label="Travel Booking" description="" href="" id="0">
<mxCell />
</Workflow>
<Layer label="Default Layer" description="" href="" id="1">
<mxCell parent="0" />
</Layer>
<Swimlane label="Travel Booking" customAttribute="text value"
id="2">
<mxCell style="swimlane;fillColor=#83027F" parent="1"
vertex="1" connectable="0">
<mxGeometry x="10" y="30" width="770" height="370"
as="geometry" />
</mxCell>
</Swimlane>
<Edge label="Check Again" description="" href="" id="3">
<mxCell style="verticalEdge" parent="2" source="14"
target="11" edge="1">
<mxGeometry x="0" y="0" as="geometry" relative="1">
<Array as="points">
<mxPoint x="440" y="30" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Symbol label="Symbol" description="" href="" id="4">
<mxCell
style="symbol;image=images/symbols/message.png" parent="2"
vertex="1">
<mxGeometry x="40" y="150" width="32" height="32"
as="geometry" />
</mxCell>
</Symbol>
<Subprocess label="Check Credit&#xa;Card" description="" href="" id="5">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="92" y="140" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Symbol label="Symbol" description="" href="" id="6">
<mxCell
style="symbol;image=images/symbols/error.png" parent="5"
vertex="1">
<mxGeometry x="8" y="34" width="32" height="32"
as="geometry" />
</mxCell>
</Symbol>
<Subprocess label="Handle&#xa;Fault" description="" href="" id="7">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="162" y="280" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Check Hotel&#xa;Reservation" description="" href="" id="8">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="202" y="140" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Check Flight&#xa;Reservation" description="" href="" id="9">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="202" y="210" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Data Map" description="" href="" id="10">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="202" y="70" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Check Car&#xa;Reservation" description="" href="" id="11">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="302" y="70" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Symbol label="Symbol" description="" href="" id="12">
<mxCell
style="symbol;image=images/symbols/fork.png" parent="2"
vertex="1">
<mxGeometry x="550" y="140" width="52" height="50"
as="geometry" />
</mxCell>
</Symbol>
<Subprocess label="Evaluate&#xa;Reservation&#xa;Result" description="" href="" id="13">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="402" y="70" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Shape label="" description="" href="" id="14">
<mxCell style="rhombus" parent="2" vertex="1">
<mxGeometry x="504" y="69" width="52" height="51"
as="geometry" />
</mxCell>
</Shape>
<Subprocess label="Confirmation" description="" href="" id="15">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="622" y="140" width="72" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Symbol label="Reply" description="" href="" id="16">
<mxCell
style="symbol;image=images/symbols/message_end.png"
parent="2" vertex="1">
<mxGeometry x="260" y="290" width="32" height="32"
as="geometry" />
</mxCell>
</Symbol>
<Symbol label="Reply" description="" href="" id="17">
<mxCell
style="symbol;image=images/symbols/message_end.png"
parent="2" vertex="1">
<mxGeometry x="720" y="150" width="32" height="32"
as="geometry" />
</mxCell>
</Symbol>
<Edge description="" href="" id="18">
<mxCell parent="2" source="4" target="5" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<mxPoint x="52" y="166" as="sourcePoint" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="19">
<mxCell parent="2" source="6" target="7" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points">
<mxPoint x="120" y="250" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="20">
<mxCell parent="2" source="7" target="16" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="21">
<mxCell parent="2" source="5" target="8" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="22">
<mxCell parent="2" source="5" target="9" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<mxPoint x="244" y="205" as="sourcePoint" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="23">
<mxCell parent="2" source="5" target="10" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<mxPoint x="234" y="55" as="sourcePoint" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="24">
<mxCell parent="2" source="10" target="11" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="25">
<mxCell parent="2" source="12" target="15" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="26">
<mxCell parent="2" source="8" target="12" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="27">
<mxCell parent="2" source="11" target="13" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="28">
<mxCell parent="2" source="13" target="14" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="29">
<mxCell parent="2" source="9" target="12" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points">
<mxPoint x="570" y="200" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="30">
<mxCell parent="2" source="14" target="12" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points">
<mxPoint x="570" y="130" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge description="" href="" id="31">
<mxCell parent="2" source="15" target="17" edge="1">
<mxGeometry x="0" y="0" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
</root>
</mxGraphModel>

View File

@@ -0,0 +1,286 @@
<mxGraphModel>
<root>
<Workflow label="Withdrawal" id="0">
<mxCell />
</Workflow>
<Layer label="Default Layer" id="1">
<mxCell parent="0" />
</Layer>
<Swimlane label="Customer" customAttribute="text value"
id="2">
<mxCell style="swimlane;fillColor=#66B922"
parent="1" connectable="0" vertex="1">
<mxGeometry x="20" y="20" width="220" height="900"
as="geometry" />
</mxCell>
</Swimlane>
<Shape label="Start" id="3">
<mxCell style="ellipse" parent="2" vertex="1">
<mxGeometry x="70" y="40" width="60" height="50"
as="geometry" />
</mxCell>
</Shape>
<Subprocess label="Insert Card" id="4">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="50" y="110" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="5">
<mxCell parent="2" source="3" target="4" edge="1">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Subprocess label="Enter PIN" id="6">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="50" y="160" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="7">
<mxCell parent="2" source="4" target="6" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Subprocess label="Enter Amount" id="8">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="50" y="260" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Shape label="" id="9">
<mxCell style="hline" parent="2" vertex="1">
<mxGeometry y="390" width="600" height="10"
as="geometry" />
</mxCell>
</Shape>
<Subprocess label="Take Money&#xa;from Slot" id="10">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="40" y="430" width="100" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="11">
<mxCell parent="2" source="9" target="10" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="90" y="420" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Subprocess label="Take Card" id="12">
<mxCell style="rounded" parent="2" vertex="1">
<mxGeometry x="40" y="790" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Shape label="End" id="13">
<mxCell style="ellipse" parent="2" vertex="1">
<mxGeometry x="60" y="850" width="60" height="50"
as="geometry" />
</mxCell>
</Shape>
<Edge id="14">
<mxCell parent="2" source="12" target="13" edge="1">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Swimlane label="ATM Machine" customAttribute="text value"
id="15">
<mxCell style="swimlane;fillColor=#CF0056"
parent="1" connectable="0" vertex="1">
<mxGeometry x="240" y="20" width="200" height="900"
as="geometry" />
</mxCell>
</Swimlane>
<Shape label="" id="16">
<mxCell style="hline" parent="15" vertex="1">
<mxGeometry x="40" y="510" width="100" height="10"
as="geometry" />
</mxCell>
</Shape>
<Shape label="" id="17">
<mxCell style="rhombus" parent="15" vertex="1">
<mxGeometry x="70" y="550" width="40" height="40"
as="geometry" />
</mxCell>
</Shape>
<Edge id="18">
<mxCell parent="15" source="16" target="17" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Subprocess label="Show Balance" id="19">
<mxCell style="rounded" parent="15" vertex="1">
<mxGeometry x="40" y="610" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="20">
<mxCell parent="15" source="17" target="19" edge="1">
<mxGeometry y="10" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Shape label="" id="21">
<mxCell style="rhombus" parent="15" vertex="1">
<mxGeometry x="70" y="660" width="40" height="40"
as="geometry" />
</mxCell>
</Shape>
<Edge id="22">
<mxCell parent="15" source="19" target="21" edge="1">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Subprocess label="Eject Card" id="23">
<mxCell style="rounded" parent="15" vertex="1">
<mxGeometry x="40" y="730" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="24">
<mxCell parent="15" source="21" target="23" edge="1">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Swimlane label="Bank" customAttribute="text value" id="25">
<mxCell style="swimlane;fillColor=#4679B6"
parent="1" connectable="0" vertex="1">
<mxGeometry x="440" y="20" width="210" height="900"
as="geometry" />
</mxCell>
</Swimlane>
<Shape label="" id="26">
<mxCell style="rhombus" parent="25" vertex="1">
<mxGeometry x="80" y="160" width="40" height="40"
as="geometry" />
</mxCell>
</Shape>
<Subprocess label="Check Account&#xa;Balance" id="27">
<mxCell style="rounded" parent="25" vertex="1">
<mxGeometry x="50" y="250" width="100" height="50"
as="geometry" />
</mxCell>
</Subprocess>
<Subprocess label="Authorize" id="28">
<mxCell style="rounded" parent="25" vertex="1">
<mxGeometry x="50" y="110" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="29">
<mxCell parent="25" source="28" target="26" edge="1">
<mxGeometry y="-50" as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Shape label="" id="30">
<mxCell style="rhombus" parent="25" vertex="1">
<mxGeometry x="80" y="330" width="40" height="40"
as="geometry" />
</mxCell>
</Shape>
<Edge id="31">
<mxCell parent="25" source="27" target="30" edge="1">
<mxGeometry as="geometry" />
</mxCell>
</Edge>
<Subprocess label="Debit Account" id="32">
<mxCell style="rounded" parent="25" vertex="1">
<mxGeometry x="50" y="440" width="100" height="30"
as="geometry" />
</mxCell>
</Subprocess>
<Edge id="33">
<mxCell parent="1" source="6" target="28" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge label="[Valid PIN]" id="34">
<mxCell style="verticalEdge" parent="1" source="26"
target="8" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge id="35">
<mxCell parent="1" source="8" target="27" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge label="[balance &gt;= amount]" id="36">
<mxCell parent="1" source="30" target="9" edge="1">
<mxGeometry as="geometry">
<Array as="points" />
</mxGeometry>
</mxCell>
</Edge>
<Edge id="37">
<mxCell parent="1" source="9" target="32" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="540" y="440" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge id="38">
<mxCell parent="1" source="32" target="16" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="364" y="503" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge id="39">
<mxCell parent="1" source="10" target="16" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="304" y="503" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge label="" id="40">
<mxCell parent="1" source="30" target="17" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="654" y="463" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge id="41">
<mxCell parent="1" source="26" target="21" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="664" y="453" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
<Edge id="42">
<mxCell parent="1" source="23" target="12" edge="1">
<mxGeometry as="geometry">
<Array as="points">
<mxPoint x="110" y="783" />
</Array>
</mxGeometry>
</mxCell>
</Edge>
</root>
</mxGraphModel>

View File

@@ -0,0 +1,9 @@
<html>
<head>
<title>Deprecation Warning</title>
</head>
<body>
This example has been deprecated. A new implementation is available <a href="../grapheditor/www/index.html">here</a>.
A copy of the old example is <a href="archive/grapheditor/grapheditor.html">here</a>.
</body>
</html>

View File

@@ -0,0 +1,45 @@
<html>
<head>
<title>mxGraph Workflow Editor Help Index</title>
<style type="text/css" media="screen">
body {
font-family: Arial;
font-size: 8pt;
}
h1 {
font-family: Arial;
font-size: 13pt;
}
h2 {
font-family: Arial;
font-size: 12pt;
}
h3 {
font-family: Arial;
font-size: 10pt;
}
h4 {
font-family: Arial;
font-size: 9pt;
}
</style>
</head>
<body>
<h1>Help Index</h1>
<h1>Help Index</h1>
<hr>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
<a href="index.html">Lorem Ipsum</a><br>
</body>
</html>

View File

@@ -0,0 +1,41 @@
<html>
<head>
<title>mxGraph Workflow Editor Help</title>
<style type="text/css" media="screen">
body {
font-family: Arial;
font-size: 8pt;
}
h1 {
font-family: Arial;
font-size: 13pt;
border-width: 0 0 1px 0;
border-style: solid;
border-color: #000000;
}
h2 {
font-family: Arial;
font-size: 12pt;
}
h3 {
font-family: Arial;
font-size: 10pt;
}
h4 {
font-family: Arial;
font-size: 9pt;
}
</style>
</head>
<body>
<h1>mxGraph Online Help</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
mollit anim id est laborum.
</p>
See <a href="index-all.html">Help Index</a>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 358 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 357 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 373 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 351 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 377 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 358 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 469 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 859 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 848 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 278 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 163 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 220 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 830 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 195 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 860 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 954 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 582 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 615 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 540 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 870 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 538 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 294 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 325 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 556 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 121 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 190 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 127 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 148 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 580 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 280 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 235 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 939 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 855 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1013 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 680 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 159 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 165 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 147 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 848 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 613 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1023 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 342 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 922 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 892 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 803 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 875 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1013 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 877 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 893 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 785 B

Some files were not shown because too many files have changed in this diff Show More