web/forgejo
10
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Add PDF rendering via PDFObject (#24086)

Browse source 
Use [PDFObject](https://pdfobject.com/) to embed PDFs, replacing our
outdated PDF.js copy we vendor (the last non-webpack vendoring).

[Commit
1](673e0263da)
is the PDFObject integration
[Commit
2](9336f5769d)
is the removal of PDF.js

<img width="1251" alt="Screenshot 2023-05-27 at 09 57 52"
src="169ce50c-bd1d-4bb0-86e5-1710bd0400a9">
<img width="1257" alt="Screenshot 2023-05-27 at 10 12 50"
src="318f7ee9-fb11-4093-83e7-17475aa70629">


Fallback for unsupporting browsers (most mobile ones, except Firefox
Mobile):

<img width="358" alt="Screenshot 2023-05-27 at 09 43 34"
src="8c12d7ba-57d6-4228-89a0-5fef9fad0cbb">

---------

Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
silverwind 2023-05-29 14:10:00 +02:00 • committed by GitHub
parent 35ce7ca25b
commit e4e98979ff
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
412 changed files with 61 additions and 124050 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web_src/js/index.js
View file

@ -21,6 +21,7 @@ import {initRepoIssueContentHistory} from './features/repo-issue-content.js';
import {initStopwatch} from './features/stopwatch.js';
import {initFindFileInRepo} from './features/repo-findfile.js';
import {initCommentContent, initMarkupContent} from './markup/content.js';
import {initPdfViewer} from './render/pdf.js';
import {initUserAuthLinkAccountView, initUserAuthOauth2} from './features/user-auth.js';
import {
@ -177,4 +178,5 @@ onDomReady(() => {
initUserAuthWebAuthnRegister();
initUserSettings();
initRepoDiffView();
initPdfViewer();
});

19
web_src/js/render/pdf.js Normal file
View file

@ -0,0 +1,19 @@
import {htmlEscape} from 'escape-goat';
export async function initPdfViewer() {
const els = document.querySelectorAll('.pdf-content');
if (!els.length) return;
const pdfobject = await import(/* webpackChunkName: "pdfobject" */'pdfobject');
for (const el of els) {
const src = el.getAttribute('data-src');
const fallbackText = el.getAttribute('data-fallback-button-text');
pdfobject.embed(src, el, {
fallbackLink: htmlEscape`
<a role="button" class="ui basic button pdf-fallback-button" href="[url]">${fallbackText}</a>
`,
});
el.classList.remove('is-loading');
}
}