Jdlrobson has uploaded a new change for review. https://gerrit.wikimedia.org/r/60820
Change subject: Move feature detection to top of page ...................................................................... Move feature detection to top of page This prevents flashes of unstyled content. Update application functions to read the classes on the html tag so as not to interfere with existing modules Change-Id: Ic5dfdf2d6aacfbcdffd49ccb006cbd5b7b6f4bb2 --- M MobileFrontend.php A javascripts/common/feature-detect.js M javascripts/common/mf-application.js M stylesheets/common/ui.css 4 files changed, 51 insertions(+), 30 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend refs/changes/20/60820/1 diff --git a/MobileFrontend.php b/MobileFrontend.php index aeaaada..facbc74 100644 --- a/MobileFrontend.php +++ b/MobileFrontend.php @@ -213,6 +213,13 @@ ), ); +$wgResourceModules['mobile.head'] = $wgMFMobileResourceBoilerplate + array( + 'position' => 'top', + 'scripts' => array( + 'javascripts/common/feature-detect.js', + ), +); + $wgResourceModules['mobile.styles.page'] = $wgMFMobileResourceBoilerplate + array( 'dependencies' => array( 'mobile.startup' ), 'styles' => array( @@ -235,7 +242,8 @@ ); $wgResourceModules['mobile.startup'] = $wgMFMobileResourceBoilerplate + array( - 'styles' => array( + 'dependencies' => array( + 'mobile.head', ), 'scripts' => array( 'javascripts/common/polyfills.js', diff --git a/javascripts/common/feature-detect.js b/javascripts/common/feature-detect.js new file mode 100644 index 0000000..086a7a1 --- /dev/null +++ b/javascripts/common/feature-detect.js @@ -0,0 +1,36 @@ +( function( $ ) { + var $doc = $( 'html' ); + + // TODO: only apply to places that need it + // http://www.quirksmode.org/blog/archives/2010/12/the_fifth_posit.html + // https://github.com/Modernizr/Modernizr/issues/167 + function supportsPositionFixed() { + // TODO: don't use device detection + var agent = navigator.userAgent, + support = false, + supportedAgents = [ + // match anything over Webkit 534 + /AppleWebKit\/(53[4-9]|5[4-9]\d?|[6-9])\d?\d?/, + // Android 3+ + /Android [3-9]/ + ]; + supportedAgents.forEach( function( item ) { + if( agent.match( item ) ) { + support = true; + } + } ); + return support; + } + + function supportsGeoLocation() { + return !!navigator.geolocation; + } + + if( supportsPositionFixed() ) { + $doc.addClass( 'supports-position-fixed' ); + } + if ( supportsGeoLocation() ) { + $doc.addClass( 'supports-geo-location' ); + } + +}( jQuery ) ); diff --git a/javascripts/common/mf-application.js b/javascripts/common/mf-application.js index 6a39598..7be72a0 100644 --- a/javascripts/common/mf-application.js +++ b/javascripts/common/mf-application.js @@ -6,6 +6,7 @@ // just inherit from EventEmitter instead eventEmitter = new EventEmitter(), template, + $doc = $( 'html' ), templates = {}, scrollY; @@ -65,25 +66,8 @@ return mw.msg( name, arg1 ); } - // TODO: only apply to places that need it - // http://www.quirksmode.org/blog/archives/2010/12/the_fifth_posit.html - // https://github.com/Modernizr/Modernizr/issues/167 function supportsPositionFixed() { - // TODO: don't use device detection - var agent = navigator.userAgent, - support = false, - supportedAgents = [ - // match anything over Webkit 534 - /AppleWebKit\/(53[4-9]|5[4-9]\d?|[6-9])\d?\d?/, - // Android 3+ - /Android [3-9]/ - ]; - supportedAgents.forEach( function( item ) { - if( agent.match( item ) ) { - support = true; - } - } ); - return support; + return $doc.hasClass( 'supports-position-fixed' ); } // Try to scroll and hide URL bar @@ -99,26 +83,19 @@ } function supportsGeoLocation() { - return !!navigator.geolocation; + return $doc.hasClass( 'supports-geo-location' ); } // TODO: separate main menu navigation code into separate module function init() { // FIXME: use wgIsMainPage - var mainPage = document.getElementById( 'mainpage' ), - $doc = $( 'html' ); + var mainPage = document.getElementById( 'mainpage' ); if ( mainPage ) { emit( 'homepage-loaded' ); } $doc.removeClass( 'page-loading' ); // FIXME: Kill with fire. This is here for historic reasons in case old HTML is cached - if( supportsPositionFixed() ) { - $doc.addClass( 'supportsPositionFixed' ); - } - if ( supportsGeoLocation() ) { - $doc.addClass( 'supports-geo-location' ); - } // when rotating to landscape stop page zooming on ios // allow disabling of transitions in android ics 4.0.2 diff --git a/stylesheets/common/ui.css b/stylesheets/common/ui.css index dd1074d..1990a7a 100644 --- a/stylesheets/common/ui.css +++ b/stylesheets/common/ui.css @@ -200,10 +200,10 @@ /* @embed */ background-image: url(images/menu/loginout.png); } -.supportsGeoLocation #mw-mf-menu-main li.icon-nearby { +.supports-geo-location #mw-mf-menu-main li.icon-nearby { display: block; } -.supportsGeoLocation #mw-mf-menu-main li.icon-nearby a { +.supports-geo-location #mw-mf-menu-main li.icon-nearby a { /* @embed */ background-image: url(images/menu/nearby.png); } -- To view, visit https://gerrit.wikimedia.org/r/60820 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Ic5dfdf2d6aacfbcdffd49ccb006cbd5b7b6f4bb2 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Jdlrobson <jrob...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits