jenkins-bot has submitted this change and it was merged.
Change subject: Fix toolbar position in iOS
......................................................................
Fix toolbar position in iOS
When the anything is focused in iOS it calculates the overlap between
the desired cursor position and the keyboard, and it scrolls the
window up by that amount.
The problem is the window contains just the toolbar and a scrollable
container, so we end up losing the toolbar.
To work around this, whenever the *window* is scrolled apply
the window's scroll offset to the scrollable container and
reset the window scroll offset to 0.
We also need to reapply the native selection so the cursor doesn't
magically disappear.
Change-Id: Ib4ff64589d299cac53a7d12f2a97dfc3149ea65a
---
M resources/mobile.editor.ve/ve.init.mw.MobileFrontendArticleTarget.js
1 file changed, 44 insertions(+), 1 deletion(-)
Approvals:
Jforrester: Looks good to me, approved
jenkins-bot: Verified
diff --git
a/resources/mobile.editor.ve/ve.init.mw.MobileFrontendArticleTarget.js
b/resources/mobile.editor.ve/ve.init.mw.MobileFrontendArticleTarget.js
index 239dce0..8451afe 100644
--- a/resources/mobile.editor.ve/ve.init.mw.MobileFrontendArticleTarget.js
+++ b/resources/mobile.editor.ve/ve.init.mw.MobileFrontendArticleTarget.js
@@ -5,7 +5,7 @@
* @license The MIT License (MIT); see LICENSE.txt
*/
-/* global ve */
+/* global ve, $ */
// jscs:disable
@@ -24,7 +24,12 @@
ve.init.mw.MobileFrontendArticleTarget.super.call( this, config );
this.overlay = overlay;
+ this.$overlayContent = overlay.$el.find( '.overlay-content' );
this.$overlaySurface = overlay.$el.find( '.surface' );
+
+ // Events
+ this.onWindowScrollDebounced = ve.debounce( this.onWindowScroll.bind(
this ), 100 );
+ $( this.getElementWindow() ).on( 'scroll', this.onWindowScrollDebounced
);
// Initialization
this.$element.addClass( 've-init-mw-mobileFrontendArticleTarget' );
@@ -38,6 +43,44 @@
/* Methods */
+/**
+ * Destroy the target
+ */
+ve.init.mw.MobileFrontendArticleTarget.prototype.destroy = function () {
+ // Parent method
+ ve.init.mw.MobileFrontendArticleTarget.super.prototype.destroy.call(
this );
+
+ $( this.getElementWindow() ).off( 'scroll',
this.onWindowScrollDebounced );
+};
+
+/**
+ * Handle window scroll events
+ */
+ve.init.mw.MobileFrontendArticleTarget.prototype.onWindowScroll = function () {
+ var target = this;
+ // The window can only scroll in iOS if the keyboard has been opened
+ if ( ve.init.platform.constructor.static.isIos() ) {
+ // iOS applies a scroll offset to the window to move the cursor
+ // into view. Apply this offset to the surface instead.
+ var range,
+ nativeSelection =
target.getSurface().getView().nativeSelection,
+ windowTop = $( window ).scrollTop(),
+ contentTop = target.$overlayContent.scrollTop();
+
+ $( window ).scrollTop( 0 );
+ target.$overlayContent.scrollTop( contentTop + windowTop );
+
+ // iOS has another bug (!) where if you change the scroll
offset of a
+ // contentEditable with a cursor visible it disappears, so
remove and
+ // reapply the selection in that case.
+ if ( nativeSelection.rangeCount &&
document.activeElement.contentEditable === 'true' ) {
+ range = nativeSelection.getRangeAt(0);
+ nativeSelection.removeAllRanges();
+ nativeSelection.addRange( range );
+ }
+ }
+};
+
/*
* FIXME: @inheritdoc once this file is in the right repo
*/
--
To view, visit https://gerrit.wikimedia.org/r/230093
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ib4ff64589d299cac53a7d12f2a97dfc3149ea65a
Gerrit-PatchSet: 6
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Esanders <[email protected]>
Gerrit-Reviewer: Esanders <[email protected]>
Gerrit-Reviewer: Jdlrobson <[email protected]>
Gerrit-Reviewer: Jforrester <[email protected]>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
