From 47b348f72411d4450e7bb9fae72ee191cd278c03 Mon Sep 17 00:00:00 2001 From: j Date: Fri, 27 Oct 2023 13:47:56 +0200 Subject: [PATCH] add embed button to pdf viewer --- static/js/document.js | 7 +++++++ static/js/documentDialog.js | 7 +++++++ static/pdf.js/embeds.js | 20 +++++++++++--------- static/pdf.js/pandora.css | 8 ++++++++ static/pdf.js/pandora.js | 18 ++++++++++++++++++ 5 files changed, 51 insertions(+), 9 deletions(-) diff --git a/static/js/document.js b/static/js/document.js index 22fee0a0..b59c4071 100644 --- a/static/js/document.js +++ b/static/js/document.js @@ -95,6 +95,13 @@ pandora.ui.document = function() { {position: $content.getArea().map(Math.round)} ); }, + embed: function(data) { + var id = item.id; + pandora.$ui.embedDocumentDialog = pandora.ui.embedDocumentDialog( + id, + data.page + ).open(); + }, key_escape: function() { // ... }, diff --git a/static/js/documentDialog.js b/static/js/documentDialog.js index 89bc072b..f993be94 100644 --- a/static/js/documentDialog.js +++ b/static/js/documentDialog.js @@ -222,6 +222,13 @@ pandora.ui.documentDialog = function(options) { {position: $content.getArea().map(Math.round)} ); }, + embed: function(data) { + var id = options.items[options.index].id; + pandora.$ui.embedDocumentDialog = pandora.ui.embedDocumentDialog( + id, + data.page + ).open(); + }, key_escape: function() { pandora.$ui.documentDialog.close(); }, diff --git a/static/pdf.js/embeds.js b/static/pdf.js/embeds.js index 2d2ca536..c773feeb 100644 --- a/static/pdf.js/embeds.js +++ b/static/pdf.js/embeds.js @@ -4,15 +4,17 @@ Ox.load({ } }, function() { var currentPage = PDFViewerApplication.page; - window.addEventListener('pagechange', function (evt) { - var page = evt.pageNumber; - if (page && page != currentPage) { - currentPage = page; - Ox.$parent.postMessage('page', { - page: Math.round(page) - }); - } - }); + PDFViewerApplication.initializedPromise.then(function() { + PDFViewerApplication.pdfViewer.eventBus.on("pagechanging", function(event) { + var page = event.pageNumber; + if (page && page != currentPage) { + currentPage = page; + Ox.$parent.postMessage('page', { + page: page + }); + } + }) + }) Ox.$parent.bindMessage({ page: function(data) { if (data.page != PDFViewerApplication.page) { diff --git a/static/pdf.js/pandora.css b/static/pdf.js/pandora.css index 89295a5a..406ff73b 100644 --- a/static/pdf.js/pandora.css +++ b/static/pdf.js/pandora.css @@ -3,11 +3,19 @@ .secondaryToolbarButton.cropFile::before { mask-image: url(custom/toolbarButton-crop.png); } +.toolbarButton.embedPage::before, + .secondaryToolbarButton.embedPage::before { + mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PGxpbmUgeDE9Ijg4IiB5MT0iNTYiIHgyPSIyNCIgeTI9IjEyOCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48bGluZSB4MT0iMjQiIHkxPSIxMjgiIHgyPSI4OCIgeTI9IjIwMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48bGluZSB4MT0iMTY4IiB5MT0iNTYiIHgyPSIyMzIiIHkyPSIxMjgiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjQ4Ii8+PGxpbmUgeDE9IjIzMiIgeTE9IjEyOCIgeDI9IjE2OCIgeTI9IjIwMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48L3N2Zz48IS0teyJjb2xvciI6ImRlZmF1bHQiLCJuYW1lIjoic3ltYm9sRW1iZWQiLCJ0aGVtZSI6Im94bWVkaXVtIn0tLT4=); +} @media screen and (min-resolution: 2dppx) { .toolbarButton.cropFile::before, .secondaryToolbarButton.cropFile::before { mask-image: url(custom/toolbarButton-crop@2x.png); } + .toolbarButton.embedPage::before, + .secondaryToolbarButton.embedPage::before { + mask-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+PGxpbmUgeDE9Ijg4IiB5MT0iNTYiIHgyPSIyNCIgeTI9IjEyOCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48bGluZSB4MT0iMjQiIHkxPSIxMjgiIHgyPSI4OCIgeTI9IjIwMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48bGluZSB4MT0iMTY4IiB5MT0iNTYiIHgyPSIyMzIiIHkyPSIxMjgiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjQ4Ii8+PGxpbmUgeDE9IjIzMiIgeTE9IjEyOCIgeDI9IjE2OCIgeTI9IjIwMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iNDgiLz48L3N2Zz48IS0teyJjb2xvciI6ImRlZmF1bHQiLCJuYW1lIjoic3ltYm9sRW1iZWQiLCJ0aGVtZSI6Im94bWVkaXVtIn0tLT4=); + } } .verticalToolbarSeparator.hiddenMediumView, diff --git a/static/pdf.js/pandora.js b/static/pdf.js/pandora.js index 50a86bd4..a54148d8 100644 --- a/static/pdf.js/pandora.js +++ b/static/pdf.js/pandora.js @@ -4,6 +4,8 @@ var cache = {} var documentId var baseUrl = document.location.protocol + '//' + document.location.host + + var div = document.createElement("div") div.innerHTML = ` +` +var embedPage = div.querySelector("#embedPage") +document.querySelector('#toolbarViewerRight').insertBefore(embedPage, document.querySelector('#toolbarViewerRight').firstChild) +embedPage.addEventListener("click", event => { + Ox.$parent.postMessage('embed', { + page: PDFViewerApplication.page + }); +}) + async function archiveAPI(action, data) { var url = baseUrl + '/api/' var key = JSON.stringify([action, data]) @@ -207,6 +222,9 @@ function initOverlay() { div.appendChild(overlay) renderCropOverlay(overlay, documentId, page) }) + PDFViewerApplication.pdfViewer.eventBus.on("pagechanging", function(event) { + console.log("pagechanging", event, event.pageNumber.toString()) + }) }) }