Robert Vogel has uploaded a new change for review.
https://gerrit.wikimedia.org/r/207757
Change subject: Added "scroll to top" link
......................................................................
Added "scroll to top" link
This new link will be available to all skins that inherit from
BlueSpiceSkin
Change-Id: I956837b25a1574e515f1890777569ab0f1ccd2af
---
M BlueSpiceSkin.php
M i18n/en.json
M i18n/qqq.json
A resources/components/skin.scrollToTop.js
A resources/components/skin.scrollToTop.less
5 files changed, 94 insertions(+), 4 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/skins/BlueSpiceSkin
refs/changes/57/207757/1
diff --git a/BlueSpiceSkin.php b/BlueSpiceSkin.php
index 79f4642..02e38ec 100644
--- a/BlueSpiceSkin.php
+++ b/BlueSpiceSkin.php
@@ -49,15 +49,19 @@
'BlueSpiceSkin/resources/components/skin.navigationTabs.js',
'BlueSpiceSkin/resources/components/skin.contentActions.js',
'BlueSpiceSkin/resources/components/skin.menuTop.js',
+ 'BlueSpiceSkin/resources/components/skin.scrollToTop.js',
'BlueSpiceSkin/resources/components/skin.dataAfterContent.js',
'BlueSpiceSkin/resources/components/extension.widgetbar.js',
'BlueSpiceSkin/resources/components/special.preferences.js'
),
'messages' => array(
- 'bs-tools-button'
+ 'bs-tools-button',
+ 'bs-to-top-desc'
),
'position' => 'top',
- 'styles' => array(),
+ 'styles' => array(
+ 'BlueSpiceSkin/resources/components/skin.scrollToTop.less'
+ ),
'dependencies' => array(
'mediawiki.jqueryMsg',
'jquery.ui.tabs',
diff --git a/i18n/en.json b/i18n/en.json
index 6602000..f8307c5 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -8,5 +8,6 @@
"bs-tools-widgets-headline": "WIDGETS",
"bs-tools-button": "MORE",
"bs-title-actions-print-text": "Print",
- "bs-title-actions-print-title": "Displays printable version of the page"
+ "bs-title-actions-print-title": "Displays printable version of the
page",
+ "bs-to-top-desc": "Scroll to the top of the page"
}
diff --git a/i18n/qqq.json b/i18n/qqq.json
index feab887..ce9da7e 100644
--- a/i18n/qqq.json
+++ b/i18n/qqq.json
@@ -10,5 +10,6 @@
"bs-tools-widgets-headline": "Headline of widget
container.\n{{Identical|Widget}}",
"bs-tools-button": "Anchor alternative text for
more.\n{{Identical|More}}",
"bs-title-actions-print-text": "Anchor alternative text for
print.\n{{Identical|Print}}",
- "bs-title-actions-print-title": "Tooltip for the button to display
printable version of the page."
+ "bs-title-actions-print-title": "Tooltip for the button to display
printable version of the page.",
+ "bs-to-top-desc": "Tooltip for a link that scrolls to the top of the
page"
}
diff --git a/resources/components/skin.scrollToTop.js
b/resources/components/skin.scrollToTop.js
new file mode 100644
index 0000000..992356f
--- /dev/null
+++ b/resources/components/skin.scrollToTop.js
@@ -0,0 +1,45 @@
+//CREDITS: http://codyhouse.co/demo/back-to-top/index.html
+(function(mw, $, bs, d, undefined ){
+ $(function(){
+ //Inject link to <body>
+ var anchor = mw.html.element(
+ 'a',
+ {
+ href: '#',
+ class: 'bs-top icon-arrow-up5',
+ id: 'bs-top',
+ title: mw.message('bs-to-top-desc').plain()
+ },
+ ''
+ );
+ $(anchor).appendTo($('body'));
+
+ //Wire up show/hide functions for main link
+ $(window).scroll(function(){
+ if( $(this).scrollTop() > bs.skin.scrollToTop.offset ) {
+ $('#bs-top').addClass('bs-top-is-visible');
+ }
+ else {
+ $('#bs-top').removeClass('bs-top-is-visible');
+ }
+ });
+
+ //Every .bs-top will scroll up
+ $(d).on('click', '.bs-top', function(e){
+ e.preventDefault();
+ $('body,html').animate(
+ {
+ scrollTop: 0
+ },
+ bs.skin.scrollToTop.duration
+ );
+ });
+ });
+
+ bs.skin = bs.skin || {};
+ bs.skin.scrollToTop = bs.skin.scrollToTop || {
+ duration: 700,
+ offset: 300
+ };
+
+})( mediaWiki, jQuery, blueSpice, document);
\ No newline at end of file
diff --git a/resources/components/skin.scrollToTop.less
b/resources/components/skin.scrollToTop.less
new file mode 100644
index 0000000..b08c537
--- /dev/null
+++ b/resources/components/skin.scrollToTop.less
@@ -0,0 +1,39 @@
+#bs-top {
+ font-size: 300%;
+ position: fixed;
+ bottom: 100px;
+ right: 10px;
+ z-index: 10;
+ visibility: hidden;
+ opacity: 0;
+ -webkit-transition: opacity .3s 0s, visibility 0s .3s;
+ -moz-transition: opacity .3s 0s, visibility 0s .3s;
+ transition: opacity .3s 0s, visibility 0s .3s;
+ color: @bs-color-primary;
+ &:hover{
+ color: @bs-color-secondary;
+ }
+}
+#bs-top.bs-top-is-visible, .bs-top-is-visible, .bs-top:hover {
+ -webkit-transition: opacity .3s 0s, visibility 0s 0s;
+ -moz-transition: opacity .3s 0s, visibility 0s 0s;
+ transition: opacity .3s 0s, visibility 0s 0s;
+}
+#bs-top.bs-top-is-visible, .bs-top-is-visible {
+ visibility: visible;
+ opacity: 1;
+}
+@media only screen and (min-width: 768px) {
+ #bs-top {
+ right: 20px;
+ bottom: 20px;
+ }
+}
+@media only screen and (min-width: 1024px) {
+ #bs-top {
+ height: 60px;
+ width: 60px;
+ right: 30px;
+ bottom: 30px;
+ }
+}
\ No newline at end of file
--
To view, visit https://gerrit.wikimedia.org/r/207757
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I956837b25a1574e515f1890777569ab0f1ccd2af
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/skins/BlueSpiceSkin
Gerrit-Branch: master
Gerrit-Owner: Robert Vogel <vo...@hallowelt.biz>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
