h3n3/yet-another-cad-viewer
1
0
Fork 0
mirror of https://github.com/yeicor-3d/yet-another-cad-viewer.git synced 2025-12-23 07:54:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

cleaning up

Browse Source
This commit is contained in:
Yeicor
2024-02-16 20:35:27 +01:00
parent 0545d8fbe2
commit c10e5f0896
14 changed files with 58 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/App.vue
View File

@@ -1,58 +1,42 @@
<script setup lang="ts">
import {defineAsyncComponent, ref, Ref} from "vue";
import Sidebar from "./Sidebar.vue";
import Loading from "./Loading.vue";
import ModelViewerOverlay from "./ModelViewerOverlay.vue";
import Tools from "./Tools.vue";
import {
VExpansionPanel,
VExpansionPanels,
VExpansionPanelText,
VExpansionPanelTitle,
VLayout,
VMain,
VToolbarTitle
} from "vuetify/lib/components";
import type {ModelViewerInfo} from "./ModelViewerWrapper.vue";
import Sidebar from "./models/Sidebar.vue";
import Loading from "./viewer/Loading.vue";
import ModelViewerOverlay from "./viewer/ModelViewerOverlay.vue";
import Tools from "./tools/Tools.vue";
import Models from "./models/Models.vue";
import {VLayout, VMain, VToolbarTitle} from "vuetify/lib/components";
import type {ModelViewerInfo} from "./viewer/ModelViewerWrapper.vue";
import {settings} from "./tools/settings";
// NOTE: The ModelViewer library is big, so we split it and import it asynchronously
// NOTE: The ModelViewer library is big (THREE.js), so we split it and import it asynchronously
const ModelViewerWrapper = defineAsyncComponent({
loader: () => import('./ModelViewerWrapper.vue'),
loader: () => import('./viewer/ModelViewerWrapper.vue'),
loadingComponent: Loading,
delay: 0,
});
// Open models by default on wide screens
let openSidebarsDefault: Ref<boolean> = ref(window.innerWidth > 1200);
let openSidebarsByDefault: Ref<boolean> = ref(window.innerWidth > 1200);
let modelViewerInfo: Ref<typeof ModelViewerInfo | null> = ref(null);
let modelSrc: Ref<string | Uint8Array> = ref(settings.preloadModels[0]);
</script>
<template>
<v-layout full-height>
<!-- The main content of the app is the model-viewer with the SVG "2D" overlay -->
<v-main id="main">
<model-viewer-wrapper @load-viewer="(args) => {
console.log('Model-Viewer finished loading:', args)
modelViewerInfo = args
}"/>
<model-viewer-wrapper :src="modelSrc" @load-viewer="(args) => modelViewerInfo = args"/>
<model-viewer-overlay v-if="modelViewerInfo"/>
</v-main>
<!-- The left collapsible sidebar has the list of models -->
<sidebar :opened-init="openSidebarsDefault" side="left">
<sidebar :opened-init="openSidebarsByDefault" side="left">
<template #toolbar>
<v-toolbar-title>Models</v-toolbar-title>
</template>
<v-expansion-panels>
<v-expansion-panel key="model-id">
<v-expansion-panel-title>? F ? E ? V | Model Name</v-expansion-panel-title>
<v-expansion-panel-text>
Content
</v-expansion-panel-text>
</v-expansion-panel>
</v-expansion-panels>
<models :modelViewerInfo="modelViewerInfo"/>
</sidebar>
<!-- The right collapsible sidebar has the list of tools -->
<sidebar :opened-init="openSidebarsDefault" side="right" :width="120">
<sidebar :opened-init="openSidebarsByDefault" side="right" :width="120">
<template #toolbar>
<v-toolbar-title>Tools</v-toolbar-title>
</template>
@@ -67,12 +51,4 @@ html, body {
height: 100%;
overflow: hidden;
}
</style>
<!--suppress CssUnusedSymbol -->
<style scoped>
/* Fix bug in hidden expansion panel text next to active expansion panel */
.v-expansion-panel-title--active + .v-expansion-panel-text {
display: flex !important;
}
</style>