From: regdoug Date: Sat, 14 Feb 2015 15:33:24 +0000 (-0500) Subject: Merge branch 'master' into center-dropdown-pips X-Git-Tag: v5.5.2~107^2 X-Git-Url: http://git.ipfire.org/gitweb/?a=commitdiff_plain;h=refs%2Fpull%2F6160%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Merge branch 'master' into center-dropdown-pips --- 9d39bd1cbc04cdcf13dab0151ad9fcd9169d5ad0 diff --cc js/foundation/foundation.dropdown.js index 77a35168f,86749d0e3..9ec8d19e8 --- a/js/foundation/foundation.dropdown.js +++ b/js/foundation/foundation.dropdown.js @@@ -274,71 -274,65 +275,71 @@@ //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) { @@@ -379,55 -369,37 +380,59 @@@ }, 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; @@@ -437,33 -409,23 +442,33 @@@ 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);