Index: third_party/polymer/v1_0/components/paper-spinner/paper-spinner.html |
diff --git a/third_party/polymer/v1_0/components/paper-spinner/paper-spinner.html b/third_party/polymer/v1_0/components/paper-spinner/paper-spinner.html |
deleted file mode 100644 |
index 5a1f9edc8b6f861a738dbf71d870147151c9739c..0000000000000000000000000000000000000000 |
--- a/third_party/polymer/v1_0/components/paper-spinner/paper-spinner.html |
+++ /dev/null |
@@ -1,200 +0,0 @@ |
-<!-- |
-@license |
-Copyright (c) 2015 The Polymer Project Authors. All rights reserved. |
-This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt |
-The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt |
-The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt |
-Code distributed by Google as part of the polymer project is also |
-subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt |
---> |
- |
-<link rel="import" href="../polymer/polymer.html"> |
-<link rel="import" href="../paper-styles/color.html"> |
-<link rel="import" href="../iron-flex-layout/iron-flex-layout.html"> |
- |
-<!-- |
-Element providing material design circular spinner. |
- |
- <paper-spinner active></paper-spinner> |
- |
-The default spinner cycles between four layers of colors; by default they are |
-blue, red, yellow and green. It can be customized so that it uses one color only |
-by setting all the layer colors to the same value. |
- |
-### Accessibility |
- |
-Alt attribute should be set to provide adequate context for accessibility. If not provided, |
-it defaults to 'loading'. |
-Empty alt can be provided to mark the element as decorative if alternative content is provided |
-in another form (e.g. a text block following the spinner). |
- |
- <paper-spinner alt="Loading contacts list" active></paper-spinner> |
- |
-### Styling |
- |
-The following custom properties and mixins are available for styling: |
- |
-Custom property | Description | Default |
-----------------|-------------|---------- |
-`--paper-spinner-layer-1-color` | Color of the first spinner rotation | `--google-blue-500` |
-`--paper-spinner-layer-2-color` | Color of the second spinner rotation | `--google-red-500` |
-`--paper-spinner-layer-3-color` | Color of the third spinner rotation | `--google-yellow-500` |
-`--paper-spinner-layer-4-color` | Color of the fourth spinner rotation | `--google-green-500` |
- |
-@group Paper Elements |
-@element paper-spinner |
-@hero hero.svg |
-@demo demo/index.html |
---> |
- |
-<dom-module id="paper-spinner"> |
- |
- <link rel="import" type="css" href="paper-spinner.css"> |
- |
- <template> |
- |
- <div id="spinnerContainer" class-name="[[_spinnerContainerClassName]]"> |
- <div class="spinner-layer layer-1"> |
- <div class="circle-clipper left"> |
- <div class="circle"></div> |
- </div><div class="gap-patch"> |
- <div class="circle"></div> |
- </div><div class="circle-clipper right"> |
- <div class="circle"></div> |
- </div> |
- </div> |
- |
- <div class="spinner-layer layer-2"> |
- <div class="circle-clipper left"> |
- <div class="circle"></div> |
- </div><div class="gap-patch"> |
- <div class="circle"></div> |
- </div><div class="circle-clipper right"> |
- <div class="circle"></div> |
- </div> |
- </div> |
- |
- <div class="spinner-layer layer-3"> |
- <div class="circle-clipper left"> |
- <div class="circle"></div> |
- </div><div class="gap-patch"> |
- <div class="circle"></div> |
- </div><div class="circle-clipper right"> |
- <div class="circle"></div> |
- </div> |
- </div> |
- |
- <div class="spinner-layer layer-4"> |
- <div class="circle-clipper left"> |
- <div class="circle"></div> |
- </div><div class="gap-patch"> |
- <div class="circle"></div> |
- </div><div class="circle-clipper right"> |
- <div class="circle"></div> |
- </div> |
- </div> |
- </div> |
- |
- </template> |
- |
- <script> |
- |
- Polymer({ |
- |
- is: 'paper-spinner', |
- |
- listeners: { |
- 'animationend': 'reset', |
- 'webkitAnimationEnd': 'reset' |
- }, |
- |
- properties: { |
- |
- /** |
- * Displays the spinner. |
- * |
- * @attribute active |
- * @type boolean |
- * @default false |
- */ |
- active: { |
- type: Boolean, |
- value: false, |
- reflectToAttribute: true, |
- observer: '_activeChanged' |
- }, |
- |
- /** |
- * Alternative text content for accessibility support. |
- * If alt is present, it will add an aria-label whose content matches alt when active. |
- * If alt is not present, it will default to 'loading' as the alt value. |
- * |
- * @attribute alt |
- * @type string |
- * @default 'loading' |
- */ |
- alt: { |
- type: String, |
- value: 'loading', |
- observer: '_altChanged' |
- }, |
- |
- /** |
- * True when the spinner is going from active to inactive. This is represented by a fade |
- * to 0% opacity to the user. |
- */ |
- _coolingDown: { |
- type: Boolean, |
- value: false |
- }, |
- |
- _spinnerContainerClassName: { |
- type: String, |
- computed: '_computeSpinnerContainerClassName(active, _coolingDown)' |
- } |
- |
- }, |
- |
- _computeSpinnerContainerClassName: function(active, coolingDown) { |
- return [ |
- active || coolingDown ? 'active' : '', |
- coolingDown ? 'cooldown' : '' |
- ].join(' '); |
- }, |
- |
- _activeChanged: function(active, old) { |
- this._setAriaHidden(!active); |
- if (!active && old) { |
- this._coolingDown = true; |
- } |
- }, |
- |
- _altChanged: function(alt) { |
- // user-provided `aria-label` takes precedence over prototype default |
- if (alt === this.getPropertyInfo('alt').value) { |
- this.alt = this.getAttribute('aria-label') || alt; |
- } else { |
- this._setAriaHidden(alt===''); |
- this.setAttribute('aria-label', alt); |
- } |
- }, |
- |
- _setAriaHidden: function(hidden) { |
- var attr = 'aria-hidden'; |
- if (hidden) { |
- this.setAttribute(attr, 'true'); |
- } else { |
- this.removeAttribute(attr); |
- } |
- }, |
- |
- reset: function() { |
- this.active = false; |
- this._coolingDown = false; |
- } |
- |
- }); |
- |
- </script> |
- |
-</dom-module> |