From 9cad1c4103a33e28e853a8c73e4c02fef0342e53 Mon Sep 17 00:00:00 2001
From: Kseninia Mikhaylova <k.mikhailova@svs-tech.pro>
Date: Thu, 20 Mar 2025 12:38:05 +0300
Subject: [PATCH] debouncing

---
 components/expDiagram.vue             |  4 +-
 components/model/updateRenderMode.vue | 58 +++++++++++++++++++++++++++
 composables/useSceneVisibility.ts     |  2 +-
 3 files changed, 62 insertions(+), 2 deletions(-)
 create mode 100644 components/model/updateRenderMode.vue

diff --git a/components/expDiagram.vue b/components/expDiagram.vue
index 59e4c55..ade97c2 100644
--- a/components/expDiagram.vue
+++ b/components/expDiagram.vue
@@ -51,7 +51,9 @@ onBeforeUnmount(() => {
                         Загрузка 3D модели
                     </div>
                 </template>
-                <TresCanvas height="600" :render-mode="renderMode" :key="renderMode">
+                {{ renderMode }}
+                <TresCanvas height="600">
+                    <ModelUpdateRenderMode :render-mode="renderMode" />
                     <TresPerspectiveCamera :position="[-7, 2, 4]" ref="camera" />
                     <OrbitControls v-bind="controlsState" ref="controls" make-default />
                     <Suspense>
diff --git a/components/model/updateRenderMode.vue b/components/model/updateRenderMode.vue
new file mode 100644
index 0000000..e5aa546
--- /dev/null
+++ b/components/model/updateRenderMode.vue
@@ -0,0 +1,58 @@
+<!-- RenderModeController.vue -->
+<script setup lang="ts">
+import { watch, onMounted } from 'vue';
+import { useTresContext } from '@tresjs/core';
+
+// Пропсы для управления render-mode
+const props = defineProps({
+    renderMode: {
+        type: String,
+        default: 'always', // Значение по умолчанию
+        validator: (value: string) => ['always', 'never'].includes(value),
+    },
+});
+
+// Получаем контекст TresJS
+const { renderer, scene, camera } = useTresContext();
+
+// Функция для обновления render-mode
+const updateRenderMode = () => {
+    if (!renderer.value || !scene.value || !camera.value) {
+        console.warn('Tres context is not ready');
+        return;
+    }
+    console.log(scene)
+    console.log(renderer)
+    switch (props.renderMode) {
+        case 'always':
+            // Рендерим постоянно
+            scene.value.visible = true
+            break;
+
+        case 'manual':
+            // Полностью останавливаем рендеринг
+            scene.value.visible = false
+            break;
+
+        default:
+            console.warn(`Unsupported render mode: ${props.renderMode}`);
+    }
+};
+
+// Наблюдаем за изменением renderMode
+watch(
+    () => props.renderMode,
+    () => {
+        updateRenderMode();
+    }
+);
+
+// Инициализация при монтировании
+onMounted(() => {
+    updateRenderMode();
+});
+</script>
+
+<template>
+    <!-- Компонент не требует шаблона, так как он управляет логикой -->
+</template>
\ No newline at end of file
diff --git a/composables/useSceneVisibility.ts b/composables/useSceneVisibility.ts
index 5dd4f7d..c4c91b2 100644
--- a/composables/useSceneVisibility.ts
+++ b/composables/useSceneVisibility.ts
@@ -20,7 +20,7 @@ export function useSceneVisibility() {
                     }, 100); // Задержка в 300 мс
                 });
             },
-            { threshold: 0.05 } // Порог видимости
+            { threshold: 0.1 } // Порог видимости
         );
 
         if (element) {
-- 
2.40.1