OLD | NEW |
1 <!-- | |
2 Copyright (c) 2014 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 | 1 |
10 <!-- | |
11 /** | |
12 * @group Polymer Core Elements | |
13 * | |
14 * The `core-iconset` element allows users to define their own icon sets. | |
15 * The `src` property specifies the url of the icon image. Multiple icons may | |
16 * be included in this image and they may be organized into rows. | |
17 * The `icons` property is a space separated list of names corresponding to the | |
18 * icons. The names must be ordered as the icons are ordered in the icon image. | |
19 * Icons are expected to be square and are the size specified by the `iconSize` | |
20 * property. The `width` property corresponds to the width of the icon image | |
21 * and must be specified if icons are arranged into multiple rows in the image. | |
22 * | |
23 * All `core-iconset` elements are available for use by other `core-iconset` | |
24 * elements via a database keyed by id. Typically, an element author that wants | |
25 * to support a set of custom icons uses a `core-iconset` to retrieve | |
26 * and use another, user-defined iconset. | |
27 * | |
28 * Example: | |
29 * | |
30 * <core-iconset id="my-icons" src="my-icons.png" width="96" iconSize="24" | |
31 * icons="location place starta stopb bus car train walk"> | |
32 * </core-iconset> | |
33 * | |
34 * This will automatically register the icon set "my-icons" to the iconset | |
35 * database. To use these icons from within another element, make a | |
36 * `core-iconset` element and call the `byId` method to retrieve a | |
37 * given iconset. To apply a particular icon to an element, use the | |
38 * `applyIcon` method. For example: | |
39 * | |
40 * iconset.applyIcon(iconNode, 'car'); | |
41 * | |
42 * Themed icon sets are also supported. The `core-iconset` can contain child | |
43 * `property` elements that specify a theme with an offsetX and offsetY of the | |
44 * theme within the icon resource. For example. | |
45 * | |
46 * <core-iconset id="my-icons" src="my-icons.png" width="96" iconSize="24" | |
47 * icons="location place starta stopb bus car train walk"> | |
48 * <property theme="special" offsetX="256" offsetY="24"></property> | |
49 * </core-iconset> | |
50 * | |
51 * Then a themed icon can be applied like this: | |
52 * | |
53 * iconset.applyIcon(iconNode, 'car', 'special'); | |
54 * | |
55 * @element core-iconset | |
56 * @extends core-meta | |
57 * @homepage github.io | |
58 */ | |
59 --> | |
60 | |
61 <link rel="import" href="../core-meta/core-meta.html"> | |
62 | |
63 <polymer-element name="core-iconset" extends="core-meta" attributes="src width i
cons iconSize"> | |
64 | |
65 <script> | |
66 | 2 |
67 Polymer('core-iconset', { | 3 Polymer('core-iconset', { |
68 | 4 |
69 /** | 5 /** |
70 * The URL of the iconset image. | 6 * The URL of the iconset image. |
71 * | 7 * |
72 * @attribute src | 8 * @attribute src |
73 * @type string | 9 * @type string |
74 * @default '' | 10 * @default '' |
75 */ | 11 */ |
(...skipping 153 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
229 this.width * scale + 'px'; | 165 this.width * scale + 'px'; |
230 if (icon.parentNode !== element) { | 166 if (icon.parentNode !== element) { |
231 element.appendChild(icon); | 167 element.appendChild(icon); |
232 } | 168 } |
233 return icon; | 169 return icon; |
234 } | 170 } |
235 } | 171 } |
236 | 172 |
237 }); | 173 }); |
238 | 174 |
239 </script> | 175 |
240 | |
241 </polymer-element> | |
OLD | NEW |