mirror of
https://github.com/zadam/trilium.git
synced 2024-09-21 16:16:04 +08:00
render PDF preview in electron for pdf notes
This commit is contained in:
parent
493d088d80
commit
e7aa84435b
|
@ -9,16 +9,12 @@ const TPL = `
|
|||
<tr>
|
||||
<th nowrap>Note ID:</th>
|
||||
<td class="file-note-id"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th nowrap>Original file name:</th>
|
||||
<td class="file-filename"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th nowrap>File type:</th>
|
||||
<td class="file-filetype"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th nowrap>File size:</th>
|
||||
<td class="file-filesize"></td>
|
||||
</tr>
|
||||
|
@ -26,13 +22,17 @@ const TPL = `
|
|||
|
||||
<pre class="file-preview-content"></pre>
|
||||
|
||||
<button class="file-download btn btn-sm btn-primary" type="button">Download</button>
|
||||
|
||||
<button class="file-open btn btn-sm btn-primary" type="button">Open</button>
|
||||
|
||||
<button class="file-upload-new-revision btn btn-sm btn-primary">Upload new revision</button>
|
||||
<iframe class="pdf-preview" style="width: 100%; height: 100%; flex-grow: 100;"></iframe>
|
||||
|
||||
<input type="file" class="file-upload-new-revision-input" style="display: none">
|
||||
<div style="padding: 10px; display: flex; justify-content: space-evenly;">
|
||||
<button class="file-download btn btn-sm btn-primary" type="button">Download</button>
|
||||
|
||||
<button class="file-open btn btn-sm btn-primary" type="button">Open</button>
|
||||
|
||||
<button class="file-upload-new-revision btn btn-sm btn-primary">Upload new revision</button>
|
||||
|
||||
<input type="file" class="file-upload-new-revision-input" style="display: none">
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
export default class FileTypeWidget extends TypeWidget {
|
||||
|
@ -45,6 +45,7 @@ export default class FileTypeWidget extends TypeWidget {
|
|||
this.$fileType = this.$widget.find(".file-filetype");
|
||||
this.$fileSize = this.$widget.find(".file-filesize");
|
||||
this.$previewContent = this.$widget.find(".file-preview-content");
|
||||
this.$pdfPreview = this.$widget.find(".pdf-preview");
|
||||
this.$downloadButton = this.$widget.find(".file-download");
|
||||
this.$openButton = this.$widget.find(".file-open");
|
||||
this.$uploadNewRevisionButton = this.$widget.find(".file-upload-new-revision");
|
||||
|
@ -110,12 +111,16 @@ export default class FileTypeWidget extends TypeWidget {
|
|||
|
||||
const noteComplement = await this.tabContext.getNoteComplement();
|
||||
|
||||
this.$previewContent.empty().hide();
|
||||
this.$pdfPreview.attr('src', '').empty().hide();
|
||||
|
||||
if (noteComplement.content) {
|
||||
this.$previewContent.show();
|
||||
this.$previewContent.text(noteComplement.content);
|
||||
}
|
||||
else {
|
||||
this.$previewContent.empty().hide();
|
||||
else if (note.mime === 'application/pdf' && utils.isElectron()) {
|
||||
this.$pdfPreview.show();
|
||||
this.$pdfPreview.attr("src", utils.getUrlForDownload("api/notes/" + this.noteId + "/open"));
|
||||
}
|
||||
|
||||
// open doesn't work for protected notes since it works through browser which isn't in protected session
|
||||
|
|
|
@ -76,6 +76,9 @@
|
|||
|
||||
.note-detail-file {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.file-table th, .file-table td {
|
||||
|
|
|
@ -31,7 +31,7 @@ async function updateFile(req) {
|
|||
};
|
||||
}
|
||||
|
||||
async function downloadNoteFile(noteId, res) {
|
||||
async function downloadNoteFile(noteId, res, contentDisposition = true) {
|
||||
const note = await repository.getNote(noteId);
|
||||
|
||||
if (!note) {
|
||||
|
@ -42,9 +42,12 @@ async function downloadNoteFile(noteId, res) {
|
|||
return res.status(401).send("Protected session not available");
|
||||
}
|
||||
|
||||
// (one) reason we're not using the originFileName (available as label) is that it's not
|
||||
// available for older note revisions and thus would be inconsistent
|
||||
res.setHeader('Content-Disposition', utils.getContentDisposition(note.title || "untitled"));
|
||||
if (contentDisposition) {
|
||||
// (one) reason we're not using the originFileName (available as label) is that it's not
|
||||
// available for older note revisions and thus would be inconsistent
|
||||
res.setHeader('Content-Disposition', utils.getContentDisposition(note.title || "untitled"));
|
||||
}
|
||||
|
||||
res.setHeader('Content-Type', note.mime);
|
||||
|
||||
res.send(await note.getContent());
|
||||
|
@ -54,11 +57,17 @@ async function downloadFile(req, res) {
|
|||
const noteId = req.params.noteId;
|
||||
|
||||
return await downloadNoteFile(noteId, res);
|
||||
}
|
||||
|
||||
async function openFile(req, res) {
|
||||
const noteId = req.params.noteId;
|
||||
|
||||
return await downloadNoteFile(noteId, res, false);
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
updateFile,
|
||||
openFile,
|
||||
downloadFile,
|
||||
downloadNoteFile
|
||||
};
|
|
@ -156,6 +156,7 @@ function register(app) {
|
|||
route(PUT, '/api/notes/:noteId/file', [auth.checkApiAuthOrElectron, uploadMiddleware, csrfMiddleware],
|
||||
filesRoute.updateFile, apiResultHandler);
|
||||
|
||||
route(GET, '/api/notes/:noteId/open', [auth.checkApiAuthOrElectron], filesRoute.openFile);
|
||||
route(GET, '/api/notes/:noteId/download', [auth.checkApiAuthOrElectron], filesRoute.downloadFile);
|
||||
// this "hacky" path is used for easier referencing of CSS resources
|
||||
route(GET, '/api/notes/download/:noteId', [auth.checkApiAuthOrElectron], filesRoute.downloadFile);
|
||||
|
|
Loading…
Reference in a new issue