| Index: trunk/extensions/VisualEditor/modules/es/views/es.SurfaceView.js |
| — | — | @@ -119,15 +119,7 @@ |
| 120 | 120 | } |
| 121 | 121 | } ); |
| 122 | 122 | $window.scroll( function() { |
| 123 | | - // FIXME: Is this code in the right place? |
| 124 | 123 | _this.dimensions.scrollTop = $window.scrollTop(); |
| 125 | | - if ( _this.dimensions.scrollTop >= _this.dimensions.toolbarTop ) { |
| 126 | | - $( '#es-toolbar' ).addClass( 'float' ); |
| 127 | | - $( '#es-panes' ).css( 'padding-top', _this.dimensions.toolbarHeight ); |
| 128 | | - } else { |
| 129 | | - $( '#es-toolbar' ).removeClass( 'float' ); |
| 130 | | - $( '#es-panes' ).css( 'padding-top', 0 ); |
| 131 | | - } |
| 132 | 124 | } ); |
| 133 | 125 | |
| 134 | 126 | // Configuration |
| Index: trunk/extensions/VisualEditor/modules/es/views/es.ToolbarView.js |
| — | — | @@ -13,12 +13,42 @@ |
| 14 | 14 | };
|
| 15 | 15 |
|
| 16 | 16 | es.ToolbarView = function( $container, surfaceView ) {
|
| 17 | | - // Reference for use in closures
|
| 18 | | - var _this = this;
|
| 19 | | -
|
| | 17 | + // References for use in closures
|
| | 18 | + var _this = this,
|
| | 19 | + $window = $( window );
|
| | 20 | +
|
| 20 | 21 | this.$ = $container;
|
| 21 | 22 | this.surfaceView = surfaceView;
|
| | 23 | +
|
| | 24 | + /*
|
| | 25 | + * This code is responsible for switching toolbar into floating mode when scrolling (with
|
| | 26 | + * keyboard or mouse). It assumes that original padding-top of next sibiling element is 0
|
| | 27 | + * (if that will be a problem in future we may introduce spacer element and set it height,
|
| | 28 | + * since even remembering original padding-top is not a solution because it may be set in em
|
| | 29 | + * instead of px). |
| | 30 | + */
|
| | 31 | + $window.scroll( function() {
|
| | 32 | + if ( _this.surfaceView.dimensions.scrollTop >= _this.surfaceView.dimensions.toolbarTop ) {
|
| | 33 | + if ( ! _this.$.hasClass( 'float' ) ) {
|
| | 34 | + var left = _this.$.offset().left,
|
| | 35 | + right = $window.width() - _this.$.outerWidth() - left;
|
| 22 | 36 |
|
| | 37 | + _this.$.css( 'right', right );
|
| | 38 | + _this.$.css( 'left', left );
|
| | 39 | +
|
| | 40 | + _this.$.addClass( 'float' );
|
| | 41 | + _this.$.next().css( 'padding-top', _this.$.height() );
|
| | 42 | + }
|
| | 43 | + } else {
|
| | 44 | + if ( _this.$.hasClass( 'float' ) ) {
|
| | 45 | + _this.$.css( 'right', 0 );
|
| | 46 | + _this.$.css( 'left', 0 );
|
| | 47 | + _this.$.removeClass( 'float' );
|
| | 48 | + _this.$.next().css( 'padding-top', 0 );
|
| | 49 | + }
|
| | 50 | + }
|
| | 51 | + } );
|
| | 52 | +
|
| 23 | 53 | this.tools = [
|
| 24 | 54 | {
|
| 25 | 55 | name: 'text',
|
| Index: trunk/extensions/VisualEditor/modules/sandbox/sandbox.css |
| — | — | @@ -10,8 +10,6 @@ |
| 11 | 11 | background-repeat: repeat-x; |
| 12 | 12 | } |
| 13 | 13 | #es-toolbar.float { |
| 14 | | - left: 0; |
| 15 | | - right: 0; |
| 16 | 14 | top: 0; |
| 17 | 15 | position: fixed; |
| 18 | 16 | -webkit-border-radius: 0; |