Brion VIBBER has uploaded a new change for review. https://gerrit.wikimedia.org/r/153543
Change subject: Work in progress: allow pinch-zoom on image viewer overlay ...................................................................... Work in progress: allow pinch-zoom on image viewer overlay Switches position:fixed to position:absolute in ImageOverlay, and adds an Overlay property 'allowZoom' which can be set to true to disable the disabling of scroll and zoom behavior. Briefly tested on iOS 7.1 simulator. May explode on other systems. Bug: 69414 Change-Id: I6de82009409a28c46b36be13f67129c30f4e0891 --- M javascripts/common/Overlay.js M javascripts/modules/mediaViewer/ImageOverlay.js M less/modules/mediaViewer.less 3 files changed, 16 insertions(+), 6 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend refs/changes/43/153543/1 diff --git a/javascripts/common/Overlay.js b/javascripts/common/Overlay.js index d30f969..3991df4 100644 --- a/javascripts/common/Overlay.js +++ b/javascripts/common/Overlay.js @@ -25,6 +25,10 @@ * @type {Boolean} */ fullScreen: true, + /** + * @type {Boolean} + */ + allowZoom: false, /** * use '#mw-mf-viewport' rather than 'body' - for some reasons this has @@ -88,7 +92,9 @@ ( $overlayContent.scrollTop() === 0 && startY < y ) || ( $overlayContent.scrollTop() === contentLenght && startY > y ) ) { - ev.preventDefault(); + if ( !self.allowZoom ) { + ev.preventDefault(); + } } } ); @@ -138,7 +144,9 @@ if ( M.isIos ) { $window .on( 'touchmove.ios', function( ev ) { - ev.preventDefault(); + if ( !self.allowZoom ) { + ev.preventDefault(); + } } ) .on( 'resize.ios', function() { self._resizeContent( $window.height() ); diff --git a/javascripts/modules/mediaViewer/ImageOverlay.js b/javascripts/modules/mediaViewer/ImageOverlay.js index 43362f1..5e450f0 100644 --- a/javascripts/modules/mediaViewer/ImageOverlay.js +++ b/javascripts/modules/mediaViewer/ImageOverlay.js @@ -14,6 +14,7 @@ className: 'overlay media-viewer', template: M.template.get( 'modules/ImageOverlay.hogan' ), closeOnBack: true, + allowZoom: true, defaults: { detailsMsg: mw.msg( 'mobile-frontend-media-details' ), @@ -56,6 +57,7 @@ show: function() { this._super(); this._positionImage(); + M.unlockViewport(); }, _positionImage: function() { diff --git a/less/modules/mediaViewer.less b/less/modules/mediaViewer.less index 42a3b6b..abe09e8 100644 --- a/less/modules/mediaViewer.less +++ b/less/modules/mediaViewer.less @@ -6,13 +6,13 @@ padding-top: 0; .main { - height: auto; - position: relative; + position: absolute; width: 100%; + height: 100%; } .image-wrapper { - position: fixed; + position: absolute; left: 0; right: 0; top: 0; @@ -56,7 +56,7 @@ .details { bottom: 0; height: auto; - position: fixed; + position: absolute; width: 100%; padding: 8px 10px; margin: 0; -- To view, visit https://gerrit.wikimedia.org/r/153543 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: I6de82009409a28c46b36be13f67129c30f4e0891 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Brion VIBBER <br...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits