OLD | NEW |
| (Empty) |
1 /* | |
2 * Copyright 2014 Google Inc. All rights reserved. | |
3 * | |
4 * Use of this source code is governed by a BSD-style | |
5 * license that can be found in the LICENSE file or at | |
6 * https://developers.google.com/open-source/licenses/bsd | |
7 */ | |
8 /* | |
9 * TODO(prsd): Document library | |
10 */ | |
11 library charted.selection; | |
12 | |
13 import "dart:html" show Element, Event, document; | |
14 import "dart:math" as math; | |
15 import "package:charted/core/utils.dart"; | |
16 import "package:charted/selection/transition.dart"; | |
17 | |
18 part "selection_scope.dart"; | |
19 part "src/selection_impl.dart"; | |
20 | |
21 /** | |
22 * Callback to access key value from a given data object. During the process | |
23 * of binding data to Elements, the key values are used to match Elements | |
24 * that have previously bound data | |
25 */ | |
26 typedef SelectionKeyFunction(datum); | |
27 | |
28 /** | |
29 * Callback for all DOM related operations - The first parameter [datum] is | |
30 * the piece of data associated with the node, [ei] is the index of the | |
31 * element in it's group and [c] is the context to which the data is | |
32 * associated to. | |
33 */ | |
34 typedef E SelectionCallback<E>(datum, int index, Element element); | |
35 | |
36 /** Callback used to access a value from a datum */ | |
37 typedef E SelectionValueAccessor<E>(datum, int index); | |
38 | |
39 /** Create a ChartedCallback that always returns [val] */ | |
40 SelectionCallback toCallback(val) => (datum, index, element) => val; | |
41 | |
42 /** Create a ChartedValueAccessor that always returns [val] */ | |
43 SelectionValueAccessor toValueAccessor(val) => (datum, index) => val; | |
44 | |
45 /** | |
46 * [Selection] is a collection of elements - this collection defines | |
47 * operators that can be applied on all elements of the collection. | |
48 * | |
49 * All operators accept parameters either as a constant value or a callback | |
50 * function (typically using the named parameters "val" and "fn"). These | |
51 * operators, when invoked with the callback function, the function is | |
52 * called once per element and is passed the "data" associated, the "index" | |
53 * and the element itself. | |
54 */ | |
55 abstract class Selection { | |
56 /** | |
57 * Collection of groups - A selection when created by calling [selectAll] | |
58 * on an existing [Selection], could contain more than one group. | |
59 */ | |
60 Iterable<SelectionGroup> groups; | |
61 | |
62 /** | |
63 * Scope of this selection that manages the element, data associations for | |
64 * all elements in this selection (and the sub-selections) | |
65 */ | |
66 SelectionScope get scope; | |
67 | |
68 /** Indicates if this selection is empty */ | |
69 bool get isEmpty; | |
70 | |
71 /** Number of elements in this selection */ | |
72 int get length; | |
73 | |
74 /** First non-null element in this selection, if any. */ | |
75 Element get first; | |
76 | |
77 /** | |
78 * Creates and returns a new [Selection] containing the first element | |
79 * matching [selector] under each element in the current selection. | |
80 * | |
81 * If an element does not have a matching descendant, a placeholder is used | |
82 * in it's position - thus being able to match the indices of elements in | |
83 * the current and the created sub-selection. | |
84 * | |
85 * Any data bound to elements in this selection is inherited by the | |
86 * selected descendants. | |
87 */ | |
88 Selection select(String selector); | |
89 | |
90 /** | |
91 * Same as [select], but calls [fn] for each non-null element in the | |
92 * selection (with data associated to the element, index of the element in | |
93 * it's group and the element itself) to get the selected element that will | |
94 * be selected. | |
95 */ | |
96 Selection selectWithCallback(SelectionCallback<Element> fn); | |
97 | |
98 /** | |
99 * Creates and returns a new [Selection] containing all elements matching | |
100 * [selector] under each element in the current selection. | |
101 * | |
102 * The resulting [Selection] is nested with elements from current selection | |
103 * as parents and the selected descendants grouped by elements in the | |
104 * current selection. When no descendants match the selector, the | |
105 * collection of selected elements in a group is empty. | |
106 * | |
107 * Data bound to the elements is not automatically inherited by the | |
108 * selected descendants. | |
109 */ | |
110 Selection selectAll(String selector); | |
111 | |
112 /** | |
113 * Same as [selectAll], but calls [fn] for each non-null element in the | |
114 * selection (with data associated to the element, index of the element in | |
115 * it's group and the element itself) to get a collection of selected | |
116 * elements that will be part of the new selection. | |
117 */ | |
118 Selection selectAllWithCallback(SelectionCallback<Iterable<Element>> fn); | |
119 | |
120 /** | |
121 * Sets the attribute [name] on all elements when [val] is not null. | |
122 * Removes the attribute when [val] is null. | |
123 */ | |
124 void attr(String name, val); | |
125 | |
126 /** | |
127 * Same as [attr], but calls [fn] for each non-null element in the | |
128 * selection (with data associated to the element, index of the element in | |
129 * it's group and the element itself) to get the value of the attribute. | |
130 */ | |
131 void attrWithCallback(String name, SelectionCallback fn); | |
132 | |
133 /** | |
134 * Ensures presence of a class when [val] is true. Ensures that the class | |
135 * isn't present if [val] is false. | |
136 */ | |
137 void classed(String name, [bool val = true]); | |
138 | |
139 /** | |
140 * Same as [classed], but calls [fn] for each non-null element in the | |
141 * selection (with data associated to the element, index of the element in | |
142 * it's group and the element itself) to get the boolean value that | |
143 * indicates if the class must be added or removed. | |
144 */ | |
145 void classedWithCallback(String name, SelectionCallback<bool> fn); | |
146 | |
147 /** Sets CSS [property] to [val] on all elements in the selection. */ | |
148 void style(String property, val, {String priority}); | |
149 | |
150 /** | |
151 * Same as [style], but calls [fn] for each non-null element in the | |
152 * selection (with data associated to the element, index of the element in | |
153 * it's group and the element itself) to get the value of the property. | |
154 */ | |
155 void styleWithCallback(String property, | |
156 SelectionCallback<String> fn, {String priority}); | |
157 | |
158 /** | |
159 * Sets textContent of all elements in the selection to [val]. A side-effect | |
160 * of this call is that any children of these elements will not be part of | |
161 * the DOM anymore. | |
162 */ | |
163 void text(String val); | |
164 | |
165 /** | |
166 * Same as [text], but calls [fn] for each non-null element in | |
167 * the selection (with data associated to the element, index of the | |
168 * element in it's group and the element itself) to get the text content | |
169 */ | |
170 void textWithCallback(SelectionCallback<String> fn); | |
171 | |
172 /** | |
173 * Sets innerHtml of all elements in the selection to [val]. A side-effect | |
174 * of this call is that any children of these elements will not be part of | |
175 * the DOM anymore. | |
176 */ | |
177 void html(String val); | |
178 | |
179 /** | |
180 * Same as [html], but calls [fn] for each non-null element in | |
181 * the selection (with data associated to the element, index of the | |
182 * element in it's group and the element itself) to get the html content | |
183 */ | |
184 void htmlWithCallback(SelectionCallback<String> fn); | |
185 | |
186 /** | |
187 * Appends a new child element to each element in the selection. | |
188 * | |
189 * Returns a [Selection] containing the newly created elements. As with | |
190 * [select], any data bound to the elements in this selection is inherited | |
191 * by the new elements. | |
192 */ | |
193 Selection append(String tag); | |
194 | |
195 /** | |
196 * Same as [append], but calls [fn] for each non-null element in the | |
197 * selection (with data associated to the element, index of the element in | |
198 * it's group and the element itself) to get the element to be appended. | |
199 */ | |
200 Selection appendWithCallback(SelectionCallback<Element> fn); | |
201 | |
202 /** | |
203 * Inserts a child node to each element in the selection before the first | |
204 * element matching [before] or before the element returned by [beforeFn]. | |
205 * | |
206 * Returns a [Selection] containing the newly created elements. As with | |
207 * [select], any data bound to the elements in this selection is inherited | |
208 * by the new elements. | |
209 */ | |
210 Selection insert(String tag, | |
211 {String before, SelectionCallback<Element> beforeFn}); | |
212 | |
213 /** | |
214 * Same as [insert], but calls [fn] for each non-null element in the | |
215 * selection (with data associated to the element, index of the element in | |
216 * it's group and the element itself) to get the element to be inserted. | |
217 */ | |
218 Selection insertWithCallback(SelectionCallback<Element> fn, | |
219 {String before, SelectionCallback<Element> beforeFn}); | |
220 | |
221 /** Removes all selected elements from the DOM */ | |
222 void remove(); | |
223 | |
224 /** Calls [fn] on each element in this selection */ | |
225 void each(SelectionCallback fn); | |
226 | |
227 /** | |
228 * Adds or removes an event [listener] to each element in the selection for | |
229 * the specified [type] (Eg: "mouseclick", "mousedown") | |
230 * | |
231 * Any existing listener of the same type will be removed. To register | |
232 * multiple listener for the same event type, the [type] can be suffixed | |
233 * with a namespace. (Eg: "mouseclick.foo", "mousedown.bar") | |
234 * | |
235 * When [listener] is null, any existing listener of the same type and in | |
236 * the same namespace will be removed (Eg: Using "mouseclick.foo" as type | |
237 * will only remove listeners for "mouseclick.foo" and not "mouseclick.bar") | |
238 * | |
239 * To remove listeners of an event type in all namespaces, prefix the type | |
240 * with a "." (Eg: ".mouseclick" will remove "mouseclick.bar", | |
241 * "mouseclick .foo" and all other mouseclick event listeners) | |
242 * | |
243 * To summarize, [type] can be any DOM event type optionally in the format | |
244 * "event.namespace" where event is the DOM event type and namespace is | |
245 * used to distinguish between added listeners. | |
246 * | |
247 * When [listener] is called, it is passed the current value associated with | |
248 * the element. Please note that index passed to the listener contains a | |
249 * value as it was at the time of adding the listener. | |
250 */ | |
251 void on(String type, [SelectionCallback listener, bool capture]); | |
252 | |
253 /** | |
254 * Associates data with the selected elements. | |
255 * Computes the enter, update and exit selections. | |
256 */ | |
257 DataSelection data(Iterable vals, [SelectionKeyFunction keyFn]); | |
258 | |
259 /** | |
260 * Same as [data], but calls [fn] for each non-null element in the | |
261 * selection (with data associated to the element, index of the element in | |
262 * it's group and the element itself) to get the data to be set on the | |
263 * current element. | |
264 */ | |
265 DataSelection dataWithCallback( | |
266 SelectionCallback<Iterable> fn, [SelectionKeyFunction keyFn]); | |
267 | |
268 /** | |
269 * Associates data with all the elements - no join is performed. Unlike | |
270 * [data], this does not compute the enter, update and exit selections. | |
271 */ | |
272 void datum(Iterable vals); | |
273 | |
274 /** | |
275 * Same as [datum], but calls [fn] for each non-null element in the | |
276 * selection (with data associated to the element, index of the element in | |
277 * it's group and the element itself) to get the data to be set on the | |
278 * current element. | |
279 */ | |
280 void datumWithCallback(SelectionCallback<Iterable> fn); | |
281 | |
282 /** | |
283 * Starts a transition for the current selection. Transitions behave much | |
284 * like selections, except operators animate smoothly over time rather than | |
285 * applying instantaneously. | |
286 */ | |
287 Transition transition(); | |
288 } | |
289 | |
290 | |
291 /* | |
292 * Group of elements in the selection. | |
293 * Each selection may contain more than one group of elements. | |
294 */ | |
295 abstract class SelectionGroup { | |
296 Iterable<Element> elements; | |
297 Element parent; | |
298 } | |
299 | |
300 | |
301 /** | |
302 * [EnterSelection] is a sub-selection that represents missing elements of a | |
303 * selection - an element is considered missing when there is data and no | |
304 * corresponding element in a selection. | |
305 */ | |
306 abstract class EnterSelection { | |
307 /** | |
308 * Indicate if this selection is empty | |
309 * See [Selection.isEmpty] for more information. | |
310 */ | |
311 bool get isEmpty; | |
312 | |
313 /** [DataSelection] that corresponds to this selection. */ | |
314 DataSelection get update; | |
315 | |
316 /** | |
317 * Appends an element to all elements in this selection and return | |
318 * [Selection] containing the newly added elements. | |
319 * | |
320 * See [Selection.append] for more information. | |
321 * The new nodes are merged into the [DataSelection] | |
322 */ | |
323 Selection append(String tag); | |
324 | |
325 /** | |
326 * Same as [append] but calls [fn] to get the element to be appended. | |
327 * See [Selection.appendWithCallback] for more information. | |
328 */ | |
329 Selection appendWithCallback(SelectionCallback<Element> fn); | |
330 | |
331 /** | |
332 * Insert a child node to each element in the selection and return | |
333 * [Selection] containing the newly added elements. | |
334 * | |
335 * See [Selection.insert] for more information. | |
336 * The new nodes are merged into the [UpdateSelection] | |
337 */ | |
338 Selection insert(String tag, | |
339 {String before, SelectionCallback<Element> beforeFn}); | |
340 | |
341 /** | |
342 * Same as [insert] but calls [fn] to get the element to be inserted. | |
343 * See [Selection.insertWithCallback] for more information. | |
344 */ | |
345 Selection insertWithCallback(SelectionCallback<Element> fn, | |
346 {String before, SelectionCallback<Element> beforeFn}); | |
347 | |
348 /** | |
349 * For each element in the current selection, select exactly one | |
350 * descendant and return [Selection] containing the selected elements. | |
351 * | |
352 * See [Selection.select] for more information. | |
353 */ | |
354 Selection select(String selector); | |
355 | |
356 /** | |
357 * Same as [select] but calls [fn] to get the element to be inserted. | |
358 * See [Selection.selectWithCallback] for more information. | |
359 */ | |
360 Selection selectWithCallback(SelectionCallback<Element> fn); | |
361 } | |
362 | |
363 /* | |
364 * [ExitSelection] is a sub-selection that represents elements that don't | |
365 * have data associated to them. | |
366 */ | |
367 abstract class ExitSelection extends Selection { | |
368 DataSelection get update; | |
369 } | |
370 | |
371 /* | |
372 * Selection that consists elements in the selection that aren't part of | |
373 * [EnterSelection] or the [ExitSelection] | |
374 * | |
375 * An [UpdateSelection] is only available after data() is attached and is | |
376 * currently exactly the same as [Selection] itself. | |
377 */ | |
378 abstract class DataSelection extends Selection { | |
379 /** | |
380 * A view of the current selection that contains a collection of data | |
381 * elements which weren't associated with an element in the DOM. | |
382 */ | |
383 EnterSelection get enter; | |
384 | |
385 /** | |
386 * A view of the current selection containing elements that don't have data | |
387 * associated with them. | |
388 */ | |
389 ExitSelection get exit; | |
390 } | |
OLD | NEW |