root/fileserver
1
0
Fork 0
Code Issues 11 Actions Wiki Activity

Added PDF Preview

Browse Source 
Closes #30
This commit is contained in:
Mutzi 2022-09-06 15:59:16 +02:00
parent 05c207daae
commit 0d5ca44316
3 changed files with 43 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
backend/src/controllers/fs/fs_routes.cpp
View File

@ -42,6 +42,8 @@ const std::unordered_map<std::string, std::string> mime_type_map = {
{ ".mkv" , "video/x-matroska" },
{ ".mk3d" , "video/x-matroska" },
{ ".mks" , "video/x-matroska" },
{ ".pdf" , "application/pdf" }
};
template<typename InputIt>
@ -170,7 +172,9 @@ namespace api {
try {
if (file.fileLength() > 100 * 1024 * 1024) throw std::exception();
std::filesystem::path filename(inode->getValueOfName());
const std::string& mime = mime_type_map.at(filename.extension().string());
std::string ext = filename.extension().string();
std::transform(ext.begin(), ext.end(), ext.begin(), tolower);
const std::string& mime = mime_type_map.at(ext);
if (!mime.starts_with("image")) throw std::exception();
cv::_InputArray image_arr(file.fileData(), (int) file.fileLength());
@ -332,12 +336,12 @@ namespace api {
if (!inode.has_value())
return cbk(dto::Responses::get_badreq_res("Unknown node"));
std::filesystem::path p("./files"), name(inode->getValueOfName());
p /= std::to_string(inode->getValueOfId());
std::filesystem::path name(inode->getValueOfName());
std::string ext = name.extension().string();
std::transform(ext.begin(), ext.end(), ext.begin(), tolower);
try {
cbk(dto::Responses::get_type_res(mime_type_map.at(name.extension().string())));
cbk(dto::Responses::get_type_res(mime_type_map.at(ext)));
} catch (const std::exception&) {
cbk(dto::Responses::get_badreq_res("Invalid file type"));
}

18
frontend/src/components/FileViewer/BlobDownload.tsx
View File

@ -1,11 +1,12 @@
import { ref } from 'vue';
import { NProgress } from 'naive-ui';
import filesize from 'filesize';
import { Music, Video, Image } from '@vicons/carbon';
import { Music, Video, Image, Document } from '@vicons/carbon';
import type { DialogApiInjection } from 'naive-ui/es/dialog/src/DialogProvider';
export default function createBlobDialog(
dialog: DialogApiInjection,
image: boolean,
audio: boolean,
video: boolean
) {
@ -14,11 +15,22 @@ export default function createBlobDialog(
const percentage = ref(0);
const dia = dialog.create({
title:
'Loading ' + (video ? 'video' : audio ? 'audio' : 'image') + '...',
'Loading ' +
(video ? 'video' : audio ? 'audio' : image ? 'image' : 'content') +
'...',
closable: false,
closeOnEsc: false,
maskClosable: false,
icon: () => (video ? <Video /> : audio ? <Music /> : <Image />),
icon: () =>
video ? (
<Video />
) : audio ? (
<Music />
) : image ? (
<Image />
) : (
<Document />
),
content: () => (
<NProgress
type="line"

24
frontend/src/components/FileViewer/FileViewer.vue
View File

@ -19,7 +19,8 @@ enum fileTypes {
LOADING,
IMAGE,
AUDIO,
VIDEO
VIDEO,
IFRAME
}
const fileType = ref<fileTypes>(fileTypes.UNKNOWN);
@ -36,6 +37,7 @@ async function loadContent() {
if (!token) return;
const { progress, total, percentage, dia } = createBlobDialog(
dialog,
fileType.value === fileTypes.IMAGE,
fileType.value === fileTypes.AUDIO,
fileType.value === fileTypes.VIDEO
);
@ -66,9 +68,11 @@ async function getType(node: Responses.GetNode) {
if (resp.type.startsWith('image')) {
fileType.value = fileTypes.IMAGE;
await loadContent();
}
if (resp.type.startsWith('audio')) fileType.value = fileTypes.AUDIO;
if (resp.type.startsWith('video')) fileType.value = fileTypes.VIDEO;
} else if (resp.type.startsWith('application/pdf')) {
fileType.value = fileTypes.IFRAME;
await loadContent();
} else if (resp.type.startsWith('audio')) fileType.value = fileTypes.AUDIO;
else if (resp.type.startsWith('video')) fileType.value = fileTypes.VIDEO;
}
watch(
@ -112,7 +116,17 @@ watch(
:src="src"
:alt="node.name"
/>
<n-button v-else-if="fileType !== fileTypes.IMAGE" @click="loadContent">
<iframe
v-else-if="fileType === fileTypes.IFRAME && src !== ''"
:src="src"
width="800"
height="1000"
>
</iframe>
<n-button
v-else-if="fileType !== fileTypes.IMAGE"
@click="loadContent"
>
<template #icon>
<n-icon><Play /></n-icon>
</template>