1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-05 15:32:55 +02:00
epub.js/examples/polymer/polymer-ui-elements/polymer-ui-icon-button/polymer-ui-icon-button.html
2013-07-18 18:46:01 -07:00

77 lines
1.9 KiB
HTML

<!--
Copyright 2013 The Polymer Authors. All rights reserved.
Use of this source code is governed by a BSD-style
license that can be found in the LICENSE file.
-->
<!--
/**
* @module Polymer UI Elements
*/
/**
* polymer-ui-icon-button enables you to place an image centered in a button.
*
* Example:
*
* <polymer-ui-icon-button src="star.png"></polymer-ui-icon-button>
*
* Polymer includes an icon set. The property "icon" can be used
* to specify which icon to use.
*
* Example:
*
* <polymer-ui-icon-button icon="menu"></polymer-ui-icon-button>
*
* @class polymer-ui-icon-button
*/
-->
<link rel="import" href="../polymer-ui-icon/polymer-ui-icon.html">
<polymer-element name="polymer-ui-icon-button" attributes="src index icon active">
<template>
<link rel="stylesheet" href="polymer-ui-icon-button.css">
<polymer-ui-icon src="{{src}}" index="{{index}}" icon="{{icon}}"></polymer-ui-icon>
</template>
<script>
Polymer('polymer-ui-icon-button', {
/**
* The URL of an image for the icon.
*
* @attribute src
* @type string
* @default ''
*/
src: '',
/**
* If true, border is placed around the button to indicate
* active state.
*
* @attribute active
* @type boolean
* @default false
*/
active: false,
/**
* Specifies the icon from the Polymer icon set.
*
* @attribute icon
* @type string
* @default ''
*/
icon: '',
/**
* If a theme is applied that includes an icon set, the index of the
* icon to display.
*
* @attribute index
* @type number
* @default -1
*/
index: -1,
activeChanged: function() {
// TODO(sjmiles): sugar this common case
this.classList.toggle('selected', this.active);
}
});
</script>
</polymer-element>