src/third_party/polymer/components-chromium/core-iconset/core-iconset.html

   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.github.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/CONTRIBUTORS.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/PATENTS.txt
   8 -->
   9
  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 icons iconSize" assetpath="">
  64
  65
  66
  67 </polymer-element>
  68 <script src="core-iconset-extracted.js"></script>