From a2792df9c998b99c2422b1b353877bbdf56e8571 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Tue, 29 Sep 2020 19:32:18 +0200 Subject: [PATCH] wait #3789 @2 --- images/interface.svg | 40 ++++++++++ images/slick/ajax-loader.gif | Bin 4178 -> 0 bytes js/libs/fluidbook/fluidbook.accessibility.js | 5 +- js/libs/fluidbook/fluidbook.help.js | 53 ++++++++++--- js/libs/fluidbook/fluidbook.input.js | 39 ++++++++-- js/libs/fluidbook/fluidbook.keyboard.js | 2 +- js/libs/slick/slick.min.js | 1 - style/help.less | 75 +++++++++++++++++-- 8 files changed, 190 insertions(+), 25 deletions(-) delete mode 100755 images/slick/ajax-loader.gif delete mode 100644 js/libs/slick/slick.min.js diff --git a/images/interface.svg b/images/interface.svg index b97cd6ab..a32ecd3d 100644 --- a/images/interface.svg +++ b/images/interface.svg @@ -152,4 +152,44 @@ C19.5,15.6,19.8,15.5,19.9,15.2z M10.2,20c0,0.4-0.3,0.7-0.7,0.7S8.8,20.4,8.8,20s0.3-0.7,0.7-0.7S10.2,19.6,10.2,20z M17.7,20.7 c-0.4,0-0.7-0.3-0.7-0.7s0.3-0.7,0.7-0.7s0.7,0.3,0.7,0.7S18.1,20.7,17.7,20.7z M8.8,14.1L7.5,8.8h13.2l-2,5.4H8.8V14.1z"/> + + + + + + + + + + + + + + + + diff --git a/images/slick/ajax-loader.gif b/images/slick/ajax-loader.gif deleted file mode 100755 index e0e6e9760bc04861cc4771e327f22ed7962e0858..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4178 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 diff --git a/js/libs/fluidbook/fluidbook.accessibility.js b/js/libs/fluidbook/fluidbook.accessibility.js index cb9b3018..65525eeb 100644 --- a/js/libs/fluidbook/fluidbook.accessibility.js +++ b/js/libs/fluidbook/fluidbook.accessibility.js @@ -24,9 +24,7 @@ FluidbookAccessibility.prototype = { if (Modernizr.audio) { this.audiodescription.setupPages(); } - this.updateTexts(); - }, updateTexts: function () { @@ -81,8 +79,9 @@ FluidbookAccessibility.prototype = { }); add_event_listener('keydown', function (e) { - if(e.keyCode===9) { + if (e.keyCode === 9) { $('body').addClass('keyboard-navigating'); + fluidbook.input.useKeyboard(); set_css(''); } }); diff --git a/js/libs/fluidbook/fluidbook.help.js b/js/libs/fluidbook/fluidbook.help.js index 079ceaf3..acbdc3f8 100644 --- a/js/libs/fluidbook/fluidbook.help.js +++ b/js/libs/fluidbook/fluidbook.help.js @@ -57,11 +57,20 @@ FluidbookHelp.prototype = { } else { var name = 'fingers'; var text = this.fluidbook.l10n.__("tap twice or spread your fingers to zoom in"); - help += '
' + this.fluidbook.loader.getImage('data/images/help-' + name + '.svg', 400 * touchzoom, 200 * touchzoom); + help += '
' + getSpriteIcon('help-touch-zoom', { + width: 180 * touchzoom, + height: 170 * touchzoom + }); help += '

' + text + '

'; help += '
'; } + + help += '
'; + help += '
Ctrl++
Ctrl+-
'; + help += '

' + this.fluidbook.l10n.__('zoom in and zoom out') + '

'; + help += '
' + name = 'mouse'; if (this.fluidbook.mobilefirst.enabled) { text = this.fluidbook.l10n.__('scroll down to read the page content'); @@ -69,7 +78,10 @@ FluidbookHelp.prototype = { text = this.fluidbook.l10n.__('click once to zoom in, click again to zoom out') + '
' + this.fluidbook.l10n.__('roll the mouse wheel to zoom in/out'); } - help += '
' + this.fluidbook.loader.getImage('data/images/help-' + name + '.svg', 100 * mousezoom, 200 * mousezoom); + help += '
' + getSpriteIcon('help-mouse', { + width: 60 * mousezoom, + height: 100 * mousezoom + }); help += '

' + text + '

