From 771f8d0c86fc004293b73162f917fc79b1a63b2a Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Fri, 15 Mar 2024 18:02:46 +0100 Subject: [PATCH] wip #6801 @1.5 --- js/libs/fluidbook/fluidbook.loader.js | 140 ++++++++++++++++++++++--- js/libs/fluidbook/fluidbook.support.js | 3 +- 2 files changed, 129 insertions(+), 14 deletions(-) diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js index 78001acd..28b905ac 100644 --- a/js/libs/fluidbook/fluidbook.loader.js +++ b/js/libs/fluidbook/fluidbook.loader.js @@ -91,16 +91,18 @@ FluidbookLoader.prototype = { preloadStart: function (callback) { let $this = this; this.init(function () { - if ($this.fluidbook.sound.enabled) { - $this.fluidbook.sound.preloadSounds(); - } - if ($this.fluidbook.shortLoading) { - $this.toPreload = [1]; - } else { - $this.toPreload = [1, 2, 3]; - } - $this.preloaded = $this.toPreload.slice(0); - $this.preloadPages(callback); + $this.loadPDFForTexts(function () { + if ($this.fluidbook.sound.enabled) { + $this.fluidbook.sound.preloadSounds(); + } + if ($this.fluidbook.shortLoading) { + $this.toPreload = [1]; + } else { + $this.toPreload = [1, 2, 3]; + } + $this.preloaded = $this.toPreload.slice(0); + $this.preloadPages(callback); + }); }); }, @@ -301,7 +303,7 @@ FluidbookLoader.prototype = { } else { // Else, we ensure the images are on stage in order to prevent white flash avec page turn. this.setOnStage(this.backgrounds[i]); - if (!this.fluidbook.support.svgtocanvas) { + if (!this.fluidbook.support.svgtocanvas && !this.fluidbook.support.pdftocanvas) { this.setOnStage(this.texts[i]); } } @@ -604,6 +606,9 @@ FluidbookLoader.prototype = { }; $('.texture_clinks[data-page="' + page + '"] .contentLink[data-image]').each(function () { + if ($(this).is('[data-rollover-hide]')) { + return; + } if ((enter && $(this).is('[data-animation-hide]')) || (!enter && $(this).is('[data-animation-hide-on-leave]'))) { return; } @@ -717,10 +722,14 @@ FluidbookLoader.prototype = { // Draw content links if (clinks !== '') { $('.texture_clinks[data-page="' + page + '"] .contentLink').each(function () { + if ($(this).is('[data-rollover-hide]')) { + return; + } if ((enter && $(this).is('[data-animation-hide]')) || (!enter && $(this).is('[data-animation-hide-on-leave]'))) { return; } + let texture; let scale = 1; @@ -889,21 +898,126 @@ FluidbookLoader.prototype = { addTextContents: function (pageNr, callback) { var t = $("#page_" + pageNr + ' .texts'); - if (this.fluidbook.support.svgtocanvas) { + if (this.fluidbook.support.svgtocanvas || this.fluidbook.support.pdftocanvas) { var html = ''; if (!this.fluidbook.mobilefirst.enabled) { html += ''; } $(t).html(html); - this.renderTextsCanvas(); + if (this.fluidbook.support.svgtocanvas) { + this.renderTextsCanvas(); + } else { + this.renderPDFTextsCanvas() + } } else { $(t).append(this.texts[pageNr]); } callback(); }, + loadPDFForTexts: function (callback) { + if (this.fluidbook.settings.svgToCanvas != 2) { + callback(); + return; + } + let $this = this; + //PDFJS.disableWorker = true; + pdfjsLib.GlobalWorkerOptions.workerSrc = 'pdfjs/build/pdf.worker.js'; + let loadingTask = pdfjsLib.getDocument('data/' + this.fluidbook.settings.pdfName); + + loadingTask.promise.then(function (pdfDoc) { + $this.pdfDoc = pdfDoc; + callback(); + }, function (reason) { + console.warn(reason); + }); + }, + + renderPDFTextsCanvas: function () { + if (!this.fluidbook.support.pdftocanvas) { + return; + } + + let $this = this; + let upscale = 1; + var z = window.devicePixelRatio * upscale; + var mz = this.fluidbook.zoom.max * window.devicePixelRatio * upscale * 1.1; + + $('canvas[data-page]:not(.thick)').each(function () { + if ($this.fluidbook.zoom.zoom === 1 && $(this).hasClass('z')) { + return; + } + + var page = $(this).data('page'); + + var c = $(this).closest('.texts'); + var tw = $(c).width(); + var th = $(c).height(); + + var w = tw * z; + var h = th * z; + var wz = tw * mz; + var hz = th * mz; + + var canvas = $(this).get(0); + + var cz = $(this).hasClass('z') ? mz : z; + var cw = $(this).hasClass('z') ? wz : w; + var ch = $(this).hasClass('z') ? hz : h; + + if ($(this).data('w') === cw && $(this).data('h') === ch) { + return; + } + + canvas.width = cw + 30; + canvas.height = ch + 30; + + if (cz === 1) { + $(canvas).css('transform', null); + } else { + $(canvas).css('transform', 'scale(' + (1 / cz) + ')'); + } + + var ctx = canvas.getContext("2d"); + + + $this.pdfDoc.getPage(page).then(function (pdfPage) { + var unscaledViewport = pdfPage.getViewport({scale: 1}); + var scale = Math.min((ch / unscaledViewport.height), (cw / unscaledViewport.width)); + + let renderTask = pdfPage.render({ + canvasContext: ctx, + viewport: pdfPage.getViewport({scale: scale}), + annotationMode: 0 + }); + renderTask.promise.then(function () { + console.log('page ' + page + ' rendered at scale ' + scale, cw, ch, cz, unscaledViewport.width, unscaledViewport.height); + }); + }) + + $(this).data('w', cw).data('h', ch); + + // let textThickness = parseFloat($this.fluidbook.settings.textsThickness); + // + // if (!$(this).hasClass('z') && $this.fluidbook.settings.textsThickness > 1 && $this.fluidbook.settings.textsThicknessPages.indexOf(page) >= 0) { + // $('canvas:not(.z)[data-page=' + page + '].thick').remove(); + // var clone; + // for (var i = 1; i <= textThickness; i++) { + // clone = $this._cloneCanvas($(this).get(0)); + // $(clone).insertBefore($(this)); + // } + // var lastOpacity = $this.fluidbook.settings.textsThickness - Math.floor($this.fluidbook.settings.textsThickness); + // if (lastOpacity > 0) { + // $(clone).css('opacity', lastOpacity); + // } + // } + + }); + }, + renderTextsCanvas: function () { + if (!this.fluidbook.support.svgtocanvas) { return; } diff --git a/js/libs/fluidbook/fluidbook.support.js b/js/libs/fluidbook/fluidbook.support.js index e3aadd3e..dc49776e 100644 --- a/js/libs/fluidbook/fluidbook.support.js +++ b/js/libs/fluidbook/fluidbook.support.js @@ -15,7 +15,8 @@ function FluidbookSupport(fluidbook) { this.edge = Modernizr.edge; this.chromeBased = Modernizr.chrome || this.edge; this.gpuInfos = this.getGPUInfos(); - this.svgtocanvas = this.fluidbook.settings.svgToCanvas==1 && this.IE === 0 && !(this.safari && this.macOs) && this.getGPUInfos().vendor.indexOf('intel') === -1 && this.getGPUInfos().vendor.indexOf('renderer') === -1; + this.svgtocanvas = this.fluidbook.settings.svgToCanvas == 1 && this.IE === 0 && !(this.safari && this.macOs) && this.getGPUInfos().vendor.indexOf('intel') === -1 && this.getGPUInfos().vendor.indexOf('renderer') === -1; + this.pdftocanvas = this.fluidbook.settings.svgToCanvas == 2; // If in node-webkit or if the index.html fluidbook is locally open in a browser this.offline = (typeof process !== "undefined" && process.versions['node-webkit']) || window.location.toString().indexOf("file://") == 0; -- 2.39.5