tbg-foundation-sites
Version:
TBG fork of the most advanced responsive front-end framework in the world.
1 lines • 6.26 kB
JavaScript
"use strict";function _classCallCheck(t,i){if(!(t instanceof i))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function t(t,i){for(var e=0;e<i.length;e++){var n=i[e];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}return function(i,e,n){return e&&t(i.prototype,e),n&&t(i,n),i}}();!function(t){function i(t){return parseInt(window.getComputedStyle(document.body,null).fontSize,10)*t}var e=function(){function e(i,n){_classCallCheck(this,e),this.$element=i,this.options=t.extend({},e.defaults,this.$element.data(),n),this._init(),Foundation.registerPlugin(this,"Sticky")}return _createClass(e,[{key:"_init",value:function(){var i=this.$element.parent("[data-sticky-container]"),e=this.$element[0].id||Foundation.GetYoDigits(6,"sticky"),n=this;i.length||(this.wasWrapped=!0),this.$container=i.length?i:t(this.options.container).wrapInner(this.$element),this.$container.addClass(this.options.containerClass),this.$element.addClass(this.options.stickyClass).attr({"data-resize":e,"data-mutate":e}),""!==this.options.anchor&&t("#"+n.options.anchor).attr({"data-mutate":e}),this.scrollCount=this.options.checkEvery,this.isStuck=!1,t(window).one("load.zf.sticky",function(){n.containerHeight="none"==n.$element.css("display")?0:n.$element[0].getBoundingClientRect().height,n.$container.css("height",n.containerHeight),n.elemHeight=n.containerHeight,""!==n.options.anchor?n.$anchor=t("#"+n.options.anchor):n._parsePoints(),n._setSizes(function(){var t=window.pageYOffset;n._calc(!1,t),n.isStuck||n._removeSticky(!(t>=n.topPoint))}),n._events(e.split("-").reverse().join("-"))})}},{key:"_parsePoints",value:function(){for(var i=""==this.options.topAnchor?1:this.options.topAnchor,e=""==this.options.btmAnchor?document.documentElement.scrollHeight:this.options.btmAnchor,n=[i,e],s={},o=0,a=n.length;o<a&&n[o];o++){var c;if("number"==typeof n[o])c=n[o];else{var h=n[o].split(":"),r=t("#"+h[0]);c=r.offset().top,h[1]&&"bottom"===h[1].toLowerCase()&&(c+=r[0].getBoundingClientRect().height)}s[o]=c}this.points=s}},{key:"_events",value:function(i){var e=this,n=this.scrollListener="scroll.zf."+i;this.isOn||(this.canStick&&(this.isOn=!0,t(window).off(n).on(n,function(t){0===e.scrollCount?(e.scrollCount=e.options.checkEvery,e._setSizes(function(){e._calc(!1,window.pageYOffset)})):(e.scrollCount--,e._calc(!1,window.pageYOffset))})),this.$element.off("resizeme.zf.trigger").on("resizeme.zf.trigger",function(t,n){e._eventsHandler(i)}),this.$element.on("mutateme.zf.trigger",function(t,n){e._eventsHandler(i)}),this.$anchor&&this.$anchor.on("mutateme.zf.trigger",function(t,n){e._eventsHandler(i)}))}},{key:"_eventsHandler",value:function(t){var i=this,e=this.scrollListener="scroll.zf."+t;i._setSizes(function(){i._calc(!1),i.canStick?i.isOn||i._events(t):i.isOn&&i._pauseListeners(e)})}},{key:"_pauseListeners",value:function(i){this.isOn=!1,t(window).off(i),this.$element.trigger("pause.zf.sticky")}},{key:"_calc",value:function(t,i){return t&&this._setSizes(),this.canStick?(i||(i=window.pageYOffset),void(i>=this.topPoint?i<=this.bottomPoint?this.isStuck||this._setSticky():this.isStuck&&this._removeSticky(!1):this.isStuck&&this._removeSticky(!0))):(this.isStuck&&this._removeSticky(!0),!1)}},{key:"_setSticky",value:function(){var t=this,i=this.options.stickTo,e="top"===i?"marginTop":"marginBottom",n="top"===i?"bottom":"top",s={};s[e]=this.options[e]+"em",s[i]=0,s[n]="auto",this.isStuck=!0,this.$element.removeClass("is-anchored is-at-"+n).addClass("is-stuck is-at-"+i).css(s).trigger("sticky.zf.stuckto:"+i),this.$element.on("transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd",function(){t._setSizes()})}},{key:"_removeSticky",value:function(t){var i=this.options.stickTo,e="top"===i,n={},s=(this.points?this.points[1]-this.points[0]:this.anchorHeight)-this.elemHeight,o=e?"marginTop":"marginBottom",a=t?"top":"bottom";n[o]=0,n.bottom="auto",t?n.top=0:n.top=s,this.isStuck=!1,this.$element.removeClass("is-stuck is-at-"+i).addClass("is-anchored is-at-"+a).css(n).trigger("sticky.zf.unstuckfrom:"+a)}},{key:"_setSizes",value:function(t){this.canStick=Foundation.MediaQuery.is(this.options.stickyOn),this.canStick||t&&"function"==typeof t&&t();var i=this.$container[0].getBoundingClientRect().width,e=window.getComputedStyle(this.$container[0]),n=parseInt(e["padding-left"],10),s=parseInt(e["padding-right"],10);this.$anchor&&this.$anchor.length?this.anchorHeight=this.$anchor[0].getBoundingClientRect().height:this._parsePoints(),this.$element.css({"max-width":i-n-s+"px"});var o=this.$element[0].getBoundingClientRect().height||this.containerHeight;if("none"==this.$element.css("display")&&(o=0),this.containerHeight=o,this.$container.css({height:o}),this.elemHeight=o,!this.isStuck&&this.$element.hasClass("is-at-bottom")){var a=(this.points?this.points[1]-this.$container.offset().top:this.anchorHeight)-this.elemHeight;this.$element.css("top",a)}this._setBreakPoints(o,function(){t&&"function"==typeof t&&t()})}},{key:"_setBreakPoints",value:function(t,e){if(!this.canStick){if(!e||"function"!=typeof e)return!1;e()}var n=i(this.options.marginTop),s=i(this.options.marginBottom),o=this.points?this.points[0]:this.$anchor.offset().top,a=this.points?this.points[1]:o+this.anchorHeight,c=window.innerHeight;"top"===this.options.stickTo?(o-=n,a-=t+n):"bottom"===this.options.stickTo&&(o-=c-(t+s),a-=c-s),this.topPoint=o,this.bottomPoint=a,e&&"function"==typeof e&&e()}},{key:"destroy",value:function(){this._removeSticky(!0),this.$element.removeClass(this.options.stickyClass+" is-anchored is-at-top").css({height:"",top:"",bottom:"","max-width":""}).off("resizeme.zf.trigger").off("mutateme.zf.trigger"),this.$anchor&&this.$anchor.length&&this.$anchor.off("change.zf.sticky"),t(window).off(this.scrollListener),this.wasWrapped?this.$element.unwrap():this.$container.removeClass(this.options.containerClass).css({height:""}),Foundation.unregisterPlugin(this)}}]),e}();e.defaults={container:"<div data-sticky-container></div>",stickTo:"top",anchor:"",topAnchor:"",btmAnchor:"",marginTop:1,marginBottom:1,stickyOn:"medium",stickyClass:"sticky",containerClass:"sticky-container",checkEvery:-1},Foundation.plugin(e,"Sticky")}(jQuery);