Esanders has uploaded a new change for review.
https://gerrit.wikimedia.org/r/175305
Change subject: Move toolbar scroll hack to surface
......................................................................
Move toolbar scroll hack to surface
Instead of having the toolbar scroll the surface, just tell the surface
the toolbar's height and let it scroll itself into view. Knowing the
toolbar's height will be useful for other interfaces that need to know
if something is in view.
Change-Id: I854951de6aa6c9053013b9e35417508ed6a9451f
---
M src/ce/ve.ce.Surface.js
M src/ui/ve.ui.Surface.js
M src/ui/ve.ui.Toolbar.js
3 files changed, 35 insertions(+), 48 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/VisualEditor/VisualEditor
refs/changes/05/175305/1
diff --git a/src/ce/ve.ce.Surface.js b/src/ce/ve.ce.Surface.js
index 9309e8b..83556ea 100644
--- a/src/ce/ve.ce.Surface.js
+++ b/src/ce/ve.ce.Surface.js
@@ -1253,6 +1253,24 @@
this.selecting = false;
this.emit( 'selectionEnd' );
}
+
+ var nativeRange, clientRect, scrollTo;
+
+ if ( !this.surface.toolbarHeight ) {
+ return;
+ }
+
+ nativeRange = this.getNativeRange();
+ if ( !nativeRange ) {
+ return null;
+ }
+
+ clientRect = RangeFix.getBoundingClientRect( nativeRange );
+
+ if ( clientRect && clientRect.top < this.surface.toolbarHeight ) {
+ scrollTo = this.$window.scrollTop() + clientRect.top -
this.surface.toolbarHeight;
+ this.$window.scrollTop( scrollTo );
+ }
};
/**
diff --git a/src/ui/ve.ui.Surface.js b/src/ui/ve.ui.Surface.js
index 76f9372..2d146fe 100644
--- a/src/ui/ve.ui.Surface.js
+++ b/src/ui/ve.ui.Surface.js
@@ -52,6 +52,8 @@
this.showProgressDebounced = ve.debounce( this.showProgress.bind( this
) );
this.filibuster = null;
+ this.toolbarHeight = 0;
+
// Initialization
this.$menus.append( this.context.$element );
this.$element
@@ -365,6 +367,17 @@
};
/**
+ * Set the current height of the toolbar.
+ *
+ * Used for scroll-into-view calculations.
+ *
+ * @param {number} toolbarHeight Toolbar height
+ */
+ve.ui.Surface.prototype.setToolbarHeight = function ( toolbarHeight ) {
+ this.toolbarHeight = toolbarHeight;
+};
+
+/**
* Create a progress bar in the progress dialog
*
* @param {jQuery.Promise} progressCompletePromise Promise which resolves when
the progress action is complete
diff --git a/src/ui/ve.ui.Toolbar.js b/src/ui/ve.ui.Toolbar.js
index e6aef7d..902b89f 100644
--- a/src/ui/ve.ui.Toolbar.js
+++ b/src/ui/ve.ui.Toolbar.js
@@ -28,7 +28,6 @@
this.floating = false;
this.floatable = false;
this.$window = null;
- this.$surfaceView = null;
this.elementOffset = null;
this.windowEvents = {
// Must use Function#bind (or a closure) instead of direct
reference
@@ -36,9 +35,6 @@
// to avoid $window.off() from unbinding other toolbars' event
handlers.
resize: toolbar.onWindowResize.bind( toolbar ),
scroll: toolbar.onWindowScroll.bind( toolbar )
- };
- this.surfaceViewEvents = {
- keyup: toolbar.onSurfaceViewKeyUp.bind( toolbar )
};
// Default directions
this.contextDirection = { inline: 'ltr', block: 'ltr' };
@@ -102,42 +98,6 @@
left: this.elementOffset.left,
right: this.elementOffset.right
} );
- }
-};
-
-/**
- * Method to scroll the content editable surface to the cursor position.
- *
- * This is for when the cursor is obscured by a floating toolbar.
- *
- * FIXME: this code should be in a target class or something
- */
-ve.ui.Toolbar.prototype.onSurfaceViewKeyUp = function () {
- var surfaceView, nativeRange, clientRect, barHeight, scrollTo, obscured;
-
- if ( !this.floating ) {
- return;
- }
-
- surfaceView = this.getSurface().getView();
-
- nativeRange = surfaceView.getNativeRange();
- if ( !nativeRange ) {
- return null;
- }
-
- clientRect = RangeFix.getBoundingClientRect( nativeRange );
- if ( !clientRect ) {
- return;
- }
-
- barHeight = this.$bar.height();
- obscured = clientRect.top < barHeight;
-
- // If toolbar is floating and cursor is obscured, scroll cursor into
view
- if ( obscured ) {
- scrollTo = this.$window.scrollTop() + clientRect.top -
barHeight;
- this.$window.scrollTop( scrollTo );
}
};
@@ -239,7 +199,6 @@
// Properties
this.$window = this.$( this.getElementWindow() );
- this.$surfaceView = this.surface.getView().$element;
this.calculateOffset();
// Initial state
@@ -247,7 +206,6 @@
if ( this.floatable ) {
this.$window.on( this.windowEvents );
- this.$surfaceView.on( this.surfaceViewEvents );
// The page may start with a non-zero scroll position
this.onWindowScroll();
}
@@ -279,16 +237,18 @@
*/
ve.ui.Toolbar.prototype.float = function () {
if ( !this.floating ) {
+ var height = this.$element.height();
// When switching into floating mode, set the height of the
wrapper and
// move the bar to the same offset as the in-flow element
this.$element
- .css( 'height', this.$element.height() )
+ .css( 'height', height )
.addClass( 've-ui-toolbar-floating' );
this.$bar.css( {
left: this.elementOffset.left,
right: this.elementOffset.right
} );
this.floating = true;
+ this.surface.setToolbarHeight( height );
}
};
@@ -302,6 +262,7 @@
.removeClass( 've-ui-toolbar-floating' );
this.$bar.css( { left: '', right: '' } );
this.floating = false;
+ this.surface.setToolbarHeight( 0 );
}
};
@@ -317,7 +278,6 @@
if ( this.initialized ) {
this.$window.on( this.windowEvents );
- this.$surfaceView.on( this.surfaceViewEvents );
}
};
@@ -327,10 +287,6 @@
ve.ui.Toolbar.prototype.disableFloatable = function () {
if ( this.$window ) {
this.$window.off( this.windowEvents );
- }
-
- if ( this.$surfaceView ) {
- this.$surfaceView.off( this.surfaceViewEvents );
}
if ( this.floating ) {
--
To view, visit https://gerrit.wikimedia.org/r/175305
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I854951de6aa6c9053013b9e35417508ed6a9451f
Gerrit-PatchSet: 1
Gerrit-Project: VisualEditor/VisualEditor
Gerrit-Branch: master
Gerrit-Owner: Esanders <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