'; help += '
'; @@ -99,6 +111,13 @@ FluidbookHelp.prototype = { return; } + var shortcuts = $(this).attr('aria-keyshortcuts'); + if (shortcuts === null || shortcuts === undefined || shortcuts === '') { + shortcuts = []; + } else { + shortcuts = shortcuts.split('+'); + } + var icon = $(this).find('.nav-icon:visible:first'); // Must get first visible icon so "toggle" icons work if (icon.length > 0) { var offset = icon.offset(); @@ -119,7 +138,7 @@ FluidbookHelp.prototype = { if ($(this).parents("#afterSearch").length > 0) { c = 'afterSearch'; } - help += '
' + text + '
'; + help += '
' + $this.keyboardShortcut(shortcuts) + text + '
'; h -= hStep; } }); @@ -144,10 +163,10 @@ FluidbookHelp.prototype = { if (this.fluidbook.interface.arrowsEnabled()) { var labels = this.fluidbook.interface.getLabels(); help += '
'; - help += ''; - help += '
' + labels.last + '
'; - help += ''; - help += '
' + labels.first + '
'; + help += ''; + help += '
' + labels.last + this.keyboardShortcut(['End']) + '
'; + help += ''; + help += '
' + this.keyboardShortcut(['Home']) + labels.first + '
'; help += '
'; } if ($("#slider").length > 0) { @@ -466,13 +485,29 @@ FluidbookHelp.prototype = { html += $('
')[0].outerHTML; // Help text label - html += $('
' + this.fluidbook.l10n.__('add / remove bookmark') + '
')[0].outerHTML; + html += $('
' + this.keyboardShortcut(['Ctrl', 'Alt', 'D']) + this.fluidbook.l10n.__('add / remove bookmark') + '
')[0].outerHTML; var wrapper = $('
' + html + '
')[0].outerHTML if (wrapper === undefined || wrapper === 'undefined') { return ''; } return wrapper; - } + }, + + keyboardShortcut: function (keys) { + if (keys.length === 0) { + return ''; + } + var map = {Control: 'Ctrl'}; + var norm = []; + $.each(keys, function (k, v) { + if (map[v] !== undefined) { + norm.push(map[v]); + } else { + norm.push(v); + } + }); + return '
' + norm.join('+') + '
'; + }, } diff --git a/js/libs/fluidbook/fluidbook.input.js b/js/libs/fluidbook/fluidbook.input.js index b5413f8c..b6a6ac62 100644 --- a/js/libs/fluidbook/fluidbook.input.js +++ b/js/libs/fluidbook/fluidbook.input.js @@ -6,6 +6,9 @@ function FluidbookInput(fluidbook) { this.usingTouch = false; this.hasTouch = false; this.forceTouch = false; + this.hasKeyboard = false; + this.usingKeyboard = false; + this.forceKeyboard = false; this.init(); } @@ -16,16 +19,17 @@ FluidbookInput.prototype = { this.hasTouch = true; } else { this.usingMouse = this.hasMouse = this.forceMouse = true; + this.usingKeyboard = this.forceKeyboard = false; + this.hasKeyboard = true; this.usingTouch = this.hasTouch = this.forceTouch = false; this.setMouseClasses(); - return; } if (Modernizr.ios || Modernizr.android) { this.usingTouch = this.hasTouch = this.forceTouch = true; this.usingMouse = this.hasMouse = this.forceMouse = false; + this.usingKeyboard = this.hasKeyboard = this.forceKeyboard = false; this.setTouchClasses(); - return; } this.forceTouch = this.forceMouse = false; @@ -48,32 +52,55 @@ FluidbookInput.prototype = { isUsingMouse: function () { return this.usingMouse; }, + isUsingKeyboard: function () { + return this.usingKeyboard; + }, useTouch: function () { if (!this.usingTouch) { this.hasTouch = this.usingTouch = true; - this.usingMouse = false; + this.usingKeyboard = this.usingMouse = false; this.setTouchClasses(); } }, useMouse: function () { if (!this.usingMouse) { this.hasMouse = this.usingMouse = true; - this.usingTouch = false; + this.usingKeyboard = this.usingTouch = false; this.setMouseClasses(); } }, + useKeyboard: function () { + if (!this.usingKeyboard) { + this.hasKeyboard = this.usingKeyboard = true; + this.usingMouse = this.usingTouch = false; + this.setKeyboardClasses(); + } + }, setTouchClasses: function () { $('html').removeClass('using-mouse') .removeClass('no-using-touch') + .removeClass('using-keyboard') .addClass('no-using-mouse') - .addClass('using-touch'); + .addClass('using-touch') + .addClass('no-using-keyboard'); + }, setMouseClasses: function () { $('html').addClass('using-mouse') .addClass('no-using-touch') + .addClass('no-using-keyboard') .removeClass('no-using-mouse') - .removeClass('using-touch'); + .removeClass('using-touch') + .removeClass('using-keyboard'); + }, + setKeyboardClasses: function () { + $('html').addClass('using-keyboard') + .addClass('no-using-touch') + .addClass('no-using-mouse') + .removeClass('no-using-keyboard') + .removeClass('using-touch') + .removeClass('using-mouse'); } }; \ No newline at end of file diff --git a/js/libs/fluidbook/fluidbook.keyboard.js b/js/libs/fluidbook/fluidbook.keyboard.js index 6920a654..7cfa8fe7 100644 --- a/js/libs/fluidbook/fluidbook.keyboard.js +++ b/js/libs/fluidbook/fluidbook.keyboard.js @@ -121,7 +121,6 @@ FluidbookKeyboard.prototype = { }); this.keyShortcut('up,down', function (e, handler) { - if ($this.fluidbook.search.isHintsNavOpened()) { $this.fluidbook.search.navigateHint(handler.key === 'down' ? 1 : -1); e.preventDefault(); @@ -203,6 +202,7 @@ FluidbookKeyboard.prototype = { } hotkeys(s.shortcuts, s.options, function (e, handler) { func(e, handler); + fluidbook.input.useKeyboard(); if (preventDefault) { e.preventDefault(); } diff --git a/js/libs/slick/slick.min.js b/js/libs/slick/slick.min.js deleted file mode 100644 index 42172c2f..00000000 --- a/js/libs/slick/slick.min.js +++ /dev/null @@ -1 +0,0 @@ -!function(i){"use strict";"function"==typeof define&&define.amd?define(["jquery"],i):"undefined"!=typeof exports?module.exports=i(require("jquery")):i(jQuery)}(function(i){"use strict";var e=window.Slick||{};(e=function(){var e=0;return function(t,o){var s,n=this;n.defaults={accessibility:!0,adaptiveHeight:!1,appendArrows:i(t),appendDots:i(t),arrows:!0,asNavFor:null,prevArrow:'',nextArrow:'',autoplay:!1,autoplaySpeed:3e3,centerMode:!1,centerPadding:"50px",cssEase:"ease",customPaging:function(e,t){return i('