| 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 |