gameobject module dev

2024-11-04 20:26:27 +02:00
parent 53350ef548
commit 2978f11869
20 changed files with 1391 additions and 114 deletions
@@ -0,0 +1,91 @@
+<template>
+    <v-card :title="id =='add' ? $l.createGameObject : $l.editGameObject" class="container my-3">
+        <v-form class="pa-4" v-model="valid">
+            <v-text-field :label="$l.name" v-model="object.name" :rules="[rules.required]"></v-text-field>
+            <v-select :label="$l.objectType" v-model="object.type" :items="objectTypes" :rules="[rules.required]">
+            </v-select>
+            <v-file-input :label="$l.objectFile" v-model="object.file" :rules="[rules.requiredFile]"></v-file-input>
+            <div v-if="object.asset?.name">{{ object.asset.name }}</div>
+        </v-form>
+        <v-card-actions>
+            <v-btn @click="saveAndPreview" :loading="loading" prepend-icon="mdi-content-save" color="primary"
+                :disabled="!valid">
+                {{ $l.saveAndPreview }}
+            </v-btn>
+            <v-btn @click="captureThumbnail" v-if="object.asset?.type == 'bundle'" prepend-icon="mdi-camera" color="secondary">{{ $l.captureThumbnail }}</v-btn>
+            <v-btn @click="publish" prepend-icon="mdi-publish" color="success" v-if="false && object.id">{{ $l.publish }}</v-btn>
+        </v-card-actions>
+    </v-card>
+
+    <v-card :title="$l.preview" class="container my-3" v-if="object.asset">
+        <div ref="target" v-if="object?.asset?.type == 'bundle'"></div>
+        <v-img v-else :src="`/asset/default/${object.asset?.name}`"></v-img>
+    </v-card>
+</template>
+
+<script>
+import { GameEngine } from '@/gameEngine';
+
+const gameEngine = new GameEngine();
+
+export default {
+    data() {
+        return {
+            object: {},
+            valid: false,
+            rules: {
+                required: v => v ? true : this.$l.fieldRequired,
+                requiredFile: v => (v?.length || this.id != 'add') ? true : this.$l.fieldRequired
+            },
+            objectTypes: ['panorama2d', 'environment3d', 'object3d', 'object2d', 'player3d', 'audio'].map(e => ({
+                title: this.$l[e],
+                value: e
+            })),
+            loading: false
+        }
+    },
+    async created(){
+        if (this.id && this.id != 'add'){
+            this.object = (await this.$api.gameObject.load(this.id)).data;
+        }
+    },
+    mounted() {
+        //this.$refs.target?.appendChild(gameEngine.renderer.domElement);
+    },
+    computed: {
+        fileToUpload(){
+            return this.object?.file instanceof File
+        },
+        id(){
+            return this.$route.params?.id;
+        }
+    },
+    methods: {
+        async saveAndPreview() {
+            this.loading = true;
+            try {
+                let fd = new FormData();
+                let keys = ['name', 'type'];
+                if (this.fileToUpload) keys.push('file');
+                if (this.id != 'add') keys.push('id');
+
+                keys.forEach(e=>fd.append(e, this.object[e]))
+                let result = await this.$api.gameObject.save(fd);
+                Object.assign(this.object, result.data.object);
+                if (this.id == 'add'){
+                    this.$router.replace({ params: {id: this.object.id} });
+                }
+            } catch (err) {
+                console.error(err);
+            }
+            this.loading = false
+        },
+        captureThumbnail() {
+
+        },
+        async publish() {
+
+        }
+    }
+}
+</script>