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

Unified Diff: third_party/polymer/v1_0/components/paper-slider/paper-slider.html

Issue 1221923003: Update bower.json for Polymer elements and add PRESUBMIT.py (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: rebase Created 5 years, 5 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 side-by-side diff with in-line comments
Download patch
Index: third_party/polymer/v1_0/components/paper-slider/paper-slider.html
diff --git a/third_party/polymer/v1_0/components/paper-slider/paper-slider.html b/third_party/polymer/v1_0/components/paper-slider/paper-slider.html
index c51236fcf5cb291f06616362ef09ef3493af8bdd..beaed90c5d4958f2dce067e03ba660ee7642b9bd 100644
--- a/third_party/polymer/v1_0/components/paper-slider/paper-slider.html
+++ b/third_party/polymer/v1_0/components/paper-slider/paper-slider.html
@@ -1,11 +1,11 @@
<!--
@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
-The complete set of authors may be found at http://polymer.github.io/AUTHORS
-The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
+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
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../polymer/polymer.html">
@@ -15,6 +15,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../paper-behaviors/paper-inky-focus-behavior.html">
<link rel="import" href="../paper-ripple/paper-ripple.html">
<link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
+<link rel="import" href="../iron-range-behavior/iron-range-behavior.html">
<link rel="import" href="../iron-form-element-behavior/iron-form-element-behavior.html">
<!--
@@ -33,49 +34,21 @@ Example:
<paper-slider min="10" max="200" value="110"></paper-slider>
-Styling slider:
+### Styling
-To change the slider progress bar color:
+The following custom properties and mixins are available for styling:
- paper-slider {
- --paper-slider-active-color: #0f9d58;
- }
-
-To change the slider knob color:
-
- paper-slider {
- --paper-slider-knob-color: #0f9d58;
- }
-
-To change the slider pin color:
-
- paper-slider {
- --paper-slider-pin-color: #0f9d58;
- }
-
-To change the slider pin's font color:
-
- paper-slider {
- --paper-slider-pin-font-color: #0f9d58;
- }
-
-To change the slider secondary progress bar color:
-
- paper-slider {
- --paper-slider-secondary-color: #0f9d58;
- }
-
-To change the slider disabled active color:
-
- paper-slider {
- --paper-slider-disabled-active-color: #ccc;
- }
-
-To change the slider disabled secondary progress bar color:
-
- paper-slider {
- --paper-slider-disabled-secondary-color: #ccc;
- }
+Custom property | Description | Default
+----------------|-------------|----------
+`--paper-slider-bar-color` | The background color of the slider | `transparent`
+`--paper-slider-active-color` | The progress bar color | `--google-blue-700`
+`--paper-slider-secondary-color` | The secondary progress bar color | `--google-blue-300`
+`--paper-slider-knob-color` | The knob color | `--google-blue-700`
+`--paper-slider-disabled-knob-color` | The disabled knob color | `--google-grey-500`
+`--paper-slider-pin-color` | The pin color | `--google-blue-700`
+`--paper-slider-font-color` | The pin's text color | `#fff`
+`--paper-slider-disabled-active-color` | The disabled progress bar color | `--google-grey-500`
+`--paper-slider-disabled-secondary-color` | The disabled secondary progress bar color | `--google-grey-300`
@group Paper Elements
@element paper-slider
@@ -120,7 +93,7 @@ To change the slider disabled secondary progress bar color:
on-up="_resetKnob"
on-track="_onTrack"
on-transitionend="_knobTransitionEnd">
- <paper-ripple id="ink" class="circle" center></paper-ripple>
+ <paper-ripple id="ink" class="circle" center hidden$="[[!receivedFocusFromKeyboard]]"></paper-ripple>
<div id="sliderKnobInner" value$="[[immediateValue]]"></div>
</div>
</div>
@@ -138,38 +111,19 @@ To change the slider disabled secondary progress bar color:
</dom-module>
<script>
- /**
- * Fired when the slider's value changes.
- *
- * @event value-change
- */
-
- /**
- * Fired when the slider's immediateValue changes.
- *
- * @event immediate-value-change
- */
-
- /**
- * Fired when the slider's value changes due to user interaction.
- *
- * Changes to the slider's value due to changes in an underlying
- * bound variable will not trigger this event.
- *
- * @event change
- */
Polymer({
is: 'paper-slider',
behaviors: [
- Polymer.IronRangeBehavior,
Polymer.IronA11yKeysBehavior,
+ Polymer.PaperInkyFocusBehavior,
Polymer.IronFormElementBehavior,
- Polymer.PaperInkyFocusBehavior
+ Polymer.IronRangeBehavior
],
properties: {
+
/**
* If true, the slider thumb snaps to tick marks evenly spaced based
* on the `step` property value.
@@ -280,7 +234,6 @@ To change the slider disabled secondary progress bar color:
ready: function() {
// issue polymer/polymer#1305
-
this.async(function() {
this._updateKnob(this.value);
this._updateInputValue();
@@ -340,14 +293,12 @@ To change the slider disabled secondary progress bar color:
},
_expandKnob: function() {
- this.$.ink.holdDown = false;
this._setExpand(true);
},
_resetKnob: function() {
this.cancelDebouncer('expandKnob');
this._setExpand(false);
- this.$.ink.hidden = true;
},
_positionKnob: function(ratio) {
@@ -431,10 +382,6 @@ To change the slider disabled secondary progress bar color:
},
_bardown: function(event) {
- this.$.ink.hidden = true;
-
- event.preventDefault();
-
this._w = this.$.sliderBar.offsetWidth;
var rect = this.$.sliderBar.getBoundingClientRect();
var ratio = (event.detail.x - rect.left) / this._w;
@@ -512,5 +459,27 @@ To change the slider disabled secondary progress bar color:
}
this.fire('change');
}
- })
+ });
+
+ /**
+ * Fired when the slider's value changes.
+ *
+ * @event value-change
+ */
+
+ /**
+ * Fired when the slider's immediateValue changes.
+ *
+ * @event immediate-value-change
+ */
+
+ /**
+ * Fired when the slider's value changes due to user interaction.
+ *
+ * Changes to the slider's value due to changes in an underlying
+ * bound variable will not trigger this event.
+ *
+ * @event change
+ */
+
</script>

Powered by Google App Engine
This is Rietveld 408576698