Commit 85046fcc authored by Kazuhiko Shiozaki's avatar Kazuhiko Shiozaki

cleanup HTML and unify jsPlumb related javascript files.

parent d99462ff
<!doctype html>
<html>
<head>
<title>Dream Simulation</title>
<link rel="stylesheet" href="css/demo-new.css">
<link rel="stylesheet" href="css/flowchartDemo.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/jsoneditor.css">
</head>
<body data-demo-id="flowchartConnectorsDemo" data-library="jquery">
<div id="headerWrapper"><div id="header"></div></div>
<div id="tools">
Tools
</div>
<div id="simulation_controls">
Simulation Parameters
<div title="Configure">
<form>
<fieldset id="general-fieldset">
</fieldset>
<a id="run_simulation">Run Simulation</a>
<a id="layout_graph">Layout Graph</a>
</form>
</div>
</div>
<div id="main">
<div id="render"></div>
</div>
<head>
<title>Dream Simulation</title>
<link rel="stylesheet" href="css/demo-new.css">
<link rel="stylesheet" href="css/flowchartDemo.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="css/jsoneditor.css">
</head>
<div id="graph_zone">
<div>Stations Utilization</div>
<div id="graph"> </div>
</div>
<body data-demo-id="flowchartConnectorsDemo" data-library="jquery">
<div id="headerWrapper">
<div id="header"></div>
</div>
<div id="sidebar">
<table>
<tr>
<td>Input</td>
<td>Result</td>
</tr>
<tr>
<td>
<textarea rows="20" cols="47" id="json_output" style="align:left">
</textarea></td>
<td>
<textarea rows="20" cols="47" id="json_result" style="align:right">
</textarea></td>
</table>
<div id="tools">
Tools
</div>
<div id="simulation_controls">
Simulation Parameters
<div title="Configure">
<form>
<fieldset id="general-fieldset">
</fieldset>
<a id="run_simulation">Run Simulation</a>
<a id="layout_graph">Layout Graph</a>
</form>
</div>
</div>
</div>
<!-- DEP -->
<script type="text/javascript" src="lib/jquery-1.8.1-min.js"></script>
<script type="text/javascript" src="lib/jquery-ui-1.8.23-min.js"></script>
<script type="text/javascript" src="lib/jquery.ui.touch-punch.min.js"></script>
<script type="text/javascript" src="lib/md5.js"></script>
<script type="text/javascript" src="lib/jio.js"></script>
<script type="text/javascript" src="lib/jio.localstorage.js"></script>
<script type="text/javascript" src="lib/pubsub.js"></script>
<!-- /DEP -->
<!-- JS -->
<!-- support lib for bezier stuff -->
<script src="lib/jsBezier-0.5.js"></script>
<!-- jsplumb util -->
<script src="lib/jsPlumb/jsPlumb-util.js"></script>
<!-- base DOM adapter -->
<script src="lib/jsPlumb/jsPlumb-dom-adapter.js"></script>
<!-- main jsplumb engine -->
<script src="lib/jsPlumb/jsPlumb.js"></script>
<!-- anchors -->
<script src="lib/jsPlumb/jsPlumb-anchors.js"></script>
<!-- endpoint -->
<script src="lib/jsPlumb/jsPlumb-endpoint.js"></script>
<!-- connection -->
<script src="lib/jsPlumb/jsPlumb-connection.js"></script>
<!-- connector editors -->
<script src="lib/jsPlumb/jsPlumb-connector-editors.js"></script>
<!-- connectors, endpoint and overlays -->
<script src="lib/jsPlumb/jsPlumb-defaults.js"></script>
<!-- state machine connectors -->
<script src="lib/jsPlumb/jsPlumb-connectors-statemachine.js"></script>
<!-- flowchart connectors -->
<script src="lib/jsPlumb/jsPlumb-connectors-flowchart.js"></script>
<!-- SVG renderer -->
<script src="lib/jsPlumb/jsPlumb-renderers-svg.js"></script>
<!-- canvas renderer -->
<script src="lib/jsPlumb/jsPlumb-renderers-canvas.js"></script>
<!-- vml renderer -->
<script src="lib/jsPlumb/jsPlumb-renderers-vml.js"></script>
<!-- jquery jsPlumb adapter -->
<script src="lib/jsPlumb/jquery.jsPlumb.js"></script>
<!-- /JS -->
<!-- flot -->
<script src="lib/jquery.flot.js"></script>
<script src="lib/jquery.flot.stack.js"></script>
<script src="lib/jquery.jsoneditor.js"></script>
<div id="main">
<div id="render"></div>
</div>
<div id="dialog-form" title="Configure">
<form>
<fieldset id="dialog-fieldset">
</fieldset>
</form>
</div>
<div id="graph_zone">
<div>Stations Utilization</div>
<div id="graph"></div>
</div>
<div id="sidebar">
<table>
<tr>
<td>Input</td>
<td>Result</td>
</tr>
<tr>
<td>
<textarea rows="20" cols="47" id="json_output" style="align:left">
</textarea>
</td>
<td>
<textarea rows="20" cols="47" id="json_result" style="align:right">
</textarea>
</td>
</table>
</div>
<!-- DEP -->
<script type="text/javascript" src="lib/jquery-1.8.1-min.js"></script>
<script type="text/javascript" src="lib/jquery-ui-1.8.23-min.js"></script>
<script type="text/javascript" src="lib/jquery.ui.touch-punch.min.js"></script>
<script type="text/javascript" src="lib/md5.js"></script>
<script type="text/javascript" src="lib/jio.js"></script>
<script type="text/javascript" src="lib/jio.localstorage.js"></script>
<script type="text/javascript" src="lib/pubsub.js"></script>
<script type="text/javascript" src="lib/jquery.jsPlumb-1.5.3-min.js"></script>
<!-- /DEP -->
<!-- flot -->
<script type="text/javascript" src="lib/jquery.flot.js"></script>
<script type="text/javascript" src="lib/jquery.flot.stack.js"></script>
<script type="text/javascript" src="lib/jquery.jsoneditor.js"></script>
<div id="dialog-form" title="Configure">
<form>
<fieldset id="dialog-fieldset">
</fieldset>
</form>
</div>
<!-- demo code -->
<script type="text/javascript" src="src/dream.js"></script>
<script type="text/javascript" src="src/jsonPlumb.js"></script>
<script type="text/javascript" src="src/dream_launcher.js"></script>
</body>
<!-- demo code -->
<script src="src/dream.js"></script>
<script src="src/jsonPlumb.js"></script>
<script src="src/dream_launcher.js"></script>
</body>
</html>
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
/*
* this is experimental and probably will not be used. solutions exist for most libraries. but of course if
* i want to support multiple scopes at some stage then i will have to do dragging inside jsPlumb.
*/
;(function() {
window.jsPlumbDrag = function(_jsPlumb) {
var ta = new TouchAdapter();
this.draggable = function(selector) {
var el, elId, da = [], elo, d = false,
isInSelector = function(el) {
if (typeof selector == "string")
return selector === _jsPlumb.getId(el);
for (var i = 0; i < selector.length; i++) {
var _sel = jsPlumb.CurrentLibrary.getDOMElement(selector[i]);
if (_sel == el) return true;
}
return false;
};
ta.bind(document, "mousedown", function(e) {
var target = e.target || e.srcElement;
if (isInSelector(target)) {
el = jsPlumb.CurrentLibrary.getElementObject(target);
elId = _jsPlumb.getId(el);
elo = jsPlumb.CurrentLibrary.getOffset(el);
da = [e.pageX, e.pageY];
d = true;
}
});
ta.bind(document, "mousemove", function(e) {
if (d) {
var dx = e.pageX - da[0],
dy = e.pageY - da[1];
jsPlumb.CurrentLibrary.setOffset(el, {
left:elo.left + dx,
top:elo.top + dy
});
_jsPlumb.repaint(elId);
e.preventDefault();
e.stopPropagation();
}
});
ta.bind(document, "mouseup", function(e) {
el = null;
d = false;
});
};
var isIOS = ((/iphone|ipad/gi).test(navigator.appVersion));
if (isIOS)
_jsPlumb.draggable = this.draggable;
};
})();
\ No newline at end of file
This diff is collapsed.
// this is really just a test overlay, so its undocumented and doesnt take any parameters. but i was loth to delete it.
jsPlumb.Overlays.GuideLines = function() {
var self = this;
self.length = 50;
self.lineWidth = 5;
this.type = "GuideLines";
AbstractOverlay.apply(this, arguments);
jsPlumb.jsPlumbUIComponent.apply(this, arguments);
this.draw = function(connector, currentConnectionPaintStyle, connectorDimensions) {
var head = connector.pointAlongPathFrom(self.loc, self.length / 2),
mid = connector.pointOnPath(self.loc),
tail = jsPlumbUtil.pointOnLine(head, mid, self.length),
tailLine = jsPlumbUtil.perpendicularLineTo(head, tail, 40),
headLine = jsPlumbUtil.perpendicularLineTo(tail, head, 20);
self.paint(connector, [head, tail, tailLine, headLine], self.lineWidth, "red", null, connectorDimensions);
return [Math.min(head.x, tail.x), Math.min(head.y, tail.y), Math.max(head.x, tail.x), Math.max(head.y,tail.y)];
};
this.computeMaxSize = function() { return 50; };
this.cleanup = function() { }; // nothing to clean up for GuideLines
};
// a test
jsPlumb.Overlays.svg.GuideLines = function() {
var path = null, self = this, path2 = null, p1_1, p1_2;
jsPlumb.Overlays.GuideLines.apply(this, arguments);
this.paint = function(connector, d, lineWidth, strokeStyle, fillStyle) {
if (path == null) {
path = _node("path");
connector.svg.appendChild(path);
self.attachListeners(path, connector);
self.attachListeners(path, self);
p1_1 = _node("path");
connector.svg.appendChild(p1_1);
self.attachListeners(p1_1, connector);
self.attachListeners(p1_1, self);
p1_2 = _node("path");
connector.svg.appendChild(p1_2);
self.attachListeners(p1_2, connector);
self.attachListeners(p1_2, self);
}
_attr(path, {
"d" : makePath(d[0], d[1]),
stroke : "red",
fill : null
});
_attr(p1_1, {
"d" : makePath(d[2][0], d[2][1]),
stroke : "blue",
fill : null
});
_attr(p1_2, {
"d" : makePath(d[3][0], d[3][1]),
stroke : "green",
fill : null
});
};
var makePath = function(d1, d2) {
return "M " + d1.x + "," + d1.y +
" L" + d2.x + "," + d2.y;
};
};
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment