From 8f0c4b327474d48c8e10358e91a203305cc32579 Mon Sep 17 00:00:00 2001 From: LJ5O <75009579+LJ5O@users.noreply.github.com> Date: Thu, 18 Jan 2024 02:04:31 +0100 Subject: [PATCH] Added zoom plates on signs that needed it Also made sure that pictures are pre-loaded, so we don't have a 2sec delay when showing them --- src/utils/addAssetsOnScene.js | 26 ++++++++++++++++++-------- src/utils/pictureZoom.js | 4 +++- 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/src/utils/addAssetsOnScene.js b/src/utils/addAssetsOnScene.js index a42c0ac..6879b13 100644 --- a/src/utils/addAssetsOnScene.js +++ b/src/utils/addAssetsOnScene.js @@ -1,3 +1,4 @@ +//Yes, this file is BIG, yes I should refactor that into smaller files, yes I don't have so much time import * as THREE from 'three'; import * as MathUtils from 'three/src/math/MathUtils.js'; import { createGround } from '../objects/ground.js'; @@ -354,6 +355,19 @@ export async function addAssetsOnScene(scene){ const zoomPlate = await loadModel('src/objects/models/zoomPicturePlate.gltf'); preparePlate(zoomPlate); + function addZoomPlate(x, y, link){ + //Function used to add easily a zoom plate in the scene + const zoomPlateClone = zoomPlate.scene.clone(); + zoomPlateClone.position.y = y; + zoomPlateClone.position.x = x; + + scene.add( zoomPlateClone ); + new Image().src = link; //Seems useless, but that's actually used to save the picture in cache, so we can directly show it up when neccessary + zoomPlateClone.onEnterHitbox = ()=>{ZoomPictures.showPicture(link)}; + zoomPlateClone.onLeaveHitbox = ()=>{ZoomPictures.hidePicture()}; + plates.push(zoomPlateClone); + } + /* -------------------- ADDING SIGNS -------------------- */ @@ -378,6 +392,9 @@ export async function addAssetsOnScene(scene){ signPlane.rotateOnWorldAxis(new THREE.Vector3(1,0,0), MathUtils.degToRad(90)); signPlane.position.set( signCopy.position.x + 0.06, 1.347, 1.65);//Determined by hand scene.add(signPlane); + + //Zoom picture plate + addZoomPlate(10 + i*5, 0.5, signPictures[i]); } /* PROFESSIONAL EXPERIENCES */ @@ -395,14 +412,7 @@ export async function addAssetsOnScene(scene){ scene.add(signPlane); //Zoom picture plate - const zoomPlateClone = zoomPlate.scene.clone(); - zoomPlateClone.position.y = 0.5; - zoomPlateClone.position.x = -4 - i*5; - - scene.add( zoomPlateClone ); - zoomPlateClone.onEnterHitbox = ()=>{ZoomPictures.showPicture(signPictures[i])}; - zoomPlateClone.onLeaveHitbox = ()=>{ZoomPictures.hidePicture()}; - plates.push(zoomPlateClone); + addZoomPlate(-4 - i*5, 0.5, signPictures[i]); } /* SOCIAL NETWORKS */ diff --git a/src/utils/pictureZoom.js b/src/utils/pictureZoom.js index 077b741..1620e5a 100644 --- a/src/utils/pictureZoom.js +++ b/src/utils/pictureZoom.js @@ -7,5 +7,7 @@ export function showPicture(link){ } //Hide picture : export function hidePicture(){ - $("#picture_zoom").fadeOut(400); + $("#picture_zoom").fadeOut(400, ()=>{ + $("#picture_zoom img").attr("src", ''); + }); } \ No newline at end of file