1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556 |
- <html>
- <head>
- <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
- <!--script type="text/javascript" src="js/jquery.jsPlumb-1.2.6-all-min.js"></script-->
- <script type="text/javascript" src="js/jquery.jsPlumb-1.3.0beta-all.js"></script>
- <script type="text/javascript">
- "use strict";
- $(function() {
- jsPlumb.setMouseEventsEnabled(true);
- jsPlumb.Defaults.PaintStyle = {
- lineWidth: 3,
- strokeStyle: '#666'
- };
- jsPlumb.Defaults.HoverPaintStyle = {
- lineWidth: 5,
- strokeStyle: '#888'
- };
- jsPlumb.Defaults.DragOptions = { cursor: 'crosshair' };
- jsPlumb.Defaults.Endpoint = new jsPlumb.Endpoints.Dot({radius: 6});
- jsPlumb.Defaults.Connector = new jsPlumb.Connectors.Bezier(150);
- var connfunction = function(data) {
- var src = Node.get(nid2id(data.sourceId));
- var dst = Node.get(nid2id(data.targetId));
- if (data.sourceEndpoint.scope != 'center')
- src.try_attach_center(dst);
- var getcon = jsPlumb.getConnections();
- src.setmarker(getcon);
- dst.setmarker(getcon);
- };
- jsPlumb.bind('jsPlumbConnection', connfunction );
- var diagramnode = '<div id="node0"><img src="img/tWLS.png"></div>';
- $('#asdf').append(diagramnode);
- jsPlumb.Defaults.Container = "asdf";
- var dragpoint = jsPlumb.addEndpoint("node0", {
- anchor: "TopCenter",
- style: {fillStyle:"#999"},
- hoverPaintStyle: {fillStyle:"#f0c"},
- isSource: true,
- isTarget: true,
- endpointsOnTop: true,
- maxConnections: -1
- });
- });
- </script>
- </head>
- <body>
- <p>Testcase:</p>
- <div id="asdf">
- </div>
- </body>
|