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

Unified Diff: third_party/polymer/v0_8/components/iron-collapse/iron-collapse.html

Issue 1162563004: Upgrade to 1.0 and switch clients to dom-repeat where needed. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fix a layout import and remove the gzipped webanimation in reproduce.sh Created 5 years, 7 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/v0_8/components/iron-collapse/iron-collapse.html
diff --git a/third_party/polymer/v0_8/components/iron-collapse/iron-collapse.html b/third_party/polymer/v0_8/components/iron-collapse/iron-collapse.html
index 7962870e44690487d0b2ee6c40997e8c21b2eca0..3821c286e117cfb59da48165ba69283c88270cce 100644
--- a/third_party/polymer/v0_8/components/iron-collapse/iron-collapse.html
+++ b/third_party/polymer/v0_8/components/iron-collapse/iron-collapse.html
@@ -43,7 +43,9 @@ and instead put a div inside and style that.
</div>
</iron-collapse>
-@group Polymer Core Elements
+@group Iron Elements
+@hero hero.svg
+@demo demo/index.html
@element iron-collapse
-->
@@ -86,33 +88,35 @@ and instead put a div inside and style that.
* If true, the orientation is horizontal; otherwise is vertical.
*
* @attribute horizontal
- * @type Boolean
- * @default false
*/
horizontal: {
type: Boolean,
value: false,
- observer: 'horizontalChanged'
+ observer: '_horizontalChanged'
},
/**
* Set opened to true to show the collapse element and to false to hide it.
*
* @attribute opened
- * @type Boolean
- * @default false
*/
opened: {
type: Boolean,
value: false,
notify: true,
- observer: 'openedChanged'
+ observer: '_openedChanged'
}
},
+ hostAttributes: {
+ role: 'group',
+ 'aria-expanded': 'false',
+ tabindex: 0
+ },
+
listeners: {
- transitionend: 'transitionEnd'
+ transitionend: '_transitionEnd'
},
ready: function() {
@@ -121,15 +125,6 @@ and instead put a div inside and style that.
this._enableTransition = true;
},
- horizontalChanged: function() {
- this.dimension = this.horizontal ? 'width' : 'height';
- this.style.transitionProperty = this.dimension;
- },
-
- openedChanged: function() {
- this[this.opened ? 'show' : 'hide']();
- },
-
/**
* Toggle the opened state.
*
@@ -142,7 +137,7 @@ and instead put a div inside and style that.
show: function() {
this.toggleClass('iron-collapse-closed', false);
this.updateSize('auto', false);
- var s = this.calcSize();
+ var s = this._calcSize();
this.updateSize('0px', false);
// force layout to ensure transition will go
this.offsetHeight;
@@ -151,7 +146,7 @@ and instead put a div inside and style that.
hide: function() {
this.toggleClass('iron-collapse-opened', false);
- this.updateSize(this.calcSize(), false);
+ this.updateSize(this._calcSize(), false);
// force layout to ensure transition will go
this.offsetHeight;
this.updateSize('0px', true);
@@ -163,26 +158,38 @@ and instead put a div inside and style that.
var nochange = s[this.dimension] === size;
s[this.dimension] = size;
if (animated && nochange) {
- this.transitionEnd();
+ this._transitionEnd();
}
},
- calcSize: function() {
- return this.getBoundingClientRect()[this.dimension] + 'px';
- },
-
enableTransition: function(enabled) {
this.style.transitionDuration = (enabled && this._enableTransition) ? '' : '0s';
},
- transitionEnd: function() {
+ _horizontalChanged: function() {
+ this.dimension = this.horizontal ? 'width' : 'height';
+ this.style.transitionProperty = this.dimension;
+ },
+
+ _openedChanged: function() {
+ this[this.opened ? 'show' : 'hide']();
+ this.setAttribute('aria-expanded', this.opened ? 'true' : 'false');
+
+ },
+
+ _transitionEnd: function() {
if (this.opened) {
this.updateSize('auto', false);
}
this.toggleClass('iron-collapse-closed', !this.opened);
this.toggleClass('iron-collapse-opened', this.opened);
this.enableTransition(false);
- }
+ },
+
+ _calcSize: function() {
+ return this.getBoundingClientRect()[this.dimension] + 'px';
+ },
+
});

Powered by Google App Engine
This is Rietveld 408576698