]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
Merge branch 'master' into center-dropdown-pips 6160/head
authorregdoug <pierce.reginald@gmail.com>
Sat, 14 Feb 2015 15:33:24 +0000 (10:33 -0500)
committerregdoug <pierce.reginald@gmail.com>
Sat, 14 Feb 2015 15:33:24 +0000 (10:33 -0500)
1  2 
js/foundation/foundation.dropdown.js

index 77a35168f0c9d01f900daf07483ab686aa491544,86749d0e3fb9dafe6876173f1050d3761593d042..9ec8d19e8a8ed87d1f7dc2ee1d33a5877ed4c61e
  
          //lets see if the panel will be off the screen
          //get the actual width of the page and store it
-         p.bodyWidth = window.outerWidth;
 -        var actualBodyWidth;
++        p.bodyWidth = window.innerWidth;
          if (document.getElementsByClassName('row')[0]) {
 -          actualBodyWidth = document.getElementsByClassName('row')[0].clientWidth;
 -        } else {
 -          actualBodyWidth = window.innerWidth;
 +          p.bodyWidth = document.getElementsByClassName('row')[0].clientWidth;
          }
  
 -        var actualMarginWidth = (window.innerWidth - actualBodyWidth) / 2;
 -        var actualBoundary = actualBodyWidth;
 -
 -        if (!this.hasClass('mega')) {
 -          //miss top
 -          if (t.offset().top <= this.outerHeight()) {
 -            p.missTop = true;
 -            actualBoundary = window.innerWidth - actualMarginWidth;
 -            p.leftRightFlag = true;
 -          }
 +        return p;
 +      },
  
 +      _position_bottom : function(d,t,s,p) {
 +        if(d.outerWidth() > t.outerWidth()) {
            //miss right
 -          if (t.offset().left + this.outerWidth() > t.offset().left + actualMarginWidth && t.offset().left - actualMarginWidth > this.outerWidth()) {
 -            p.missRight = true;
 -            p.missLeft = false;
 +          if (p.left + d.outerWidth() > p.bodyWidth) {
 +            //miss left
 +            if(p.left - (d.outerWidth() - t.outerWidth()) < 0) {
 +              // set triggered right if the dropdown won't fit inside the first .row
 +              // in either the left or right orientation.
 +              p.triggeredRight = true;
 +              p.missLeft = true;
 +            } else {
 +              p.missRight = true;
 +            }
            }
 +        }
  
 -          //miss left
 -          if (t.offset().left - this.outerWidth() <= 0) {
 -            p.missLeft = true;
 -            p.missRight = false;
 +        if (t.outerWidth() > d.outerWidth() && s.pip == 'center') {
 +          p.offset = (t.outerWidth() - d.outerWidth()) / 2;
 +        }
 +        else if (p.triggeredRight) {
 +          if(d.outerWidth() < p.bodyWidth) {
 +            p.offset = (p.bodyWidth - p.left) - d.outerWidth();
 +          } else {
 +            p.offset = -p.left;
            }
          }
 +        else if (p.missRight || self.rtl) {
 +          p.offset = -d.outerWidth() + t.outerWidth();
 +        } else {
 +          p.offset = 0;
 +        }
  
          return p;
        },
  
        top : function (t, s) {
          var self = Foundation.libs.dropdown,
 -            p = self.dirs._base.call(this, t);
 +            p = self.dirs._base.call(this, t),
 +            offsetTop = -this.outerHeight();
 +
 +        p = self.dirs._position_bottom(this,t,s,p);
  
          this.addClass('drop-top');
-         
 -        if (p.missTop == true) {
 -          p.top = p.top + t.outerHeight() + this.outerHeight();
 +        //miss top
 +        if (t.offset().top <= this.outerHeight()) {
 +          p.missTop = true;
 +          p.leftRightFlag = true;
            this.removeClass('drop-top');
 +          offsetTop = t.outerHeight();
          }
  
 -        if (p.missRight == true) {
 -          p.left = p.left - this.outerWidth() + t.outerWidth();
 -        }
 -
 -        if (t.outerWidth() < this.outerWidth() || self.small() || this.hasClass(s.mega_menu)) {
 -          self.adjust_pip(this, t, s, p);
 -        }
 -
 -        if (Foundation.rtl) {
 -          return {left : p.left - this.outerWidth() + t.outerWidth(),
 -            top : p.top - this.outerHeight()};
 +        if (self.rtl || t.outerWidth() < this.outerWidth() || self.small() || this.hasClass(s.mega_menu)) {
 +          self.adjust_pip(this,t,s,p);
          }
  
 -        return {left : p.left, top : p.top - this.outerHeight()};
 +        return {left : p.left + p.offset, top : p.top + offsetTop};
        },
  
        bottom : function (t, s) {
        },
  
        right : function (t, s) {
 -        var p = Foundation.libs.dropdown.dirs._base.call(this, t);
 +        var self = Foundation.libs.dropdown,
 +            p = self.dirs._base.call(this, t);
 +
 +        p.offset = t.outerWidth();
  
          this.addClass('drop-right');
-         
 -        if (p.missRight == true) {
 -          p.left = p.left - this.outerWidth();
 +        //miss right
 +        if (p.left + this.outerWidth() + t.outerWidth() > p.bodyWidth) {
 +          p.missRight = true;
 +          p.missLeft = false;
            p.top = p.top + t.outerHeight();
            this.removeClass('drop-right');
 +          p = self.dirs._position_bottom(this,t,s,p);
 +          self.adjust_pip(this,t,s,p);
          } else {
            p.triggeredRight = true;
 +          self.adjust_pip_vertical(this,t,s,p);
          }
-     
          var self = Foundation.libs.dropdown;
  
-         return {left : p.left + p.offset, top : p.top};
+         if (t.outerWidth() < this.outerWidth() || self.small() || this.hasClass(s.mega_menu)) {
+           self.adjust_pip(this, t, s, p);
+         }
+         return {left : p.left + t.outerWidth(), top : p.top};
        }
      },
  
      // Insert rule to style psuedo elements
-     adjust_pip : function (dropdown,target,settings,position) {
+     adjust_pip : function (dropdown, target, settings, position) {
        var sheet = Foundation.stylesheet,
-           pip_offset_base = 8 - position.offset;
+           pip_offset_base = 8;
  
        if (dropdown.hasClass(settings.mega_class)) {
 -        pip_offset_base = position.left + (target.outerWidth() / 2) - 8;
 -      } else if (this.small()) {
 -        pip_offset_base += position.left - 8;
 +        pip_offset_base = position.left + (target.outerWidth()/2) - 8;
 +      }
 +      else if (this.small()) {
 +        pip_offset_base = position.left;
 +        if (settings.pip == 'center') {
 +          pip_offset_base += (target.outerWidth()/2) - 15;
 +        }
 +      }
 +      else if (settings.pip == 'center') {
 +        if(target.outerWidth() < dropdown.outerWidth()){
 +          pip_offset_base = (target.outerWidth()/2) - position.offset - 7;
 +        } else {
 +          pip_offset_base = (dropdown.outerWidth()/2) - 7;
 +        }
 +      }
 +      else if (position.missRight) {
 +        pip_offset_base += target.outerWidth() - 30;
        }
  
        this.rule_idx = sheet.cssRules.length;
            sel_after  = '.f-dropdown.open:after',
            css_before = 'left: ' + pip_offset_base + 'px;',
            css_after  = 'left: ' + (pip_offset_base - 1) + 'px;';
-         
 -      if (position.missRight == true) {
 -        pip_offset_base = dropdown.outerWidth() - 23;
 -        sel_before = '.f-dropdown.open:before',
 -        sel_after  = '.f-dropdown.open:after',
 -        css_before = 'left: ' + pip_offset_base + 'px;',
 -        css_after  = 'left: ' + (pip_offset_base - 1) + 'px;';
 +      if (sheet.insertRule) {
 +        sheet.insertRule([sel_before, '{', css_before, '}'].join(' '), this.rule_idx);
 +        sheet.insertRule([sel_after, '{', css_after, '}'].join(' '), this.rule_idx + 1);
 +      } else {
 +        sheet.addRule(sel_before, css_before, this.rule_idx);
 +        sheet.addRule(sel_after, css_after, this.rule_idx + 1);
        }
 +    },
 +
 +    adjust_pip_vertical : function (dropdown,target,settings,position) {
 +      var sheet = Foundation.stylesheet,
 +          pip_offset_base = 10,
 +          pip_halfheight = 14;
  
 -      //just a case where right is fired, but its not missing right
 -      if (position.triggeredRight == true) {
 -        sel_before = '.f-dropdown.open:before',
 -        sel_after  = '.f-dropdown.open:after',
 -        css_before = 'left:-12px;',
 -        css_after  = 'left:-14px;';
 +      if (settings.pip == 'center') {
 +        pip_offset_base = (target.outerHeight() - pip_halfheight) / 2;
        }
  
 +      this.rule_idx = sheet.cssRules.length;
 +
 +      //default
 +      var sel_before = '.f-dropdown.open:before',
 +          sel_after  = '.f-dropdown.open:after',
 +          css_before = 'top: ' + pip_offset_base + 'px;',
 +          css_after  = 'top: ' + (pip_offset_base - 1) + 'px;';
 +        
        if (sheet.insertRule) {
          sheet.insertRule([sel_before, '{', css_before, '}'].join(' '), this.rule_idx);
          sheet.insertRule([sel_after, '{', css_after, '}'].join(' '), this.rule_idx + 1);