forked from jsplumb/jsplumb
/
todo.txt
169 lines (100 loc) · 6.4 KB
/
todo.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
makeTarget uniqueEndpoint issues
-------------------------------
- drag off a connection and drop it; it detaches. then try to drag a new connection - you get an error.
future
(none of these things are definite. i just like to keep a list of ideas that i've bounced around with various people)
- have a toFront and toBack method available on Connection (and on return value from jsPlumb.select method).
would require some notion of what the default zindex was. how best to do that?
- expose "rehomeEndpoint" method on jsPlumb (and 'rehome' on Endpoint); this takes an Endpoint and moves it
to a different parent. should take an optional second method to provide the Container to use.
- text on path (see demo)?
- performance tests:
- single SVG element, many paths (what are mouse interaction/zindex ramifications?)
- single canvas (have to paint nodes).
- VML groups.
- type selector that takes some data and decides which types to apply to a
connection or endpoint.
FAQ
http://jsfiddle.net/sporritt/S4Fxk/12/ (connect to intermediate endpoint)
http://jsfiddle.net/sporritt/ZUm7p/50/ (connect list items)
http://jsfiddle.net/sporritt/ZQcEc/25/ (drag multiple nodes at once)
extending a connector:
jsPlumb.Connectors.Flowchart2 = function(params) {
jsPlumb.Connectors.Flowchart.apply(this, arguments);
var _c = this._compute;
this._compute = function(paintInfo, params) {
paintInfo.endStubX += 30;
_c(paintInfo, params);
}
};
---
makeTarget when elements verlap:
https://groups.google.com/forum/?fromgroups#!topic/jsplumb/C9d217E34oo
dropOptions: {
hoverClass: "dragHover",
over: function(event, ui){
$('.w').not(self.$el).droppable("disable");
},
out: function(event, ui){
$('.w').droppable("enable");
}
}
---
CSS to disable drag highlight:
http://stackoverflow.com/questions/826782/css-rule-to-disable-text-selection-highlighting
---------------
Create a new node at the point a connection is dropped and attach a new connection to it:
jsPlumb.bind('connectionDragStop', function (data) {
if (data.target == null) {
var newBlock = createNewBlock(null);
jsPlumb.connect({ source:data.sourceId, target:newBlock.id + "-parent" });
}
});
Performance
-----------
What takes most of the time?
- jsBezier
jsBezier load test with 100 000 curves took tens of milliseconds, so we can discount this.
- DOM relayouts
adding individual elements to the DOM, one for each connection/endpoint, causes dom relayouts.
is it possible to batch element creation using document fragments instead?
- getting offsets/size info
are there too many calls to updateOffset/getSize ?
would i be better off just lifting a decent .offset function from somewhere? then i could
take CSS3 transforms into account, and margins, and scroll.
- anchorManager
is the redraw routine in anchor manager optimized?
- native calls
would there be any gain in introducing a layer that used native methods like getElementById,
querySelector, querySelectorAll, and set CSS properties direvtly? does el.classList exist in all
browsers? does it work on SVG elements? does it work on VML elements?
-
1.3.16
- add "perimeter" anchors: basically helper methods that create a set of dynamic anchors that together approximate the perimeter of some shape. so if you had circles, for instance, it would be straightforward to get a set of anchors that travel around the circumference of each one. or ellipses. whatever. also look into the possibility of jsPlumb interacting directly with SVG/VML elements to determine their perimeter.
- multiple paint styles, referenced by name. a simple case in on example app i saw could be "up", which paints green,
and "down" which paints red. then you could have "fat" and "skinny" for the bandwidth, for example. this would be backed with an API that behaved like classes on DOM elements -
you could have multiple assigned at once and jsPlumb would merge them all together.
(done, implemented as the 'types' concept)
1.3.11
- add jsPlumb.selectEndpoints(...); behaves the same way as .select, but for Endpoints
1.3.9
- do not set jsplumb scope on draggables when it's just some div you are making draggable. (issue 245) DONE
1.3.5
- refactor assigning endpoint styles into a common helper method DONE
- oncontextmenu event bind DONE
1.3.6
- mix of standard anchors on one end and continuous on the other does not paint (done)
- arrow overlay on flowchart sometimes jumps (done)
- random drag log entries (done)
- importDefaults({ some defaults }) method on jsPlumb (like a bulk import) DONE
- draggable by parent issue from google code DONE
possible future enhancements
- beforeDrag interceptor
- straight connector with continuous anchors disappears when horizontal or vertical (fixed?)
- single SVG element/single VML group/single Canvas per page?
- qunit: add helper methods to simulate mousedown and drag. then write some functional tests.
- image overlay?
- make AnchorManager the source of knowledge about connections (remove connections by scope etc)
- z-index: make a highlighted connection or one which is connected to an element that is being dragged come to the top over other connections. have a toFront and toBack method available on Connection (and on return value from jsPlumb.select method)
- jsPlumb should handle scope, dragActive etc. then can support multiple scopes.
- paint style "profiles": labelled paint styles, with inheritance. so hover, as an example, could extend from some normal state, and just override a couple of values. or you might have different "types" of connections, the paint styles for which could extend some default.