mirror of
https://github.com/Alexander-D-Karpov/akarpov
synced 2024-11-22 13:16:33 +03:00
added fonts, pdf
This commit is contained in:
parent
1f2544e357
commit
08cfbc211e
|
|
@ -3,6 +3,7 @@
|
|||
previews = {
|
||||
"application": {
|
||||
"zip": application.zip.view,
|
||||
"pdf": application.pdf.view,
|
||||
"java-archive": application.zip.view,
|
||||
"doc": application.doc.view,
|
||||
"docx": application.docx.view,
|
||||
|
|
@ -37,14 +38,24 @@
|
|||
"plain": text.plain.view,
|
||||
"csv": text.csv.view,
|
||||
},
|
||||
"font": {"otf": font.otf.view},
|
||||
"font": {
|
||||
"otf": font.basic.view,
|
||||
"ttf": font.basic.view,
|
||||
"woff": font.basic.view,
|
||||
"woff2": font.basic.view,
|
||||
},
|
||||
}
|
||||
|
||||
source_code = {}
|
||||
for ext in text.common.language_previews.keys():
|
||||
source_code[ext] = text.common.view
|
||||
|
||||
extensions = {
|
||||
fonts_ext = {}
|
||||
for ext in font.basic.formats.keys():
|
||||
fonts_ext[ext] = font.basic.view
|
||||
|
||||
extensions = (
|
||||
{
|
||||
"mp4": video.mp4.view,
|
||||
"mp3": audio.basic.view,
|
||||
"opus": audio.basic.view,
|
||||
|
|
@ -63,5 +74,8 @@
|
|||
"jar": application.zip.view,
|
||||
"mpeg": video.mp4.view,
|
||||
"oga": audio.oga.view,
|
||||
"otf": font.otf.view,
|
||||
} | source_code
|
||||
"pdf": application.pdf.view,
|
||||
}
|
||||
| source_code
|
||||
| fonts_ext
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
from . import doc, docx, odt, zip # noqa
|
||||
from . import doc, docx, odt, pdf, zip # noqa
|
||||
|
|
|
|||
169
akarpov/files/previews/application/pdf.py
Normal file
169
akarpov/files/previews/application/pdf.py
Normal file
|
|
@ -0,0 +1,169 @@
|
|||
from akarpov.files.models import File
|
||||
|
||||
|
||||
def view(file: File):
|
||||
static = """
|
||||
<link href="https://cdn.jsdelivr.net/npm/pdfjs-dist@3.4.120/web/pdf_viewer.min.css" rel="stylesheet">
|
||||
"""
|
||||
|
||||
content = (
|
||||
"""
|
||||
<header>
|
||||
<div class="col-auto">
|
||||
<ul class="navigation">
|
||||
<li class="navigation__item">
|
||||
<!-- Navigate to the Previous and Next pages -->
|
||||
<a href="#" class="previous round" id="prev_page">
|
||||
<i class="fas fa-arrow-left"></i>
|
||||
</a>
|
||||
|
||||
<!-- Navigate to a specific page -->
|
||||
<input type="number" value="1" id="current_page" />
|
||||
|
||||
<a href="#" class="next round" id="next_page">
|
||||
<i class="fas fa-arrow-right"></i>
|
||||
</a>
|
||||
|
||||
<!-- Page Info -->
|
||||
Page
|
||||
<span id="page_num"></span>
|
||||
of
|
||||
<span id="page_count"></span>
|
||||
</li>
|
||||
|
||||
<!-- Zoom In and Out -->
|
||||
<li class="navigation__item">
|
||||
<button class="zoom" id="zoom_in">
|
||||
<i class="fas fa-search-plus"></i>
|
||||
</button>
|
||||
|
||||
<button class="zoom" id="zoom_out">
|
||||
<i class="fas fa-search-minus"></i>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</header>
|
||||
|
||||
<!-- Canvas to place the PDF -->
|
||||
<canvas id="canvas" class="canvas__container w-50"></canvas>
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@3.4.120/build/pdf.min.js"></script>
|
||||
<script>
|
||||
"""
|
||||
+ f"""
|
||||
const pdf = '{file.file.url}';
|
||||
"""
|
||||
+ """
|
||||
const pageNum = document.querySelector('#page_num');
|
||||
const pageCount = document.querySelector('#page_count');
|
||||
const currentPage = document.querySelector('#current_page');
|
||||
const previousPage = document.querySelector('#prev_page');
|
||||
const nextPage = document.querySelector('#next_page');
|
||||
const zoomIn = document.querySelector('#zoom_in');
|
||||
const zoomOut = document.querySelector('#zoom_out');
|
||||
|
||||
const initialState = {
|
||||
pdfDoc: null,
|
||||
currentPage: 1,
|
||||
pageCount: 0,
|
||||
zoom: 1,
|
||||
};
|
||||
pdfjsLib
|
||||
.getDocument(pdf)
|
||||
.promise.then((data) => {
|
||||
initialState.pdfDoc = data;
|
||||
console.log('pdfDocument', initialState.pdfDoc);
|
||||
|
||||
pageCount.textContent = initialState.pdfDoc.numPages;
|
||||
|
||||
renderPage();
|
||||
})
|
||||
.catch((err) => {
|
||||
alert(err.message);
|
||||
});
|
||||
|
||||
const renderPage = () => {
|
||||
// Load the first page.
|
||||
console.log(initialState.pdfDoc, 'pdfDoc');
|
||||
initialState.pdfDoc
|
||||
.getPage(initialState.currentPage)
|
||||
.then((page) => {
|
||||
console.log('page', page);
|
||||
|
||||
const canvas = document.querySelector('#canvas');
|
||||
const ctx = canvas.getContext('2d');
|
||||
const viewport = page.getViewport({
|
||||
scale: initialState.zoom,
|
||||
});
|
||||
|
||||
canvas.height = viewport.height;
|
||||
canvas.width = viewport.width;
|
||||
|
||||
// Render the PDF page into the canvas context.
|
||||
const renderCtx = {
|
||||
canvasContext: ctx,
|
||||
viewport: viewport,
|
||||
};
|
||||
|
||||
page.render(renderCtx);
|
||||
|
||||
pageNum.textContent = initialState.currentPage;
|
||||
});
|
||||
};
|
||||
const showPrevPage = () => {
|
||||
if (initialState.pdfDoc === null || initialState.currentPage <= 1)
|
||||
return;
|
||||
initialState.currentPage--;
|
||||
// Render the current page.
|
||||
currentPage.value = initialState.currentPage;
|
||||
renderPage();
|
||||
};
|
||||
|
||||
const showNextPage = () => {
|
||||
if (
|
||||
initialState.pdfDoc === null ||
|
||||
initialState.currentPage >= initialState.pdfDoc._pdfInfo.numPages
|
||||
)
|
||||
return;
|
||||
|
||||
initialState.currentPage++;
|
||||
currentPage.value = initialState.currentPage;
|
||||
renderPage();
|
||||
};
|
||||
|
||||
// Button events.
|
||||
previousPage.addEventListener('click', showPrevPage);
|
||||
nextPage.addEventListener('click', showNextPage);
|
||||
currentPage.addEventListener('keypress', (event) => {
|
||||
if (initialState.pdfDoc === null) return;
|
||||
// Get the key code.
|
||||
const keycode = event.keyCode ? event.keyCode : event.which;
|
||||
|
||||
if (keycode === 13) {
|
||||
// Get the new page number and render it.
|
||||
let desiredPage = currentPage.valueAsNumber;
|
||||
initialState.currentPage = Math.min(
|
||||
Math.max(desiredPage, 1),
|
||||
initialState.pdfDoc._pdfInfo.numPages,
|
||||
);
|
||||
|
||||
currentPage.value = initialState.currentPage;
|
||||
renderPage();
|
||||
}
|
||||
});
|
||||
zoomIn.addEventListener('click', () => {
|
||||
if (initialState.pdfDoc === null) return;
|
||||
initialState.zoom *= 4 / 3;
|
||||
renderPage();
|
||||
});
|
||||
|
||||
zoomOut.addEventListener('click', () => {
|
||||
if (initialState.pdfDoc === null) return;
|
||||
initialState.zoom *= 2 / 3;
|
||||
renderPage();
|
||||
});
|
||||
</script>
|
||||
"""
|
||||
)
|
||||
|
||||
return static, content
|
||||
|
|
@ -1 +1 @@
|
|||
from . import otf # noqa
|
||||
from . import basic # noqa
|
||||
|
|
|
|||
|
|
@ -2,10 +2,18 @@
|
|||
|
||||
from akarpov.files.models import File
|
||||
|
||||
text = " ".join(string.printable)
|
||||
formats = {
|
||||
"ttf": "truetype",
|
||||
"otf": "opentype",
|
||||
"woff": "woff",
|
||||
"woff2": "woff2",
|
||||
}
|
||||
|
||||
|
||||
def view(file: File):
|
||||
text = " ".join(string.printable)
|
||||
name = file.file.path.split("/")[-1].split(".")[0]
|
||||
extension = file.file.path.split("/")[-1].split(".")[-1]
|
||||
static = (
|
||||
"""
|
||||
<style>
|
||||
|
|
@ -13,7 +21,7 @@ def view(file: File):
|
|||
"""
|
||||
+ f"""
|
||||
font-family: {name};
|
||||
src: url("{file.file.url}") format("opentype");
|
||||
src: url("{file.file.url}") format("{formats[extension]}");
|
||||
"""
|
||||
+ """
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user