third_party/polymer/components-chromium/paper-toast/paper-toast-extracted.js

   1
   2
   3   (function() {
   4
   5     var currentToast;
   6
   7     Polymer('paper-toast', {
   8
   9       /**
  10        * The text shows in a toast.
  11        *
  12        * @attribute text
  13        * @type string
  14        * @default ''
  15        */
  16       text: '',
  17
  18       /**
  19        * The duration in milliseconds to show the toast.
  20        *
  21        * @attribute duration
  22        * @type number
  23        * @default 3000
  24        */
  25       duration: 3000,
  26
  27       /**
  28        * Set opened to true to show the toast and to false to hide it.
  29        *
  30        * @attribute opened
  31        * @type boolean
  32        * @default false
  33        */
  34       opened: false,
  35
  36       /**
  37        * Min-width when the toast changes to narrow layout.  In narrow layout,
  38        * the toast fits at the bottom of the screen when opened.
  39        *
  40        * @attribute responsiveWidth
  41        * @type string
  42        * @default '480px'
  43        */
  44       responsiveWidth: '480px',
  45
  46       /**
  47        * If true, the toast can't be swiped.
  48        *
  49        * @attribute swipeDisabled
  50        * @type boolean
  51        * @default false
  52        */
  53       swipeDisabled: false,
  54
  55       /**
  56        * By default, the toast will close automatically if the user taps
  57        * outside it or presses the escape key. Disable this behavior by setting
  58        * the `autoCloseDisabled` property to true.
  59        *
  60        * @attribute autoCloseDisabled
  61        * @type boolean
  62        * @default false
  63        */
  64       autoCloseDisabled: false,
  65
  66       narrowMode: false,
  67
  68       eventDelegates: {
  69         trackstart: 'trackStart',
  70         track: 'track',
  71         trackend: 'trackEnd',
  72         transitionend: 'transitionEnd'
  73       },
  74
  75       narrowModeChanged: function() {
  76         this.classList.toggle('fit-bottom', this.narrowMode);
  77         if (this.opened) {
  78           this.$.overlay.resizeHandler();
  79         }
  80       },
  81
  82       openedChanged: function() {
  83         if (this.opened) {
  84           this.dismissJob = this.job(this.dismissJob, this.dismiss, this.duration);
  85         } else {
  86           this.dismissJob && this.dismissJob.stop();
  87           this.dismiss();
  88         }
  89       },
  90
  91       /**
  92        * Toggle the opened state of the toast.
  93        * @method toggle
  94        */
  95       toggle: function() {
  96         this.opened = !this.opened;
  97       },
  98
  99       /**
 100        * Show the toast for the specified duration
 101        * @method show
 102        */
 103       show: function() {
 104         if (currentToast) {
 105           currentToast.dismiss();
 106         }
 107         currentToast = this;
 108         this.opened = true;
 109       },
 110
 111       /**
 112        * Dismiss the toast and hide it.
 113        * @method dismiss
 114        */
 115       dismiss: function() {
 116         if (this.dragging) {
 117           this.shouldDismiss = true;
 118         } else {
 119           this.opened = false;
 120           if (currentToast === this) {
 121             currentToast = null;
 122           }
 123         }
 124       },
 125
 126       trackStart: function(e) {
 127         if (!this.swipeDisabled) {
 128           e.preventTap();
 129           this.vertical = e.yDirection;
 130           this.w = this.offsetWidth;
 131           this.h = this.offsetHeight;
 132           this.dragging = true;
 133           this.classList.add('dragging');
 134         }
 135       },
 136
 137       track: function(e) {
 138         if (this.dragging) {
 139           var s = this.style;
 140           if (this.vertical) {
 141             var y = e.dy;
 142             s.opacity = (this.h - Math.abs(y)) / this.h;
 143             s.transform = s.webkitTransform = 'translate3d(0, ' + y + 'px, 0)';
 144           } else {
 145             var x = e.dx;
 146             s.opacity = (this.w - Math.abs(x)) / this.w;
 147             s.transform = s.webkitTransform = 'translate3d(' + x + 'px, 0, 0)';
 148           }
 149         }
 150       },
 151
 152       trackEnd: function(e) {
 153         if (this.dragging) {
 154           this.classList.remove('dragging');
 155           this.style.opacity = '';
 156           this.style.transform = this.style.webkitTransform = '';
 157           var cl = this.classList;
 158           if (this.vertical) {
 159             cl.toggle('fade-out-down', e.yDirection === 1 && e.dy > 0);
 160             cl.toggle('fade-out-up', e.yDirection === -1 && e.dy < 0);
 161           } else {
 162             cl.toggle('fade-out-right', e.xDirection === 1 && e.dx > 0);
 163             cl.toggle('fade-out-left', e.xDirection === -1 && e.dx < 0);
 164           }
 165           this.dragging = false;
 166         }
 167       },
 168
 169       transitionEnd: function() {
 170         var cl = this.classList;
 171         if (cl.contains('fade-out-right') || cl.contains('fade-out-left') ||
 172             cl.contains('fade-out-down') || cl.contains('fade-out-up')) {
 173           this.dismiss();
 174           cl.remove('fade-out-right', 'fade-out-left',
 175               'fade-out-down', 'fade-out-up');
 176         } else if (this.shouldDismiss) {
 177           this.dismiss();
 178         }
 179         this.shouldDismiss = false;
 180       }
 181
 182     });
 183
 184   })();
 185