mirror of
https://github.com/renbaoshuo/S2OJ.git
synced 2024-12-22 22:31:53 +00:00
refactor: lazyload pdf.js
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
This commit is contained in:
parent
daf0c55485
commit
fe5e9b17e5
@ -2,7 +2,6 @@
|
||||
requireLib('bootstrap5');
|
||||
requireLib('hljs');
|
||||
requireLib('mathjax');
|
||||
requireLib('pdf.js');
|
||||
requirePHPLib('form');
|
||||
requirePHPLib('judger');
|
||||
|
||||
|
@ -2,7 +2,6 @@
|
||||
requireLib('bootstrap5');
|
||||
requireLib('hljs');
|
||||
requireLib('mathjax');
|
||||
requireLib('pdf.js');
|
||||
requirePHPLib('form');
|
||||
requirePHPLib('judger');
|
||||
|
||||
|
@ -2,7 +2,6 @@
|
||||
requireLib('bootstrap5');
|
||||
requireLib('mathjax');
|
||||
requireLib('hljs');
|
||||
requireLib('pdf.js');
|
||||
requirePHPLib('form');
|
||||
|
||||
Auth::check() || redirectToLogin();
|
||||
|
@ -185,7 +185,6 @@ class UOJBlogEditor {
|
||||
if ($this->type == 'blog') {
|
||||
$req_lib = [
|
||||
'mathjax' => '',
|
||||
'pdf.js' => '',
|
||||
];
|
||||
|
||||
if (isset($REQUIRE_LIB['bootstrap5'])) {
|
||||
|
@ -308,54 +308,6 @@ if (!isset($ShowPageHeader)) {
|
||||
<?= HTML::css_link('/css/font-awesome.min.css') ?>
|
||||
<?php endif ?>
|
||||
|
||||
<?php if (isset($REQUIRE_LIB['pdf.js'])) : ?>
|
||||
<!-- pdf.js -->
|
||||
<?= HTML::js_src('/js/pdf.js') ?>
|
||||
<script>
|
||||
pdfjsLib.GlobalWorkerOptions.workerSrc = '/js/pdf.worker.js';
|
||||
|
||||
function randstr(prefix) {
|
||||
return Math.random().toString(36).replace('0.', prefix || '');
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$('div[data-pdf]').each(function() {
|
||||
var _this = $(this);
|
||||
var pdf_src = $(this).data('src');
|
||||
|
||||
$(this).css('width', '100%').css('height', '100%');
|
||||
|
||||
var task = pdfjsLib.getDocument(pdf_src);
|
||||
var id = 'pdf_' + task.docId;
|
||||
|
||||
$(this).attr('id', id + '_container');
|
||||
|
||||
task.promise.then(function(pdf) {
|
||||
for (var i = 1; i <= pdf.numPages; i++) {
|
||||
$(_this).append('<canvas id="' + id + '_page_' + i + '" class="pdf-page-canvas"></canvas>');
|
||||
|
||||
pdf.getPage(i).then(function(page) {
|
||||
var viewport = page.getViewport({
|
||||
scale: 2,
|
||||
});
|
||||
|
||||
var canvas = document.getElementById(id + '_page_' + page.pageNumber);
|
||||
|
||||
canvas.height = viewport.height;
|
||||
canvas.width = viewport.width;
|
||||
|
||||
page.render({
|
||||
canvasContext: canvas.getContext('2d'),
|
||||
viewport: viewport,
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<?php endif ?>
|
||||
|
||||
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
||||
|
@ -235,7 +235,8 @@ h6,
|
||||
/* PDF */
|
||||
|
||||
.pdf-page-canvas {
|
||||
width: 100% !important;
|
||||
/* min-width: 100%; */
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* Form */
|
||||
|
@ -1052,6 +1052,65 @@ function showCommentReplies(id, replies) {
|
||||
);
|
||||
}
|
||||
|
||||
// PDF
|
||||
$(document).ready(function() {
|
||||
$('div[data-pdf]').each(function() {
|
||||
$(this).append(
|
||||
$('<div class="uoj-pdf-loading-spinner border d-flex flex-column justify-content-center align-items-center" style="width: 100%; height: 350px;" />')
|
||||
.append('<div class="spinner-border text-muted" style="width: 3rem; height: 3rem;" />')
|
||||
.append('<div class="mt-3">Loading PDF...</div>')
|
||||
);
|
||||
});
|
||||
|
||||
$LAB.script('/js/pdf.js').wait(function() {
|
||||
pdfjsLib.GlobalWorkerOptions.workerSrc = '/js/pdf.worker.js';
|
||||
|
||||
// Support HiDPI-screens.
|
||||
var outputScale = window.devicePixelRatio || 1;
|
||||
|
||||
$('div[data-pdf]').each(function() {
|
||||
var _this = $(this);
|
||||
var pdf_src = $(this).data('src');
|
||||
|
||||
$(this).css('width', '100%').css('height', '100%');
|
||||
|
||||
var task = pdfjsLib.getDocument(pdf_src);
|
||||
var id = 'pdf_' + task.docId;
|
||||
|
||||
$(this).attr('id', id + '_container');
|
||||
|
||||
task.promise.then(function(pdf) {
|
||||
for (var i = 1; i <= pdf.numPages; i++) {
|
||||
$(_this).append('<canvas id="' + id + '_page_' + i + '" class="pdf-page-canvas"></canvas>');
|
||||
|
||||
pdf.getPage(i).then(function(page) {
|
||||
var viewport = page.getViewport({
|
||||
scale: 2.5,
|
||||
});
|
||||
|
||||
var canvas = document.getElementById(id + '_page_' + page.pageNumber);
|
||||
|
||||
canvas.height = Math.floor(viewport.height * outputScale);
|
||||
canvas.width = Math.floor(viewport.width * outputScale);
|
||||
|
||||
var transform = outputScale !== 1
|
||||
? [outputScale, 0, 0, outputScale, 0, 0]
|
||||
: null;
|
||||
|
||||
page.render({
|
||||
canvasContext: canvas.getContext('2d'),
|
||||
viewport: viewport,
|
||||
transform: transform,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$('.uoj-pdf-loading-spinner', _this).remove();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Tooltip
|
||||
$(document).ready(function() {
|
||||
bootstrap.Tooltip.jQueryInterface.call($('[data-bs-toggle="tooltip"]'));
|
||||
|
Loading…
Reference in New Issue
Block a user