third_party/polymer/v1_0/components-chromium/paper-toggle-button/paper-toggle-button-extracted.js

   1 Polymer({
   2       is: 'paper-toggle-button',
   3
   4       behaviors: [
   5         Polymer.PaperInkyFocusBehavior,
   6         Polymer.IronCheckedElementBehavior
   7       ],
   8
   9       hostAttributes: {
  10         role: 'button',
  11         'aria-pressed': 'false',
  12         tabindex: 0
  13       },
  14
  15       properties: {
  16         /**
  17          * Fired when the checked state changes due to user interaction.
  18          *
  19          * @event change
  20          */
  21         /**
  22          * Fired when the checked state changes.
  23          *
  24          * @event iron-change
  25          */
  26       },
  27
  28       listeners: {
  29         track: '_ontrack'
  30       },
  31
  32       ready: function() {
  33         this._isReady = true;
  34       },
  35
  36       // button-behavior hook
  37       _buttonStateChanged: function() {
  38         if (this.disabled) {
  39           return;
  40         }
  41         if (this._isReady) {
  42           this.checked = this.active;
  43         }
  44       },
  45
  46       _ontrack: function(event) {
  47         var track = event.detail;
  48         if (track.state === 'start') {
  49           this._trackStart(track);
  50         } else if (track.state === 'track') {
  51           this._trackMove(track);
  52         } else if (track.state === 'end') {
  53           this._trackEnd(track);
  54         }
  55       },
  56
  57       _trackStart: function(track) {
  58         this._width = this.$.toggleBar.offsetWidth / 2;
  59         /*
  60          * keep an track-only check state to keep the dragging behavior smooth
  61          * while toggling activations
  62          */
  63         this._trackChecked = this.checked;
  64         this.$.toggleButton.classList.add('dragging');
  65       },
  66
  67       _trackMove: function(track) {
  68         var dx = track.dx;
  69         this._x = Math.min(this._width,
  70             Math.max(0, this._trackChecked ? this._width + dx : dx));
  71         this.translate3d(this._x + 'px', 0, 0, this.$.toggleButton);
  72         this._userActivate(this._x > (this._width / 2));
  73       },
  74
  75       _trackEnd: function(track) {
  76         this.$.toggleButton.classList.remove('dragging');
  77         this.transform('', this.$.toggleButton);
  78       }
  79
  80     });