From 17038bac0646f59cbd2f4285aafde840a03ca995 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Tue, 17 Sep 2019 15:58:19 +0200 Subject: [PATCH] fix #2971 @1.5 --- _index.html | 2 +- js/libs/fluidbook/fluidbook.menu.js | 2 +- js/libs/fluidbook/fluidbook.nav.js | 147 +++++++++++++++------------- style/fluidbook.less | 27 ++++- 4 files changed, 106 insertions(+), 72 deletions(-) diff --git a/_index.html b/_index.html index 4f281629..1d662a7f 100644 --- a/_index.html +++ b/_index.html @@ -85,7 +85,7 @@ - +
diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js index 1243320b..3cf7133b 100644 --- a/js/libs/fluidbook/fluidbook.menu.js +++ b/js/libs/fluidbook/fluidbook.menu.js @@ -45,7 +45,7 @@ FluidbookMenu.prototype = { bookmark: 'thumbnails', video: 'extras' }; - if (!OFFLINEAPP && this.fluidbook.gal != null && preload[view] != undefined) { + if (!OFFLINEAPP && this.fluidbook.gal != null && preload[view] !== undefined) { this.fluidbook.displayLoader(); this.fluidbook.resetWaiters(); var w = this.fluidbook.addWaiter(true); diff --git a/js/libs/fluidbook/fluidbook.nav.js b/js/libs/fluidbook/fluidbook.nav.js index aad05109..8775db05 100644 --- a/js/libs/fluidbook/fluidbook.nav.js +++ b/js/libs/fluidbook/fluidbook.nav.js @@ -18,10 +18,10 @@ FluidbookNav.prototype = { var $this = this, dir = this.fluidbook.l10n.dir, inverted = this.fluidbook.datas.invertMenuPosition, - side = ((dir == 'ltr' && inverted) || (dir == 'rtl' && !inverted)) ? 'right' : 'left'; + side = ((dir === 'ltr' && inverted) || (dir === 'rtl' && !inverted)) ? 'right' : 'left'; var extensions = ['pagedim-black', 'position-front']; - if (side == 'right') { + if (side === 'right') { extensions.push('position-right'); } @@ -135,7 +135,7 @@ FluidbookNav.prototype = { // } else { // src += 'png'; // } - // if (this._dimensions[name] == undefined) { + // if (this._dimensions[name] === undefined) { // return ''; // } // return this.fluidbook.loader.getImage(src, this._dimensions[name][0], this._dimensions[name][1]); @@ -149,7 +149,7 @@ FluidbookNav.prototype = { } var l = $(this.getLink(name, href, id, title, help, className, showIcon, navType)), li = '
  • ' + l[0].outerHTML + '
    • '; - if (before == undefined) { + if (before === undefined) { $nav.find('ul').append(li); } else { $nav.find("ul #" + before).before(li); @@ -157,31 +157,31 @@ FluidbookNav.prototype = { return $("#" + elementID).get(0); }, getLink: function (name, href, id, title, help, className, showIcon, navType) { - if (showIcon == undefined) { + if (showIcon === undefined) { showIcon = true; } var res = ''; - if (id != undefined) { + if (id !== undefined) { // Make sure that the link gets a unique ID when it is used in both menus - var elementID = (navType == undefined) ? id : navType + '_' + id; + var elementID = (navType === undefined) ? id : navType + '_' + id; res += ' id="' + elementID + '"'; // Links may exist more than once so add a class name based on the ID // This class name can be used by event handlers to handle all instances // For more specific behaviour, the ID can be targeted - className = (className == undefined) ? 'icon-' + id : className + ' icon-' + id; + className = (className === undefined) ? 'icon-' + id : className + ' icon-' + id; } - if (className != undefined) { + if (className !== undefined) { res += ' class="' + className + '"'; } // Only the horizontal icon menu should have the tooltips - if (navType == 'horizontalNav') { - if (help != undefined && help != '') { + if (navType === 'horizontalNav') { + if (help !== undefined && help !== '') { res += ' data-tooltip="' + this.fluidbook.l10n.__(help) + '"'; } } @@ -192,20 +192,20 @@ FluidbookNav.prototype = { res += getSpriteIcon(name); // Special case for icons that have an additional state - if (name == 'nav-fullscreen') { + if (name === 'nav-fullscreen') { res += getSpriteIcon('nav-fullscreen-exit'); } } // Only the Menu should have titles + the locales icon in the horizontal menu - if (navType == 'menu' || id == 'locales') { - if (title != undefined && title != '') { + if (navType === 'menu' || id === 'locales') { + if (title !== undefined && title !== '') { res += ' ' + this.fluidbook.l10n.__(title) + ''; } } // If there's no link defined, return the text an icon wrapped in a (useful for MMenu) - if (href == '') { + if (href === '') { return ''; } else { return ''; @@ -226,13 +226,13 @@ FluidbookNav.prototype = { }, setNav: function (navType) { - if (typeof navType == 'undefined') { + if (typeof navType === 'undefined') { return false; } var $nav = this.getNavFromType(navType); - if (this._inited[navType] == true) { + if (this._inited[navType] === true) { return; } this._inited[navType] = true; @@ -257,7 +257,7 @@ FluidbookNav.prototype = { } // MMenu specific elements - if (navType == 'menu') { + if (navType === 'menu') { // Use navOrderH (mobile icon order) if it is set if (this.fluidbook.datas.navOrderH.length > 0) { @@ -275,7 +275,7 @@ FluidbookNav.prototype = { this.searchHTML = ''; // Save for later so it can be injected after MMenu is rendered // Horizontal icon nav - } else if (navType == 'horizontalNav') { + } else if (navType === 'horizontalNav') { $nav.append('
      '); @@ -321,7 +321,7 @@ FluidbookNav.prototype = { ]; // Fallback to default list if navOrder is still empty for some reason - if (navOrder.length == 0) { + if (navOrder.length === 0) { navOrder = all; } @@ -340,20 +340,20 @@ FluidbookNav.prototype = { for (var i in thisall) { var icon = thisall[i]; - var visible = hide.indexOf(icon) == -1; - if (!visible && navType == 'menu') { + var visible = hide.indexOf(icon) === -1; + if (!visible && navType === 'menu') { continue; } var link = null; var link2 = null; - if (icon == 'home' && !skipHome) { + if (icon === 'home' && !skipHome) { var homeURL = this.fluidbook.datas.home; var homeRequireLoader = true; - if (this.fluidbook.datas.home == '%apphome%' || forceHome && DATAS.phonegap) { + if (this.fluidbook.datas.home === '%apphome%' || forceHome && DATAS.phonegap) { homeURL = decodeURIComponent(window.localStorage.getItem('apphome')); } - if ($_GET['home'] != null) { + if ($_GET['home'] !== null) { if ($_GET['home'].indexOf("%253A") <= 6) { $_GET['home'] = decodeURIComponent(decodeURIComponent($_GET['home'])); } @@ -366,7 +366,7 @@ FluidbookNav.prototype = { homeRequireLoader = false; } try { - if (homeURL != '') { + if (homeURL !== '') { link = this.addLink(navType, 'nav-home', homeURL, 'home', 'home', 'home'); } } catch (err) { @@ -387,20 +387,20 @@ FluidbookNav.prototype = { return false; }); - } else if (icon == 'index') { + } else if (icon === 'index') { link = this.addLink(navType, 'nav-index', '#/index', 'index', 'overview', 'overview'); - } else if (icon == 'chapters') { + } else if (icon === 'chapters') { if (!this.fluidbook.datas.displayChaptersIcon) { continue; } if (this.fluidbook.datas.externalChaptersHTML) { link = this.addLink(navType, 'nav-chapters', '#/chapters', 'chapters', 'chapters', 'chapters'); - } else if (this.fluidbook.datas.chaptersPage != '') { + } else if (this.fluidbook.datas.chaptersPage !== '') { link = this.addLink(navType, 'nav-chapters', '#/page/' + this.fluidbook.datas.chaptersPage, 'chapters', 'chapters', 'chapters'); } else if (this.fluidbook.datas.chapters.length > 0) { // NOTE: Currently the MMenu breaks when the non-cascading chapter UL HTML is inserted so it will // be opened in a popup for now. Todo: fix this so it works as a sub panel of it's own - if (navType == 'menu' && this.fluidbook.datas.chaptersCascade && !this.fluidbook.datas.displayChaptersPopup) { + if (navType === 'menu' && this.fluidbook.datas.chaptersCascade && !this.fluidbook.datas.displayChaptersPopup) { link = this.addLink(navType, 'nav-chapters', '', 'chapters', 'chapters', 'chapters'); // Get HTML for submenus (appended later) @@ -411,25 +411,25 @@ FluidbookNav.prototype = { } } // Sharing icons - this may contain many different icons - } else if (icon == 'friend') { + } else if (icon === 'friend') { if (this.fluidbook.share.isEnabled()) { - if (navType == 'horizontalNav') { + if (navType === 'horizontalNav') { if (this.fluidbook.datas.share) { link = this.addLink(navType, 'nav-share', '#/share', 'share', 'share', 'share'); } - } else if (navType == 'menu') { + } else if (navType === 'menu') { // Save HTML so it can be added to menu once MMenu is initialised this.shareLinksHTML = ''; } } - } else if (icon == 'bookmark' && this.fluidbook.datas.bookmark) { + } else if (icon === 'bookmark' && this.fluidbook.datas.bookmark) { link = this.addLink(navType, 'nav-bookmarks', '#/bookmark', 'bookmarks', 'bookmarks', 'bookmarks'); - } else if (icon == 'pdf' && this.fluidbook.datas.pdf) { + } else if (icon === 'pdf' && this.fluidbook.datas.pdf) { link = this.addLink(navType, 'nav-download', '#', 'download', 'download', 'download'); - } else if (icon == 'print' && this.fluidbook.datas.print) { + } else if (icon === 'print' && this.fluidbook.datas.print) { link = this.addLink(navType, 'nav-print', '#', 'print', 'print', 'print'); - } else if (icon == 'basket' && this.fluidbook.cart != undefined && this.fluidbook.cart.enabled) { + } else if (icon === 'basket' && this.fluidbook.cart !== undefined && this.fluidbook.cart.enabled) { link = this.addLink(navType, 'nav-basket', '#/cart', 'cart', 'basket', 'basket'); $(this.fluidbook).on('fluidbook.cart.updateIcon', {link: $(link).attr('id')}, function (e, data) { var n = data.number; @@ -449,37 +449,37 @@ FluidbookNav.prototype = { } catch (e) { } - } else if (icon == 'lang' && this.fluidbook.l10n.multilangEnabled) { + } else if (icon === 'lang' && this.fluidbook.l10n.multilangEnabled) { // Note: the "!" at the beginning of the title/help parameters means that we don't want these strings translated link = this.addLink(navType, 'nav-locales', '#/locales', 'locales', '!' + this.fluidbook.l10n.getCurrentLanguageName(), '!Select Language'); - } else if (icon == 'archives') { - if (this.fluidbook.datas.archivesLink != '') { + } else if (icon === 'archives') { + if (this.fluidbook.datas.archivesLink !== '') { link = this.addLink(navType, 'nav-archives', this.fluidbook.datas.archivesLink, 'archives', '!' + this.fluidbook.datas.archivesLabel, '!' + this.fluidbook.datas.archivesLabel); - } else if (this.fluidbook.datas.externalArchives != '') { + } else if (this.fluidbook.datas.externalArchives !== '') { link = this.addLink(navType, 'nav-archives', '#/archives', 'archives', '!' + this.fluidbook.datas.archivesLabel, '!' + this.fluidbook.datas.archivesLabel); } - } else if (icon == 'help') { + } else if (icon === 'help') { link = this.addLink(navType, 'nav-help', '#', 'help', 'help', 'help'); - } else if (icon == 'zoom' && !this.fluidbook.support.isMobile) { + } else if (icon === 'zoom' && !this.fluidbook.support.isMobile) { link = this.addLink(navType, 'nav-zoomin', '#', 'zoomin', 'zoom in', 'zoom in'); link = this.addLink(navType, 'nav-zoomout', '#', 'zoomout', 'zoom out', 'zoom out'); - } else if (icon == 'fullscreen' && this.fluidbook.support.fullscreen && !DATAS.phonegap) { + } else if (icon === 'fullscreen' && this.fluidbook.support.fullscreen && !DATAS.phonegap) { link = this.addLink(navType, 'nav-' + icon, '#', icon, 'full screen', 'switch between fullscreen and normal'); - } else if (icon == 'sound' && this.fluidbook.sound.enabled) { + } else if (icon === 'sound' && this.fluidbook.sound.enabled) { link = this.addLink(navType, 'nav-sound-on', '#', 'sound-on', 'switch off the sound', 'switch on / switch off the sound'); link2 = this.addLink(navType, 'nav-sound-off', '#', 'sound-off', 'switch on the sound', 'switch on / switch off the sound'); - } else if (icon == 'search') { + } else if (icon === 'search') { // Only the horizontal icon menu has the search icon, which opens the main menu - if (this.fluidbook.datas.search && navType == 'horizontalNav') { + if (this.fluidbook.datas.search && navType === 'horizontalNav') { link = this.addLink(navType, 'nav-search', '#', 'searchIcon', 'search', 'search'); } - } else if (icon == 'extra') { + } else if (icon === 'extra') { var id = 'extra', $nav = this.getNavFromType(navType), @@ -488,7 +488,7 @@ FluidbookNav.prototype = { navLinkTarget = ''; // Check to see if navExtraLink is external or not and set target accordingly - if (typeof (this.fluidbook.datas.navExtraLink) == 'string' && this.fluidbook.datas.navExtraLink.lastIndexOf('http', 0) === 0) { + if (typeof (this.fluidbook.datas.navExtraLink) === 'string' && this.fluidbook.datas.navExtraLink.lastIndexOf('http', 0) === 0) { navLinkTarget = ' target="_blank" rel="noopener noreferrer"'; } @@ -496,12 +496,12 @@ FluidbookNav.prototype = { continue; } - if (navType == 'horizontalNav') { - if (this.fluidbook.datas.navExtraImage != '' && this.fluidbook.datas.navExtraLink != '') { + if (navType === 'horizontalNav') { + if (this.fluidbook.datas.navExtraImage !== '' && this.fluidbook.datas.navExtraLink !== '') { navExtraImage = this.fluidbook.datas.navExtraImage; link = '      '; } - } else if (navType == 'menu' && (this.fluidbook.datas.navExtraImage != '' || this.fluidbook.datas.navExtraImageMobile != '') && this.fluidbook.datas.navExtraLink != '') { + } else if (navType === 'menu' && (this.fluidbook.datas.navExtraImage !== '' || this.fluidbook.datas.navExtraImageMobile !== '') && this.fluidbook.datas.navExtraLink !== '') { navExtraImage = this.fluidbook.datas.navExtraImageMobile || this.fluidbook.datas.navExtraImage; // Fallback to desktop image link = ' ' + this.fluidbook.datas.navExtraTooltip + ''; } @@ -515,10 +515,10 @@ FluidbookNav.prototype = { var extraIcon = this.fluidbook.datas['navExtraIcon' + n]; var extraVisibility = this.fluidbook.datas['navExtraVisibility' + n]; var extraType = this.fluidbook.datas['navExtraType' + n]; - if (extraURL == '' || extraIcon == '') { + if (extraURL === '' || extraIcon === '') { continue; } - if ((extraVisibility == 'horizontal' && navType == 'menu') || (extraVisibility == 'burger' && navType == 'horizontalNav')) { + if ((extraVisibility === 'horizontal' && navType === 'menu') || (extraVisibility === 'burger' && navType === 'horizontalNav')) { continue; } var linkIcon; @@ -526,8 +526,8 @@ FluidbookNav.prototype = { if (extraIcon.indexOf('.') === -1) { linkIcon = getSpriteIcon(extraIcon); } else { - if ((extraIcon.indexOf('.svg') >= 0) && (extraType == 'icon')) { - if (getSpriteIcon('extra-extra' + n) == '') { + if ((extraIcon.indexOf('.svg') >= 0) && (extraType === 'icon')) { + if (getSpriteIcon('extra-extra' + n) === '') { var url = 'data/images/' + extraIcon; extraNPerURL[url] = n; $.ajax({ @@ -541,7 +541,7 @@ FluidbookNav.prototype = { $(svg).wrapInner(''); var viewbox = $(svg).attr('viewBox'); var maing = $(svg).children('g').eq(0); - if ($("#extra-extra" + n1).length == 0) { + if ($("#extra-extra" + n1).length === 0) { $("#svg-container").append('' + $("").append($(maing).clone()).html() + ''); } $('#spare_extra' + n1).replaceWith(getSpriteIcon('extra-extra' + n1)); @@ -568,16 +568,16 @@ FluidbookNav.prototype = { var foundLink; $.each(this.fluidbook.datas.links, function (page, links) { var l = $('' + links + '').find('[data-id="' + linkId + '"]'); - if (l.length == 1) { + if (l.length === 1) { foundLink = l; return false; } }); - if (foundLink == undefined) { + if (foundLink === undefined) { continue; } link = $(foundLink).find('a').append(linkIcon); - if (navType == 'menu' && extraType == 'icon') { + if (navType === 'menu' && extraType === 'icon') { var tooltip = $(link).data('tooltip'); $(link).append('' + $(link).data('tooltip') + ''); } @@ -601,8 +601,15 @@ FluidbookNav.prototype = { if (navType === 'menu') { + // Copy credits + var credits = $("footer#credits").clone().attr('id', 'mobile-credits'); + var a = credits.find('a'); + var t = a.text().replace('TM', '™'); + credits.find('a').text(t); + $("#menuList").append(credits); + // Insert Chapters submenus - if (this.chaptersMenuHTML !=='') { + if (this.chaptersMenuHTML !== '') { $('#menu_chapters').parent().append(this.chaptersMenuHTML); } @@ -632,6 +639,7 @@ FluidbookNav.prototype = { //console.log($('#menuList').parent().html()); } + // Add close button to menu this.menu.append(this.getMenuCloseButton()); @@ -642,7 +650,7 @@ FluidbookNav.prototype = { $(document).trigger('fluidbook.navigation.ready'); } - if (this.fluidbook.datas.afterSearch !== '' && this.fluidbook.datas.afterSearchDisplayForHTML && this.fluidbook.datas.themeEnableAfterSearch && navType == 'horizontalNav') { + if (this.fluidbook.datas.afterSearch !== '' && this.fluidbook.datas.afterSearchDisplayForHTML && this.fluidbook.datas.themeEnableAfterSearch && navType === 'horizontalNav') { // Use the "afterSearch" image and links set in the theme and link editor var afterSearchContent = '
      ' + this.fluidbook.loader.getImage('data/images/' + this.fluidbook.datas.afterSearch) + '
      ' + this.fluidbook.datas.links.aftersearch + '
      '; $nav.after(afterSearchContent); @@ -705,7 +713,7 @@ FluidbookNav.prototype = { // Bookmarks icon $(document).on('click', '.icon-bookmarks', function () { - if ($(this).data('extra') != null) { + if ($(this).data('extra') !== null) { $this.fluidbook.menu.openView('bookmark', $(this).data('extra'), null, function () { }); return false; @@ -795,7 +803,7 @@ FluidbookNav.prototype = { sResults = $this.fluidbook.search.menuSearchResults; // Make sure the search really is empty - if (sHints && sHints.html().length == 0 && sResults && sResults.html().length == 0) { + if (sHints && sHints.html().length === 0 && sResults && sResults.html().length === 0) { $this.fluidbook.search.closeSearch(); } @@ -807,6 +815,8 @@ FluidbookNav.prototype = { }, getSearch: function () { + var search = $("#search"); + var $this = this; var res = '
      '; res += ''; @@ -814,7 +824,7 @@ FluidbookNav.prototype = { res += '
      '; res += ''; res += ''; - $("#search").append(res); + search.append(res); // Search submit button $(document).on('click', '#submitSearch', function (e) { @@ -838,7 +848,6 @@ FluidbookNav.prototype = { case 39: // Right arrow case 40: // Down arrow return; // Ignore these keys - break; default: searchHints(); } @@ -859,9 +868,9 @@ FluidbookNav.prototype = { // }, 250); // }); - //this.menu.append($("#search")); - var searchHTML = $('#search').html(); - $('#search').remove(); + //this.menu.append(search); + var searchHTML = search.html(); + search.remove(); return searchHTML; }, diff --git a/style/fluidbook.less b/style/fluidbook.less index bfe762d7..0d916a00 100644 --- a/style/fluidbook.less +++ b/style/fluidbook.less @@ -916,7 +916,7 @@ input[type="search"]::-webkit-search-results-decoration { /* Fluidbook zooming */ -footer, header, #interface { +footer#credits, header, #interface { transition: opacity 400ms ease-in, visibility 400ms ease-in; .ios & { @@ -930,6 +930,31 @@ footer, header, #interface { } } +footer { + &#credits { + .menu-burger & { + display: none; + } + } + + &#mobile-credits { + a { + text-transform: none; + font-size: 12px; + font-family: @font; + font-weight: 300; + opacity: 0.5; + padding: 0 10px 0 37px; + transform-origin: 0 0; + transform: scaleX(0.98) !important; + } + + &:after { + display: none; + } + } +} + #shadow { @shadow-zoom-transition: 400ms; -- 2.39.5