OLD | NEW |
1 | 1 |
2 | 2 |
3 (function() { | 3 (function() { |
4 | 4 |
5 'use strict'; | 5 'use strict'; |
6 | 6 |
7 function classNames(obj) { | 7 function classNames(obj) { |
8 var classNames = []; | 8 var classNames = []; |
9 for (var key in obj) { | 9 for (var key in obj) { |
10 if (obj.hasOwnProperty(key) && obj[key]) { | 10 if (obj.hasOwnProperty(key) && obj[key]) { |
(...skipping 118 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
129 * Returns true if the panel is in narrow layout. This is useful if you | 129 * Returns true if the panel is in narrow layout. This is useful if you |
130 * need to show/hide elements based on the layout. | 130 * need to show/hide elements based on the layout. |
131 * | 131 * |
132 * @attribute narrow | 132 * @attribute narrow |
133 * @type boolean | 133 * @type boolean |
134 * @default false | 134 * @default false |
135 */ | 135 */ |
136 narrow: { | 136 narrow: { |
137 reflectToAttribute: true, | 137 reflectToAttribute: true, |
138 type: Boolean, | 138 type: Boolean, |
139 value: false | 139 value: false, |
| 140 notify: true |
140 }, | 141 }, |
141 | 142 |
142 // Whether the drawer is peeking out from the edge. | 143 // Whether the drawer is peeking out from the edge. |
143 peeking: { | 144 peeking: { |
144 type: Boolean, | 145 type: Boolean, |
145 value: false | 146 value: false |
146 }, | 147 }, |
147 | 148 |
148 /** | 149 /** |
149 * Max-width when the panel changes to narrow layout. | 150 * Max-width when the panel changes to narrow layout. |
(...skipping 56 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
206 * @type {?number} | 207 * @type {?number} |
207 */ | 208 */ |
208 _startX: { | 209 _startX: { |
209 type: Number, | 210 type: Number, |
210 value: null | 211 value: null |
211 } | 212 } |
212 | 213 |
213 }, | 214 }, |
214 | 215 |
215 listeners: { | 216 listeners: { |
216 click: 'onClick', | 217 tap: '_onTap', |
217 track: 'onTrack' | 218 track: '_onTrack' |
218 | 219 |
219 // TODO: Implement tap handlers when taps are supported. | 220 // TODO: Implement tap handlers when taps are supported. |
220 // | 221 // |
221 // down: 'downHandler', | 222 // down: 'downHandler', |
222 // up: 'upHandler' | 223 // up: 'upHandler' |
223 }, | 224 }, |
224 | 225 |
225 _computeIronSelectorClass: function(narrow, transition, dragging, rightDra
wer) { | 226 _computeIronSelectorClass: function(narrow, transition, dragging, rightDra
wer) { |
226 return classNames({ | 227 return classNames({ |
227 dragging: dragging, | 228 dragging: dragging, |
(...skipping 22 matching lines...) Expand all Loading... |
250 }, | 251 }, |
251 | 252 |
252 _computeMediaQuery: function(forceNarrow, responsiveWidth) { | 253 _computeMediaQuery: function(forceNarrow, responsiveWidth) { |
253 return forceNarrow ? '' : '(max-width: ' + responsiveWidth + ')'; | 254 return forceNarrow ? '' : '(max-width: ' + responsiveWidth + ')'; |
254 }, | 255 }, |
255 | 256 |
256 _computeSwipeOverlayHidden: function(narrow, disableEdgeSwipe) { | 257 _computeSwipeOverlayHidden: function(narrow, disableEdgeSwipe) { |
257 return !narrow || disableEdgeSwipe; | 258 return !narrow || disableEdgeSwipe; |
258 }, | 259 }, |
259 | 260 |
260 onTrack: function(event) { | 261 _onTrack: function(event) { |
261 switch (event.detail.state) { | 262 switch (event.detail.state) { |
262 case 'end': | 263 case 'end': |
263 this.trackEnd(event); | 264 this.trackEnd(event); |
264 break; | 265 break; |
265 case 'move': | 266 case 'move': |
266 this.trackX(event); | 267 this.trackX(event); |
267 break; | 268 break; |
268 case 'start': | 269 case 'start': |
269 this.trackStart(event); | 270 this.trackStart(event); |
270 break; | 271 break; |
(...skipping 71 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
342 this.peeking = true; | 343 this.peeking = true; |
343 }, | 344 }, |
344 | 345 |
345 stopEdgePeek: function() { | 346 stopEdgePeek: function() { |
346 if (this.peeking) { | 347 if (this.peeking) { |
347 this.peeking = false; | 348 this.peeking = false; |
348 this.moveDrawer(null); | 349 this.moveDrawer(null); |
349 } | 350 } |
350 }, | 351 }, |
351 | 352 |
352 // TODO: Implement tap handlers when taps are supported. | 353 _downHandler: function(e) { |
353 // | 354 if (!this.dragging && this._isMainSelected() && this._isEdgeTouch(e)) { |
354 // downHandler: function(e) { | 355 this._startEdgePeek(); |
355 // if (!this.dragging && this.isMainSelected() && this.isEdgeTouch(e)) { | 356 } |
356 // this.startEdgePeek(); | 357 }, |
357 // } | |
358 // }, | |
359 // | |
360 // upHandler: function(e) { | |
361 // this.stopEdgePeek(); | |
362 // }, | |
363 | 358 |
364 onClick: function(e) { | 359 _upHandler: function(e) { |
365 var isTargetToggleElement = e.target && | 360 this._stopEdgePeek(); |
| 361 }, |
| 362 |
| 363 _onTap: function(e) { |
| 364 var targetElement = Polymer.dom(e).localTarget; |
| 365 var isTargetToggleElement = targetElement && |
366 this.drawerToggleAttribute && | 366 this.drawerToggleAttribute && |
367 e.target.hasAttribute(this.drawerToggleAttribute); | 367 targetElement.hasAttribute(this.drawerToggleAttribute); |
368 | 368 |
369 if (isTargetToggleElement) { | 369 if (isTargetToggleElement) { |
370 this.togglePanel(); | 370 this.togglePanel(); |
371 } | 371 } |
372 }, | 372 }, |
373 | 373 |
374 isEdgeTouch: function(event) { | 374 isEdgeTouch: function(event) { |
375 var x = event.detail.x; | 375 var x = event.detail.x; |
376 | 376 |
377 return !this.disableEdgeSwipe && this.swipeAllowed() && | 377 return !this.disableEdgeSwipe && this.swipeAllowed() && |
(...skipping 76 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
454 }, | 454 }, |
455 | 455 |
456 moveDrawer: function(translateX) { | 456 moveDrawer: function(translateX) { |
457 var s = this.$.drawer.style; | 457 var s = this.$.drawer.style; |
458 | 458 |
459 if (this.hasTransform) { | 459 if (this.hasTransform) { |
460 s.transform = this.transformForTranslateX(translateX); | 460 s.transform = this.transformForTranslateX(translateX); |
461 } else { | 461 } else { |
462 s.webkitTransform = this.transformForTranslateX(translateX); | 462 s.webkitTransform = this.transformForTranslateX(translateX); |
463 } | 463 } |
464 }, | |
465 | |
466 onSelect: function(e) { | |
467 e.preventDefault(); | |
468 this.selected = e.detail.selected; | |
469 } | 464 } |
470 | 465 |
471 }); | 466 }); |
472 | 467 |
473 }()); | 468 }()); |
474 | 469 |
OLD | NEW |