From: Vincent Vanwaelscappel Date: Wed, 29 Jul 2020 14:24:20 +0000 (+0200) Subject: wip #3827 @4 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=69c99c420ad2682c9b62e626a42359115d7aebdd;p=fluidbook-html5.git wip #3827 @4 --- diff --git a/images/interface.svg b/images/interface.svg index c53dcee2..456143ff 100644 --- a/images/interface.svg +++ b/images/interface.svg @@ -135,5 +135,14 @@ c0.524-0.446,1.112-0.53,1.678-0.242c0.565,0.288,0.871,0.919,0.773,1.546l-1.094,7.029l6.313,3.243 C29.863,18.278,30.176,18.903,30.074,19.532z"/> - + + + + + + + diff --git a/js/libs/fluidbook/fluidbook.articles.js b/js/libs/fluidbook/fluidbook.articles.js index 93c01886..45a28c7c 100644 --- a/js/libs/fluidbook/fluidbook.articles.js +++ b/js/libs/fluidbook/fluidbook.articles.js @@ -60,6 +60,10 @@ FluidbookArticles.prototype = { return res; }, + findArticleById: function (id) { + return this.fluidbook.settings.articlesList[id]; + }, + isEnabled: function () { return Object.keys(this.fluidbook.settings.articlesList).length > 0; }, diff --git a/js/libs/fluidbook/links/fluidbook.links.zoom.js b/js/libs/fluidbook/links/fluidbook.links.zoom.js index f8b02dcb..0444bcd6 100644 --- a/js/libs/fluidbook/links/fluidbook.links.zoom.js +++ b/js/libs/fluidbook/links/fluidbook.links.zoom.js @@ -18,7 +18,7 @@ FluidbookLinksZoom.prototype = { }); $(this.fluidbook).on('fluidbook.zoom.in.end', function () { - $this.zoomLinkReset(true); + $this.zoomLinkReset(false); return true; }); @@ -197,8 +197,11 @@ FluidbookLinksZoom.prototype = { } if (action === 'link') { - menu += 'href="' + data + '" target="_blank"'; - linkClass += ' ext'; + var l = $this.getLink(data); + if (l !== undefined) { + menu += 'href="' + l.url + '" target="' + l.target + '"'; + linkClass += ' ext'; + } } else if (action === 'copy') { menu += 'data-clipboard-text="' + escapeHtml(data) + '" '; } else if (action === 'video') { @@ -320,7 +323,6 @@ FluidbookLinksZoom.prototype = { // Load image before running zoom up animation $this.fluidbook.displayLoader(); loadImage(zoomImage, function (img) { - // Image is set as a background for better scaling / fitting via CSS z.css('background-image', 'url(' + img.src + ')'); $this.fluidbook.hideLoader(); @@ -333,20 +335,31 @@ FluidbookLinksZoom.prototype = { boxShadow: '0 0 100px rgba(0,0,0,0.3)', transform: 'translateX(' + zoomX + 'px) translateY(' + zoomY + 'px) scale(1)' }); - setTimeout(function () { $this.resizeZoomLinkBackground(true); }, 600); - }, 50); - $this.fluidbook.stats.track(2, $this.fluidbook.currentPage); }); }); }, + getLink: function (url) { + var e = url.split(':', 2); + if (e.length === 1 || e[0] === 'http' || e[1] === 'https') { + return {url: url, target: '_blank'}; + } + + if (e[0] === 'article') { + var a = this.fluidbook.articles.findArticleById(e[1]); + if (a !== undefined) { + return {url: '#/article/' + a.url, target: '_self'}; + } + } + }, + resizeZoomLinkBackground: function (show) { var top, left, bottom, right, width, height, hpadding, vpadding; @@ -393,10 +406,6 @@ FluidbookLinksZoom.prototype = { $("#zoomPopupMenuWrapper").css({left: left, top: top + height, width: width, opacity: show ? 1 : 0}); }, - zoomLinkClose: function (immediate) { - return this.zoomLinkReset(immediate); - }, - zoomLinkReset: function (immediate) { var $this = this; diff --git a/style/fluidbook.less b/style/fluidbook.less index fc3afa1d..21c7b30f 100644 --- a/style/fluidbook.less +++ b/style/fluidbook.less @@ -1416,7 +1416,7 @@ html.ios body.portrait #interface { left: 0; width: 100%; height: 100%; - z-index: 21; + z-index: 41; cursor: pointer; // Needed or click events don't work on iOS (see: https://stackoverflow.com/a/16006333) .overlayBackground(); } @@ -1431,7 +1431,7 @@ html.ios body.portrait #interface { position: absolute; top: 0; left: 0; - z-index: 22; + z-index: 42; display: none; overflow: hidden; background-repeat: no-repeat; @@ -2063,7 +2063,7 @@ ul.chapters.shareList a.level0 .svg-icon { position: absolute; top: 0px; left: 0px; - z-index: 30; + z-index: 40; display: none; > div { @@ -2436,7 +2436,7 @@ ul.chapters.shareList a.level0 .svg-icon { position: absolute; top: 0; left: 0; - z-index: 40; + z-index: 140; width: 100%; height: 100%; @@ -2528,7 +2528,7 @@ ul.chapters.shareList a.level0 .svg-icon { left: 0; width: 100%; height: 100%; - z-index: 100; + z-index: 30; display: none; .overlayBackground(); } @@ -2539,7 +2539,7 @@ ul.chapters.shareList a.level0 .svg-icon { #zoomPopupBackground { position: absolute; - z-index: 100; + z-index: 30; opacity: 0; transition: opacity 150ms; @@ -2552,7 +2552,7 @@ ul.chapters.shareList a.level0 .svg-icon { #zoomPopupMenuWrapper { position: absolute; - z-index: 101; + z-index: 31; transition: opacity 150ms; #zoomPopupMenu { @@ -2630,7 +2630,7 @@ ul.chapters.shareList a.level0 .svg-icon { width: @zoom-close-button-size; height: @zoom-close-button-size; padding: unit((@zoom-close-button-size/30)*11, px); - z-index: 103; + z-index: 33; .button-hover(); color: @menu-text; opacity: 1; @@ -2655,7 +2655,7 @@ ul.chapters.shareList a.level0 .svg-icon { transition: all 0.5s; transform-origin: 0 0; position: absolute; - z-index: 101; + z-index: 31; img { position: absolute; @@ -2664,7 +2664,7 @@ ul.chapters.shareList a.level0 .svg-icon { width: 100%; height: 100%; display: block; - z-index: 102; + z-index: 32; } @@ -2767,7 +2767,7 @@ body > input { opacity: 0; pointer-events: none; transition: opacity 0.3s ease-in; - z-index: 30; + z-index: 45; position: absolute; top: 0; left: 0;