Amire80 has uploaded a new change for review.
https://gerrit.wikimedia.org/r/65693
Change subject: Scroll secondary ULS into view
......................................................................
Scroll secondary ULS into view
Bug: 47821
Change-Id: I7ad1de7c62dc4ece4c565500f31ae4db1e7708a4
---
M resources/js/ext.uls.displaysettings.js
M resources/js/ext.uls.inputsettings.js
2 files changed, 89 insertions(+), 38 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/UniversalLanguageSelector
refs/changes/93/65693/1
diff --git a/resources/js/ext.uls.displaysettings.js
b/resources/js/ext.uls.displaysettings.js
index f75fc72..c660e54 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -120,6 +120,35 @@
this.listen();
},
+ scrollIntoView: function () {
+ var scrollPosition,
+ padding = 10,
+ $window = $( window ),
+ windowHeight = $window.height(),
+ windowScrollTop = $window.scrollTop(),
+ windowBottom = windowScrollTop + windowHeight,
+ panelHeight = this.$parent.$window.height(),
+ panelTop = this.$parent.$window.offset().top,
+ panelBottom = panelTop + panelHeight;
+
+ // If the ULS panel is out of the viewport,
+ // scroll the window to show it
+ if ( ( panelTop < windowScrollTop ) || ( panelBottom >
windowBottom ) ) {
+ if ( panelHeight > windowHeight ) {
+ // Scroll to show as much of the upper
+ // part of ULS as possible
+ scrollPosition = panelTop - padding;
+ } else {
+ // Scroll just enough to show the ULS
panel
+ scrollPosition = panelBottom -
windowHeight + padding;
+ }
+
+ $( 'html, body' ).stop().animate( {
+ scrollTop: scrollPosition
+ }, 500 );
+ }
+ },
+
/**
* Prepare the UI language selector
*/
@@ -262,13 +291,40 @@
.i18n();
},
onVisible: function () {
- var $parent = $(
'#language-settings-dialog' );
+ var scrollPosition,
+ padding = 10,
+ $window = $( window ),
+ windowHeight = $window.height(),
+ windowScrollTop =
$window.scrollTop(),
+ windowBottom = windowScrollTop
+ windowHeight,
+ panelHeight =
this.$menu.height(),
+ panelTop =
this.$menu.offset().top,
+ panelBottom = panelTop +
panelHeight,
+ $parent = $(
'#language-settings-dialog' );
+
// Re-position the element according to
the window that called it
if ( parseInt( $parent.css( 'left' ),
10 ) ) {
- this.$menu.css( 'left',
$parent.css( 'left' ) );
+ this.$menu.css( 'left',
$parent.css( 'left' ) );
}
if ( parseInt( $parent.css( 'top' ), 10
) ) {
this.$menu.css( 'top',
$parent.css( 'top' ) );
+ }
+
+ // If the ULS panel is out of the
viewport,
+ // scroll the window to show it
+ if ( ( panelTop < windowScrollTop ) ||
( panelBottom > windowBottom ) ) {
+ if ( panelHeight > windowHeight
) {
+ // Scroll to show as
much of the upper
+ // part of ULS as
possible
+ scrollPosition =
panelTop - padding;
+ } else {
+ // Scroll just enough
to show the ULS panel
+ scrollPosition =
panelBottom - windowHeight + padding;
+ }
+
+ $( 'html, body'
).stop().animate( {
+ scrollTop:
scrollPosition
+ }, 500 );
}
},
onSelect: function ( langCode ) {
@@ -485,14 +541,7 @@
} );
$tabButtons.on( 'click', function () {
- var scrollPosition,
- panelHeight, panelTop, panelBottom,
- padding,
- $window,
- windowHeight,
- windowScrollTop,
- windowBottom,
- $button = $( this );
+ var $button = $( this );
if ( $button.hasClass( 'down' ) ) {
return;
@@ -511,32 +560,7 @@
$tabButtons.filter( '.down' ).removeClass(
'down');
$button.addClass( 'down' );
- padding = 10;
- $window = $( window );
- windowHeight = $window.height();
- windowScrollTop = $window.scrollTop();
- windowBottom = windowScrollTop + windowHeight;
-
- panelHeight =
displaySettings.$parent.$window.height();
- panelTop =
displaySettings.$parent.$window.offset().top;
- panelBottom = panelTop + panelHeight;
-
- // If the ULS panel is out of the viewport,
- // scroll the window to show it
- if ( ( panelTop < windowScrollTop ) || (
panelBottom > windowBottom ) ) {
- if ( panelHeight > windowHeight ) {
- // Scroll to show as much of
the upper
- // part of ULS as possible
- scrollPosition = panelTop -
padding;
- } else {
- // Scroll just enough to show
the ULS panel
- scrollPosition = panelBottom -
windowHeight + padding;
- }
-
- $( 'html, body' ).stop().animate( {
- scrollTop: scrollPosition
- }, 500 );
- }
+ displaySettings.scrollIntoView();
} );
},
diff --git a/resources/js/ext.uls.inputsettings.js
b/resources/js/ext.uls.inputsettings.js
index 0abe952..d49e507 100644
--- a/resources/js/ext.uls.inputsettings.js
+++ b/resources/js/ext.uls.inputsettings.js
@@ -319,14 +319,41 @@
.i18n();
},
onVisible: function () {
- var $parent = $(
'#language-settings-dialog' );
+ var scrollPosition,
+ padding = 10,
+ $window = $( window ),
+ windowHeight = $window.height(),
+ windowScrollTop =
$window.scrollTop(),
+ windowBottom = windowScrollTop
+ windowHeight,
+ panelHeight =
this.$menu.height(),
+ panelTop =
this.$menu.offset().top,
+ panelBottom = panelTop +
panelHeight,
+ $parent = $(
'#language-settings-dialog' );
+
// Re-position the element according to
the window that called it
if ( parseInt( $parent.css( 'left' ),
10 ) ) {
- this.$menu.css( 'left',
$parent.css( 'left' ) );
+ this.$menu.css( 'left',
$parent.css( 'left' ) );
}
if ( parseInt( $parent.css( 'top' ), 10
) ) {
this.$menu.css( 'top',
$parent.css( 'top' ) );
}
+
+ // If the ULS panel is out of the
viewport,
+ // scroll the window to show it
+ if ( ( panelTop < windowScrollTop ) ||
( panelBottom > windowBottom ) ) {
+ if ( panelHeight > windowHeight
) {
+ // Scroll to show as
much of the upper
+ // part of ULS as
possible
+ scrollPosition =
panelTop - padding;
+ } else {
+ // Scroll just enough
to show the ULS panel
+ scrollPosition =
panelBottom - windowHeight + padding;
+ }
+
+ $( 'html, body'
).stop().animate( {
+ scrollTop:
scrollPosition
+ }, 500 );
+ }
},
onSelect: function ( langCode ) {
inputSettings.enableApplyButton();
--
To view, visit https://gerrit.wikimedia.org/r/65693
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I7ad1de7c62dc4ece4c565500f31ae4db1e7708a4
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/UniversalLanguageSelector
Gerrit-Branch: master
Gerrit-Owner: Amire80 <amir.ahar...@mail.huji.ac.il>
Gerrit-Reviewer: jenkins-bot
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
