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

Side by Side Diff: third_party/polymer/v1_0/components-chromium/paper-ripple/paper-ripple-extracted.js

Issue 2096903002: Revert of [Polymer] update polymer (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 4 years, 6 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 unified diff | Download patch
OLDNEW
1 (function() { 1 (function() {
2 var Utility = { 2 var Utility = {
3 distance: function(x1, y1, x2, y2) { 3 distance: function(x1, y1, x2, y2) {
4 var xDelta = (x1 - x2); 4 var xDelta = (x1 - x2);
5 var yDelta = (y1 - y2); 5 var yDelta = (y1 - y2);
6 6
7 return Math.sqrt(xDelta * xDelta + yDelta * yDelta); 7 return Math.sqrt(xDelta * xDelta + yDelta * yDelta);
8 }, 8 },
9 9
10 now: window.performance && window.performance.now ? 10 now: window.performance && window.performance.now ?
(...skipping 382 matching lines...) Expand 10 before | Expand all | Expand 10 after
393 393
394 _boundAnimate: { 394 _boundAnimate: {
395 type: Function, 395 type: Function,
396 value: function() { 396 value: function() {
397 return this.animate.bind(this); 397 return this.animate.bind(this);
398 } 398 }
399 } 399 }
400 }, 400 },
401 401
402 get target () { 402 get target () {
403 return this.keyEventTarget; 403 var ownerRoot = Polymer.dom(this).getOwnerRoot();
404 var target;
405
406 if (this.parentNode.nodeType == 11) { // DOCUMENT_FRAGMENT_NODE
407 target = ownerRoot.host;
408 } else {
409 target = this.parentNode;
410 }
411
412 return target;
404 }, 413 },
405 414
406 keyBindings: { 415 keyBindings: {
407 'enter:keydown': '_onEnterKeydown', 416 'enter:keydown': '_onEnterKeydown',
408 'space:keydown': '_onSpaceKeydown', 417 'space:keydown': '_onSpaceKeydown',
409 'space:keyup': '_onSpaceKeyup' 418 'space:keyup': '_onSpaceKeyup'
410 }, 419 },
411 420
412 attached: function() { 421 attached: function() {
413 // Set up a11yKeysBehavior to listen to key events on the target, 422 // Set up a11yKeysBehavior to listen to key events on the target,
414 // so that space and enter activate the ripple even if the target doesn' t 423 // so that space and enter activate the ripple even if the target doesn' t
415 // handle key events. The key handlers deal with `noink` themselves. 424 // handle key events. The key handlers deal with `noink` themselves.
416 if (this.parentNode.nodeType == 11) { // DOCUMENT_FRAGMENT_NODE 425 this.keyEventTarget = this.target;
417 this.keyEventTarget = Polymer.dom(this).getOwnerRoot().host; 426 this.listen(this.target, 'up', 'uiUpAction');
418 } else { 427 this.listen(this.target, 'down', 'uiDownAction');
419 this.keyEventTarget = this.parentNode;
420 }
421 var keyEventTarget = /** @type {!EventTarget} */ (this.keyEventTarget);
422 this.listen(keyEventTarget, 'up', 'uiUpAction');
423 this.listen(keyEventTarget, 'down', 'uiDownAction');
424 }, 428 },
425 429
426 detached: function() { 430 detached: function() {
427 this.unlisten(this.keyEventTarget, 'up', 'uiUpAction'); 431 this.unlisten(this.target, 'up', 'uiUpAction');
428 this.unlisten(this.keyEventTarget, 'down', 'uiDownAction'); 432 this.unlisten(this.target, 'down', 'uiDownAction');
429 this.keyEventTarget = null;
430 }, 433 },
431 434
432 get shouldKeepAnimating () { 435 get shouldKeepAnimating () {
433 for (var index = 0; index < this.ripples.length; ++index) { 436 for (var index = 0; index < this.ripples.length; ++index) {
434 if (!this.ripples[index].isAnimationComplete) { 437 if (!this.ripples[index].isAnimationComplete) {
435 return true; 438 return true;
436 } 439 }
437 } 440 }
438 441
439 return false; 442 return false;
(...skipping 27 matching lines...) Expand all
467 downAction: function(event) { 470 downAction: function(event) {
468 if (this.holdDown && this.ripples.length > 0) { 471 if (this.holdDown && this.ripples.length > 0) {
469 return; 472 return;
470 } 473 }
471 474
472 var ripple = this.addRipple(); 475 var ripple = this.addRipple();
473 476
474 ripple.downAction(event); 477 ripple.downAction(event);
475 478
476 if (!this._animating) { 479 if (!this._animating) {
477 this._animating = true;
478 this.animate(); 480 this.animate();
479 } 481 }
480 }, 482 },
481 483
482 /** 484 /**
483 * Provokes a ripple up effect via a UI event, 485 * Provokes a ripple up effect via a UI event,
484 * respecting the `noink` property. 486 * respecting the `noink` property.
485 * @param {Event=} event 487 * @param {Event=} event
486 */ 488 */
487 uiUpAction: function(event) { 489 uiUpAction: function(event) {
488 if (!this.noink) { 490 if (!this.noink) {
489 this.upAction(event); 491 this.upAction(event);
490 } 492 }
491 }, 493 },
492 494
493 /** 495 /**
494 * Provokes a ripple up effect via a UI event, 496 * Provokes a ripple up effect via a UI event,
495 * *not* respecting the `noink` property. 497 * *not* respecting the `noink` property.
496 * @param {Event=} event 498 * @param {Event=} event
497 */ 499 */
498 upAction: function(event) { 500 upAction: function(event) {
499 if (this.holdDown) { 501 if (this.holdDown) {
500 return; 502 return;
501 } 503 }
502 504
503 this.ripples.forEach(function(ripple) { 505 this.ripples.forEach(function(ripple) {
504 ripple.upAction(event); 506 ripple.upAction(event);
505 }); 507 });
506 508
507 this._animating = true;
508 this.animate(); 509 this.animate();
509 }, 510 },
510 511
511 onAnimationComplete: function() { 512 onAnimationComplete: function() {
512 this._animating = false; 513 this._animating = false;
513 this.$.background.style.backgroundColor = null; 514 this.$.background.style.backgroundColor = null;
514 this.fire('transitionend'); 515 this.fire('transitionend');
515 }, 516 },
516 517
517 addRipple: function() { 518 addRipple: function() {
(...skipping 18 matching lines...) Expand all
536 this.ripples.splice(rippleIndex, 1); 537 this.ripples.splice(rippleIndex, 1);
537 538
538 ripple.remove(); 539 ripple.remove();
539 540
540 if (!this.ripples.length) { 541 if (!this.ripples.length) {
541 this._setAnimating(false); 542 this._setAnimating(false);
542 } 543 }
543 }, 544 },
544 545
545 animate: function() { 546 animate: function() {
546 if (!this._animating) {
547 return;
548 }
549 var index; 547 var index;
550 var ripple; 548 var ripple;
551 549
550 this._animating = true;
551
552 for (index = 0; index < this.ripples.length; ++index) { 552 for (index = 0; index < this.ripples.length; ++index) {
553 ripple = this.ripples[index]; 553 ripple = this.ripples[index];
554 554
555 ripple.draw(); 555 ripple.draw();
556 556
557 this.$.background.style.opacity = ripple.outerOpacity; 557 this.$.background.style.opacity = ripple.outerOpacity;
558 558
559 if (ripple.isOpacityFullyDecayed && !ripple.isRestingAtMaxRadius) { 559 if (ripple.isOpacityFullyDecayed && !ripple.isRestingAtMaxRadius) {
560 this.removeRipple(ripple); 560 this.removeRipple(ripple);
561 } 561 }
(...skipping 24 matching lines...) Expand all
586 _holdDownChanged: function(newVal, oldVal) { 586 _holdDownChanged: function(newVal, oldVal) {
587 if (oldVal === undefined) { 587 if (oldVal === undefined) {
588 return; 588 return;
589 } 589 }
590 if (newVal) { 590 if (newVal) {
591 this.downAction(); 591 this.downAction();
592 } else { 592 } else {
593 this.upAction(); 593 this.upAction();
594 } 594 }
595 } 595 }
596
597 /**
598 Fired when the animation finishes.
599 This is useful if you want to wait until
600 the ripple animation finishes to perform some action.
601
602 @event transitionend
603 @param {{node: Object}} detail Contains the animated node.
604 */
605 }); 596 });
606 })(); 597 })();
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698