wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-09-25 11:16:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make toolbar float nicely in demo and in MediaWiki sandbox special page.

Browse source
This commit is contained in:
Inez Korczynski 2011-11-29 00:58:40 +00:00
parent 2ecd479349
commit dc7e601ef0
3 changed files with 33 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
modules/es/views/es.SurfaceView.js
View file

@ -119,15 +119,7 @@ es.SurfaceView = function( $container, model ) {
}
} );
$window.scroll( function() {
// FIXME: Is this code in the right place?
_this.dimensions.scrollTop = $window.scrollTop();
if ( _this.dimensions.scrollTop >= _this.dimensions.toolbarTop ) {
$( '#es-toolbar' ).addClass( 'float' );
$( '#es-panes' ).css( 'padding-top', _this.dimensions.toolbarHeight );
} else {
$( '#es-toolbar' ).removeClass( 'float' );
$( '#es-panes' ).css( 'padding-top', 0 );
}
} );
// Configuration

36
modules/es/views/es.ToolbarView.js
View file

@ -13,11 +13,41 @@ var i18n = function( key ) {
};
es.ToolbarView = function( $container, surfaceView ) {
// Reference for use in closures
var _this = this;
// References for use in closures
var _this = this,
$window = $( window );
this.$ = $container;
this.surfaceView = surfaceView;
/*
* This code is responsible for switching toolbar into floating mode when scrolling (with
* keyboard or mouse). It assumes that original padding-top of next sibiling element is 0
* (if that will be a problem in future we may introduce spacer element and set it height,
* since even remembering original padding-top is not a solution because it may be set in em
* instead of px).
*/
$window.scroll( function() {
if ( _this.surfaceView.dimensions.scrollTop >= _this.surfaceView.dimensions.toolbarTop ) {
if ( ! _this.$.hasClass( 'float' ) ) {
var left = _this.$.offset().left,
right = $window.width() - _this.$.outerWidth() - left;
_this.$.css( 'right', right );
_this.$.css( 'left', left );
_this.$.addClass( 'float' );
_this.$.next().css( 'padding-top', _this.$.height() );
}
} else {
if ( _this.$.hasClass( 'float' ) ) {
_this.$.css( 'right', 0 );
_this.$.css( 'left', 0 );
_this.$.removeClass( 'float' );
_this.$.next().css( 'padding-top', 0 );
}
}
} );
this.tools = [
{

2
modules/sandbox/sandbox.css
View file

@ -10,8 +10,6 @@
background-repeat: repeat-x;
}
#es-toolbar.float {
left: 0;
right: 0;
top: 0;
position: fixed;
-webkit-border-radius: 0;