summaryrefslogtreecommitdiff
path: root/components/FilePreview.vue
diff options
context:
space:
mode:
Diffstat (limited to 'components/FilePreview.vue')
-rw-r--r--components/FilePreview.vue63
1 files changed, 63 insertions, 0 deletions
diff --git a/components/FilePreview.vue b/components/FilePreview.vue
new file mode 100644
index 0000000..a738a93
--- /dev/null
+++ b/components/FilePreview.vue
@@ -0,0 +1,63 @@
+<template lang="pug">
+ .file-preview
+ img(
+ v-if="isImage(path)"
+ :src="baseAPI + '' + path"
+ )
+ model-stl(
+ v-else-if="isStl(path)"
+ :rotate="rotate"
+ :src="baseAPI + '' + path"
+ :backgroundColor="'#D1D5DB'"
+ )
+ model-obj(
+ v-else-if="isObj(path)"
+ :src="baseAPI + '' + path"
+ :backgroundColor="'#D1D5DB'"
+ )
+</template>
+
+<script>
+import { ModelStl, ModelObj } from "vue-3d-model";
+
+export default {
+ name: "FilePreview",
+ props: ["path"],
+ data() {
+ return {
+ baseAPI: "",
+ rotate: {
+ x: -Math.PI / 2,
+ y: 0,
+ z: 0,
+ },
+ };
+ },
+ components: {
+ ModelStl,
+ ModelObj,
+ },
+ created() {
+ this.baseAPI = this.$config.api;
+ },
+ methods: {
+ checkExt(path, ext) {
+ return path.indexOf("." + ext) > 0;
+ },
+ isImage(path) {
+ return (
+ this.checkExt(path, "png") ||
+ this.checkExt(path, "jpg") ||
+ this.checkExt(path, "jpeg") ||
+ this.checkExt(path, "webp")
+ );
+ },
+ isStl(path) {
+ return this.checkExt(path, "stl") || this.checkExt(path, "sla");
+ },
+ isObj(path) {
+ return this.checkExt(path, "obj") || this.checkExt(path, "octet-stream");
+ },
+ },
+};
+</script>