icons

front/src/components/Promo/index.vue

@@ -17,6 +17,7 @@ import { useRawData } from '../../stores/raw_data';
 
 import { Pixelation, EffectComposer } from '@tresjs/post-processing'
 import { useClickable } from '../../stores/clickable';
+import { usePromoScene } from '../../stores/promo_scene';
 
 const minPan = ref(new Vector3(-2, -2, -2))
 const maxPan = ref(new Vector3(2, 2, 2))
@@ -48,6 +49,7 @@ const controlsState = reactive({
 const raw_dataStore = useRawData()
 const route = useRoute()
 const clickable = useClickable()
+const sidebarScene = usePromoScene()
 
 watch(() => route.params.target, sidebar.close)
 const sidebarFunc = () => {
@@ -59,19 +61,19 @@ const sidebarFunc = () => {
 }
 
 const prevClickableId = () => {
-    const item = clickable.list.findIndex(el => el.id == sidebar.id_clickable)
+    const item = sidebarScene.clickable.findIndex(el => el.id == sidebar.id_clickable)
     if (item == 0) {
-        return clickable.list[clickable.list.length - 1].id
+        return sidebarScene.clickable[sidebarScene.clickable.length - 1].id
     } else {
-        return clickable.list[item - 1].id
+        return sidebarScene.clickable[item - 1].id
     }
 }
 const nextClickableId = () => {
-    const item = clickable.list.findIndex(el => el.id == sidebar.id_clickable)
+    const item = sidebarScene.clickable.findIndex(el => el.id == sidebar.id_clickable)
-    if (item == (clickable.list.length - 1)) {
+    if (item == (sidebarScene.clickable.length - 1)) {
-        return clickable.list[0].id
+        return sidebarScene.clickable[0].id
     } else {
-        return clickable.list[item + 1].id
+        return sidebarScene.clickable[item + 1].id
     }
 } 
 </script>

front/src/components/Promo/load_models.vue

@@ -33,7 +33,6 @@ const process_loading = ref(null)
 const targetDistance = reactive({ max: 10, min: 0 })
 let sidebar_clickable = [] as PromoScene[]
 let sidebar_visible = [] as PromoScene[]
-let addTexture: any
 
 const COUNT = 100
 const controls_targetto = ref() as Ref<Vector3 | undefined>;
@@ -52,9 +51,6 @@ const raw_dataStore = useRawData()
 const { controls, camera, scene, raycaster, renderer } = useTresContext()
 const { seekByName, seekAllByName } = useSeek()
 
-const groundTexture = await useTexture({
-    displacementMap: '/ground_displacement.jpg',
-})
 const pointerTexture = await useTexture({
     map: '/pointer_texture.png'
 })
@@ -270,6 +266,7 @@ watch(() => sidebar.is_open && sidebar.id_clickable, () => {
             const quaternion = new Quaternion();
             quaternion.setFromAxisAngle(new Vector3(1, 0, 0), -45 * 4 * (Math.PI / 180));
             camera_rotatetoto.value = quaternion
+            // camera.value.rotation.z += Math.PI/2
             camera_moveto.value = target_vector;
         }
     }

front/src/components/sidebar.vue

@@ -47,10 +47,10 @@ watch(() => sidebar.id_clickable, () => {
                     </div>
 
                     <div class="sidebar-accordion-content" v-if="sidebar.isAccOpen('clickable')">
-                        <div class="sidebar-list-item" v-for="item in sidebar_scene.clickable">
+                        <div class="sidebar-list-item" v-for="(item, index) in sidebar_scene.clickable">
                             <input type="radio" name="clickable" v-model="clickable_obj" :value="item.id"
                                 :id="item.id.toString()" />
-                            <label :for="item.id.toString()">{{ item.name }}</label>
+                            <label :for="item.id.toString()">{{ index + 1 }} {{ item.name }}</label>
                         </div>
                     </div>
                 </div>