OLD | NEW |
1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 /** | 5 /** |
6 * Custom DOM elements. | 6 * Custom DOM elements. |
7 * | 7 * |
8 * This library provides access to the Polymer project's | 8 * This library provides access to the Polymer project's |
9 * [Custom Elements] | 9 * [Custom Elements] |
10 * (http://www.polymer-project.org/platform/custom-elements.html) | 10 * (http://www.polymer-project.org/platform/custom-elements.html) |
11 * API, which lets you define your own elements. With custom elements, you | 11 * API, which lets you define your own elements. With custom elements, you |
12 * associate code with custom tag names, and then use those custom tag names | 12 * associate code with custom tag names, and then use those custom tag names |
13 * as you would any standard tag. For more information, see the | 13 * as you would any standard tag. For more information, see the |
14 * [Polymer.dart homepage](https://www.dartlang.org/polymer-dart/) and its | 14 * [Polymer.dart homepage](https://www.dartlang.org/polymer-dart/) and its |
15 * [custom element example] | 15 * [custom element example] |
16 * (https://www.dartlang.org/polymer-dart/#custom-elements). | 16 * (https://www.dartlang.org/polymer-dart/#custom-elements). |
17 */ | 17 */ |
18 library custom_element; | 18 library custom_element; |
19 | 19 |
20 import 'dart:async'; | 20 import 'dart:async'; |
21 import 'dart:html'; | 21 import 'dart:html'; |
22 import 'package:mdv/mdv.dart' as mdv; | 22 import 'package:mdv/mdv.dart' as mdv; |
23 import 'package:meta/meta.dart'; | 23 import 'package:meta/meta.dart'; |
24 import 'src/custom_tag_name.dart'; | 24 import 'src/custom_tag_name.dart'; |
25 | 25 |
| 26 part 'src/attribute_map.dart'; |
| 27 |
26 // TODO(jmesserly): replace with a real custom element polyfill. | 28 // TODO(jmesserly): replace with a real custom element polyfill. |
27 // This is just something temporary. | 29 // This is just something temporary. |
28 /** | 30 /** |
29 * *Warning*: this implementation is a work in progress. It only implements | 31 * *Warning*: this implementation is a work in progress. It only implements |
30 * the specification partially. | 32 * the specification partially. |
31 * | 33 * |
32 * Registers a custom HTML element with [localName] and the associated | 34 * Registers a custom HTML element with [localName] and the associated |
33 * constructor. This will ensure the element is detected and | 35 * constructor. This will ensure the element is detected and |
34 * | 36 * |
35 * See the specification at: | 37 * See the specification at: |
(...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
108 * interface, it also provides lifecycle methods: | 110 * interface, it also provides lifecycle methods: |
109 * - [created] | 111 * - [created] |
110 * - [inserted] | 112 * - [inserted] |
111 * - [attributeChanged] | 113 * - [attributeChanged] |
112 * - [removed] | 114 * - [removed] |
113 */ | 115 */ |
114 class CustomElement implements Element { | 116 class CustomElement implements Element { |
115 /** The web component element wrapped by this class. */ | 117 /** The web component element wrapped by this class. */ |
116 Element _host; | 118 Element _host; |
117 List _shadowRoots; | 119 List _shadowRoots; |
| 120 _AttributeMap _attributes; |
118 | 121 |
119 /** | 122 /** |
120 * Shadow roots generated by dwc for each custom element, indexed by the | 123 * Shadow roots generated by dwc for each custom element, indexed by the |
121 * custom element tag name. | 124 * custom element tag name. |
122 */ | 125 */ |
123 Map<String, dynamic> _generatedRoots = {}; | 126 Map<String, dynamic> _generatedRoots = {}; |
124 | 127 |
125 /** | 128 /** |
126 * Temporary property until components extend [Element]. An element can | 129 * Temporary property until components extend [Element]. An element can |
127 * only be associated with one host, and it is an error to use a web component | 130 * only be associated with one host, and it is an error to use a web component |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
171 * Note that [root] will be a [ShadowRoot] if the browser supports Shadow DOM. | 174 * Note that [root] will be a [ShadowRoot] if the browser supports Shadow DOM. |
172 */ | 175 */ |
173 void created() {} | 176 void created() {} |
174 | 177 |
175 /** Invoked when this component gets inserted in the DOM tree. */ | 178 /** Invoked when this component gets inserted in the DOM tree. */ |
176 void inserted() {} | 179 void inserted() {} |
177 | 180 |
178 /** Invoked when this component is removed from the DOM tree. */ | 181 /** Invoked when this component is removed from the DOM tree. */ |
179 void removed() {} | 182 void removed() {} |
180 | 183 |
181 // TODO(jmesserly): how do we implement this efficiently? | |
182 // See https://github.com/dart-lang/web-ui/issues/37 | |
183 /** Invoked when any attribute of the component is modified. */ | 184 /** Invoked when any attribute of the component is modified. */ |
184 void attributeChanged(String name, String oldValue, String newValue) {} | 185 void attributeChanged(String name, String oldValue) {} |
185 | 186 |
186 get model => host.model; | 187 get model => host.model; |
187 | 188 |
188 void set model(newModel) { | 189 void set model(newModel) { |
189 host.model = newModel; | 190 host.model = newModel; |
190 } | 191 } |
191 | 192 |
192 get templateInstance => host.templateInstance; | 193 get templateInstance => host.templateInstance; |
193 get isTemplate => host.isTemplate; | 194 get isTemplate => host.isTemplate; |
194 get ref => host.ref; | 195 get ref => host.ref; |
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
261 bool contains(Node other) => host.contains(other); | 262 bool contains(Node other) => host.contains(other); |
262 | 263 |
263 bool hasChildNodes() => host.hasChildNodes(); | 264 bool hasChildNodes() => host.hasChildNodes(); |
264 | 265 |
265 Node insertBefore(Node newChild, Node refChild) => | 266 Node insertBefore(Node newChild, Node refChild) => |
266 host.insertBefore(newChild, refChild); | 267 host.insertBefore(newChild, refChild); |
267 | 268 |
268 Node insertAllBefore(Iterable<Node> newChild, Node refChild) => | 269 Node insertAllBefore(Iterable<Node> newChild, Node refChild) => |
269 host.insertAllBefore(newChild, refChild); | 270 host.insertAllBefore(newChild, refChild); |
270 | 271 |
271 Map<String, String> get attributes => host.attributes; | 272 Map<String, String> get attributes { |
| 273 if (_attributes == null) _attributes = new _AttributeMap(this); |
| 274 return _attributes; |
| 275 } |
272 set attributes(Map<String, String> value) { | 276 set attributes(Map<String, String> value) { |
273 host.attributes = value; | 277 (attributes as _AttributeMap)._replaceAll(value); |
274 } | 278 } |
275 | 279 |
276 List<Element> get elements => host.children; | 280 List<Element> get elements => host.children; |
277 | 281 |
278 set elements(List<Element> value) { | 282 set elements(List<Element> value) { |
279 host.children = value; | 283 host.children = value; |
280 } | 284 } |
281 | 285 |
282 List<Element> get children => host.children; | 286 List<Element> get children => host.children; |
283 | 287 |
(...skipping 355 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
639 for (var removed in record.removedNodes) { | 643 for (var removed in record.removedNodes) { |
640 if (identical(node, removed)) { | 644 if (identical(node, removed)) { |
641 observer.disconnect(); | 645 observer.disconnect(); |
642 element.removed(); | 646 element.removed(); |
643 return; | 647 return; |
644 } | 648 } |
645 } | 649 } |
646 } | 650 } |
647 }).observe(element.parentNode, childList: true); | 651 }).observe(element.parentNode, childList: true); |
648 } | 652 } |
OLD | NEW |