From 75151c78a631dcefad9b544f948b3b29e290359f Mon Sep 17 00:00:00 2001 From: tomByrer Date: Tue, 30 Sep 2014 18:39:52 -0600 Subject: [PATCH 01/28] + jsDelivr CDN info [jsDelivr CDN hosting](http://www.jsdelivr.com/#!jquery.midnight) is live. Seem instructions are best in the README for you, since that is where you put advanced usage. Push a new [release](https://github.com/Aerolab/midnight.js/releases/), & it should appear on jsDelivr in about 15 minutes. --- README.md | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f73dfbf..9b97bde 100644 --- a/README.md +++ b/README.md @@ -116,8 +116,22 @@ $('nav').midnight({ }); ``` +## CDN Hosting + +To lower hosting costs & have users load midnight.js faster, you can use the [jsDelivr CDN](http://www.jsdelivr.com/#!jquery.midnight) like so: +```htm + +``` + +### Advanced + +You can use jsDelivr's [version aliasing & concocting](https://github.com/jsdelivr/jsdelivr#version-aliasing) to serve the latest minor branch version along with dependancies. For example, to download the latest patch versions of midnight.js v1.0.z together along with jQuery v1.11.z: +```htm + +``` + ## Known Issues On iOS <7 and older Android devices scrollTop isn't updated fluently, which creates a choppy effect. It can be fixed somewhat by wrapping the body in container and detecting touch events, but we're leaving that as an open issue. We'll probably disable the effect on older mobile devices due to bad performance. -You shouldn't add any sort of padding, margin or offset (top/left/right/bottom) to the nav, since it causes issues with rendering. \ No newline at end of file +You shouldn't add any sort of padding, margin or offset (top/left/right/bottom) to the nav, since it causes issues with rendering. From dbf358d926146de9cd6c63e9ea73353056346d5d Mon Sep 17 00:00:00 2001 From: suzuki_yudai Date: Wed, 1 Oct 2014 21:52:43 +0900 Subject: [PATCH 02/28] mod simple gulp file --- gulpfile.js | 16 +++++----------- midnight.jquery.min.js | 2 +- 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/gulpfile.js b/gulpfile.js index 2f16434..972ba09 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -12,20 +12,14 @@ var getCopyright = function () { return fs.readFileSync('Copyright'); }; -gulp.task('buildfromsrc', function () { +gulp.task('build', function () { gulp.src('./midnight.jquery.src.js') .pipe(header(getCopyright(), {version: getVersion()})) .pipe(concat('midnight.jquery.js')) - .pipe(gulp.dest('')); -}); - -// task -gulp.task('minifyjs', function () { - gulp.src('./midnight.jquery.js') - .pipe(uglify()) - .pipe(header(getCopyright(), {version: getVersion()})) + .pipe(gulp.dest('./')) + .pipe(uglify({preserveComments:'some'})) .pipe(concat('midnight.jquery.min.js')) - .pipe(gulp.dest('')); + .pipe(gulp.dest('./')); }); -gulp.task('default', ['buildfromsrc', 'minifyjs']); \ No newline at end of file +gulp.task('default', ['build']); diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 7b60d4b..80ceb08 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ - !function(e){e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default"};e.extend(s,t);var a=window.pageYOffset||document.documentElement.scrollTop,n=e(document).height(),r=e(this),o={},l={top:0,height:r.outerHeight()},d=e("[data-midnight]"),f=[],h=function(){for(var e="transform WebkitTransform MozTransform OTransform msTransform".split(" "),t=0;t ."+s.headerClass),a=0,n=0;return t.length?t.each(function(){var t=e(this),i=t.find("> ."+s.innerClass);i.length?(i.css("bottom","auto"),n=i.outerHeight(),i.css("bottom","0")):(t.css("bottom","auto"),n=t.outerHeight(),t.css("bottom","0")),a=n>a?n:a}):a=n=r.outerHeight(),a},u=function(){l.height=c(),r.css("height",l.height+"px")},g=function(){o["default"]={},d.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:r.css("padding-top"),right:r.css("padding-right"),bottom:r.css("padding-bottom"),left:r.css("padding-left")});r.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),u();var t=r.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):r.wrapInner('
');var t=r.find("> ."+s.headerClass),a=t.filter("."+s.defaultClass).clone(!0,!0);for(headerClass in o)if("undefined"==typeof o[headerClass].element){var n=t.filter("."+headerClass);o[headerClass].element=n.length?n:a.clone(!0,!0).removeClass(s.defaultClass).addClass(headerClass).appendTo(r);var i={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[headerClass].element.css(i),m!==!1&&o[headerClass].element.css(m,"translateZ(0)"),o[headerClass].element.find("> ."+s.innerClass).length||o[headerClass].element.wrapInner('
'),o[headerClass].inner=o[headerClass].element.find("> ."+s.innerClass),o[headerClass].inner.css(i),m!==!1&&o[headerClass].inner.css(m,"translateZ(0)"),o[headerClass].from="",o[headerClass].progress=0}t.each(function(){var t=e(this),a=!1;for(headerClass in o)t.hasClass(headerClass)&&(a=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),a||t.hide()})};g();var p=function(){for(n=e(document).height(),f=[],i=0;i=f[ix].start&&t<=f[ix].end&&(o[f[ix].class].visible=!0,t>=f[ix].start&&s<=f[ix].end?(o[f[ix].class].from="top",o[f[ix].class].progress+=1):s>f[ix].end&&tf[ix].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(ix in o)if(""!==!o[ix].from){var a=100*(1-o[ix].progress);"top"===o[ix].from?m!==!1?(o[ix].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[ix].element[0].style.top="-"+a+"%",o[ix].inner[0].style.top="+"+a+"%"):m!==!1?(o[ix].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[ix].element.style.top="+"+a+"%",o[ix].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),u(),x(),C()}).trigger("resize"),requestAnimationFrame=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}();var v=function(){requestAnimationFrame(v),x(),C()};v()}})}}(jQuery); \ No newline at end of file +!function(e){e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default"};e.extend(s,t);var a=window.pageYOffset||document.documentElement.scrollTop,n=e(document).height(),r=e(this),o={},l={top:0,height:r.outerHeight()},d=e("[data-midnight]"),f=[],h=function(){for(var e="transform WebkitTransform MozTransform OTransform msTransform".split(" "),t=0;t ."+s.headerClass),a=0,n=0;return t.length?t.each(function(){var t=e(this),i=t.find("> ."+s.innerClass);i.length?(i.css("bottom","auto"),n=i.outerHeight(),i.css("bottom","0")):(t.css("bottom","auto"),n=t.outerHeight(),t.css("bottom","0")),a=n>a?n:a}):a=n=r.outerHeight(),a},u=function(){l.height=c(),r.css("height",l.height+"px")},g=function(){o["default"]={},d.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:r.css("padding-top"),right:r.css("padding-right"),bottom:r.css("padding-bottom"),left:r.css("padding-left")});r.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),u();var t=r.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):r.wrapInner('
');var t=r.find("> ."+s.headerClass),a=t.filter("."+s.defaultClass).clone(!0,!0);for(headerClass in o)if("undefined"==typeof o[headerClass].element){var n=t.filter("."+headerClass);o[headerClass].element=n.length?n:a.clone(!0,!0).removeClass(s.defaultClass).addClass(headerClass).appendTo(r);var i={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[headerClass].element.css(i),m!==!1&&o[headerClass].element.css(m,"translateZ(0)"),o[headerClass].element.find("> ."+s.innerClass).length||o[headerClass].element.wrapInner('
'),o[headerClass].inner=o[headerClass].element.find("> ."+s.innerClass),o[headerClass].inner.css(i),m!==!1&&o[headerClass].inner.css(m,"translateZ(0)"),o[headerClass].from="",o[headerClass].progress=0}t.each(function(){var t=e(this),a=!1;for(headerClass in o)t.hasClass(headerClass)&&(a=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),a||t.hide()})};g();var p=function(){for(n=e(document).height(),f=[],i=0;i=f[ix].start&&t<=f[ix].end&&(o[f[ix].class].visible=!0,t>=f[ix].start&&s<=f[ix].end?(o[f[ix].class].from="top",o[f[ix].class].progress+=1):s>f[ix].end&&tf[ix].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(ix in o)if(""!==!o[ix].from){var a=100*(1-o[ix].progress);"top"===o[ix].from?m!==!1?(o[ix].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[ix].element[0].style.top="-"+a+"%",o[ix].inner[0].style.top="+"+a+"%"):m!==!1?(o[ix].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[ix].element.style.top="+"+a+"%",o[ix].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),u(),x(),C()}).trigger("resize"),requestAnimationFrame=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}();var v=function(){requestAnimationFrame(v),x(),C()};v()}})}}(jQuery); \ No newline at end of file From a299d2bf54b9469b900c347289dfd5df05216233 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonz=C3=A1lez?= Date: Wed, 29 Oct 2014 01:06:53 -0300 Subject: [PATCH 03/28] Addresses issues #22 and #18 with strict mode and tidier loops. --- midnight.jquery.js | 48 +++++++++++++++++++++++------------------- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 48 +++++++++++++++++++++++------------------- 3 files changed, 53 insertions(+), 45 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 4a717fe..b5042a0 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -10,6 +10,8 @@ */ ((function ( $ ) { + "use strict"; + $.fn.midnight = function( customOptions ) { if( typeof customOptions !== "object" ) { @@ -26,10 +28,8 @@ innerClass: 'midnightInner', // The class used by the default header (useful when adding multiple headers with different markup). defaultClass: 'default', - /* - // Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) + // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) classPrefix: '' - */ }; $.extend(settings, customOptions); @@ -55,10 +55,10 @@ var sections = []; var getSupportedTransform = function() { - var prefixes = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' '); - for(var i = 0; i < prefixes.length; i++) { - if(document.createElement('div').style[prefixes[i]] !== undefined) { - return prefixes[i]; + var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; + for(var ix = 0; ix < prefixes.length; ix++) { + if(document.createElement('div').style[prefixes[ix]] !== undefined) { + return prefixes[ix]; } } return false; @@ -166,7 +166,8 @@ - for( headerClass in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } if( typeof headers[headerClass].element === 'undefined' ) { // Create the outer clipping mask @@ -214,7 +215,8 @@ $customHeaders.each(function(){ var $header = $(this); var hasAnyClass = false; - for( headerClass in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } if( $header.hasClass(headerClass) ){ hasAnyClass = true; } } @@ -238,8 +240,8 @@ // Cache all the sections and their start/end positions (where the class starts and ends) sections = []; - for( i=0; i<$sections.length; i++ ) { - var $section = $($sections[i]); + for( var ix=0; ix<$sections.length; ix++ ) { + var $section = $($sections[ix]); sections.push({ element: $section, @@ -271,14 +273,15 @@ var headerEnd = scrollTop + headerInfo.top + headerHeight; // Reset the header status - for( ix in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } // from == '' signals that the section is inactive - headers[ ix ].from = ''; - headers[ ix ].progress = 0.0; + headers[ headerClass ].from = ''; + headers[ headerClass ].progress = 0.0; } // Set the header status - for( ix in sections ) { + for( var ix = 0; ix < sections.length; ix++ ) { // Todo: This isn't exactly the best code. @@ -325,10 +328,11 @@ // Do some preprocessing to ensure a header is always shown (even if some sections haven't been assigned) var totalProgress = 0.0; var lastActiveClass = ''; - for( ix in headers ) { - if( ! headers[ix].from === '' ){ continue; } - totalProgress += headers[ix].progress; - lastActiveClass = ix; + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } + if( ! headers[headerClass].from === '' ){ continue; } + totalProgress += headers[headerClass].progress; + lastActiveClass = headerClass; } @@ -344,8 +348,8 @@ } - for( ix in headers ) { - + for( var ix in headers ) { + if( ! headers.hasOwnProperty(ix) ){ continue; } if( ! headers[ix].from === '' ){ continue; } var offset = (1.0 - headers[ix].progress) * 100.0; @@ -388,7 +392,7 @@ // This works using requestAnimationFrame for better compatibility with iOS/Android - requestAnimationFrame = window.requestAnimationFrame || (function(){ + var requestAnimationFrame = window.requestAnimationFrame || (function(){ return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 7b60d4b..2164165 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ - !function(e){e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default"};e.extend(s,t);var a=window.pageYOffset||document.documentElement.scrollTop,n=e(document).height(),r=e(this),o={},l={top:0,height:r.outerHeight()},d=e("[data-midnight]"),f=[],h=function(){for(var e="transform WebkitTransform MozTransform OTransform msTransform".split(" "),t=0;t ."+s.headerClass),a=0,n=0;return t.length?t.each(function(){var t=e(this),i=t.find("> ."+s.innerClass);i.length?(i.css("bottom","auto"),n=i.outerHeight(),i.css("bottom","0")):(t.css("bottom","auto"),n=t.outerHeight(),t.css("bottom","0")),a=n>a?n:a}):a=n=r.outerHeight(),a},u=function(){l.height=c(),r.css("height",l.height+"px")},g=function(){o["default"]={},d.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:r.css("padding-top"),right:r.css("padding-right"),bottom:r.css("padding-bottom"),left:r.css("padding-left")});r.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),u();var t=r.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):r.wrapInner('
');var t=r.find("> ."+s.headerClass),a=t.filter("."+s.defaultClass).clone(!0,!0);for(headerClass in o)if("undefined"==typeof o[headerClass].element){var n=t.filter("."+headerClass);o[headerClass].element=n.length?n:a.clone(!0,!0).removeClass(s.defaultClass).addClass(headerClass).appendTo(r);var i={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[headerClass].element.css(i),m!==!1&&o[headerClass].element.css(m,"translateZ(0)"),o[headerClass].element.find("> ."+s.innerClass).length||o[headerClass].element.wrapInner('
'),o[headerClass].inner=o[headerClass].element.find("> ."+s.innerClass),o[headerClass].inner.css(i),m!==!1&&o[headerClass].inner.css(m,"translateZ(0)"),o[headerClass].from="",o[headerClass].progress=0}t.each(function(){var t=e(this),a=!1;for(headerClass in o)t.hasClass(headerClass)&&(a=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),a||t.hide()})};g();var p=function(){for(n=e(document).height(),f=[],i=0;i=f[ix].start&&t<=f[ix].end&&(o[f[ix].class].visible=!0,t>=f[ix].start&&s<=f[ix].end?(o[f[ix].class].from="top",o[f[ix].class].progress+=1):s>f[ix].end&&tf[ix].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(ix in o)if(""!==!o[ix].from){var a=100*(1-o[ix].progress);"top"===o[ix].from?m!==!1?(o[ix].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[ix].element[0].style.top="-"+a+"%",o[ix].inner[0].style.top="+"+a+"%"):m!==!1?(o[ix].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[ix].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[ix].element.style.top="+"+a+"%",o[ix].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),u(),x(),C()}).trigger("resize"),requestAnimationFrame=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}();var v=function(){requestAnimationFrame(v),x(),C()};v()}})}}(jQuery); \ No newline at end of file + !function(e){"use strict";e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""};e.extend(s,t);var n=window.pageYOffset||document.documentElement.scrollTop,r=e(document).height(),a=e(this),o={},i={top:0,height:a.outerHeight()},l=e("[data-midnight]"),f=[],d=function(){for(var e=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],t=0;t ."+s.headerClass),n=0,r=0;return t.length?t.each(function(){var t=e(this),a=t.find("> ."+s.innerClass);a.length?(a.css("bottom","auto"),r=a.outerHeight(),a.css("bottom","0")):(t.css("bottom","auto"),r=t.outerHeight(),t.css("bottom","0")),n=r>n?r:n}):n=r=a.outerHeight(),n},c=function(){i.height=h(),a.css("height",i.height+"px")},u=function(){o["default"]={},l.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:a.css("padding-top"),right:a.css("padding-right"),bottom:a.css("padding-bottom"),left:a.css("padding-left")});a.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),c();var t=a.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):a.wrapInner('
');var t=a.find("> ."+s.headerClass),n=t.filter("."+s.defaultClass).clone(!0,!0);for(var r in o)if(o.hasOwnProperty(r)&&"undefined"==typeof o[r].element){var i=t.filter("."+r);o[r].element=i.length?i:n.clone(!0,!0).removeClass(s.defaultClass).addClass(r).appendTo(a);var f={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[r].element.css(f),m!==!1&&o[r].element.css(m,"translateZ(0)"),o[r].element.find("> ."+s.innerClass).length||o[r].element.wrapInner('
'),o[r].inner=o[r].element.find("> ."+s.innerClass),o[r].inner.css(f),m!==!1&&o[r].inner.css(m,"translateZ(0)"),o[r].from="",o[r].progress=0}t.each(function(){var t=e(this),n=!1;for(var r in o)o.hasOwnProperty(r)&&t.hasClass(r)&&(n=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),n||t.hide()})};u();var p=function(){r=e(document).height(),f=[];for(var t=0;t=f[l].start&&t<=f[l].end&&(o[f[l].class].visible=!0,t>=f[l].start&&s<=f[l].end?(o[f[l].class].from="top",o[f[l].class].progress+=1):s>f[l].end&&tf[l].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(var r in o)if(o.hasOwnProperty(r)&&""!==!o[r].from){var a=100*(1-o[r].progress);"top"===o[r].from?m!==!1?(o[r].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[r].element[0].style.top="-"+a+"%",o[r].inner[0].style.top="+"+a+"%"):m!==!1?(o[r].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[r].element.style.top="+"+a+"%",o[r].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),c(),g(),v()}).trigger("resize");var w=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),C=function(){w(C),g(),v()};C()}})}}(jQuery); \ No newline at end of file diff --git a/midnight.jquery.src.js b/midnight.jquery.src.js index 09bcaf3..cdf0943 100644 --- a/midnight.jquery.src.js +++ b/midnight.jquery.src.js @@ -1,5 +1,7 @@ ((function ( $ ) { + "use strict"; + $.fn.midnight = function( customOptions ) { if( typeof customOptions !== "object" ) { @@ -16,10 +18,8 @@ innerClass: 'midnightInner', // The class used by the default header (useful when adding multiple headers with different markup). defaultClass: 'default', - /* - // Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) + // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) classPrefix: '' - */ }; $.extend(settings, customOptions); @@ -45,10 +45,10 @@ var sections = []; var getSupportedTransform = function() { - var prefixes = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' '); - for(var i = 0; i < prefixes.length; i++) { - if(document.createElement('div').style[prefixes[i]] !== undefined) { - return prefixes[i]; + var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; + for(var ix = 0; ix < prefixes.length; ix++) { + if(document.createElement('div').style[prefixes[ix]] !== undefined) { + return prefixes[ix]; } } return false; @@ -156,7 +156,8 @@ - for( headerClass in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } if( typeof headers[headerClass].element === 'undefined' ) { // Create the outer clipping mask @@ -204,7 +205,8 @@ $customHeaders.each(function(){ var $header = $(this); var hasAnyClass = false; - for( headerClass in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } if( $header.hasClass(headerClass) ){ hasAnyClass = true; } } @@ -228,8 +230,8 @@ // Cache all the sections and their start/end positions (where the class starts and ends) sections = []; - for( i=0; i<$sections.length; i++ ) { - var $section = $($sections[i]); + for( var ix=0; ix<$sections.length; ix++ ) { + var $section = $($sections[ix]); sections.push({ element: $section, @@ -261,14 +263,15 @@ var headerEnd = scrollTop + headerInfo.top + headerHeight; // Reset the header status - for( ix in headers ) { + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } // from == '' signals that the section is inactive - headers[ ix ].from = ''; - headers[ ix ].progress = 0.0; + headers[ headerClass ].from = ''; + headers[ headerClass ].progress = 0.0; } // Set the header status - for( ix in sections ) { + for( var ix = 0; ix < sections.length; ix++ ) { // Todo: This isn't exactly the best code. @@ -315,10 +318,11 @@ // Do some preprocessing to ensure a header is always shown (even if some sections haven't been assigned) var totalProgress = 0.0; var lastActiveClass = ''; - for( ix in headers ) { - if( ! headers[ix].from === '' ){ continue; } - totalProgress += headers[ix].progress; - lastActiveClass = ix; + for( var headerClass in headers ) { + if( ! headers.hasOwnProperty(headerClass) ){ continue; } + if( ! headers[headerClass].from === '' ){ continue; } + totalProgress += headers[headerClass].progress; + lastActiveClass = headerClass; } @@ -334,8 +338,8 @@ } - for( ix in headers ) { - + for( var ix in headers ) { + if( ! headers.hasOwnProperty(ix) ){ continue; } if( ! headers[ix].from === '' ){ continue; } var offset = (1.0 - headers[ix].progress) * 100.0; @@ -378,7 +382,7 @@ // This works using requestAnimationFrame for better compatibility with iOS/Android - requestAnimationFrame = window.requestAnimationFrame || (function(){ + var requestAnimationFrame = window.requestAnimationFrame || (function(){ return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || From 8b19efa061acee95e5aef1ce5115e4b4d12fb4c6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonz=C3=A1lez?= Date: Wed, 29 Oct 2014 01:14:20 -0300 Subject: [PATCH 04/28] Should address #17 --- midnight.jquery.js | 20 ++++++++++---------- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 20 ++++++++++---------- 3 files changed, 21 insertions(+), 21 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index b5042a0..12a6f8a 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -245,7 +245,7 @@ sections.push({ element: $section, - class: $section.data('midnight'), + className: $section.data('midnight'), start: $section.offset().top, end: $section.offset().top + $section.outerHeight() }); @@ -288,27 +288,27 @@ // If there's some kind of overlap between the header and a section, that class becomes active if( headerEnd >= sections[ix].start && headerStart <= sections[ix].end ) { - headers[ sections[ix].class ].visible = true; + headers[ sections[ix].className ].visible = true; // If the header sits neatly within the section, this is the only active class if( headerStart >= sections[ix].start && headerEnd <= sections[ix].end ) { - headers[ sections[ix].class ].from = 'top'; - headers[ sections[ix].class ].progress += 1.0; + headers[ sections[ix].className ].from = 'top'; + headers[ sections[ix].className ].progress += 1.0; } // If the header is in the middle of the end of a section, it comes from the top else if( headerEnd > sections[ix].end && headerStart < sections[ix].end ) { - headers[ sections[ix].class ].from = 'top'; - headers[ sections[ix].class ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; + headers[ sections[ix].className ].from = 'top'; + headers[ sections[ix].className ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; } // If the header is in the middle of the start of a section, it comes from the bottom else if( headerEnd > sections[ix].start && headerStart < sections[ix].start ) { // If the same color continues in the next section, just add the progress to it so we don't switch - if( headers[ sections[ix].class ].from === 'top' ) { - headers[ sections[ix].class ].progress += (headerEnd - sections[ix].start) / headerHeight; + if( headers[ sections[ix].className ].from === 'top' ) { + headers[ sections[ix].className ].progress += (headerEnd - sections[ix].start) / headerHeight; } else { - headers[ sections[ix].class ].from = 'bottom'; - headers[ sections[ix].class ].progress = (headerEnd - sections[ix].start) / headerHeight; + headers[ sections[ix].className ].from = 'bottom'; + headers[ sections[ix].className ].progress = (headerEnd - sections[ix].start) / headerHeight; } } diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index dfd5ae7..f68df65 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(e){"use strict";e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""};e.extend(s,t);var n=window.pageYOffset||document.documentElement.scrollTop,r=e(document).height(),a=e(this),o={},i={top:0,height:a.outerHeight()},l=e("[data-midnight]"),f=[],d=function(){for(var e=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],t=0;t ."+s.headerClass),n=0,r=0;return t.length?t.each(function(){var t=e(this),a=t.find("> ."+s.innerClass);a.length?(a.css("bottom","auto"),r=a.outerHeight(),a.css("bottom","0")):(t.css("bottom","auto"),r=t.outerHeight(),t.css("bottom","0")),n=r>n?r:n}):n=r=a.outerHeight(),n},c=function(){i.height=h(),a.css("height",i.height+"px")},u=function(){o["default"]={},l.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:a.css("padding-top"),right:a.css("padding-right"),bottom:a.css("padding-bottom"),left:a.css("padding-left")});a.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),c();var t=a.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):a.wrapInner('
');var t=a.find("> ."+s.headerClass),n=t.filter("."+s.defaultClass).clone(!0,!0);for(var r in o)if(o.hasOwnProperty(r)&&"undefined"==typeof o[r].element){var i=t.filter("."+r);o[r].element=i.length?i:n.clone(!0,!0).removeClass(s.defaultClass).addClass(r).appendTo(a);var f={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[r].element.css(f),m!==!1&&o[r].element.css(m,"translateZ(0)"),o[r].element.find("> ."+s.innerClass).length||o[r].element.wrapInner('
'),o[r].inner=o[r].element.find("> ."+s.innerClass),o[r].inner.css(f),m!==!1&&o[r].inner.css(m,"translateZ(0)"),o[r].from="",o[r].progress=0}t.each(function(){var t=e(this),n=!1;for(var r in o)o.hasOwnProperty(r)&&t.hasClass(r)&&(n=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),n||t.hide()})};u();var p=function(){r=e(document).height(),f=[];for(var t=0;t=f[l].start&&t<=f[l].end&&(o[f[l].class].visible=!0,t>=f[l].start&&s<=f[l].end?(o[f[l].class].from="top",o[f[l].class].progress+=1):s>f[l].end&&tf[l].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(var r in o)if(o.hasOwnProperty(r)&&""!==!o[r].from){var a=100*(1-o[r].progress);"top"===o[r].from?m!==!1?(o[r].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[r].element[0].style.top="-"+a+"%",o[r].inner[0].style.top="+"+a+"%"):m!==!1?(o[r].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[r].element.style.top="+"+a+"%",o[r].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),c(),g(),v()}).trigger("resize");var w=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),C=function(){w(C),g(),v()};C()}})}}(jQuery); \ No newline at end of file +!function(e){"use strict";e.fn.midnight=function(t){return"object"!=typeof t&&(t={}),this.each(function(){var s={headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""};e.extend(s,t);var n=window.pageYOffset||document.documentElement.scrollTop,r=e(document).height(),a=e(this),o={},i={top:0,height:a.outerHeight()},l=e("[data-midnight]"),f=[],d=function(){for(var e=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],t=0;t ."+s.headerClass),n=0,r=0;return t.length?t.each(function(){var t=e(this),a=t.find("> ."+s.innerClass);a.length?(a.css("bottom","auto"),r=a.outerHeight(),a.css("bottom","0")):(t.css("bottom","auto"),r=t.outerHeight(),t.css("bottom","0")),n=r>n?r:n}):n=r=a.outerHeight(),n},c=function(){i.height=h(),a.css("height",i.height+"px")},u=function(){o["default"]={},l.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:a.css("padding-top"),right:a.css("padding-right"),bottom:a.css("padding-bottom"),left:a.css("padding-left")});a.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),c();var t=a.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):a.wrapInner('
');var t=a.find("> ."+s.headerClass),n=t.filter("."+s.defaultClass).clone(!0,!0);for(var r in o)if(o.hasOwnProperty(r)&&"undefined"==typeof o[r].element){var i=t.filter("."+r);o[r].element=i.length?i:n.clone(!0,!0).removeClass(s.defaultClass).addClass(r).appendTo(a);var f={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[r].element.css(f),m!==!1&&o[r].element.css(m,"translateZ(0)"),o[r].element.find("> ."+s.innerClass).length||o[r].element.wrapInner('
'),o[r].inner=o[r].element.find("> ."+s.innerClass),o[r].inner.css(f),m!==!1&&o[r].inner.css(m,"translateZ(0)"),o[r].from="",o[r].progress=0}t.each(function(){var t=e(this),n=!1;for(var r in o)o.hasOwnProperty(r)&&t.hasClass(r)&&(n=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),n||t.hide()})};u();var p=function(){r=e(document).height(),f=[];for(var t=0;t=f[l].start&&t<=f[l].end&&(o[f[l].className].visible=!0,t>=f[l].start&&s<=f[l].end?(o[f[l].className].from="top",o[f[l].className].progress+=1):s>f[l].end&&tf[l].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(var r in o)if(o.hasOwnProperty(r)&&""!==!o[r].from){var a=100*(1-o[r].progress);"top"===o[r].from?m!==!1?(o[r].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[r].element[0].style.top="-"+a+"%",o[r].inner[0].style.top="+"+a+"%"):m!==!1?(o[r].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[r].element.style.top="+"+a+"%",o[r].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),c(),g(),v()}).trigger("resize");var w=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),C=function(){w(C),g(),v()};C()}})}}(jQuery); \ No newline at end of file diff --git a/midnight.jquery.src.js b/midnight.jquery.src.js index cdf0943..f06171d 100644 --- a/midnight.jquery.src.js +++ b/midnight.jquery.src.js @@ -235,7 +235,7 @@ sections.push({ element: $section, - class: $section.data('midnight'), + className: $section.data('midnight'), start: $section.offset().top, end: $section.offset().top + $section.outerHeight() }); @@ -278,27 +278,27 @@ // If there's some kind of overlap between the header and a section, that class becomes active if( headerEnd >= sections[ix].start && headerStart <= sections[ix].end ) { - headers[ sections[ix].class ].visible = true; + headers[ sections[ix].className ].visible = true; // If the header sits neatly within the section, this is the only active class if( headerStart >= sections[ix].start && headerEnd <= sections[ix].end ) { - headers[ sections[ix].class ].from = 'top'; - headers[ sections[ix].class ].progress += 1.0; + headers[ sections[ix].className ].from = 'top'; + headers[ sections[ix].className ].progress += 1.0; } // If the header is in the middle of the end of a section, it comes from the top else if( headerEnd > sections[ix].end && headerStart < sections[ix].end ) { - headers[ sections[ix].class ].from = 'top'; - headers[ sections[ix].class ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; + headers[ sections[ix].className ].from = 'top'; + headers[ sections[ix].className ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; } // If the header is in the middle of the start of a section, it comes from the bottom else if( headerEnd > sections[ix].start && headerStart < sections[ix].start ) { // If the same color continues in the next section, just add the progress to it so we don't switch - if( headers[ sections[ix].class ].from === 'top' ) { - headers[ sections[ix].class ].progress += (headerEnd - sections[ix].start) / headerHeight; + if( headers[ sections[ix].className ].from === 'top' ) { + headers[ sections[ix].className ].progress += (headerEnd - sections[ix].start) / headerHeight; } else { - headers[ sections[ix].class ].from = 'bottom'; - headers[ sections[ix].class ].progress = (headerEnd - sections[ix].start) / headerHeight; + headers[ sections[ix].className ].from = 'bottom'; + headers[ sections[ix].className ].progress = (headerEnd - sections[ix].start) / headerHeight; } } From 5c358f61d50e9b2edce284f8dd6ada19d481b7c3 Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Thu, 20 Nov 2014 18:50:20 -0300 Subject: [PATCH 05/28] Implemented Midnight as a widget to implement refresh() and rebuild() methods, as well as make the code a bit cleaner. --- midnight.jquery.js | 634 ++++++++++++++++++++++------------------- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 632 +++++++++++++++++++++------------------- 3 files changed, 678 insertions(+), 590 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 12a6f8a..fe3215f 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -8,413 +8,457 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ - ((function ( $ ) { + // jQuery Widget +(function(e){"function"==typeof define&&define.amd?define(["jquery"],e):e(jQuery)})(function(e){var t=0,i=Array.prototype.slice;e.cleanData=function(t){return function(i){var s,n,a;for(a=0;null!=(n=i[a]);a++)try{s=e._data(n,"events"),s&&s.remove&&e(n).triggerHandler("remove")}catch(o){}t(i)}}(e.cleanData),e.widget=function(t,i,s){var n,a,o,r,h={},l=t.split(".")[0];return t=t.split(".")[1],n=l+"-"+t,s||(s=i,i=e.Widget),e.expr[":"][n.toLowerCase()]=function(t){return!!e.data(t,n)},e[l]=e[l]||{},a=e[l][t],o=e[l][t]=function(e,t){return this._createWidget?(arguments.length&&this._createWidget(e,t),void 0):new o(e,t)},e.extend(o,a,{version:s.version,_proto:e.extend({},s),_childConstructors:[]}),r=new i,r.options=e.widget.extend({},r.options),e.each(s,function(t,s){return e.isFunction(s)?(h[t]=function(){var e=function(){return i.prototype[t].apply(this,arguments)},n=function(e){return i.prototype[t].apply(this,e)};return function(){var t,i=this._super,a=this._superApply;return this._super=e,this._superApply=n,t=s.apply(this,arguments),this._super=i,this._superApply=a,t}}(),void 0):(h[t]=s,void 0)}),o.prototype=e.widget.extend(r,{widgetEventPrefix:a?r.widgetEventPrefix||t:t},h,{constructor:o,namespace:l,widgetName:t,widgetFullName:n}),a?(e.each(a._childConstructors,function(t,i){var s=i.prototype;e.widget(s.namespace+"."+s.widgetName,o,i._proto)}),delete a._childConstructors):i._childConstructors.push(o),e.widget.bridge(t,o),o},e.widget.extend=function(t){for(var s,n,a=i.call(arguments,1),o=0,r=a.length;r>o;o++)for(s in a[o])n=a[o][s],a[o].hasOwnProperty(s)&&void 0!==n&&(t[s]=e.isPlainObject(n)?e.isPlainObject(t[s])?e.widget.extend({},t[s],n):e.widget.extend({},n):n);return t},e.widget.bridge=function(t,s){var n=s.prototype.widgetFullName||t;e.fn[t]=function(a){var o="string"==typeof a,r=i.call(arguments,1),h=this;return a=!o&&r.length?e.widget.extend.apply(null,[a].concat(r)):a,o?this.each(function(){var i,s=e.data(this,n);return"instance"===a?(h=s,!1):s?e.isFunction(s[a])&&"_"!==a.charAt(0)?(i=s[a].apply(s,r),i!==s&&void 0!==i?(h=i&&i.jquery?h.pushStack(i.get()):i,!1):void 0):e.error("no such method '"+a+"' for "+t+" widget instance"):e.error("cannot call methods on "+t+" prior to initialization; "+"attempted to call method '"+a+"'")}):this.each(function(){var t=e.data(this,n);t?(t.option(a||{}),t._init&&t._init()):e.data(this,n,new s(a,this))}),h}},e.Widget=function(){},e.Widget._childConstructors=[],e.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(i,s){s=e(s||this.defaultElement||this)[0],this.element=e(s),this.uuid=t++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=e(),this.hoverable=e(),this.focusable=e(),s!==this&&(e.data(s,this.widgetFullName,this),this._on(!0,this.element,{remove:function(e){e.target===s&&this.destroy()}}),this.document=e(s.style?s.ownerDocument:s.document||s),this.window=e(this.document[0].defaultView||this.document[0].parentWindow)),this.options=e.widget.extend({},this.options,this._getCreateOptions(),i),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:e.noop,_getCreateEventData:e.noop,_create:e.noop,_init:e.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(e.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled "+"ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:e.noop,widget:function(){return this.element},option:function(t,i){var s,n,a,o=t;if(0===arguments.length)return e.widget.extend({},this.options);if("string"==typeof t)if(o={},s=t.split("."),t=s.shift(),s.length){for(n=o[t]=e.widget.extend({},this.options[t]),a=0;s.length-1>a;a++)n[s[a]]=n[s[a]]||{},n=n[s[a]];if(t=s.pop(),1===arguments.length)return void 0===n[t]?null:n[t];n[t]=i}else{if(1===arguments.length)return void 0===this.options[t]?null:this.options[t];o[t]=i}return this._setOptions(o),this},_setOptions:function(e){var t;for(t in e)this._setOption(t,e[t]);return this},_setOption:function(e,t){return this.options[e]=t,"disabled"===e&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!t),t&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(t,i,s){var n,a=this;"boolean"!=typeof t&&(s=i,i=t,t=!1),s?(i=n=e(i),this.bindings=this.bindings.add(i)):(s=i,i=this.element,n=this.widget()),e.each(s,function(s,o){function r(){return t||a.options.disabled!==!0&&!e(this).hasClass("ui-state-disabled")?("string"==typeof o?a[o]:o).apply(a,arguments):void 0}"string"!=typeof o&&(r.guid=o.guid=o.guid||r.guid||e.guid++);var h=s.match(/^([\w:-]*)\s*(.*)$/),l=h[1]+a.eventNamespace,u=h[2];u?n.delegate(u,l,r):i.bind(l,r)})},_off:function(t,i){i=(i||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,t.unbind(i).undelegate(i),this.bindings=e(this.bindings.not(t).get()),this.focusable=e(this.focusable.not(t).get()),this.hoverable=e(this.hoverable.not(t).get())},_delay:function(e,t){function i(){return("string"==typeof e?s[e]:e).apply(s,arguments)}var s=this;return setTimeout(i,t||0)},_hoverable:function(t){this.hoverable=this.hoverable.add(t),this._on(t,{mouseenter:function(t){e(t.currentTarget).addClass("ui-state-hover")},mouseleave:function(t){e(t.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(t){this.focusable=this.focusable.add(t),this._on(t,{focusin:function(t){e(t.currentTarget).addClass("ui-state-focus")},focusout:function(t){e(t.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(t,i,s){var n,a,o=this.options[t];if(s=s||{},i=e.Event(i),i.type=(t===this.widgetEventPrefix?t:this.widgetEventPrefix+t).toLowerCase(),i.target=this.element[0],a=i.originalEvent)for(n in a)n in i||(i[n]=a[n]);return this.element.trigger(i,s),!(e.isFunction(o)&&o.apply(this.element[0],[i].concat(s))===!1||i.isDefaultPrevented())}},e.each({show:"fadeIn",hide:"fadeOut"},function(t,i){e.Widget.prototype["_"+t]=function(s,n,a){"string"==typeof n&&(n={effect:n});var o,r=n?n===!0||"number"==typeof n?i:n.effect||i:t;n=n||{},"number"==typeof n&&(n={duration:n}),o=!e.isEmptyObject(n),n.complete=a,n.delay&&s.delay(n.delay),o&&e.effects&&e.effects.effect[r]?s[t](n):r!==t&&s[r]?s[r](n.duration,n.easing,a):s.queue(function(i){e(this)[t](),a&&a.call(s[0]),i()})}}),e.widget}); + +((function ( $ ) { "use strict"; - $.fn.midnight = function( customOptions ) { + $.widget('aerolab.midnight', { - if( typeof customOptions !== "object" ) { - customOptions = {}; - } + options: { + // The class that wraps each header. Used as a clipping mask. + headerClass: 'midnightHeader', + // The class that wraps the contents of each header. Also used as a clipping mask. + innerClass: 'midnightInner', + // The class used by the default header (useful when adding multiple headers with different markup). + defaultClass: 'default', + // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) + classPrefix: '' + }, - return this.each(function() { - - // Settings - var settings = { - // The class that wraps each header. Used as a clipping mask. - headerClass: 'midnightHeader', - // The class that wraps the contents of each header. Also used as a clipping mask. - innerClass: 'midnightInner', - // The class used by the default header (useful when adding multiple headers with different markup). - defaultClass: 'default', - // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) - classPrefix: '' - }; + // Cache all the switchable headers (different colors) + _headers: {}, + _headerInfo: {top:0, height:0}, - $.extend(settings, customOptions); + // Cache all the sections which cause the header to change colors + _$sections: [], + _sections: [], + // Scroll Cache + _scrollTop: 0, + _documentHeight: 0, - // Scroll Cache - var scrollTop = window.pageYOffset || document.documentElement.scrollTop; - var documentHeight = $(document).height(); + // Tools + _transformMode: false, - // Cache all the switchable headers (different colors) - var $originalHeader = $(this); - var headers = {}; + refresh: function() { - var headerInfo = { - // Todo: Add support for this (though it's mostly unnecessary) + this._headerInfo = { + // Todo: Add support for top (though it's mostly unnecessary) top: 0, - height: $originalHeader.outerHeight() + height: this.element.outerHeight() }; // Sections that affect the color of the header (and cache) - var $sections = $('[data-midnight]'); - var sections = []; - - var getSupportedTransform = function() { - var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; - for(var ix = 0; ix < prefixes.length; ix++) { - if(document.createElement('div').style[prefixes[ix]] !== undefined) { - return prefixes[ix]; - } - } - return false; - } + this._$sections = $('[data-midnight]'); + this._sections = []; - var transformMode = getSupportedTransform(); + // We need at least one section for this to work. + if( this._$sections.length == 0 ){ return; } + this._setupHeaders(); - // We need at least one section for this to work. - if( $sections.length == 0 ){ return; } - - - var getContainerHeight = function(){ - var $customHeaders = $originalHeader.find('> .'+settings['headerClass']); - var maxHeight = 0; - var height = 0; - if( $customHeaders.length ) { - $customHeaders.each(function() { - - var $header = $(this); - var $inner = $header.find('> .'+settings['innerClass']); - - // Disable the fixed height and trigger a reflow to get the proper height - // Get the inner height or just the height of the container - if( $inner.length ) { - $inner.css('bottom', 'auto'); - height = $inner.outerHeight(); - $inner.css('bottom', '0'); - } else { - $header.css('bottom', 'auto'); - height = $header.outerHeight(); - $header.css('bottom', '0'); - } + this.recalculate(); - maxHeight = (height > maxHeight) ? height : maxHeight; - }); - } else { - maxHeight = height = $originalHeader.outerHeight(); - } - return maxHeight; - }; + }, + _create: function() { - var updateHeaderHeight = function(){ - headerInfo.height = getContainerHeight(); - $originalHeader.css('height', headerInfo.height+'px'); - }; + var context = this; + this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; + this._documentHeight = $(document).height(); + this._headers = {}; + this._transformMode = this._getSupportedTransform(); - var setupHeaders = function(){ + // Calculate all sections and create the necessary headers + this.refresh(); - // Get all the different header colors - headers['default'] = {}; - $sections.each(function(){ - var $section = $(this); - var headerClass = $section.data('midnight'); + // NANANANANANANANA GRASAAAAA + // (This is the ghetto way of keeping the section values updated after any kind of reflow. The overhead is minimal) + setInterval(function(){ + context._recalculateSections(); + }, 1000); - if( typeof headerClass !== 'string' ){ return; } - headerClass = headerClass.trim(); + // We need to recalculate all this._sections and headers on resize. + $(window).resize(function(){ + context.recalculate(); + }).trigger('resize'); - if( headerClass === '' ){ return; } - headers[headerClass] = {}; - }); + // Start the RequestAnimationFrame loop. This should be done just once. + this._updateHeadersLoop(); + }, - // Get the padding of the original Header. It will be applied to the internal headers. - // Todo: Implement this - var defaultPaddings = { - top: $originalHeader.css("padding-top"), - right: $originalHeader.css("padding-right"), - bottom: $originalHeader.css("padding-bottom"), - left: $originalHeader.css("padding-left") - }; + recalculate: function() { + this._recalculateSections(); + this._updateHeaderHeight(); - // Create the fake headers - $originalHeader - .css({ - position: 'fixed', - top: 0, - left: 0, - right: 0, - overflow: 'hidden' - }); + this._recalculateHeaders(); + this._updateHeaders(); + }, - updateHeaderHeight(); - var $customHeaders = $originalHeader.find('> .'+settings['headerClass']); - if( $customHeaders.length ) { - if( ! $customHeaders.filter('.'+ settings['defaultClass']).length ) { - // If there's no default header, just pick the first one, duplicate it, and set the correct class - $customHeaders.filter('.'+ settings['headerClass'] +':first').clone(true, true).attr('class', settings['headerClass'] +' '+ settings['defaultClass']); - } - } else { - // If there are no custom headers, just wrap the content and make that the default header - $originalHeader.wrapInner('
'); + /** + * This is to offer the optimal transform format when updating the header + */ + _getSupportedTransform: function() { + var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; + for(var ix = 0; ix < prefixes.length; ix++) { + if(document.createElement('div').style[prefixes[ix]] !== undefined) { + return prefixes[ix]; } + } + return false; + }, + - // Make a copy of the default header for use in the generic ones. - var $customHeaders = $originalHeader.find('> .'+ settings['headerClass']); - var $defaultHeader = $customHeaders.filter('.'+ settings['defaultClass']).clone(true, true); + /** + * Get the size of the header. + */ + _getContainerHeight: function(){ + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + var maxHeight = 0; + var height = 0; + var context = this; + if( $customHeaders.length ) { + $customHeaders.each(function() { + var $header = $(this); + var $inner = $header.find('> .'+context.options['innerClass']); + + // Disable the fixed height and trigger a reflow to get the proper height + // Get the inner height or just the height of the container + if( $inner.length ) { + $inner.css('bottom', 'auto'); + height = $inner.outerHeight(); + $inner.css('bottom', '0'); + } else { + $header.css('bottom', 'auto'); + height = $header.outerHeight(); + $header.css('bottom', '0'); + } - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( typeof headers[headerClass].element === 'undefined' ) { + maxHeight = (height > maxHeight) ? height : maxHeight; + }); + } else { + maxHeight = height = this.element.outerHeight(); + } + return maxHeight; + }, - // Create the outer clipping mask - // If there's some custom markup, use it, or else just clone the default header - var $existingHeader = $customHeaders.filter('.'+headerClass); - if( $existingHeader.length ) { - headers[headerClass].element = $existingHeader; - } else { - headers[headerClass].element = $defaultHeader.clone(true, true).removeClass( settings['defaultClass'] ).addClass(headerClass).appendTo( $originalHeader ); - } - var resetStyles = { - position: 'absolute', - overflow: 'hidden', - top: 0, - left: 0, - right: 0, - bottom: 0 - }; - headers[headerClass].element.css(resetStyles); - - if( transformMode !== false ) { - headers[headerClass].element.css(transformMode, 'translateZ(0)'); - } + _setupHeaders: function(){ - // Create the inner clipping mask - if( ! headers[headerClass].element.find('> .'+ settings['innerClass']).length ) { - headers[headerClass].element.wrapInner('
'); - } - headers[headerClass].inner = headers[headerClass].element.find('> .'+ settings['innerClass']) - headers[headerClass].inner.css(resetStyles); + // Get all the different header colors + var context = this; + this._headers['default'] = {}; - if( transformMode !== false ) { - headers[headerClass].inner.css(transformMode, 'translateZ(0)'); - } + this._$sections.each(function(){ + var $section = $(this); + var headerClass = $section.data('midnight'); - // Set the default clipping variables - headers[headerClass].from = ''; - headers[headerClass].progress = 0.0; - } - } + if( typeof headerClass !== 'string' ){ return; } + headerClass = headerClass.trim(); - // Headers that weren't initialized have to be hidden - $customHeaders.each(function(){ - var $header = $(this); - var hasAnyClass = false; - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( $header.hasClass(headerClass) ){ hasAnyClass = true; } - } + if( headerClass === '' ){ return; } - // Add the inner clipping mask just in case - if( ! $header.find('> .'+ settings['innerClass']).length ) { - $header.wrapInner('
'); - } + context._headers[headerClass] = {}; + }); - if( ! hasAnyClass ){ $header.hide(); } - }); + // Get the padding of the original Header. It will be applied to the internal headers. + // Todo: Implement this + var defaultPaddings = { + top: this.element.css("padding-top"), + right: this.element.css("padding-right"), + bottom: this.element.css("padding-bottom"), + left: this.element.css("padding-left") }; - setupHeaders(); + // Create the fake headers + this.element + .css({ + position: 'fixed', + top: 0, + left: 0, + right: 0, + overflow: 'hidden' + }); - var recalculateSections = function(){ + this._updateHeaderHeight(); - documentHeight = $(document).height(); + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + if( $customHeaders.length ) { + if( ! $customHeaders.filter('.'+ this.options['defaultClass']).length ) { + // If there's no default header, just pick the first one, duplicate it, and set the correct class + $customHeaders.filter('.'+ this.options['headerClass'] +':first').clone(true, true).attr('class', this.options['headerClass'] +' '+ this.options['defaultClass']); + } + } else { + // If there are no custom headers, just wrap the content and make that the default header + this.element.wrapInner('
'); + } - // Cache all the sections and their start/end positions (where the class starts and ends) - sections = []; + // Make a copy of the default header for use in the generic ones. + var $customHeaders = this.element.find('> .'+ this.options['headerClass']); + var $defaultHeader = $customHeaders.filter('.'+ this.options['defaultClass']).clone(true, true); - for( var ix=0; ix<$sections.length; ix++ ) { - var $section = $($sections[ix]); - sections.push({ - element: $section, - className: $section.data('midnight'), - start: $section.offset().top, - end: $section.offset().top + $section.outerHeight() - }); - } - }; + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( typeof this._headers[headerClass].element === 'undefined' ) { + // Create the outer clipping mask + // If there's some custom markup, use it, or else just clone the default header + var $existingHeader = $customHeaders.filter('.'+headerClass); + if( $existingHeader.length ) { + this._headers[headerClass].element = $existingHeader; + } else { + this._headers[headerClass].element = $defaultHeader.clone(true, true).removeClass( this.options['defaultClass'] ).addClass(headerClass).appendTo( this.element ); + } - // NANANANANANANANA GRASAAAAA - // (This is the ghetto way of keeping the section values updated after any kind of reflow. The overhead is minimal) - setInterval(recalculateSections, 1000); + var resetStyles = { + position: 'absolute', + overflow: 'hidden', + top: 0, + left: 0, + right: 0, + bottom: 0 + }; + this._headers[headerClass].element.css(resetStyles); + + if( this._transformMode !== false ) { + this._headers[headerClass].element.css(this._transformMode, 'translateZ(0)'); + } + + // Create the inner clipping mask + if( ! this._headers[headerClass].element.find('> .'+ this.options['innerClass']).length ) { + this._headers[headerClass].element.wrapInner('
'); + } + this._headers[headerClass].inner = this._headers[headerClass].element.find('> .'+ this.options['innerClass']) + this._headers[headerClass].inner.css(resetStyles); + if( this._transformMode !== false ) { + this._headers[headerClass].inner.css(this._transformMode, 'translateZ(0)'); + } - var recalculateHeaders = function(){ + // Set the default clipping variables + this._headers[headerClass].from = ''; + this._headers[headerClass].progress = 0.0; + } + } - // Check classes are currently active in the header (including the current percentage of each) - scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop; - // Some browsers (e.g on OS X) allow scrolling past the top/bottom. - scrollTop = Math.max(scrollTop, 0); - scrollTop = Math.min(scrollTop, documentHeight); - // Get the header's position relative to the document (given that it's fixed) - var headerHeight = headerInfo.height; - var headerStart = scrollTop + headerInfo.top; - var headerEnd = scrollTop + headerInfo.top + headerHeight; + // Headers that weren't initialized have to be hidden + $customHeaders.each(function(){ + var $header = $(this); + var hasAnyClass = false; + for( var headerClass in context._headers ) { + if( ! context._headers.hasOwnProperty(headerClass) ){ continue; } + if( $header.hasClass(headerClass) ){ hasAnyClass = true; } + } - // Reset the header status - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - // from == '' signals that the section is inactive - headers[ headerClass ].from = ''; - headers[ headerClass ].progress = 0.0; + // Add the inner clipping mask just in case + if( ! $header.find('> .'+ context.options['innerClass']).length ) { + $header.wrapInner('
'); } - // Set the header status - for( var ix = 0; ix < sections.length; ix++ ) { + if( ! hasAnyClass ){ $header.hide(); } + }); - // Todo: This isn't exactly the best code. + }, - // If there's some kind of overlap between the header and a section, that class becomes active - if( headerEnd >= sections[ix].start && headerStart <= sections[ix].end ) { - headers[ sections[ix].className ].visible = true; + /** + * Recalculate which headers should be visible at this time based on the scroll position and the (cached) position of each section. + * This doesn't update + */ + _recalculateHeaders: function(){ - // If the header sits neatly within the section, this is the only active class - if( headerStart >= sections[ix].start && headerEnd <= sections[ix].end ) { - headers[ sections[ix].className ].from = 'top'; - headers[ sections[ix].className ].progress += 1.0; - } - // If the header is in the middle of the end of a section, it comes from the top - else if( headerEnd > sections[ix].end && headerStart < sections[ix].end ) { - headers[ sections[ix].className ].from = 'top'; - headers[ sections[ix].className ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; + // Check classes are currently active in the header (including the current percentage of each) + this._scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop; + // Some browsers (e.g on OS X) allow scrolling past the top/bottom. + this._scrollTop = Math.max(this._scrollTop, 0); + this._scrollTop = Math.min(this._scrollTop, this._documentHeight); + + // Get the header's position relative to the document (given that it's fixed) + var headerHeight = this._headerInfo.height; + var headerStart = this._scrollTop + this._headerInfo.top; + var headerEnd = this._scrollTop + this._headerInfo.top + headerHeight; + + // Reset the header status + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + // from == '' signals that the section is inactive + this._headers[ headerClass ].from = ''; + this._headers[ headerClass ].progress = 0.0; + } + + // Set the header status + for( var ix = 0; ix < this._sections.length; ix++ ) { + + // Todo: This isn't exactly the best code. + + // If there's some kind of overlap between the header and a section, that class becomes active + if( headerEnd >= this._sections[ix].start && headerStart <= this._sections[ix].end ) { + + this._headers[ this._sections[ix].className ].visible = true; + + // If the header sits neatly within the section, this is the only active class + if( headerStart >= this._sections[ix].start && headerEnd <= this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress += 1.0; + } + // If the header is in the middle of the end of a section, it comes from the top + else if( headerEnd > this._sections[ix].end && headerStart < this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress = 1.0 - (headerEnd - this._sections[ix].end) / headerHeight; + } + // If the header is in the middle of the start of a section, it comes from the bottom + else if( headerEnd > this._sections[ix].start && headerStart < this._sections[ix].start ) { + // If the same color continues in the next section, just add the progress to it so we don't switch + if( this._headers[ this._sections[ix].className ].from === 'top' ) { + this._headers[ this._sections[ix].className ].progress += (headerEnd - this._sections[ix].start) / headerHeight; } - // If the header is in the middle of the start of a section, it comes from the bottom - else if( headerEnd > sections[ix].start && headerStart < sections[ix].start ) { - // If the same color continues in the next section, just add the progress to it so we don't switch - if( headers[ sections[ix].className ].from === 'top' ) { - headers[ sections[ix].className ].progress += (headerEnd - sections[ix].start) / headerHeight; - } - else { - headers[ sections[ix].className ].from = 'bottom'; - headers[ sections[ix].className ].progress = (headerEnd - sections[ix].start) / headerHeight; - } + else { + this._headers[ this._sections[ix].className ].from = 'bottom'; + this._headers[ this._sections[ix].className ].progress = (headerEnd - this._sections[ix].start) / headerHeight; } - } } - }; + } + }, - /** - * Update the headers based on the previously calculated values - */ - var updateHeaders = function(){ + /** + * Update the headers based on the position of each section + */ + _updateHeaders: function(){ - // Do some preprocessing to ensure a header is always shown (even if some sections haven't been assigned) - var totalProgress = 0.0; - var lastActiveClass = ''; - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( ! headers[headerClass].from === '' ){ continue; } - totalProgress += headers[headerClass].progress; - lastActiveClass = headerClass; - } + // Do some preprocessing to ensure a header is always shown (even if some this._sections haven't been assigned) + var totalProgress = 0.0; + var lastActiveClass = ''; + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( ! this._headers[headerClass].from === '' ){ continue; } + totalProgress += this._headers[headerClass].progress; + lastActiveClass = headerClass; + } - if( totalProgress < 1.0 ) { - // Complete the header at the bottom with the default class - if( headers[ settings['defaultClass'] ].from === '' ) { - headers[ settings['defaultClass'] ].from = ( headers[lastActiveClass].from === 'top' ) ? 'bottom' : 'top'; - headers[ settings['defaultClass'] ].progress = 1.0 - totalProgress; - } - else { - headers[ settings['defaultClass'] ].progress += 1.0 - totalProgress; - } + if( totalProgress < 1.0 ) { + // Complete the header at the bottom with the default class + if( this._headers[ this.options['defaultClass'] ].from === '' ) { + this._headers[ this.options['defaultClass'] ].from = ( this._headers[lastActiveClass].from === 'top' ) ? 'bottom' : 'top'; + this._headers[ this.options['defaultClass'] ].progress = 1.0 - totalProgress; + } + else { + this._headers[ this.options['defaultClass'] ].progress += 1.0 - totalProgress; } + } - for( var ix in headers ) { - if( ! headers.hasOwnProperty(ix) ){ continue; } - if( ! headers[ix].from === '' ){ continue; } + for( var ix in this._headers ) { + if( ! this._headers.hasOwnProperty(ix) ){ continue; } + if( ! this._headers[ix].from === '' ){ continue; } - var offset = (1.0 - headers[ix].progress) * 100.0; + var offset = (1.0 - this._headers[ix].progress) * 100.0; - if( headers[ix].from === 'top' ){ - if( transformMode !== false ) { - headers[ix].element[0].style[transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; - headers[ix].inner[0].style[transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; - } else { - headers[ix].element[0].style['top'] = '-'+ offset +'%'; - headers[ix].inner[0].style['top'] = '+'+ offset +'%'; - } + if( this._headers[ix].from === 'top' ){ + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '-'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '+'+ offset +'%'; } - else { - if( transformMode !== false ) { - headers[ix].element[0].style[transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; - headers[ix].inner[0].style[transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; - } else { - headers[ix].element.style['top'] = '+'+ offset +'%'; - headers[ix].inner.style['top'] = '-'+ offset +'%'; - } + } + else { + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '+'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '-'+ offset +'%'; } - } - }; + } + }, - // We need to recalculate all sections and headers on resize. - $(window).resize(function(){ - recalculateSections(); - updateHeaderHeight(); + /** + * Update the size of all the sections. + * This doesn't look for new sections. It only updates the ones that were around when the plugin was started. + * Use .midnight('refresh') to do a full update. + */ + _recalculateSections: function(){ - recalculateHeaders(); - updateHeaders(); - }).trigger('resize'); + this._documentHeight = $(document).height(); + // Cache all the this._sections and their start/end positions (where the class starts and ends) + this._sections = []; + for( var ix=0; ix ."+s.headerClass),n=0,r=0;return t.length?t.each(function(){var t=e(this),a=t.find("> ."+s.innerClass);a.length?(a.css("bottom","auto"),r=a.outerHeight(),a.css("bottom","0")):(t.css("bottom","auto"),r=t.outerHeight(),t.css("bottom","0")),n=r>n?r:n}):n=r=a.outerHeight(),n},c=function(){i.height=h(),a.css("height",i.height+"px")},u=function(){o["default"]={},l.each(function(){var t=e(this),s=t.data("midnight");"string"==typeof s&&(s=s.trim(),""!==s&&(o[s]={}))});({top:a.css("padding-top"),right:a.css("padding-right"),bottom:a.css("padding-bottom"),left:a.css("padding-left")});a.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),c();var t=a.find("> ."+s.headerClass);t.length?t.filter("."+s.defaultClass).length||t.filter("."+s.headerClass+":first").clone(!0,!0).attr("class",s.headerClass+" "+s.defaultClass):a.wrapInner('
');var t=a.find("> ."+s.headerClass),n=t.filter("."+s.defaultClass).clone(!0,!0);for(var r in o)if(o.hasOwnProperty(r)&&"undefined"==typeof o[r].element){var i=t.filter("."+r);o[r].element=i.length?i:n.clone(!0,!0).removeClass(s.defaultClass).addClass(r).appendTo(a);var f={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};o[r].element.css(f),m!==!1&&o[r].element.css(m,"translateZ(0)"),o[r].element.find("> ."+s.innerClass).length||o[r].element.wrapInner('
'),o[r].inner=o[r].element.find("> ."+s.innerClass),o[r].inner.css(f),m!==!1&&o[r].inner.css(m,"translateZ(0)"),o[r].from="",o[r].progress=0}t.each(function(){var t=e(this),n=!1;for(var r in o)o.hasOwnProperty(r)&&t.hasClass(r)&&(n=!0);t.find("> ."+s.innerClass).length||t.wrapInner('
'),n||t.hide()})};u();var p=function(){r=e(document).height(),f=[];for(var t=0;t=f[l].start&&t<=f[l].end&&(o[f[l].className].visible=!0,t>=f[l].start&&s<=f[l].end?(o[f[l].className].from="top",o[f[l].className].progress+=1):s>f[l].end&&tf[l].start&&te&&(""===o[s.defaultClass].from?(o[s.defaultClass].from="top"===o[t].from?"bottom":"top",o[s.defaultClass].progress=1-e):o[s.defaultClass].progress+=1-e);for(var r in o)if(o.hasOwnProperty(r)&&""!==!o[r].from){var a=100*(1-o[r].progress);"top"===o[r].from?m!==!1?(o[r].element[0].style[m]="translateY(-"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(+"+a+"%) translateZ(0)"):(o[r].element[0].style.top="-"+a+"%",o[r].inner[0].style.top="+"+a+"%"):m!==!1?(o[r].element[0].style[m]="translateY(+"+a+"%) translateZ(0)",o[r].inner[0].style[m]="translateY(-"+a+"%) translateZ(0)"):(o[r].element.style.top="+"+a+"%",o[r].inner.style.top="-"+a+"%")}};e(window).resize(function(){p(),c(),g(),v()}).trigger("resize");var w=window.requestAnimationFrame||function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)}}(),C=function(){w(C),g(),v()};C()}})}}(jQuery); \ No newline at end of file +!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],0!=this._$sections.length&&(this._setupHeaders(),this.recalculate())},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers["default"]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;eo;o++)for(s in a[o])n=a[o][s],a[o].hasOwnProperty(s)&&void 0!==n&&(t[s]=e.isPlainObject(n)?e.isPlainObject(t[s])?e.widget.extend({},t[s],n):e.widget.extend({},n):n);return t},e.widget.bridge=function(t,s){var n=s.prototype.widgetFullName||t;e.fn[t]=function(a){var o="string"==typeof a,r=i.call(arguments,1),h=this;return a=!o&&r.length?e.widget.extend.apply(null,[a].concat(r)):a,o?this.each(function(){var i,s=e.data(this,n);return"instance"===a?(h=s,!1):s?e.isFunction(s[a])&&"_"!==a.charAt(0)?(i=s[a].apply(s,r),i!==s&&void 0!==i?(h=i&&i.jquery?h.pushStack(i.get()):i,!1):void 0):e.error("no such method '"+a+"' for "+t+" widget instance"):e.error("cannot call methods on "+t+" prior to initialization; "+"attempted to call method '"+a+"'")}):this.each(function(){var t=e.data(this,n);t?(t.option(a||{}),t._init&&t._init()):e.data(this,n,new s(a,this))}),h}},e.Widget=function(){},e.Widget._childConstructors=[],e.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(i,s){s=e(s||this.defaultElement||this)[0],this.element=e(s),this.uuid=t++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=e(),this.hoverable=e(),this.focusable=e(),s!==this&&(e.data(s,this.widgetFullName,this),this._on(!0,this.element,{remove:function(e){e.target===s&&this.destroy()}}),this.document=e(s.style?s.ownerDocument:s.document||s),this.window=e(this.document[0].defaultView||this.document[0].parentWindow)),this.options=e.widget.extend({},this.options,this._getCreateOptions(),i),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:e.noop,_getCreateEventData:e.noop,_create:e.noop,_init:e.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(e.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled "+"ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:e.noop,widget:function(){return this.element},option:function(t,i){var s,n,a,o=t;if(0===arguments.length)return e.widget.extend({},this.options);if("string"==typeof t)if(o={},s=t.split("."),t=s.shift(),s.length){for(n=o[t]=e.widget.extend({},this.options[t]),a=0;s.length-1>a;a++)n[s[a]]=n[s[a]]||{},n=n[s[a]];if(t=s.pop(),1===arguments.length)return void 0===n[t]?null:n[t];n[t]=i}else{if(1===arguments.length)return void 0===this.options[t]?null:this.options[t];o[t]=i}return this._setOptions(o),this},_setOptions:function(e){var t;for(t in e)this._setOption(t,e[t]);return this},_setOption:function(e,t){return this.options[e]=t,"disabled"===e&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!t),t&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(t,i,s){var n,a=this;"boolean"!=typeof t&&(s=i,i=t,t=!1),s?(i=n=e(i),this.bindings=this.bindings.add(i)):(s=i,i=this.element,n=this.widget()),e.each(s,function(s,o){function r(){return t||a.options.disabled!==!0&&!e(this).hasClass("ui-state-disabled")?("string"==typeof o?a[o]:o).apply(a,arguments):void 0}"string"!=typeof o&&(r.guid=o.guid=o.guid||r.guid||e.guid++);var h=s.match(/^([\w:-]*)\s*(.*)$/),l=h[1]+a.eventNamespace,u=h[2];u?n.delegate(u,l,r):i.bind(l,r)})},_off:function(t,i){i=(i||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,t.unbind(i).undelegate(i),this.bindings=e(this.bindings.not(t).get()),this.focusable=e(this.focusable.not(t).get()),this.hoverable=e(this.hoverable.not(t).get())},_delay:function(e,t){function i(){return("string"==typeof e?s[e]:e).apply(s,arguments)}var s=this;return setTimeout(i,t||0)},_hoverable:function(t){this.hoverable=this.hoverable.add(t),this._on(t,{mouseenter:function(t){e(t.currentTarget).addClass("ui-state-hover")},mouseleave:function(t){e(t.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(t){this.focusable=this.focusable.add(t),this._on(t,{focusin:function(t){e(t.currentTarget).addClass("ui-state-focus")},focusout:function(t){e(t.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(t,i,s){var n,a,o=this.options[t];if(s=s||{},i=e.Event(i),i.type=(t===this.widgetEventPrefix?t:this.widgetEventPrefix+t).toLowerCase(),i.target=this.element[0],a=i.originalEvent)for(n in a)n in i||(i[n]=a[n]);return this.element.trigger(i,s),!(e.isFunction(o)&&o.apply(this.element[0],[i].concat(s))===!1||i.isDefaultPrevented())}},e.each({show:"fadeIn",hide:"fadeOut"},function(t,i){e.Widget.prototype["_"+t]=function(s,n,a){"string"==typeof n&&(n={effect:n});var o,r=n?n===!0||"number"==typeof n?i:n.effect||i:t;n=n||{},"number"==typeof n&&(n={duration:n}),o=!e.isEmptyObject(n),n.complete=a,n.delay&&s.delay(n.delay),o&&e.effects&&e.effects.effect[r]?s[t](n):r!==t&&s[r]?s[r](n.duration,n.easing,a):s.queue(function(i){e(this)[t](),a&&a.call(s[0]),i()})}}),e.widget}); + ((function ( $ ) { "use strict"; - $.fn.midnight = function( customOptions ) { + $.widget('aerolab.midnight', { - if( typeof customOptions !== "object" ) { - customOptions = {}; - } + options: { + // The class that wraps each header. Used as a clipping mask. + headerClass: 'midnightHeader', + // The class that wraps the contents of each header. Also used as a clipping mask. + innerClass: 'midnightInner', + // The class used by the default header (useful when adding multiple headers with different markup). + defaultClass: 'default', + // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) + classPrefix: '' + }, - return this.each(function() { - - // Settings - var settings = { - // The class that wraps each header. Used as a clipping mask. - headerClass: 'midnightHeader', - // The class that wraps the contents of each header. Also used as a clipping mask. - innerClass: 'midnightInner', - // The class used by the default header (useful when adding multiple headers with different markup). - defaultClass: 'default', - // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) - classPrefix: '' - }; + // Cache all the switchable headers (different colors) + _headers: {}, + _headerInfo: {top:0, height:0}, - $.extend(settings, customOptions); + // Cache all the sections which cause the header to change colors + _$sections: [], + _sections: [], + // Scroll Cache + _scrollTop: 0, + _documentHeight: 0, - // Scroll Cache - var scrollTop = window.pageYOffset || document.documentElement.scrollTop; - var documentHeight = $(document).height(); + // Tools + _transformMode: false, - // Cache all the switchable headers (different colors) - var $originalHeader = $(this); - var headers = {}; + refresh: function() { - var headerInfo = { - // Todo: Add support for this (though it's mostly unnecessary) + this._headerInfo = { + // Todo: Add support for top (though it's mostly unnecessary) top: 0, - height: $originalHeader.outerHeight() + height: this.element.outerHeight() }; // Sections that affect the color of the header (and cache) - var $sections = $('[data-midnight]'); - var sections = []; - - var getSupportedTransform = function() { - var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; - for(var ix = 0; ix < prefixes.length; ix++) { - if(document.createElement('div').style[prefixes[ix]] !== undefined) { - return prefixes[ix]; - } - } - return false; - } + this._$sections = $('[data-midnight]'); + this._sections = []; - var transformMode = getSupportedTransform(); + // We need at least one section for this to work. + if( this._$sections.length == 0 ){ return; } + this._setupHeaders(); - // We need at least one section for this to work. - if( $sections.length == 0 ){ return; } - - - var getContainerHeight = function(){ - var $customHeaders = $originalHeader.find('> .'+settings['headerClass']); - var maxHeight = 0; - var height = 0; - if( $customHeaders.length ) { - $customHeaders.each(function() { - - var $header = $(this); - var $inner = $header.find('> .'+settings['innerClass']); - - // Disable the fixed height and trigger a reflow to get the proper height - // Get the inner height or just the height of the container - if( $inner.length ) { - $inner.css('bottom', 'auto'); - height = $inner.outerHeight(); - $inner.css('bottom', '0'); - } else { - $header.css('bottom', 'auto'); - height = $header.outerHeight(); - $header.css('bottom', '0'); - } + this.recalculate(); - maxHeight = (height > maxHeight) ? height : maxHeight; - }); - } else { - maxHeight = height = $originalHeader.outerHeight(); - } - return maxHeight; - }; + }, + _create: function() { - var updateHeaderHeight = function(){ - headerInfo.height = getContainerHeight(); - $originalHeader.css('height', headerInfo.height+'px'); - }; + var context = this; + this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; + this._documentHeight = $(document).height(); + this._headers = {}; + this._transformMode = this._getSupportedTransform(); - var setupHeaders = function(){ + // Calculate all sections and create the necessary headers + this.refresh(); - // Get all the different header colors - headers['default'] = {}; - $sections.each(function(){ - var $section = $(this); - var headerClass = $section.data('midnight'); + // NANANANANANANANA GRASAAAAA + // (This is the ghetto way of keeping the section values updated after any kind of reflow. The overhead is minimal) + setInterval(function(){ + context._recalculateSections(); + }, 1000); - if( typeof headerClass !== 'string' ){ return; } - headerClass = headerClass.trim(); + // We need to recalculate all this._sections and headers on resize. + $(window).resize(function(){ + context.recalculate(); + }).trigger('resize'); - if( headerClass === '' ){ return; } - headers[headerClass] = {}; - }); + // Start the RequestAnimationFrame loop. This should be done just once. + this._updateHeadersLoop(); + }, - // Get the padding of the original Header. It will be applied to the internal headers. - // Todo: Implement this - var defaultPaddings = { - top: $originalHeader.css("padding-top"), - right: $originalHeader.css("padding-right"), - bottom: $originalHeader.css("padding-bottom"), - left: $originalHeader.css("padding-left") - }; + recalculate: function() { + this._recalculateSections(); + this._updateHeaderHeight(); - // Create the fake headers - $originalHeader - .css({ - position: 'fixed', - top: 0, - left: 0, - right: 0, - overflow: 'hidden' - }); + this._recalculateHeaders(); + this._updateHeaders(); + }, - updateHeaderHeight(); - var $customHeaders = $originalHeader.find('> .'+settings['headerClass']); - if( $customHeaders.length ) { - if( ! $customHeaders.filter('.'+ settings['defaultClass']).length ) { - // If there's no default header, just pick the first one, duplicate it, and set the correct class - $customHeaders.filter('.'+ settings['headerClass'] +':first').clone(true, true).attr('class', settings['headerClass'] +' '+ settings['defaultClass']); - } - } else { - // If there are no custom headers, just wrap the content and make that the default header - $originalHeader.wrapInner('
'); + /** + * This is to offer the optimal transform format when updating the header + */ + _getSupportedTransform: function() { + var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; + for(var ix = 0; ix < prefixes.length; ix++) { + if(document.createElement('div').style[prefixes[ix]] !== undefined) { + return prefixes[ix]; } + } + return false; + }, + - // Make a copy of the default header for use in the generic ones. - var $customHeaders = $originalHeader.find('> .'+ settings['headerClass']); - var $defaultHeader = $customHeaders.filter('.'+ settings['defaultClass']).clone(true, true); + /** + * Get the size of the header. + */ + _getContainerHeight: function(){ + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + var maxHeight = 0; + var height = 0; + var context = this; + if( $customHeaders.length ) { + $customHeaders.each(function() { + var $header = $(this); + var $inner = $header.find('> .'+context.options['innerClass']); + + // Disable the fixed height and trigger a reflow to get the proper height + // Get the inner height or just the height of the container + if( $inner.length ) { + $inner.css('bottom', 'auto'); + height = $inner.outerHeight(); + $inner.css('bottom', '0'); + } else { + $header.css('bottom', 'auto'); + height = $header.outerHeight(); + $header.css('bottom', '0'); + } - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( typeof headers[headerClass].element === 'undefined' ) { + maxHeight = (height > maxHeight) ? height : maxHeight; + }); + } else { + maxHeight = height = this.element.outerHeight(); + } + return maxHeight; + }, - // Create the outer clipping mask - // If there's some custom markup, use it, or else just clone the default header - var $existingHeader = $customHeaders.filter('.'+headerClass); - if( $existingHeader.length ) { - headers[headerClass].element = $existingHeader; - } else { - headers[headerClass].element = $defaultHeader.clone(true, true).removeClass( settings['defaultClass'] ).addClass(headerClass).appendTo( $originalHeader ); - } - var resetStyles = { - position: 'absolute', - overflow: 'hidden', - top: 0, - left: 0, - right: 0, - bottom: 0 - }; - headers[headerClass].element.css(resetStyles); - - if( transformMode !== false ) { - headers[headerClass].element.css(transformMode, 'translateZ(0)'); - } + _setupHeaders: function(){ - // Create the inner clipping mask - if( ! headers[headerClass].element.find('> .'+ settings['innerClass']).length ) { - headers[headerClass].element.wrapInner('
'); - } - headers[headerClass].inner = headers[headerClass].element.find('> .'+ settings['innerClass']) - headers[headerClass].inner.css(resetStyles); + // Get all the different header colors + var context = this; + this._headers['default'] = {}; - if( transformMode !== false ) { - headers[headerClass].inner.css(transformMode, 'translateZ(0)'); - } + this._$sections.each(function(){ + var $section = $(this); + var headerClass = $section.data('midnight'); - // Set the default clipping variables - headers[headerClass].from = ''; - headers[headerClass].progress = 0.0; - } - } + if( typeof headerClass !== 'string' ){ return; } + headerClass = headerClass.trim(); - // Headers that weren't initialized have to be hidden - $customHeaders.each(function(){ - var $header = $(this); - var hasAnyClass = false; - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( $header.hasClass(headerClass) ){ hasAnyClass = true; } - } + if( headerClass === '' ){ return; } - // Add the inner clipping mask just in case - if( ! $header.find('> .'+ settings['innerClass']).length ) { - $header.wrapInner('
'); - } + context._headers[headerClass] = {}; + }); - if( ! hasAnyClass ){ $header.hide(); } - }); + // Get the padding of the original Header. It will be applied to the internal headers. + // Todo: Implement this + var defaultPaddings = { + top: this.element.css("padding-top"), + right: this.element.css("padding-right"), + bottom: this.element.css("padding-bottom"), + left: this.element.css("padding-left") }; - setupHeaders(); + // Create the fake headers + this.element + .css({ + position: 'fixed', + top: 0, + left: 0, + right: 0, + overflow: 'hidden' + }); - var recalculateSections = function(){ + this._updateHeaderHeight(); - documentHeight = $(document).height(); + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + if( $customHeaders.length ) { + if( ! $customHeaders.filter('.'+ this.options['defaultClass']).length ) { + // If there's no default header, just pick the first one, duplicate it, and set the correct class + $customHeaders.filter('.'+ this.options['headerClass'] +':first').clone(true, true).attr('class', this.options['headerClass'] +' '+ this.options['defaultClass']); + } + } else { + // If there are no custom headers, just wrap the content and make that the default header + this.element.wrapInner('
'); + } - // Cache all the sections and their start/end positions (where the class starts and ends) - sections = []; + // Make a copy of the default header for use in the generic ones. + var $customHeaders = this.element.find('> .'+ this.options['headerClass']); + var $defaultHeader = $customHeaders.filter('.'+ this.options['defaultClass']).clone(true, true); - for( var ix=0; ix<$sections.length; ix++ ) { - var $section = $($sections[ix]); - sections.push({ - element: $section, - className: $section.data('midnight'), - start: $section.offset().top, - end: $section.offset().top + $section.outerHeight() - }); - } - }; + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( typeof this._headers[headerClass].element === 'undefined' ) { + // Create the outer clipping mask + // If there's some custom markup, use it, or else just clone the default header + var $existingHeader = $customHeaders.filter('.'+headerClass); + if( $existingHeader.length ) { + this._headers[headerClass].element = $existingHeader; + } else { + this._headers[headerClass].element = $defaultHeader.clone(true, true).removeClass( this.options['defaultClass'] ).addClass(headerClass).appendTo( this.element ); + } - // NANANANANANANANA GRASAAAAA - // (This is the ghetto way of keeping the section values updated after any kind of reflow. The overhead is minimal) - setInterval(recalculateSections, 1000); + var resetStyles = { + position: 'absolute', + overflow: 'hidden', + top: 0, + left: 0, + right: 0, + bottom: 0 + }; + this._headers[headerClass].element.css(resetStyles); + + if( this._transformMode !== false ) { + this._headers[headerClass].element.css(this._transformMode, 'translateZ(0)'); + } + + // Create the inner clipping mask + if( ! this._headers[headerClass].element.find('> .'+ this.options['innerClass']).length ) { + this._headers[headerClass].element.wrapInner('
'); + } + this._headers[headerClass].inner = this._headers[headerClass].element.find('> .'+ this.options['innerClass']) + this._headers[headerClass].inner.css(resetStyles); + if( this._transformMode !== false ) { + this._headers[headerClass].inner.css(this._transformMode, 'translateZ(0)'); + } - var recalculateHeaders = function(){ + // Set the default clipping variables + this._headers[headerClass].from = ''; + this._headers[headerClass].progress = 0.0; + } + } - // Check classes are currently active in the header (including the current percentage of each) - scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop; - // Some browsers (e.g on OS X) allow scrolling past the top/bottom. - scrollTop = Math.max(scrollTop, 0); - scrollTop = Math.min(scrollTop, documentHeight); - // Get the header's position relative to the document (given that it's fixed) - var headerHeight = headerInfo.height; - var headerStart = scrollTop + headerInfo.top; - var headerEnd = scrollTop + headerInfo.top + headerHeight; + // Headers that weren't initialized have to be hidden + $customHeaders.each(function(){ + var $header = $(this); + var hasAnyClass = false; + for( var headerClass in context._headers ) { + if( ! context._headers.hasOwnProperty(headerClass) ){ continue; } + if( $header.hasClass(headerClass) ){ hasAnyClass = true; } + } - // Reset the header status - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - // from == '' signals that the section is inactive - headers[ headerClass ].from = ''; - headers[ headerClass ].progress = 0.0; + // Add the inner clipping mask just in case + if( ! $header.find('> .'+ context.options['innerClass']).length ) { + $header.wrapInner('
'); } - // Set the header status - for( var ix = 0; ix < sections.length; ix++ ) { + if( ! hasAnyClass ){ $header.hide(); } + }); - // Todo: This isn't exactly the best code. + }, - // If there's some kind of overlap between the header and a section, that class becomes active - if( headerEnd >= sections[ix].start && headerStart <= sections[ix].end ) { - headers[ sections[ix].className ].visible = true; + /** + * Recalculate which headers should be visible at this time based on the scroll position and the (cached) position of each section. + * This doesn't update + */ + _recalculateHeaders: function(){ - // If the header sits neatly within the section, this is the only active class - if( headerStart >= sections[ix].start && headerEnd <= sections[ix].end ) { - headers[ sections[ix].className ].from = 'top'; - headers[ sections[ix].className ].progress += 1.0; - } - // If the header is in the middle of the end of a section, it comes from the top - else if( headerEnd > sections[ix].end && headerStart < sections[ix].end ) { - headers[ sections[ix].className ].from = 'top'; - headers[ sections[ix].className ].progress = 1.0 - (headerEnd - sections[ix].end) / headerHeight; + // Check classes are currently active in the header (including the current percentage of each) + this._scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop; + // Some browsers (e.g on OS X) allow scrolling past the top/bottom. + this._scrollTop = Math.max(this._scrollTop, 0); + this._scrollTop = Math.min(this._scrollTop, this._documentHeight); + + // Get the header's position relative to the document (given that it's fixed) + var headerHeight = this._headerInfo.height; + var headerStart = this._scrollTop + this._headerInfo.top; + var headerEnd = this._scrollTop + this._headerInfo.top + headerHeight; + + // Reset the header status + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + // from == '' signals that the section is inactive + this._headers[ headerClass ].from = ''; + this._headers[ headerClass ].progress = 0.0; + } + + // Set the header status + for( var ix = 0; ix < this._sections.length; ix++ ) { + + // Todo: This isn't exactly the best code. + + // If there's some kind of overlap between the header and a section, that class becomes active + if( headerEnd >= this._sections[ix].start && headerStart <= this._sections[ix].end ) { + + this._headers[ this._sections[ix].className ].visible = true; + + // If the header sits neatly within the section, this is the only active class + if( headerStart >= this._sections[ix].start && headerEnd <= this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress += 1.0; + } + // If the header is in the middle of the end of a section, it comes from the top + else if( headerEnd > this._sections[ix].end && headerStart < this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress = 1.0 - (headerEnd - this._sections[ix].end) / headerHeight; + } + // If the header is in the middle of the start of a section, it comes from the bottom + else if( headerEnd > this._sections[ix].start && headerStart < this._sections[ix].start ) { + // If the same color continues in the next section, just add the progress to it so we don't switch + if( this._headers[ this._sections[ix].className ].from === 'top' ) { + this._headers[ this._sections[ix].className ].progress += (headerEnd - this._sections[ix].start) / headerHeight; } - // If the header is in the middle of the start of a section, it comes from the bottom - else if( headerEnd > sections[ix].start && headerStart < sections[ix].start ) { - // If the same color continues in the next section, just add the progress to it so we don't switch - if( headers[ sections[ix].className ].from === 'top' ) { - headers[ sections[ix].className ].progress += (headerEnd - sections[ix].start) / headerHeight; - } - else { - headers[ sections[ix].className ].from = 'bottom'; - headers[ sections[ix].className ].progress = (headerEnd - sections[ix].start) / headerHeight; - } + else { + this._headers[ this._sections[ix].className ].from = 'bottom'; + this._headers[ this._sections[ix].className ].progress = (headerEnd - this._sections[ix].start) / headerHeight; } - } } - }; + } + }, - /** - * Update the headers based on the previously calculated values - */ - var updateHeaders = function(){ + /** + * Update the headers based on the position of each section + */ + _updateHeaders: function(){ - // Do some preprocessing to ensure a header is always shown (even if some sections haven't been assigned) - var totalProgress = 0.0; - var lastActiveClass = ''; - for( var headerClass in headers ) { - if( ! headers.hasOwnProperty(headerClass) ){ continue; } - if( ! headers[headerClass].from === '' ){ continue; } - totalProgress += headers[headerClass].progress; - lastActiveClass = headerClass; - } + // Do some preprocessing to ensure a header is always shown (even if some this._sections haven't been assigned) + var totalProgress = 0.0; + var lastActiveClass = ''; + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( ! this._headers[headerClass].from === '' ){ continue; } + totalProgress += this._headers[headerClass].progress; + lastActiveClass = headerClass; + } - if( totalProgress < 1.0 ) { - // Complete the header at the bottom with the default class - if( headers[ settings['defaultClass'] ].from === '' ) { - headers[ settings['defaultClass'] ].from = ( headers[lastActiveClass].from === 'top' ) ? 'bottom' : 'top'; - headers[ settings['defaultClass'] ].progress = 1.0 - totalProgress; - } - else { - headers[ settings['defaultClass'] ].progress += 1.0 - totalProgress; - } + if( totalProgress < 1.0 ) { + // Complete the header at the bottom with the default class + if( this._headers[ this.options['defaultClass'] ].from === '' ) { + this._headers[ this.options['defaultClass'] ].from = ( this._headers[lastActiveClass].from === 'top' ) ? 'bottom' : 'top'; + this._headers[ this.options['defaultClass'] ].progress = 1.0 - totalProgress; + } + else { + this._headers[ this.options['defaultClass'] ].progress += 1.0 - totalProgress; } + } - for( var ix in headers ) { - if( ! headers.hasOwnProperty(ix) ){ continue; } - if( ! headers[ix].from === '' ){ continue; } + for( var ix in this._headers ) { + if( ! this._headers.hasOwnProperty(ix) ){ continue; } + if( ! this._headers[ix].from === '' ){ continue; } - var offset = (1.0 - headers[ix].progress) * 100.0; + var offset = (1.0 - this._headers[ix].progress) * 100.0; - if( headers[ix].from === 'top' ){ - if( transformMode !== false ) { - headers[ix].element[0].style[transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; - headers[ix].inner[0].style[transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; - } else { - headers[ix].element[0].style['top'] = '-'+ offset +'%'; - headers[ix].inner[0].style['top'] = '+'+ offset +'%'; - } + if( this._headers[ix].from === 'top' ){ + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '-'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '+'+ offset +'%'; } - else { - if( transformMode !== false ) { - headers[ix].element[0].style[transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; - headers[ix].inner[0].style[transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; - } else { - headers[ix].element.style['top'] = '+'+ offset +'%'; - headers[ix].inner.style['top'] = '-'+ offset +'%'; - } + } + else { + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '+'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '-'+ offset +'%'; } - } - }; + } + }, - // We need to recalculate all sections and headers on resize. - $(window).resize(function(){ - recalculateSections(); - updateHeaderHeight(); + /** + * Update the size of all the sections. + * This doesn't look for new sections. It only updates the ones that were around when the plugin was started. + * Use .midnight('refresh') to do a full update. + */ + _recalculateSections: function(){ - recalculateHeaders(); - updateHeaders(); - }).trigger('resize'); + this._documentHeight = $(document).height(); + // Cache all the this._sections and their start/end positions (where the class starts and ends) + this._sections = []; + for( var ix=0; ix Date: Thu, 20 Nov 2014 19:06:14 -0300 Subject: [PATCH 06/28] Bugfix: It didn't actually support the defaultClass option. --- midnight.jquery.src.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/midnight.jquery.src.js b/midnight.jquery.src.js index 8b941f3..4161cab 100644 --- a/midnight.jquery.src.js +++ b/midnight.jquery.src.js @@ -56,7 +56,7 @@ }, _create: function() { - + var context = this; this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; this._documentHeight = $(document).height(); @@ -150,7 +150,7 @@ // Get all the different header colors var context = this; - this._headers['default'] = {}; + this._headers[this.options['defaultClass']] = {}; this._$sections.each(function(){ var $section = $(this); From c620e266aff01ed7140322352307f2f105aa44aa Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Thu, 20 Nov 2014 19:06:36 -0300 Subject: [PATCH 07/28] . --- midnight.jquery.js | 4 ++-- midnight.jquery.min.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index fe3215f..b81acc8 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -66,7 +66,7 @@ }, _create: function() { - + var context = this; this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; this._documentHeight = $(document).height(); @@ -160,7 +160,7 @@ // Get all the different header colors var context = this; - this._headers['default'] = {}; + this._headers[this.options['defaultClass']] = {}; this._$sections.each(function(){ var $section = $(this); diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 8470e7a..9464953 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],0!=this._$sections.length&&(this._setupHeaders(),this.recalculate())},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers["default"]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],0!=this._$sections.length&&(this._setupHeaders(),this.recalculate())},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e Date: Thu, 20 Nov 2014 19:28:51 -0300 Subject: [PATCH 08/28] Now it runs even when no sections are present. --- midnight.jquery.js | 33 +++++++++++++++++---------------- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 33 +++++++++++++++++---------------- 3 files changed, 35 insertions(+), 33 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index b81acc8..3b97a77 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -56,9 +56,6 @@ this._$sections = $('[data-midnight]'); this._sections = []; - // We need at least one section for this to work. - if( this._$sections.length == 0 ){ return; } - this._setupHeaders(); this.recalculate(); @@ -206,6 +203,7 @@ } } else { // If there are no custom headers, just wrap the content and make that the default header + this.element.wrapInner('
'); } @@ -349,6 +347,9 @@ */ _updateHeaders: function(){ + // Don't do anything if there are no headers + if( typeof this._headers[ this.options['defaultClass'] ] === 'undefined' ){ return; } + // Do some preprocessing to ensure a header is always shown (even if some this._sections haven't been assigned) var totalProgress = 0.0; var lastActiveClass = ''; @@ -359,7 +360,6 @@ lastActiveClass = headerClass; } - if( totalProgress < 1.0 ) { // Complete the header at the bottom with the default class if( this._headers[ this.options['defaultClass'] ].from === '' ) { @@ -433,18 +433,8 @@ }, _updateHeadersLoop: function(){ - // This works using requestAnimationFrame for better compatibility with iOS/Android - /* - this._requestAnimationFrame = (this._requestAnimationFrame || (function(){ - return window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - function( callback ){ - window.setTimeout(callback, 1000 / 60); - }; - })()); -*/ + // This works using requestAnimationFrame for better compatibility with iOS/Android var context = this; this._requestAnimationFrame(function(){ context._updateHeadersLoop(); @@ -452,10 +442,21 @@ this._recalculateHeaders(); this._updateHeaders(); + }, _requestAnimationFrame: function(callback){ - window.requestAnimationFrame(callback); + // Todo: This should be moved somewhere else + var requestAnimationFrame = (requestAnimationFrame || (function(){ + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + function( callback ){ + window.setTimeout(callback, 1000 / 60); + }; + })()); + + requestAnimationFrame(callback); } diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 9464953..b906568 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],0!=this._$sections.length&&(this._setupHeaders(),this.recalculate())},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e
'); } @@ -339,6 +337,9 @@ */ _updateHeaders: function(){ + // Don't do anything if there are no headers + if( typeof this._headers[ this.options['defaultClass'] ] === 'undefined' ){ return; } + // Do some preprocessing to ensure a header is always shown (even if some this._sections haven't been assigned) var totalProgress = 0.0; var lastActiveClass = ''; @@ -349,7 +350,6 @@ lastActiveClass = headerClass; } - if( totalProgress < 1.0 ) { // Complete the header at the bottom with the default class if( this._headers[ this.options['defaultClass'] ].from === '' ) { @@ -423,18 +423,8 @@ }, _updateHeadersLoop: function(){ - // This works using requestAnimationFrame for better compatibility with iOS/Android - /* - this._requestAnimationFrame = (this._requestAnimationFrame || (function(){ - return window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - function( callback ){ - window.setTimeout(callback, 1000 / 60); - }; - })()); -*/ + // This works using requestAnimationFrame for better compatibility with iOS/Android var context = this; this._requestAnimationFrame(function(){ context._updateHeadersLoop(); @@ -442,10 +432,21 @@ this._recalculateHeaders(); this._updateHeaders(); + }, _requestAnimationFrame: function(callback){ - window.requestAnimationFrame(callback); + // Todo: This should be moved somewhere else + var requestAnimationFrame = (requestAnimationFrame || (function(){ + return window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + function( callback ){ + window.setTimeout(callback, 1000 / 60); + }; + })()); + + requestAnimationFrame(callback); } From 06d7da75c2544d0c646e1a86592d2f3407d576cf Mon Sep 17 00:00:00 2001 From: Tom Byrer Date: Sun, 23 Nov 2014 19:30:31 -0700 Subject: [PATCH 09/28] Please push new changes out to /release :) Will fix #23 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index dc268a3..7280b46 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Midnight.JS", - "version": "1.0.3", + "version": "1.0.4", "description": "A jQuery plugin to switch fixed headers on the fly", "devDependencies": { "gulp": "^3.8.8", From 117658c36cc4d1dbf3d7cde006c334c227640777 Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Tue, 25 Nov 2014 18:45:13 -0300 Subject: [PATCH 10/28] Added support for transforms. --- midnight.jquery.js | 27 ++++++++++++++++++++++++++- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 27 ++++++++++++++++++++++++++- 3 files changed, 53 insertions(+), 3 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 3b97a77..a0e5e4b 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -293,7 +293,28 @@ // Get the header's position relative to the document (given that it's fixed) var headerHeight = this._headerInfo.height; var headerStart = this._scrollTop + this._headerInfo.top; - var headerEnd = this._scrollTop + this._headerInfo.top + headerHeight; + var headerEnd = headerStart + headerHeight; + + // Add support for transforms (for plugins like Headroom or general css stuff) + if( typeof window.getComputedStyle === 'function' ) { + var style = window.getComputedStyle(this.element[0], null); + var top = 0.0; + var transformY = 0.0; + + if( this._transformMode !== false && typeof style.transform === 'string' ) { + // Convert the transform matrix to an array + var transformArray = (style.transform).match(/(-?[0-9\.]+)/g); + if( transformArray.length >= 6 && ! isNaN(parseFloat(transformArray[5])) ) { + transformY = parseFloat(transformArray[5]); + } + } + if( (style.top).indexOf('px') >= 0 && ! isNaN(parseFloat(style.top)) ) { + top = parseFloat(style.top); + } + + headerStart += top + transformY; + headerEnd += top + transformY; + } // Reset the header status for( var headerClass in this._headers ) { @@ -378,6 +399,10 @@ var offset = (1.0 - this._headers[ix].progress) * 100.0; + // Add an extra offset when an area is hidden to prevent clipping/rounding issues. + if( offset >= 100.0 ) { offset = 110.0; } + if( offset <= -100.0 ) { offset = -110.0; } + if( this._headers[ix].from === 'top' ){ if( this._transformMode !== false ) { this._headers[ix].element[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index b906568..451d054 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=this._scrollTop+this._headerInfo.top+t;for(var i in this._headers)this._headers.hasOwnProperty(i)&&(this._headers[i].from="",this._headers[i].progress=0);for(var n=0;n=this._sections[n].start&&e<=this._sections[n].end&&(this._headers[this._sections[n].className].visible=!0,e>=this._sections[n].start&&s<=this._sections[n].end?(this._headers[this._sections[n].className].from="top",this._headers[this._sections[n].className].progress+=1):s>this._sections[n].end&&ethis._sections[n].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e= 6 && ! isNaN(parseFloat(transformArray[5])) ) { + transformY = parseFloat(transformArray[5]); + } + } + if( (style.top).indexOf('px') >= 0 && ! isNaN(parseFloat(style.top)) ) { + top = parseFloat(style.top); + } + + headerStart += top + transformY; + headerEnd += top + transformY; + } // Reset the header status for( var headerClass in this._headers ) { @@ -368,6 +389,10 @@ var offset = (1.0 - this._headers[ix].progress) * 100.0; + // Add an extra offset when an area is hidden to prevent clipping/rounding issues. + if( offset >= 100.0 ) { offset = 110.0; } + if( offset <= -100.0 ) { offset = -110.0; } + if( this._headers[ix].from === 'top' ){ if( this._transformMode !== false ) { this._headers[ix].element[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; From bafed1ddc3c662271d7d165620e7eebef69c6063 Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Tue, 25 Nov 2014 18:45:37 -0300 Subject: [PATCH 11/28] Upped the version. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index dc268a3..21ee7bb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "Midnight.JS", - "version": "1.0.3", + "version": "1.1.0", "description": "A jQuery plugin to switch fixed headers on the fly", "devDependencies": { "gulp": "^3.8.8", From 70ca847d1dffeaa17f49475602d595246ffa70ff Mon Sep 17 00:00:00 2001 From: Sergio Behrends Date: Mon, 15 Dec 2014 16:40:05 -0300 Subject: [PATCH 12/28] Fixing issue with transformArray length --- bower.json | 2 +- midnight.jquery.js | 4 ++-- midnight.jquery.min.js | 4 ++-- midnight.jquery.src.js | 2 +- 4 files changed, 6 insertions(+), 6 deletions(-) diff --git a/bower.json b/bower.json index 67c6184..2bd379f 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "midnight", - "version": "1.0.3", + "version": "1.1.0", "description": "Switch fixed headers on the fly", "main": "midnight.jquery.js", "homepage": "https://github.com/Aerolab/midnight.js", diff --git a/midnight.jquery.js b/midnight.jquery.js index a0e5e4b..91acc01 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -1,5 +1,5 @@ /*! - * Midnight.js 1.0.3 + * Midnight.js 1.1.0 * jQuery plugin to switch between multiple fixed header designs on the fly, so it looks in line with the content below it. * http://aerolab.github.io/midnight.js/ * @@ -304,7 +304,7 @@ if( this._transformMode !== false && typeof style.transform === 'string' ) { // Convert the transform matrix to an array var transformArray = (style.transform).match(/(-?[0-9\.]+)/g); - if( transformArray.length >= 6 && ! isNaN(parseFloat(transformArray[5])) ) { + if( transformArray !== null && transformArray.length >= 6 && ! isNaN(parseFloat(transformArray[5])) ) { transformY = parseFloat(transformArray[5]); } } diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 451d054..1e3b72e 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -1,5 +1,5 @@ /*! - * Midnight.js 1.0.3 + * Midnight.js 1.1.0 * jQuery plugin to switch between multiple fixed header designs on the fly, so it looks in line with the content below it. * http://aerolab.github.io/midnight.js/ * @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e= 6 && ! isNaN(parseFloat(transformArray[5])) ) { + if( transformArray !== null && transformArray.length >= 6 && ! isNaN(parseFloat(transformArray[5])) ) { transformY = parseFloat(transformArray[5]); } } From ef25b84306d4b25ab95515d7f5c20fdb9845002f Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Tue, 6 Jan 2015 19:52:55 -0300 Subject: [PATCH 13/28] Fixed a bug with hidden unused headers. --- midnight.jquery.js | 6 +++++- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 6 +++++- 3 files changed, 11 insertions(+), 3 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 91acc01..042bb0f 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -272,7 +272,11 @@ $header.wrapInner('
'); } - if( ! hasAnyClass ){ $header.hide(); } + if( hasAnyClass ) { + $header.show(); + } else { + $header.hide(); + } }); }, diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index 1e3b72e..ca4440d 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i||s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e
'); } - if( ! hasAnyClass ){ $header.hide(); } + if( hasAnyClass ) { + $header.show(); + } else { + $header.hide(); + } }); }, From 03dfe2e1a889c4f7a43dc9ee0c9b6a98cb37fd17 Mon Sep 17 00:00:00 2001 From: RobertoGonzalez Date: Fri, 6 Mar 2015 13:16:36 -0300 Subject: [PATCH 14/28] Fixed a header calculation bug on Chrome 41. --- midnight.jquery.js | 4 +++- midnight.jquery.min.js | 2 +- midnight.jquery.src.js | 4 +++- 3 files changed, 7 insertions(+), 3 deletions(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 042bb0f..656fd63 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -135,7 +135,9 @@ // Disable the fixed height and trigger a reflow to get the proper height // Get the inner height or just the height of the container if( $inner.length ) { - $inner.css('bottom', 'auto'); + // Overflow: Auto fixes an issue with Chrome 41, where outerHeight() no longer takes into account + // the margins of internal elements, creating a smaller container than necessary + $inner.css('bottom', 'auto').css('overflow', 'auto'); height = $inner.outerHeight(); $inner.css('bottom', '0'); } else { diff --git a/midnight.jquery.min.js b/midnight.jquery.min.js index ca4440d..688511a 100644 --- a/midnight.jquery.min.js +++ b/midnight.jquery.min.js @@ -8,4 +8,4 @@ * Released under the MIT license * http://aerolab.github.io/midnight.js/LICENSE.txt */ -!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,this.each(r?function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}:function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),t(window).resize(function(){e.recalculate()}).trigger("resize"),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto").css("overflow","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);this._headers[n].element=o.length?o:i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e Date: Wed, 10 Jun 2015 21:25:30 -0400 Subject: [PATCH 15/28] Remove moot `version` property from bower.json Per bower/bower.json-spec@a325da3 --- bower.json | 1 - 1 file changed, 1 deletion(-) diff --git a/bower.json b/bower.json index 2bd379f..47dd90a 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,5 @@ { "name": "midnight", - "version": "1.1.0", "description": "Switch fixed headers on the fly", "main": "midnight.jquery.js", "homepage": "https://github.com/Aerolab/midnight.js", From c51ffef208a4adca09f1a42dba663bae17ac487d Mon Sep 17 00:00:00 2001 From: Federico Brigante Date: Mon, 28 Sep 2015 20:02:28 -0700 Subject: [PATCH 16/28] Avoid triggering a global resize just to run a function --- midnight.jquery.src.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/midnight.jquery.src.js b/midnight.jquery.src.js index 8b9088e..44cfa9e 100644 --- a/midnight.jquery.src.js +++ b/midnight.jquery.src.js @@ -72,10 +72,14 @@ }, 1000); - // We need to recalculate all this._sections and headers on resize. + // We need to recalculate all this._sections and headers + context.recalculate(); + + + // and at every resize $(window).resize(function(){ context.recalculate(); - }).trigger('resize'); + }); // Start the RequestAnimationFrame loop. This should be done just once. From 40c002a08702ec7d50101ed9452040e7655db3b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonz=C3=A1lez?= Date: Tue, 29 Sep 2015 13:45:44 -0300 Subject: [PATCH 17/28] Added dist and src folders. Improved the settings for bower and published to npm. Left the original js files on the root in case someone is still linking to those. --- .gitignore | 3 +- bower.json | 5 +- dist/midnight.jquery.js | 500 ++++++++++++++++++ dist/midnight.jquery.min.js | 11 + gulpfile.js | 6 +- index.html | 6 +- package.json | 8 +- .../midnight.jquery.src.js | 0 8 files changed, 529 insertions(+), 10 deletions(-) create mode 100644 dist/midnight.jquery.js create mode 100644 dist/midnight.jquery.min.js rename midnight.jquery.src.js => src/midnight.jquery.src.js (100%) diff --git a/.gitignore b/.gitignore index b0eb24c..851b9e3 100644 --- a/.gitignore +++ b/.gitignore @@ -6,4 +6,5 @@ build components coverage *.orig -.idea \ No newline at end of file +.idea +bower_components/ diff --git a/bower.json b/bower.json index 47dd90a..a52a644 100644 --- a/bower.json +++ b/bower.json @@ -1,7 +1,10 @@ { "name": "midnight", "description": "Switch fixed headers on the fly", - "main": "midnight.jquery.js", + "main": "dist/midnight.jquery.min.js", + "dependencies": { + "jquery": "~1.11.3" + }, "homepage": "https://github.com/Aerolab/midnight.js", "license": "MIT", "authors": [ diff --git a/dist/midnight.jquery.js b/dist/midnight.jquery.js new file mode 100644 index 0000000..43d90ab --- /dev/null +++ b/dist/midnight.jquery.js @@ -0,0 +1,500 @@ +/*! + * Midnight.js 1.1.1 + * jQuery plugin to switch between multiple fixed header designs on the fly, so it looks in line with the content below it. + * http://aerolab.github.io/midnight.js/ + * + * Copyright (c) 2014 Aerolab + * + * Released under the MIT license + * http://aerolab.github.io/midnight.js/LICENSE.txt + */ + // jQuery Widget +(function(e){"function"==typeof define&&define.amd?define(["jquery"],e):e(jQuery)})(function(e){var t=0,i=Array.prototype.slice;e.cleanData=function(t){return function(i){var s,n,a;for(a=0;null!=(n=i[a]);a++)try{s=e._data(n,"events"),s&&s.remove&&e(n).triggerHandler("remove")}catch(o){}t(i)}}(e.cleanData),e.widget=function(t,i,s){var n,a,o,r,h={},l=t.split(".")[0];return t=t.split(".")[1],n=l+"-"+t,s||(s=i,i=e.Widget),e.expr[":"][n.toLowerCase()]=function(t){return!!e.data(t,n)},e[l]=e[l]||{},a=e[l][t],o=e[l][t]=function(e,t){return this._createWidget?(arguments.length&&this._createWidget(e,t),void 0):new o(e,t)},e.extend(o,a,{version:s.version,_proto:e.extend({},s),_childConstructors:[]}),r=new i,r.options=e.widget.extend({},r.options),e.each(s,function(t,s){return e.isFunction(s)?(h[t]=function(){var e=function(){return i.prototype[t].apply(this,arguments)},n=function(e){return i.prototype[t].apply(this,e)};return function(){var t,i=this._super,a=this._superApply;return this._super=e,this._superApply=n,t=s.apply(this,arguments),this._super=i,this._superApply=a,t}}(),void 0):(h[t]=s,void 0)}),o.prototype=e.widget.extend(r,{widgetEventPrefix:a?r.widgetEventPrefix||t:t},h,{constructor:o,namespace:l,widgetName:t,widgetFullName:n}),a?(e.each(a._childConstructors,function(t,i){var s=i.prototype;e.widget(s.namespace+"."+s.widgetName,o,i._proto)}),delete a._childConstructors):i._childConstructors.push(o),e.widget.bridge(t,o),o},e.widget.extend=function(t){for(var s,n,a=i.call(arguments,1),o=0,r=a.length;r>o;o++)for(s in a[o])n=a[o][s],a[o].hasOwnProperty(s)&&void 0!==n&&(t[s]=e.isPlainObject(n)?e.isPlainObject(t[s])?e.widget.extend({},t[s],n):e.widget.extend({},n):n);return t},e.widget.bridge=function(t,s){var n=s.prototype.widgetFullName||t;e.fn[t]=function(a){var o="string"==typeof a,r=i.call(arguments,1),h=this;return a=!o&&r.length?e.widget.extend.apply(null,[a].concat(r)):a,o?this.each(function(){var i,s=e.data(this,n);return"instance"===a?(h=s,!1):s?e.isFunction(s[a])&&"_"!==a.charAt(0)?(i=s[a].apply(s,r),i!==s&&void 0!==i?(h=i&&i.jquery?h.pushStack(i.get()):i,!1):void 0):e.error("no such method '"+a+"' for "+t+" widget instance"):e.error("cannot call methods on "+t+" prior to initialization; "+"attempted to call method '"+a+"'")}):this.each(function(){var t=e.data(this,n);t?(t.option(a||{}),t._init&&t._init()):e.data(this,n,new s(a,this))}),h}},e.Widget=function(){},e.Widget._childConstructors=[],e.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(i,s){s=e(s||this.defaultElement||this)[0],this.element=e(s),this.uuid=t++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=e(),this.hoverable=e(),this.focusable=e(),s!==this&&(e.data(s,this.widgetFullName,this),this._on(!0,this.element,{remove:function(e){e.target===s&&this.destroy()}}),this.document=e(s.style?s.ownerDocument:s.document||s),this.window=e(this.document[0].defaultView||this.document[0].parentWindow)),this.options=e.widget.extend({},this.options,this._getCreateOptions(),i),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:e.noop,_getCreateEventData:e.noop,_create:e.noop,_init:e.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(e.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled "+"ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:e.noop,widget:function(){return this.element},option:function(t,i){var s,n,a,o=t;if(0===arguments.length)return e.widget.extend({},this.options);if("string"==typeof t)if(o={},s=t.split("."),t=s.shift(),s.length){for(n=o[t]=e.widget.extend({},this.options[t]),a=0;s.length-1>a;a++)n[s[a]]=n[s[a]]||{},n=n[s[a]];if(t=s.pop(),1===arguments.length)return void 0===n[t]?null:n[t];n[t]=i}else{if(1===arguments.length)return void 0===this.options[t]?null:this.options[t];o[t]=i}return this._setOptions(o),this},_setOptions:function(e){var t;for(t in e)this._setOption(t,e[t]);return this},_setOption:function(e,t){return this.options[e]=t,"disabled"===e&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!t),t&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(t,i,s){var n,a=this;"boolean"!=typeof t&&(s=i,i=t,t=!1),s?(i=n=e(i),this.bindings=this.bindings.add(i)):(s=i,i=this.element,n=this.widget()),e.each(s,function(s,o){function r(){return t||a.options.disabled!==!0&&!e(this).hasClass("ui-state-disabled")?("string"==typeof o?a[o]:o).apply(a,arguments):void 0}"string"!=typeof o&&(r.guid=o.guid=o.guid||r.guid||e.guid++);var h=s.match(/^([\w:-]*)\s*(.*)$/),l=h[1]+a.eventNamespace,u=h[2];u?n.delegate(u,l,r):i.bind(l,r)})},_off:function(t,i){i=(i||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,t.unbind(i).undelegate(i),this.bindings=e(this.bindings.not(t).get()),this.focusable=e(this.focusable.not(t).get()),this.hoverable=e(this.hoverable.not(t).get())},_delay:function(e,t){function i(){return("string"==typeof e?s[e]:e).apply(s,arguments)}var s=this;return setTimeout(i,t||0)},_hoverable:function(t){this.hoverable=this.hoverable.add(t),this._on(t,{mouseenter:function(t){e(t.currentTarget).addClass("ui-state-hover")},mouseleave:function(t){e(t.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(t){this.focusable=this.focusable.add(t),this._on(t,{focusin:function(t){e(t.currentTarget).addClass("ui-state-focus")},focusout:function(t){e(t.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(t,i,s){var n,a,o=this.options[t];if(s=s||{},i=e.Event(i),i.type=(t===this.widgetEventPrefix?t:this.widgetEventPrefix+t).toLowerCase(),i.target=this.element[0],a=i.originalEvent)for(n in a)n in i||(i[n]=a[n]);return this.element.trigger(i,s),!(e.isFunction(o)&&o.apply(this.element[0],[i].concat(s))===!1||i.isDefaultPrevented())}},e.each({show:"fadeIn",hide:"fadeOut"},function(t,i){e.Widget.prototype["_"+t]=function(s,n,a){"string"==typeof n&&(n={effect:n});var o,r=n?n===!0||"number"==typeof n?i:n.effect||i:t;n=n||{},"number"==typeof n&&(n={duration:n}),o=!e.isEmptyObject(n),n.complete=a,n.delay&&s.delay(n.delay),o&&e.effects&&e.effects.effect[r]?s[t](n):r!==t&&s[r]?s[r](n.duration,n.easing,a):s.queue(function(i){e(this)[t](),a&&a.call(s[0]),i()})}}),e.widget}); + +((function ( $ ) { + + "use strict"; + + $.widget('aerolab.midnight', { + + options: { + // The class that wraps each header. Used as a clipping mask. + headerClass: 'midnightHeader', + // The class that wraps the contents of each header. Also used as a clipping mask. + innerClass: 'midnightInner', + // The class used by the default header (useful when adding multiple headers with different markup). + defaultClass: 'default', + // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) + classPrefix: '' + }, + + // Cache all the switchable headers (different colors) + _headers: {}, + _headerInfo: {top:0, height:0}, + + // Cache all the sections which cause the header to change colors + _$sections: [], + _sections: [], + + // Scroll Cache + _scrollTop: 0, + _documentHeight: 0, + + // Tools + _transformMode: false, + + + refresh: function() { + + this._headerInfo = { + // Todo: Add support for top (though it's mostly unnecessary) + top: 0, + height: this.element.outerHeight() + }; + + // Sections that affect the color of the header (and cache) + this._$sections = $('[data-midnight]'); + this._sections = []; + + this._setupHeaders(); + + this.recalculate(); + + }, + + _create: function() { + + var context = this; + this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; + this._documentHeight = $(document).height(); + this._headers = {}; + + this._transformMode = this._getSupportedTransform(); + + // Calculate all sections and create the necessary headers + this.refresh(); + + + // NANANANANANANANA GRASAAAAA + // (This is the ghetto way of keeping the section values updated after any kind of reflow. The overhead is minimal) + setInterval(function(){ + context._recalculateSections(); + }, 1000); + + + // We need to recalculate all this._sections and headers + context.recalculate(); + + + // and at every resize + $(window).resize(function(){ + context.recalculate(); + }); + + + // Start the RequestAnimationFrame loop. This should be done just once. + this._updateHeadersLoop(); + + }, + + + recalculate: function() { + this._recalculateSections(); + this._updateHeaderHeight(); + + this._recalculateHeaders(); + this._updateHeaders(); + }, + + + /** + * This is to offer the optimal transform format when updating the header + */ + _getSupportedTransform: function() { + var prefixes = ['transform','WebkitTransform','MozTransform','OTransform','msTransform']; + for(var ix = 0; ix < prefixes.length; ix++) { + if(document.createElement('div').style[prefixes[ix]] !== undefined) { + return prefixes[ix]; + } + } + return false; + }, + + + /** + * Get the size of the header. + */ + _getContainerHeight: function(){ + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + var maxHeight = 0; + var height = 0; + var context = this; + + if( $customHeaders.length ) { + $customHeaders.each(function() { + + var $header = $(this); + var $inner = $header.find('> .'+context.options['innerClass']); + + // Disable the fixed height and trigger a reflow to get the proper height + // Get the inner height or just the height of the container + if( $inner.length ) { + // Overflow: Auto fixes an issue with Chrome 41, where outerHeight() no longer takes into account + // the margins of internal elements, creating a smaller container than necessary + $inner.css('bottom', 'auto').css('overflow', 'auto'); + height = $inner.outerHeight(); + $inner.css('bottom', '0'); + } else { + $header.css('bottom', 'auto'); + height = $header.outerHeight(); + $header.css('bottom', '0'); + } + + maxHeight = (height > maxHeight) ? height : maxHeight; + }); + } else { + maxHeight = height = this.element.outerHeight(); + } + return maxHeight; + }, + + + _setupHeaders: function(){ + + // Get all the different header colors + var context = this; + this._headers[this.options['defaultClass']] = {}; + + this._$sections.each(function(){ + var $section = $(this); + var headerClass = $section.data('midnight'); + + if( typeof headerClass !== 'string' ){ return; } + + headerClass = headerClass.trim(); + + if( headerClass === '' ){ return; } + + context._headers[headerClass] = {}; + }); + + + // Get the padding of the original Header. It will be applied to the internal headers. + // Todo: Implement this + var defaultPaddings = { + top: this.element.css("padding-top"), + right: this.element.css("padding-right"), + bottom: this.element.css("padding-bottom"), + left: this.element.css("padding-left") + }; + + + // Create the fake headers + this.element + .css({ + position: 'fixed', + top: 0, + left: 0, + right: 0, + overflow: 'hidden' + }); + + this._updateHeaderHeight(); + + var $customHeaders = this.element.find('> .'+this.options['headerClass']); + if( $customHeaders.length ) { + if( ! $customHeaders.filter('.'+ this.options['defaultClass']).length ) { + // If there's no default header, just pick the first one, duplicate it, and set the correct class + $customHeaders.filter('.'+ this.options['headerClass'] +':first').clone(true, true).attr('class', this.options['headerClass'] +' '+ this.options['defaultClass']); + } + } else { + // If there are no custom headers, just wrap the content and make that the default header + + this.element.wrapInner('
'); + } + + // Make a copy of the default header for use in the generic ones. + var $customHeaders = this.element.find('> .'+ this.options['headerClass']); + var $defaultHeader = $customHeaders.filter('.'+ this.options['defaultClass']).clone(true, true); + + + + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( typeof this._headers[headerClass].element === 'undefined' ) { + + // Create the outer clipping mask + // If there's some custom markup, use it, or else just clone the default header + var $existingHeader = $customHeaders.filter('.'+headerClass); + if( $existingHeader.length ) { + this._headers[headerClass].element = $existingHeader; + } else { + this._headers[headerClass].element = $defaultHeader.clone(true, true).removeClass( this.options['defaultClass'] ).addClass(headerClass).appendTo( this.element ); + } + + var resetStyles = { + position: 'absolute', + overflow: 'hidden', + top: 0, + left: 0, + right: 0, + bottom: 0 + }; + this._headers[headerClass].element.css(resetStyles); + + if( this._transformMode !== false ) { + this._headers[headerClass].element.css(this._transformMode, 'translateZ(0)'); + } + + // Create the inner clipping mask + if( ! this._headers[headerClass].element.find('> .'+ this.options['innerClass']).length ) { + this._headers[headerClass].element.wrapInner('
'); + } + this._headers[headerClass].inner = this._headers[headerClass].element.find('> .'+ this.options['innerClass']) + this._headers[headerClass].inner.css(resetStyles); + + if( this._transformMode !== false ) { + this._headers[headerClass].inner.css(this._transformMode, 'translateZ(0)'); + } + + // Set the default clipping variables + this._headers[headerClass].from = ''; + this._headers[headerClass].progress = 0.0; + } + } + + + // Headers that weren't initialized have to be hidden + $customHeaders.each(function(){ + var $header = $(this); + var hasAnyClass = false; + for( var headerClass in context._headers ) { + if( ! context._headers.hasOwnProperty(headerClass) ){ continue; } + if( $header.hasClass(headerClass) ){ hasAnyClass = true; } + } + + // Add the inner clipping mask just in case + if( ! $header.find('> .'+ context.options['innerClass']).length ) { + $header.wrapInner('
'); + } + + if( hasAnyClass ) { + $header.show(); + } else { + $header.hide(); + } + }); + + }, + + + /** + * Recalculate which headers should be visible at this time based on the scroll position and the (cached) position of each section. + * This doesn't update + */ + _recalculateHeaders: function(){ + + // Check classes are currently active in the header (including the current percentage of each) + this._scrollTop = window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop; + // Some browsers (e.g on OS X) allow scrolling past the top/bottom. + this._scrollTop = Math.max(this._scrollTop, 0); + this._scrollTop = Math.min(this._scrollTop, this._documentHeight); + + // Get the header's position relative to the document (given that it's fixed) + var headerHeight = this._headerInfo.height; + var headerStart = this._scrollTop + this._headerInfo.top; + var headerEnd = headerStart + headerHeight; + + // Add support for transforms (for plugins like Headroom or general css stuff) + if( typeof window.getComputedStyle === 'function' ) { + var style = window.getComputedStyle(this.element[0], null); + var top = 0.0; + var transformY = 0.0; + + if( this._transformMode !== false && typeof style.transform === 'string' ) { + // Convert the transform matrix to an array + var transformArray = (style.transform).match(/(-?[0-9\.]+)/g); + if( transformArray !== null && transformArray.length >= 6 && ! isNaN(parseFloat(transformArray[5])) ) { + transformY = parseFloat(transformArray[5]); + } + } + if( (style.top).indexOf('px') >= 0 && ! isNaN(parseFloat(style.top)) ) { + top = parseFloat(style.top); + } + + headerStart += top + transformY; + headerEnd += top + transformY; + } + + // Reset the header status + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + // from == '' signals that the section is inactive + this._headers[ headerClass ].from = ''; + this._headers[ headerClass ].progress = 0.0; + } + + // Set the header status + for( var ix = 0; ix < this._sections.length; ix++ ) { + + // Todo: This isn't exactly the best code. + + // If there's some kind of overlap between the header and a section, that class becomes active + if( headerEnd >= this._sections[ix].start && headerStart <= this._sections[ix].end ) { + + this._headers[ this._sections[ix].className ].visible = true; + + // If the header sits neatly within the section, this is the only active class + if( headerStart >= this._sections[ix].start && headerEnd <= this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress += 1.0; + } + // If the header is in the middle of the end of a section, it comes from the top + else if( headerEnd > this._sections[ix].end && headerStart < this._sections[ix].end ) { + this._headers[ this._sections[ix].className ].from = 'top'; + this._headers[ this._sections[ix].className ].progress = 1.0 - (headerEnd - this._sections[ix].end) / headerHeight; + } + // If the header is in the middle of the start of a section, it comes from the bottom + else if( headerEnd > this._sections[ix].start && headerStart < this._sections[ix].start ) { + // If the same color continues in the next section, just add the progress to it so we don't switch + if( this._headers[ this._sections[ix].className ].from === 'top' ) { + this._headers[ this._sections[ix].className ].progress += (headerEnd - this._sections[ix].start) / headerHeight; + } + else { + this._headers[ this._sections[ix].className ].from = 'bottom'; + this._headers[ this._sections[ix].className ].progress = (headerEnd - this._sections[ix].start) / headerHeight; + } + } + + } + + } + + }, + + + /** + * Update the headers based on the position of each section + */ + _updateHeaders: function(){ + + // Don't do anything if there are no headers + if( typeof this._headers[ this.options['defaultClass'] ] === 'undefined' ){ return; } + + // Do some preprocessing to ensure a header is always shown (even if some this._sections haven't been assigned) + var totalProgress = 0.0; + var lastActiveClass = ''; + for( var headerClass in this._headers ) { + if( ! this._headers.hasOwnProperty(headerClass) ){ continue; } + if( ! this._headers[headerClass].from === '' ){ continue; } + totalProgress += this._headers[headerClass].progress; + lastActiveClass = headerClass; + } + + if( totalProgress < 1.0 ) { + // Complete the header at the bottom with the default class + if( this._headers[ this.options['defaultClass'] ].from === '' ) { + this._headers[ this.options['defaultClass'] ].from = ( this._headers[lastActiveClass].from === 'top' ) ? 'bottom' : 'top'; + this._headers[ this.options['defaultClass'] ].progress = 1.0 - totalProgress; + } + else { + this._headers[ this.options['defaultClass'] ].progress += 1.0 - totalProgress; + } + } + + + for( var ix in this._headers ) { + if( ! this._headers.hasOwnProperty(ix) ){ continue; } + if( ! this._headers[ix].from === '' ){ continue; } + + var offset = (1.0 - this._headers[ix].progress) * 100.0; + + // Add an extra offset when an area is hidden to prevent clipping/rounding issues. + if( offset >= 100.0 ) { offset = 110.0; } + if( offset <= -100.0 ) { offset = -110.0; } + + if( this._headers[ix].from === 'top' ){ + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '-'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '+'+ offset +'%'; + } + } + else { + if( this._transformMode !== false ) { + this._headers[ix].element[0].style[this._transformMode] = 'translateY(+'+ offset +'%) translateZ(0)'; + this._headers[ix].inner[0].style[this._transformMode] = 'translateY(-'+ offset +'%) translateZ(0)'; + } else { + this._headers[ix].element[0].style['top'] = '+'+ offset +'%'; + this._headers[ix].inner[0].style['top'] = '-'+ offset +'%'; + } + } + + } + + }, + + + /** + * Update the size of all the sections. + * This doesn't look for new sections. It only updates the ones that were around when the plugin was started. + * Use .midnight('refresh') to do a full update. + */ + _recalculateSections: function(){ + + this._documentHeight = $(document).height(); + + // Cache all the this._sections and their start/end positions (where the class starts and ends) + this._sections = []; + + for( var ix=0; ix + * + * Released under the MIT license + * http://aerolab.github.io/midnight.js/LICENSE.txt + */ +!function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t(jQuery)}(function(t){var e=0,s=Array.prototype.slice;t.cleanData=function(e){return function(s){var i,n,o;for(o=0;null!=(n=s[o]);o++)try{i=t._data(n,"events"),i&&i.remove&&t(n).triggerHandler("remove")}catch(r){}e(s)}}(t.cleanData),t.widget=function(e,s,i){var n,o,r,a,h={},d=e.split(".")[0];return e=e.split(".")[1],n=d+"-"+e,i||(i=s,s=t.Widget),t.expr[":"][n.toLowerCase()]=function(e){return!!t.data(e,n)},t[d]=t[d]||{},o=t[d][e],r=t[d][e]=function(t,e){return this._createWidget?void(arguments.length&&this._createWidget(t,e)):new r(t,e)},t.extend(r,o,{version:i.version,_proto:t.extend({},i),_childConstructors:[]}),a=new s,a.options=t.widget.extend({},a.options),t.each(i,function(e,i){return t.isFunction(i)?void(h[e]=function(){var t=function(){return s.prototype[e].apply(this,arguments)},n=function(t){return s.prototype[e].apply(this,t)};return function(){var e,s=this._super,o=this._superApply;return this._super=t,this._superApply=n,e=i.apply(this,arguments),this._super=s,this._superApply=o,e}}()):void(h[e]=i)}),r.prototype=t.widget.extend(a,{widgetEventPrefix:o?a.widgetEventPrefix||e:e},h,{constructor:r,namespace:d,widgetName:e,widgetFullName:n}),o?(t.each(o._childConstructors,function(e,s){var i=s.prototype;t.widget(i.namespace+"."+i.widgetName,r,s._proto)}),delete o._childConstructors):s._childConstructors.push(r),t.widget.bridge(e,r),r},t.widget.extend=function(e){for(var i,n,o=s.call(arguments,1),r=0,a=o.length;a>r;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,r?this.each(function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}):this.each(function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),e.recalculate(),t(window).resize(function(){e.recalculate()}),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto").css("overflow","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);o.length?this._headers[n].element=o:this._headers[n].element=i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e - Download + Download Fork on GitHub
@@ -224,7 +224,7 @@

Further customization

- Download + Download Fork on GitHub
@@ -243,7 +243,7 @@

Further customization

- + - + ``` + ### Advanced You can use jsDelivr's [version aliasing & concocting](https://github.com/jsdelivr/jsdelivr#version-aliasing) to serve the latest minor branch version along with dependancies. For example, to download the latest patch versions of midnight.js v1.0.z together along with jQuery v1.11.z: @@ -130,6 +144,7 @@ You can use jsDelivr's [version aliasing & concocting](https://github.com/jsdeli ``` + ## Known Issues On iOS <7 and older Android devices scrollTop isn't updated fluently, which creates a choppy effect. It can be fixed somewhat by wrapping the body in container and detecting touch events, but we're leaving that as an open issue. We'll probably disable the effect on older mobile devices due to bad performance. diff --git a/gulpfile.js b/gulpfile.js index 972ba09..ee640ce 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -13,10 +13,7 @@ var getCopyright = function () { }; gulp.task('build', function () { - gulp.src('./midnight.jquery.src.js') - .pipe(header(getCopyright(), {version: getVersion()})) - .pipe(concat('midnight.jquery.js')) - .pipe(gulp.dest('./')) + gulp.src('./midnight.jquery.js') .pipe(uglify({preserveComments:'some'})) .pipe(concat('midnight.jquery.min.js')) .pipe(gulp.dest('./')); diff --git a/midnight.jquery.src.js b/midnight.jquery.js similarity index 100% rename from midnight.jquery.src.js rename to midnight.jquery.js From cdc3e24a54389127634ce11a38eacc53ad4141ab Mon Sep 17 00:00:00 2001 From: Marko Petzold Date: Thu, 5 May 2016 15:03:48 +0200 Subject: [PATCH 21/28] Make it work atop a tabed layout When switching tabs the midnight header needs to be refreshed with $('#yourmidnightid').midnight('refresh') --- midnight.jquery.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index 43d90ab..37b8bee 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -53,7 +53,7 @@ }; // Sections that affect the color of the header (and cache) - this._$sections = $('[data-midnight]'); + this._$sections = $('[data-midnight]:not(:hidden)'); this._sections = []; this._setupHeaders(); From 32678ad942e84ae5895b02c7f38da2e11acb02c3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonz=C3=A1lez?= Date: Sun, 1 Jan 2017 16:46:46 -0300 Subject: [PATCH 22/28] Bower links to the non-minified version --- bower.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/bower.json b/bower.json index c4496c6..d9272ce 100644 --- a/bower.json +++ b/bower.json @@ -1,9 +1,9 @@ { "name": "midnight", "description": "Switch fixed headers on the fly", - "main": "midnight.jquery.min.js", + "main": "midnight.jquery.js", "dependencies": { - "jquery": "~1.11.3" + "jquery": "^1.11.3" }, "homepage": "https://github.com/Aerolab/midnight.js", "license": "MIT", From 1ebb5e5e7a6c6b53bf23d98f21864afcbfffd749 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonza=CC=81lez?= Date: Sun, 1 Jan 2017 16:50:05 -0300 Subject: [PATCH 23/28] Upped the version to 1.1.2 --- bower.json | 1 + package.json | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/bower.json b/bower.json index d9272ce..caa6e1f 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,7 @@ { "name": "midnight", "description": "Switch fixed headers on the fly", + "version": "1.1.2", "main": "midnight.jquery.js", "dependencies": { "jquery": "^1.11.3" diff --git a/package.json b/package.json index edb75d8..794cad1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "midnight.js", - "version": "1.1.1", + "version": "1.1.2", "description": "A jQuery plugin to switch fixed headers on the fly", "main": "midnight.jquery.min.js", "dependencies": { From 30808390df44e81e6ee1dab27839d9ba2dd467fc Mon Sep 17 00:00:00 2001 From: Marcel Date: Wed, 18 Jan 2017 16:53:17 -0200 Subject: [PATCH 24/28] moved "instalation" section to top It's a best practice to put instalation at the top, to help people setup the script before playing with it --- README.md | 21 +++++++++------------ 1 file changed, 9 insertions(+), 12 deletions(-) diff --git a/README.md b/README.md index 461544e..96aa477 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,15 @@ A jQuery plugin that switches between multiple header designs as you scroll, so **[Check out the demo](http://aerolab.github.io/midnight.js/)** (watch the logo as you scroll). +## Installation + +Midnight is available on Bower and NPM as **midnight.js**: + +``` +bower install midnight.js + +npm install midnight.js +``` ## Quick start @@ -117,18 +126,6 @@ $('nav').midnight({ }); ``` - -## Installation - -Midnight is available on Bower and NPM as **midnight.js**: - -``` -bower install midnight.js - -npm install midnight.js -``` - - ## CDN Hosting To lower hosting costs & have users load midnight.js faster, you can use the [jsDelivr CDN](http://www.jsdelivr.com/#!jquery.midnight) like so: From 1886157226fc6b77bf9ba830e5ed3bd385d3519a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roberto=20Gonza=CC=81lez?= Date: Thu, 4 May 2017 20:40:15 -0300 Subject: [PATCH 25/28] Added support for multiple navs based on PR #38 --- README.md | 22 +++++++++++++++++++++- index.html | 6 +++--- midnight.jquery.js | 28 +++++++++++++++------------- midnight.jquery.min.js | 2 +- 4 files changed, 40 insertions(+), 18 deletions(-) diff --git a/README.md b/README.md index 96aa477..2d08733 100644 --- a/README.md +++ b/README.md @@ -126,6 +126,26 @@ $('nav').midnight({ }); ``` + +## Running Multiple Instances with Different Breakpoints + +If you want to run multiple instances of midnight with different breakpoints, you can use the *sectionSelector* option to choose where each nav is going to be split. + +By default, the plugin will look for all the sections with the *data-midnight* attribute, which is the default, but you can change this to suit your needs. For example: + +```js +$('nav.one').midnight({ + // By default, sectionSelector is 'midnight'. It will switch only on elements that have the data-midnight attribute. + sectionSelector: 'midnight' +}); + +$('nav.two').midnight({ + // We want this nav to switch only on elements that have the data-noon attribute. + sectionSelector: 'noon' +}); +``` + + ## CDN Hosting To lower hosting costs & have users load midnight.js faster, you can use the [jsDelivr CDN](http://www.jsdelivr.com/#!jquery.midnight) like so: @@ -134,7 +154,7 @@ To lower hosting costs & have users load midnight.js faster, you can use the [js ``` -### Advanced +### JSDelivr You can use jsDelivr's [version aliasing & concocting](https://github.com/jsdelivr/jsdelivr#version-aliasing) to serve the latest minor branch version along with dependancies. For example, to download the latest patch versions of midnight.js v1.0.z together along with jQuery v1.11.z: ```htm diff --git a/index.html b/index.html index 7391f52..bcec540 100644 --- a/index.html +++ b/index.html @@ -20,7 +20,7 @@ - + @@ -31,7 +31,7 @@ - + @@ -221,7 +221,7 @@

Further customization

- +
Download diff --git a/midnight.jquery.js b/midnight.jquery.js index 37b8bee..f351a63 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -25,7 +25,9 @@ // The class used by the default header (useful when adding multiple headers with different markup). defaultClass: 'default', // Unused: Add a prefix to the header classes (so if you set the "thingy-" prefix, a section with data-midnight="butterfly" will use the "thingy-butterfly" header) - classPrefix: '' + classPrefix: '', + // If you want to use plugin more than once or if you want a different data attribute name (so if you set the "header" in a section use data-header) + sectionSelector: 'midnight' }, // Cache all the switchable headers (different colors) @@ -53,7 +55,7 @@ }; // Sections that affect the color of the header (and cache) - this._$sections = $('[data-midnight]:not(:hidden)'); + this._$sections = $('[data-'+ this.options.sectionSelector +']:not(:hidden)'); this._sections = []; this._setupHeaders(); @@ -63,7 +65,7 @@ }, _create: function() { - + var context = this; this._scrollTop = window.pageYOffset || document.documentElement.scrollTop; this._documentHeight = $(document).height(); @@ -139,7 +141,7 @@ // Disable the fixed height and trigger a reflow to get the proper height // Get the inner height or just the height of the container if( $inner.length ) { - // Overflow: Auto fixes an issue with Chrome 41, where outerHeight() no longer takes into account + // Overflow: Auto fixes an issue with Chrome 41, where outerHeight() no longer takes into account // the margins of internal elements, creating a smaller container than necessary $inner.css('bottom', 'auto').css('overflow', 'auto'); height = $inner.outerHeight(); @@ -165,18 +167,18 @@ var context = this; this._headers[this.options['defaultClass']] = {}; - this._$sections.each(function(){ - var $section = $(this); - var headerClass = $section.data('midnight'); + for( var i=0; ir;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,r?this.each(function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}):this.each(function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:""},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-midnight]"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),e.recalculate(),t(window).resize(function(){e.recalculate()}),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto").css("overflow","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={},this._$sections.each(function(){var s=t(this),i=s.data("midnight");"string"==typeof i&&(i=i.trim(),""!==i&&(e._headers[i]={}))});({top:this.element.css("padding-top"),right:this.element.css("padding-right"),bottom:this.element.css("padding-bottom"),left:this.element.css("padding-left")});this.element.css({position:"fixed",top:0,left:0,right:0,overflow:"hidden"}),this._updateHeaderHeight();var s=this.element.find("> ."+this.options.headerClass);s.length?s.filter("."+this.options.defaultClass).length||s.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var s=this.element.find("> ."+this.options.headerClass),i=s.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var o=s.filter("."+n);o.length?this._headers[n].element=o:this._headers[n].element=i.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var r={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(r),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(r),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}s.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&et&&(""===this._headers[this.options.defaultClass].from?(this._headers[this.options.defaultClass].from="top"===this._headers[e].from?"bottom":"top",this._headers[this.options.defaultClass].progress=1-t):this._headers[this.options.defaultClass].progress+=1-t);for(var i in this._headers)if(this._headers.hasOwnProperty(i)&&""!==!this._headers[i].from){var n=100*(1-this._headers[i].progress);n>=100&&(n=110),-100>=n&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;er;r++)for(i in o[r])n=o[r][i],o[r].hasOwnProperty(i)&&void 0!==n&&(e[i]=t.isPlainObject(n)?t.isPlainObject(e[i])?t.widget.extend({},e[i],n):t.widget.extend({},n):n);return e},t.widget.bridge=function(e,i){var n=i.prototype.widgetFullName||e;t.fn[e]=function(o){var r="string"==typeof o,a=s.call(arguments,1),h=this;return o=!r&&a.length?t.widget.extend.apply(null,[o].concat(a)):o,r?this.each(function(){var s,i=t.data(this,n);return"instance"===o?(h=i,!1):i?t.isFunction(i[o])&&"_"!==o.charAt(0)?(s=i[o].apply(i,a),s!==i&&void 0!==s?(h=s&&s.jquery?h.pushStack(s.get()):s,!1):void 0):t.error("no such method '"+o+"' for "+e+" widget instance"):t.error("cannot call methods on "+e+" prior to initialization; attempted to call method '"+o+"'")}):this.each(function(){var e=t.data(this,n);e?(e.option(o||{}),e._init&&e._init()):t.data(this,n,new i(o,this))}),h}},t.Widget=function(){},t.Widget._childConstructors=[],t.Widget.prototype={widgetName:"widget",widgetEventPrefix:"",defaultElement:"
",options:{disabled:!1,create:null},_createWidget:function(s,i){i=t(i||this.defaultElement||this)[0],this.element=t(i),this.uuid=e++,this.eventNamespace="."+this.widgetName+this.uuid,this.bindings=t(),this.hoverable=t(),this.focusable=t(),i!==this&&(t.data(i,this.widgetFullName,this),this._on(!0,this.element,{remove:function(t){t.target===i&&this.destroy()}}),this.document=t(i.style?i.ownerDocument:i.document||i),this.window=t(this.document[0].defaultView||this.document[0].parentWindow)),this.options=t.widget.extend({},this.options,this._getCreateOptions(),s),this._create(),this._trigger("create",null,this._getCreateEventData()),this._init()},_getCreateOptions:t.noop,_getCreateEventData:t.noop,_create:t.noop,_init:t.noop,destroy:function(){this._destroy(),this.element.unbind(this.eventNamespace).removeData(this.widgetFullName).removeData(t.camelCase(this.widgetFullName)),this.widget().unbind(this.eventNamespace).removeAttr("aria-disabled").removeClass(this.widgetFullName+"-disabled ui-state-disabled"),this.bindings.unbind(this.eventNamespace),this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus")},_destroy:t.noop,widget:function(){return this.element},option:function(e,s){var i,n,o,r=e;if(0===arguments.length)return t.widget.extend({},this.options);if("string"==typeof e)if(r={},i=e.split("."),e=i.shift(),i.length){for(n=r[e]=t.widget.extend({},this.options[e]),o=0;i.length-1>o;o++)n[i[o]]=n[i[o]]||{},n=n[i[o]];if(e=i.pop(),1===arguments.length)return void 0===n[e]?null:n[e];n[e]=s}else{if(1===arguments.length)return void 0===this.options[e]?null:this.options[e];r[e]=s}return this._setOptions(r),this},_setOptions:function(t){var e;for(e in t)this._setOption(e,t[e]);return this},_setOption:function(t,e){return this.options[t]=e,"disabled"===t&&(this.widget().toggleClass(this.widgetFullName+"-disabled",!!e),e&&(this.hoverable.removeClass("ui-state-hover"),this.focusable.removeClass("ui-state-focus"))),this},enable:function(){return this._setOptions({disabled:!1})},disable:function(){return this._setOptions({disabled:!0})},_on:function(e,s,i){var n,o=this;"boolean"!=typeof e&&(i=s,s=e,e=!1),i?(s=n=t(s),this.bindings=this.bindings.add(s)):(i=s,s=this.element,n=this.widget()),t.each(i,function(i,r){function a(){return e||o.options.disabled!==!0&&!t(this).hasClass("ui-state-disabled")?("string"==typeof r?o[r]:r).apply(o,arguments):void 0}"string"!=typeof r&&(a.guid=r.guid=r.guid||a.guid||t.guid++);var h=i.match(/^([\w:-]*)\s*(.*)$/),d=h[1]+o.eventNamespace,l=h[2];l?n.delegate(l,d,a):s.bind(d,a)})},_off:function(e,s){s=(s||"").split(" ").join(this.eventNamespace+" ")+this.eventNamespace,e.unbind(s).undelegate(s),this.bindings=t(this.bindings.not(e).get()),this.focusable=t(this.focusable.not(e).get()),this.hoverable=t(this.hoverable.not(e).get())},_delay:function(t,e){function s(){return("string"==typeof t?i[t]:t).apply(i,arguments)}var i=this;return setTimeout(s,e||0)},_hoverable:function(e){this.hoverable=this.hoverable.add(e),this._on(e,{mouseenter:function(e){t(e.currentTarget).addClass("ui-state-hover")},mouseleave:function(e){t(e.currentTarget).removeClass("ui-state-hover")}})},_focusable:function(e){this.focusable=this.focusable.add(e),this._on(e,{focusin:function(e){t(e.currentTarget).addClass("ui-state-focus")},focusout:function(e){t(e.currentTarget).removeClass("ui-state-focus")}})},_trigger:function(e,s,i){var n,o,r=this.options[e];if(i=i||{},s=t.Event(s),s.type=(e===this.widgetEventPrefix?e:this.widgetEventPrefix+e).toLowerCase(),s.target=this.element[0],o=s.originalEvent)for(n in o)n in s||(s[n]=o[n]);return this.element.trigger(s,i),!(t.isFunction(r)&&r.apply(this.element[0],[s].concat(i))===!1||s.isDefaultPrevented())}},t.each({show:"fadeIn",hide:"fadeOut"},function(e,s){t.Widget.prototype["_"+e]=function(i,n,o){"string"==typeof n&&(n={effect:n});var r,a=n?n===!0||"number"==typeof n?s:n.effect||s:e;n=n||{},"number"==typeof n&&(n={duration:n}),r=!t.isEmptyObject(n),n.complete=o,n.delay&&i.delay(n.delay),r&&t.effects&&t.effects.effect[a]?i[e](n):a!==e&&i[a]?i[a](n.duration,n.easing,o):i.queue(function(s){t(this)[e](),o&&o.call(i[0]),s()})}}),t.widget}),function(t){"use strict";t.widget("aerolab.midnight",{options:{headerClass:"midnightHeader",innerClass:"midnightInner",defaultClass:"default",classPrefix:"",sectionSelector:"midnight"},_headers:{},_headerInfo:{top:0,height:0},_$sections:[],_sections:[],_scrollTop:0,_documentHeight:0,_transformMode:!1,refresh:function(){this._headerInfo={top:0,height:this.element.outerHeight()},this._$sections=t("[data-"+this.options.sectionSelector+"]:not(:hidden)"),this._sections=[],this._setupHeaders(),this.recalculate()},_create:function(){var e=this;this._scrollTop=window.pageYOffset||document.documentElement.scrollTop,this._documentHeight=t(document).height(),this._headers={},this._transformMode=this._getSupportedTransform(),this.refresh(),setInterval(function(){e._recalculateSections()},1e3),e.recalculate(),t(window).resize(function(){e.recalculate()}),this._updateHeadersLoop()},recalculate:function(){this._recalculateSections(),this._updateHeaderHeight(),this._recalculateHeaders(),this._updateHeaders()},_getSupportedTransform:function(){for(var t=["transform","WebkitTransform","MozTransform","OTransform","msTransform"],e=0;e ."+this.options.headerClass),s=0,i=0,n=this;return e.length?e.each(function(){var e=t(this),o=e.find("> ."+n.options.innerClass);o.length?(o.css("bottom","auto").css("overflow","auto"),i=o.outerHeight(),o.css("bottom","0")):(e.css("bottom","auto"),i=e.outerHeight(),e.css("bottom","0")),s=i>s?i:s}):s=i=this.element.outerHeight(),s},_setupHeaders:function(){var e=this;this._headers[this.options.defaultClass]={};for(var s=0;s ."+this.options.headerClass);o.length?o.filter("."+this.options.defaultClass).length||o.filter("."+this.options.headerClass+":first").clone(!0,!0).attr("class",this.options.headerClass+" "+this.options.defaultClass):this.element.wrapInner('
');var o=this.element.find("> ."+this.options.headerClass),r=o.filter("."+this.options.defaultClass).clone(!0,!0);for(var n in this._headers)if(this._headers.hasOwnProperty(n)&&"undefined"==typeof this._headers[n].element){var a=o.filter("."+n);a.length?this._headers[n].element=a:this._headers[n].element=r.clone(!0,!0).removeClass(this.options.defaultClass).addClass(n).appendTo(this.element);var h={position:"absolute",overflow:"hidden",top:0,left:0,right:0,bottom:0};this._headers[n].element.css(h),this._transformMode!==!1&&this._headers[n].element.css(this._transformMode,"translateZ(0)"),this._headers[n].element.find("> ."+this.options.innerClass).length||this._headers[n].element.wrapInner('
'),this._headers[n].inner=this._headers[n].element.find("> ."+this.options.innerClass),this._headers[n].inner.css(h),this._transformMode!==!1&&this._headers[n].inner.css(this._transformMode,"translateZ(0)"),this._headers[n].from="",this._headers[n].progress=0}o.each(function(){var s=t(this),i=!1;for(var n in e._headers)e._headers.hasOwnProperty(n)&&s.hasClass(n)&&(i=!0);s.find("> ."+e.options.innerClass).length||s.wrapInner('
'),i?s.show():s.hide()})},_recalculateHeaders:function(){this._scrollTop=window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop,this._scrollTop=Math.max(this._scrollTop,0),this._scrollTop=Math.min(this._scrollTop,this._documentHeight);var t=this._headerInfo.height,e=this._scrollTop+this._headerInfo.top,s=e+t;if("function"==typeof window.getComputedStyle){var i=window.getComputedStyle(this.element[0],null),n=0,o=0;if(this._transformMode!==!1&&"string"==typeof i.transform){var r=i.transform.match(/(-?[0-9\.]+)/g);null!==r&&r.length>=6&&!isNaN(parseFloat(r[5]))&&(o=parseFloat(r[5]))}i.top.indexOf("px")>=0&&!isNaN(parseFloat(i.top))&&(n=parseFloat(i.top)),e+=n+o,s+=n+o}for(var a in this._headers)this._headers.hasOwnProperty(a)&&(this._headers[a].from="",this._headers[a].progress=0);for(var h=0;h=this._sections[h].start&&e<=this._sections[h].end&&(this._headers[this._sections[h].className].visible=!0,e>=this._sections[h].start&&s<=this._sections[h].end?(this._headers[this._sections[h].className].from="top",this._headers[this._sections[h].className].progress+=1):s>this._sections[h].end&&ethis._sections[h].start&&e=100&&(n=110),n<=-100&&(n=-110),"top"===this._headers[i].from?this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="-"+n+"%",this._headers[i].inner[0].style.top="+"+n+"%"):this._transformMode!==!1?(this._headers[i].element[0].style[this._transformMode]="translateY(+"+n+"%) translateZ(0)",this._headers[i].inner[0].style[this._transformMode]="translateY(-"+n+"%) translateZ(0)"):(this._headers[i].element[0].style.top="+"+n+"%",this._headers[i].inner[0].style.top="-"+n+"%")}}},_recalculateSections:function(){this._documentHeight=t(document).height(),this._sections=[];for(var e=0;e Date: Fri, 4 Aug 2017 09:38:13 -0300 Subject: [PATCH 26/28] Fixing Safari _recalculateHeaders function when top is a percentage --- midnight.jquery.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/midnight.jquery.js b/midnight.jquery.js index f351a63..d88e605 100644 --- a/midnight.jquery.js +++ b/midnight.jquery.js @@ -310,6 +310,7 @@ // Add support for transforms (for plugins like Headroom or general css stuff) if( typeof window.getComputedStyle === 'function' ) { var style = window.getComputedStyle(this.element[0], null); + var styleTop = style.top; var top = 0.0; var transformY = 0.0; @@ -320,7 +321,10 @@ transformY = parseFloat(transformArray[5]); } } - if( (style.top).indexOf('px') >= 0 && ! isNaN(parseFloat(style.top)) ) { + if ( style.top.indexOf('%') >= 0 && ! isNaN(parseFloat(styleTop)) ) { + // SAFARI ISSUE https://bugs.webkit.org/show_bug.cgi?id=29084 + top = window.innerHeight * ( parseFloat(styleTop) / 100 ); + } else if( (styleTop).indexOf('px') >= 0 && ! isNaN(parseFloat(styleTop)) ) { top = parseFloat(style.top); } From 6e47551d8c13c3c8ab6044e8223d81007d7eb880 Mon Sep 17 00:00:00 2001 From: Lukas Drgon Date: Thu, 7 Sep 2017 17:04:06 +0200 Subject: [PATCH 27/28] Update jsDelivr links --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 2d08733..9d034ae 100644 --- a/README.md +++ b/README.md @@ -150,15 +150,15 @@ $('nav.two').midnight({ To lower hosting costs & have users load midnight.js faster, you can use the [jsDelivr CDN](http://www.jsdelivr.com/#!jquery.midnight) like so: ```htm - + ``` ### JSDelivr -You can use jsDelivr's [version aliasing & concocting](https://github.com/jsdelivr/jsdelivr#version-aliasing) to serve the latest minor branch version along with dependancies. For example, to download the latest patch versions of midnight.js v1.0.z together along with jQuery v1.11.z: +You can use jsDelivr's [version aliasing & concocting](https://www.jsdelivr.com/features) to serve the latest minor branch version along with dependancies. For example, to download the latest patch versions of midnight.js v1.0.z together along with jQuery v1.11.z: ```htm - + ``` From fd32fb015c313bb8d30a013612eda5542a776709 Mon Sep 17 00:00:00 2001 From: Roberto Gonzalez Date: Thu, 2 Nov 2017 16:04:59 -0300 Subject: [PATCH 28/28] Sublty --- index.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index bcec540..d6ac500 100644 --- a/index.html +++ b/index.html @@ -5,7 +5,7 @@ Midnight.js - Switch fixed headers on the fly - + @@ -16,7 +16,7 @@ - + @@ -25,7 +25,7 @@ - + @@ -310,4 +310,4 @@

Further customization

- \ No newline at end of file +