From 6c870e85cc152cb83855e74e1fc93302c6f96fe2 Mon Sep 17 00:00:00 2001
From: Santo Cariotti <santo@dcariotti.me>
Date: Sat, 24 Sep 2022 15:57:30 +0200
Subject: File preview on model edit

---
 components/FilePreview.vue | 63 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 components/FilePreview.vue

(limited to 'components/FilePreview.vue')

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>
-- 
cgit v1.2.3-18-g5258

