Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(3)

Side by Side Diff: third_party/polymer/v0_8/components/iron-meta/iron-meta.html

Issue 1082403004: Import Polymer 0.8 and several key elements. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Also remove polymer/explainer Created 5 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!--
2 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
3 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
5 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
6 Code distributed by Google as part of the polymer project is also
7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
8 -->
9
10 <!--
11 `iron-meta` is a generic element you can use for sharing information across the DOM tree.
12 It uses [monostate pattern](http://c2.com/cgi/wiki?MonostatePattern) such that a ny
13 instance of iron-meta has access to the shared
14 information. You can use `iron-meta` to share whatever you want (or create an ex tension
15 [like x-meta] for enhancements).
16
17 The `iron-meta` instances containing your actual data can be loaded in an import ,
18 or constructed in any way you see fit. The only requirement is that you create t hem
19 before you try to access them.
20
21 Examples:
22
23 If I create an instance like this:
24
25 <iron-meta key="info" keyUrl="foo/bar"></iron-meta>
26
27 Note that keyUrl="foo/bar" is the metadata I've defined. I could define more
28 attributes or use child nodes to define additional metadata.
29
30 Now I can access that element (and it's metadata) from any iron-meta instance
31 via the byKey method, e.g.
32
33 meta.byKey('info').getAttribute('keyUrl').
34
35 Pure imperative form would be like:
36
37 document.createElement('iron-meta').byKey('info').getAttribute('keyUrl');
38
39 Or, in a Polymer element, you can include a meta in your template:
40
41 <iron-meta id="meta"></iron-meta>
42 ...
43 this.$.meta.byKey('info').getAttribute('keyUrl');
44
45 @group Polymer Iron Elements
46 @element iron-meta
47 -->
48
49 <link rel="import" href="../polymer/polymer.html">
50
51 <script>
52
53 (function() {
54
55 // monostate data
56 var metaDatas = {};
57 var metaArrays = {};
58
59 Polymer.IronMeta = Polymer({
60
61 is: 'iron-meta',
62
63 properties: {
64
65 /**
66 * The type of meta-data. All meta-data of the same type is stored
67 * together.
68 *
69 * @attribute type
70 * @type String
71 * @default 'default'
72 */
73 type: {
74 type: String,
75 value: 'default',
76 observer: '_typeChanged'
77 },
78
79 /**
80 * The key used to store `value` under the `type` namespace.
81 *
82 * @attribute key
83 * @type String
84 * @default ''
85 */
86 key: {
87 type: String,
88 observer: '_keyChanged'
89 },
90
91 /**
92 * The meta-data to store or retrieve.
93 *
94 * @attribute value
95 * @type *
96 * @default this
97 */
98 value: {
99 type: Object,
100 notify: true,
101 observer: '_valueChanged'
102 },
103
104 /**
105 * If true, `value` is set to the iron-meta instance itself.
106 *
107 * @attribute self
108 * @type Boolean
109 * @default false
110 */
111 self: {
112 type: Boolean,
113 observer: '_selfChanged'
114 },
115
116 /**
117 * Array of all meta-data values for the given type.
118 *
119 * @property list
120 * @type Array
121 */
122 list: {
123 type: Array,
124 notify: true
125 }
126
127 },
128
129 /**
130 * Only runs if someone invokes the factory/constructor directly
131 * e.g. `new Polymer.IronMeta()`
132 */
133 factoryImpl: function(config) {
134 if (config) {
135 for (var n in config) {
136 switch(n) {
137 case 'type':
138 case 'key':
139 case 'value':
140 this[n] = config[n];
141 break;
142 }
143 }
144 }
145 },
146
147 created: function() {
148 // TODO(sjmiles): good for debugging?
149 this._metaDatas = metaDatas;
150 this._metaArrays = metaArrays;
151 },
152
153 _keyChanged: function(key, old) {
154 this._resetRegistration(old);
155 },
156
157 _valueChanged: function(value) {
158 this._resetRegistration(this.key);
159 },
160
161 _selfChanged: function(self) {
162 if (self) {
163 this.value = this;
164 }
165 },
166
167 _typeChanged: function(type) {
168 this._unregisterKey(this.key);
169 if (!metaDatas[type]) {
170 metaDatas[type] = {};
171 }
172 this._metaData = metaDatas[type];
173 if (!metaArrays[type]) {
174 metaArrays[type] = [];
175 }
176 this.list = metaArrays[type];
177 this._registerKeyValue(this.key, this.value);
178 },
179
180 /**
181 * Retrieves meta data value by key.
182 *
183 * @method byKey
184 * @param {String} key The key of the meta-data to be returned.
185 * @returns *
186 */
187 byKey: function(key) {
188 return this._metaData && this._metaData[key];
189 },
190
191 _resetRegistration: function(oldKey) {
192 this._unregisterKey(oldKey);
193 this._registerKeyValue(this.key, this.value);
194 },
195
196 _unregisterKey: function(key) {
197 this._unregister(key, this._metaData, this.list);
198 },
199
200 _registerKeyValue: function(key, value) {
201 this._register(key, value, this._metaData, this.list);
202 },
203
204 _register: function(key, value, data, list) {
205 if (key && data && value !== undefined) {
206 data[key] = value;
207 list.push(value);
208 }
209 },
210
211 _unregister: function(key, data, list) {
212 if (key && data) {
213 if (key in data) {
214 var value = data[key];
215 delete data[key];
216 this.arrayDelete(list, value);
217 }
218 }
219 }
220
221 });
222
223 /**
224 `iron-meta-query` can be used to access infomation stored in `iron-meta`.
225
226 Examples:
227
228 If I create an instance like this:
229
230 <iron-meta key="info" value="foo/bar"></iron-meta>
231
232 Note that keyUrl="foo/bar" is the metadata I've defined. I could define more
233 attributes or use child nodes to define additional metadata.
234
235 Now I can access that element (and it's metadata) from any `iron-meta-query` instance:
236
237 var value = new Polymer.IronMetaQuery({key: 'info'}).value;
238
239 @group Polymer Iron Elements
240 @element iron-meta-query
241 */
242 Polymer.IronMetaQuery = Polymer({
243
244 is: 'iron-meta-query',
245
246 properties: {
247
248 /**
249 * The type of meta-data. All meta-data of the same type is stored
250 * together.
251 *
252 * @attribute type
253 * @type String
254 * @default 'default'
255 */
256 type: {
257 type: String,
258 value: 'default',
259 observer: '_typeChanged'
260 },
261
262 /**
263 * Specifies a key to use for retrieving `value` from the `type`
264 * namespace.
265 *
266 * @attribute key
267 * @type String
268 */
269 key: {
270 type: String,
271 observer: '_keyChanged'
272 },
273
274 /**
275 * The meta-data to store or retrieve.
276 *
277 * @attribute value
278 * @type *
279 * @default this
280 */
281 value: {
282 type: Object,
283 notify: true,
284 readOnly: true
285 },
286
287 /**
288 * Array of all meta-data values for the given type.
289 *
290 * @property list
291 * @type Array
292 */
293 list: {
294 type: Array,
295 notify: true
296 }
297
298 },
299
300 /**
301 * Actually a factory method, not a true constructor. Only runs if
302 * someone invokes it directly (via `new Polymer.IronMeta()`);
303 */
304 constructor: function(config) {
305 if (config) {
306 for (var n in config) {
307 switch(n) {
308 case 'type':
309 case 'key':
310 this[n] = config[n];
311 break;
312 }
313 }
314 }
315 },
316
317 created: function() {
318 // TODO(sjmiles): good for debugging?
319 this._metaDatas = metaDatas;
320 this._metaArrays = metaArrays;
321 },
322
323 _keyChanged: function(key) {
324 this._setValue(this._metaData && this._metaData[key]);
325 },
326
327 _typeChanged: function(type) {
328 this._metaData = metaDatas[type];
329 this.list = metaArrays[type];
330 if (this.key) {
331 this._keyChanged(this.key);
332 }
333 },
334
335 /**
336 * Retrieves meta data value by key.
337 *
338 * @method byKey
339 * @param {String} key The key of the meta-data to be returned.
340 * @returns *
341 */
342 byKey: function(key) {
343 return this._metaData && this._metaData[key];
344 }
345
346 });
347
348 })();
349 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698