Home | History | Annotate | Download | only in paper-menu-button 
      1 
      2     Polymer('paper-menu-button-overlay', {
      3 
      4       publish: {
      5 
      6         /**
      7          * The `relatedTarget` is an element used to position the overlay, for example a
      8          * button the user taps to show a menu.
      9          *
     10          * @attribute relatedTarget
     11          * @type Element
     12          */
     13         relatedTarget: null,
     14 
     15         /**
     16          * The horizontal alignment of the overlay relative to the `relatedTarget`.
     17          *
     18          * @attribute halign
     19          * @type 'left'|'right'|'center'
     20          * @default 'left'
     21          */
     22         halign: 'left'
     23 
     24       },
     25 
     26       updateTargetDimensions: function() {
     27         this.super();
     28 
     29         var t = this.target;
     30         this.target.cachedSize = t.getBoundingClientRect();
     31       },
     32 
     33       positionTarget: function() {
     34         if (this.relatedTarget) {
     35 
     36           var rect = this.relatedTarget.getBoundingClientRect();
     37 
     38           if (this.halign === 'left') {
     39             this.target.style.left = rect.left + 'px';
     40           } else if (this.halign === 'right') {
     41             this.target.style.right = (window.innerWidth - rect.right) + 'px';
     42           } else {
     43             this.target.style.left = (rect.left - (rect.width - this.target.cachedSize.width) / 2) + 'px';
     44           }
     45 
     46           if (this.valign === 'top') {
     47             this.target.style.top = rect.top + 'px';
     48           } else if (this.valign === 'bottom') {
     49             this.target.style.top = rect.bottom + 'px';
     50           } else {
     51             this.target.style.top = rect.top + 'px';
     52           }
     53 
     54           // this.target.style.top = rect.top + 'px';
     55 
     56         } else {
     57           this.super();
     58         }
     59       }
     60 
     61     });
     62