Home | History | Annotate | Download | only in paper-tabs
      1 
      2 
      3   Polymer('paper-tabs', {
      4     
      5     /**
      6      * If true, ink effect is disabled.
      7      *
      8      * @attribute noink
      9      * @type boolean
     10      * @default false
     11      */
     12     noink: false,
     13     
     14     /**
     15      * If true, the bottom bar to indicate the selected tab will not be shown.
     16      *
     17      * @attribute nobar
     18      * @type boolean
     19      * @default false
     20      */
     21     nobar: false,
     22     
     23     activateEvent: 'down',
     24     
     25     nostretch: false,
     26     
     27     selectedIndexChanged: function(old) {
     28       var s = this.$.selectionBar.style;
     29       
     30       if (!this.selectedItem) {
     31         s.width = 0;
     32         s.left = 0;
     33         return;
     34       } 
     35       
     36       var w = 100 / this.items.length;
     37       
     38       if (this.nostretch || old === null || old === -1) {
     39         s.width = w + '%';
     40         s.left = this.selectedIndex * w + '%';
     41         return;
     42       }
     43       
     44       var m = 5;
     45       this.$.selectionBar.classList.add('expand');
     46       if (old < this.selectedIndex) {
     47         s.width = w + w * (this.selectedIndex - old) - m + '%';
     48       } else {
     49         s.width = w + w * (old - this.selectedIndex) - m + '%';
     50         s.left = this.selectedIndex * w + m + '%';
     51       }
     52     },
     53     
     54     barTransitionEnd: function() {
     55       var cl = this.$.selectionBar.classList;
     56       if (cl.contains('expand')) {
     57         cl.remove('expand');
     58         cl.add('contract');
     59         var s = this.$.selectionBar.style;
     60         var w = 100 / this.items.length;
     61         s.width = w + '%';
     62         s.left = this.selectedIndex * w + '%';
     63       } else if (cl.contains('contract')) {
     64         cl.remove('contract');
     65       }
     66     }
     67     
     68   });
     69   
     70