From 770161841c7e881ffe4c0aa6cfca6ca1d4773adb Mon Sep 17 00:00:00 2001
From: goynov <goynov@gmail.com>
Date: Sat, 4 Apr 2026 13:21:18 +0300
Subject: [PATCH] #80

---
 .../GenericObject/GenericObject.js            |  6 ++-
 .../ImageObject/ImageObject.js                | 10 +++-
 .../ImageObject/ImageObject.vue               |  1 +
 .../InteractiveObjects/InteractiveObject.js   |  2 +-
 .../VideoPlayer/VideoPlayer.js                | 10 ++++
 .../VideoPlayer/VideoPlayer.vue               |  1 +
 src/lib/Dashboard.js                          | 52 +++++++++++++------
 7 files changed, 61 insertions(+), 21 deletions(-)

diff --git a/src/components/InteractiveObjects/GenericObject/GenericObject.js b/src/components/InteractiveObjects/GenericObject/GenericObject.js
index fa4968b..49720e0 100644
--- a/src/components/InteractiveObjects/GenericObject/GenericObject.js
+++ b/src/components/InteractiveObjects/GenericObject/GenericObject.js
@@ -35,8 +35,10 @@ class GenericObject extends EventManager{
                             }
                         }
                         if (data.description){
-                            engine.dashboard.updateText(this.object.__onhud ? data.description : '', false, (d)=>{
-                                d && this.dispatchEvent({type:'finish'})
+                            engine.dashboard.updateText(this.object.__onhud ? data.description : '', {
+                                textScrolledCallback: (d)=>{
+                                    d && this.dispatchEvent({type:'finish'})
+                                }
                             })
                         }
                     }
diff --git a/src/components/InteractiveObjects/ImageObject/ImageObject.js b/src/components/InteractiveObjects/ImageObject/ImageObject.js
index 61cd49e..09033ba 100644
--- a/src/components/InteractiveObjects/ImageObject/ImageObject.js
+++ b/src/components/InteractiveObjects/ImageObject/ImageObject.js
@@ -1,7 +1,9 @@
+import { EventManager } from "@/lib/EventManager";
 import { MeshStandardMaterial, MeshBasicMaterial, PlaneGeometry, Mesh, DoubleSide, Vector3 } from "three";
 
-class ImageObject {
+class ImageObject extends EventManager{
     constructor(engine, obj) {
+        super();
         return new Promise(async(resolve, reject)=>{
             if (obj.$go){
                 obj.path = engine.assetPath;
@@ -32,6 +34,12 @@ class ImageObject {
             }
             this.object = new Mesh(geo, mp.metalness ? new MeshStandardMaterial(mp) : new MeshBasicMaterial(mp));
 
+            if (obj.description) {
+                engine.clickable.add(this.object, ()=>{
+                    engine.dashboard.updateText(obj.description, {hideOnFinish: true})
+                })
+            }
+
             resolve(this)
         })
     }
diff --git a/src/components/InteractiveObjects/ImageObject/ImageObject.vue b/src/components/InteractiveObjects/ImageObject/ImageObject.vue
index 6bf33f8..eb923d8 100644
--- a/src/components/InteractiveObjects/ImageObject/ImageObject.vue
+++ b/src/components/InteractiveObjects/ImageObject/ImageObject.vue
@@ -2,6 +2,7 @@
     <div v-if="modelValue.go">
         <v-img :src="`/asset/thumb/${modelValue.go}.webp`" />
         <div class="text-caption text-center">{{ modelValue.title }}</div>
+        <v-textarea :label="l.description" v-model="modelValue.description"></v-textarea>
     </div>
     <asset-selector @select="assignTexture" :type="['Texture']">
         <template v-slot:activator="props">
diff --git a/src/components/InteractiveObjects/InteractiveObject.js b/src/components/InteractiveObjects/InteractiveObject.js
index b9b4874..23f2df1 100644
--- a/src/components/InteractiveObjects/InteractiveObject.js
+++ b/src/components/InteractiveObjects/InteractiveObject.js
@@ -68,7 +68,7 @@ class InteractiveObject extends EventManager{
                         //process first interaction
                         this.io.once('interaction', ()=>{
                             if (obj.introText){
-                                engine.dashboard.updateText(obj.introText, true)
+                                engine.dashboard.updateText(obj.introText, {hideOnFinish: true});
                             }
                         })
                         this.io.addEventListener('interaction', ()=>{
diff --git a/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.js b/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.js
index f073199..887d45e 100644
--- a/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.js
+++ b/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.js
@@ -46,6 +46,13 @@ class VideoPlayer extends EventManager {
                     if (data.immersive || 1){
                         engine.immersive(true);
                     }
+                    if (data.description) {
+                        engine.dashboard.updateText(data.description, {
+                            hideOnFinish: true,
+                            startFrom: vi.currentTime / vi.duration,
+                            duration: vi.duration
+                        })
+                    }
                 }
 
                 const onPause = ()=>{
@@ -57,6 +64,9 @@ class VideoPlayer extends EventManager {
                     if (data.immersive || 1){
                         engine.immersive(false);
                     }
+                    if (data.description) {
+                        engine.dashboard.updateText('')
+                    }
                 }
 
                 vi.addEventListener('play', onPlay);
diff --git a/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.vue b/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.vue
index 85a2f29..c104a10 100644
--- a/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.vue
+++ b/src/components/InteractiveObjects/VideoPlayer/VideoPlayer.vue
@@ -3,6 +3,7 @@
         <v-img :src="`/asset/thumb/${modelValue.go}.webp`" />
         <div class="text-caption text-center">{{ modelValue.title }}</div>
         <v-checkbox density="compact" v-model="modelValue.playInHud" hide-details :label="l.viewInHUD"></v-checkbox>
+        <v-textarea :label="l.description" v-model="modelValue.description"></v-textarea>
     </div>
     <asset-selector @select="assignVideoObject" :type="['Video']">
         <template v-slot:activator="props">
diff --git a/src/lib/Dashboard.js b/src/lib/Dashboard.js
index 8424b74..bdc04ba 100644
--- a/src/lib/Dashboard.js
+++ b/src/lib/Dashboard.js
@@ -121,39 +121,57 @@ class DashBoard extends EventManager {
 			sceneHeader.init(scene, startBtnCallback);
 		}
 
-		this.updateText = function(t, hideOnFinish = false, textScrolledCallback){
+		this.updateText = function(t, params = {}){
 			if (!textPlane) return;
 			textPlane.visible = !!t;
 			engine.motionQueue.clear(text);
 			text.text = t;
 			text.anchorY = 0.03 * dashHeight;
 			text.sync(async()=>{
+				//console.log(text.clipRect);
 				let dMax = text.textRenderInfo.blockBounds[3] - text.textRenderInfo.blockBounds[1];
 				let dh = dMax + text.clipRect[1];
+				if (params.startFrom){
+					text.anchorY = text.anchorY + (-dh -text.anchorY) * params.startFrom;
+				}
 				if (dh > 0){
-					let updateFn = ()=>{
-						//text.sync();
-						if (text.textRenderInfo.blockBounds[1]> text.clipRect[1] * 1.33 ){
-							textScrolledCallback?.(true);
-							textScrolledCallback = null;
-							if (hideOnFinish){
-								this.updateText('')
-							}
-						}
-					}
+					// let updateFn = ()=>{
+					// 	//text.sync();
+					// 	//console.log(text.clipRect, text.textRenderInfo.blockBounds)
+					// 	if (text.textRenderInfo.blockBounds[1] > text.clipRect[1] ){
+					// 		params.textScrolledCallback?.(true);
+					// 		params.textScrolledCallback = null;
+					// 		if (params.hideOnFinish){
+					// 			this.updateText('')
+					// 		}
+					// 	}
+					// }
 					engine.motionQueue.add({
 						o: text,
-						a: { anchorY: - dMax },
-						t: dMax*99 / dashHeight,
-						u: updateFn
+						a: { anchorY: -dh },
+						t: params.duration ? (params.duration * (1-params.startFrom||0)) : (dMax*77 / dashHeight),
+						f: ()=>{
+							params.textScrolledCallback?.(true);
+							params.textScrolledCallback = null;
+							if (params.hideOnFinish){
+								this.updateText('')
+							}else{
+								engine.motionQueue.add({
+									o: text,
+									a: { anchorY: -dMax },
+									t: 4,
+									f: params.textFinishCallback
+								})
+							}
+						}
 					})
 				}else{
-					if (hideOnFinish){
+					if (params.hideOnFinish){
 						await Utils.wait(10000);
 						if (text.text == t) this.updateText('')
-						textScrolledCallback?.(false)
+						params.textScrolledCallback?.(false)
 					}else{
-						textScrolledCallback?.(false)
+						params.textScrolledCallback?.(false)
 					}
 				}
 			})