commit 862d832549ea2a31b977cb57e2512b9ffe27f1cb parent 5cacdcf8dd85566362a848c88a323809d158881a Author: Martin Kloeckner <mjkloeckner@gmail.com> Date: Sun, 7 Jul 2024 19:19:57 -0300 use `import` instead of a string to define images urls Diffstat:
26 files changed, 112 insertions(+), 49 deletions(-) diff --git a/tp/src/assets/durmientes.jpg b/tp/src/assets/durmientes.jpg Binary files differ. diff --git a/tp/src/assets/elevation_map.png b/tp/src/assets/elevation_map.png Binary files differ. diff --git a/tp/src/assets/elevation_map2.png b/tp/src/assets/elevation_map2.png Binary files differ. diff --git a/tp/src/assets/elevation_map3.png b/tp/src/assets/elevation_map3.png Binary files differ. diff --git a/tp/src/assets/elevation_map_wider_river.png b/tp/src/assets/elevation_map_wider_river.png Binary files differ. diff --git a/tp/src/assets/madera.jpg b/tp/src/assets/madera.jpg Binary files differ. diff --git a/tp/src/assets/pared-de-ladrillos.jpg b/tp/src/assets/pared-de-ladrillos.jpg Binary files differ. diff --git a/tp/src/assets/pasto.jpg b/tp/src/assets/pasto.jpg Binary files differ. diff --git a/tp/src/assets/roca.jpg b/tp/src/assets/roca.jpg Binary files differ. diff --git a/tp/src/assets/sky_day_void.jpg b/tp/src/assets/sky_day_void.jpg Binary files differ. diff --git a/tp/src/assets/sky_night.jpg b/tp/src/assets/sky_night.jpg Binary files differ. diff --git a/tp/src/assets/tierra.jpg b/tp/src/assets/tierra.jpg Binary files differ. diff --git a/tp/src/assets/tierraSeca.jpg b/tp/src/assets/tierraSeca.jpg Binary files differ. diff --git a/tp/src/assets/tree_forbidden_zone_map.png b/tp/src/assets/tree_forbidden_zone_map.png Binary files differ. diff --git a/tp/src/assets/tree_forbidden_zone_map_wider_path.png b/tp/src/assets/tree_forbidden_zone_map_wider_path.png Binary files differ. diff --git a/tp/src/bridge.js b/tp/src/bridge.js @@ -1,9 +1,12 @@ import * as THREE from 'three'; import { mergeGeometries } from 'three/addons/utils/BufferGeometryUtils.js'; +import tierraSecaUrl from './assets/tierraSeca.jpg' +import ladrillosUrl from './assets/pared-de-ladrillos.jpg' + const textures = { - tierra: { url: '/tierraSeca.jpg', object: null }, - ladrillos: { url: '/pared-de-ladrillos.jpg', object: null }, + tierra: { url: tierraSecaUrl, object: null }, + ladrillos: { url: ladrillosUrl, object: null }, }; function onTextureLoaded(key, texture) { diff --git a/tp/src/rails.js b/tp/src/rails.js @@ -15,11 +15,16 @@ export const railsFoundationShape = new THREE.CatmullRomCurve3([ ], false); +import tierraUrl from './assets/tierra.jpg' +import rocaUrl from './assets/roca.jpg' +import pastoUrl from './assets/pasto.jpg' +import durmientesUrl from './assets/durmientes.jpg' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - durmientes: { url: '/durmientes.jpg', object: null }, + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + durmientes: { url: durmientesUrl, object: null }, }; export function getRailsPathPosAt(t) { diff --git a/tp/src/scene.js b/tp/src/scene.js @@ -58,16 +58,38 @@ const heightSegments = 150; const amplitude = 10; const amplitudeBottom = -2.10; // terrain offset +import skyDayUrl from './assets/sky_day_void.jpg' +import skyNightUrl from './assets/sky_night.jpg' +import rocaUrl from './assets/roca.jpg' +import pastoUrl from './assets/pasto.jpg' +import tierraUrl from './assets/tierra.jpg' +import maderaUrl from './assets/madera.jpg' +import durmientesUrl from './assets/durmientes.jpg' +import elevationMapUrl from './assets/elevation_map_wider_river.png' +import treeForbiddenMapUrl from './assets/tree_forbidden_zone_map_wider_path.png' + +// const textures = { +// sky_day: { url: '/sky_day_void.jpg', object: null }, +// sky_night: { url: '/sky_night.jpg', object: null }, +// roca: { url: '/roca.jpg', object: null }, +// pasto: { url: '/pasto.jpg', object: null }, +// tierra: { url: '/tierra.jpg', object: null }, +// madera: { url: '/madera.jpg', object: null }, +// durmientes: { url: '/durmientes.jpg', object: null }, +// elevationMap: { url: '/elevation_map_wider_river.png', object: null }, +// treeForbiddenMap: { url: '/tree_forbidden_zone_map_wider_path.png', object: null } +// }; + const textures = { - sky_day: { url: '/sky_day_void.jpg', object: null }, - sky_night: { url: '/sky_night.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - tierra: { url: '/tierra.jpg', object: null }, - madera: { url: '/madera.jpg', object: null }, - durmientes: { url: '/durmientes.jpg', object: null }, - elevationMap: { url: '/elevation_map_wider_river.png', object: null }, - treeForbiddenMap: { url: '/tree_forbidden_zone_map_wider_path.png', object: null } + skyDay: { url: skyDayUrl, object: null }, + skyNight: { url: skyNightUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + tierra: { url: tierraUrl, object: null }, + madera: { url: maderaUrl, object: null }, + durmientes: { url: durmientesUrl, object: null }, + elevationMap: { url: elevationMapUrl, object: null }, + treeForbiddenMap: { url: treeForbiddenMapUrl, object: null } }; function onResize() { @@ -311,14 +333,14 @@ function setupThreeJs() { lights.ambient.object.visible = false; lights.hemisphere.object.intensity = 0; lights.directional.object.color.setHex(0xcdddfe); // 0x090254; 0xa8a1fd - scene.background = textures.sky_night.object; + scene.background = textures.skyNight.object; lights.directional.object.position.set(100, 100, 100); // math the skybox texture moon light } else { lights.ambient.object.visible = true; lights.hemisphere.object.intensity = 1; lights.directional.object.intensity = 1; lights.directional.object.color.setHex(0xFFFFFF); - scene.background = textures.sky_day.object; + scene.background = textures.skyDay.object; lights.directional.object.position.set(-100, 100, 100); } @@ -337,13 +359,13 @@ function setupThreeJs() { window.addEventListener('resize', onResize); onResize(); - textures.sky_day.object.mapping = THREE.EquirectangularRefractionMapping; - textures.sky_night.object.mapping = THREE.EquirectangularRefractionMapping; + textures.skyDay.object.mapping = THREE.EquirectangularRefractionMapping; + textures.skyNight.object.mapping = THREE.EquirectangularRefractionMapping; if(settings.nightMode == true) { - scene.background = textures.sky_night.object; + scene.background = textures.skyNight.object; } else { - scene.background = textures.sky_day.object; + scene.background = textures.skyDay.object; } } @@ -772,7 +794,7 @@ function toggleNightMode() { lights.ambient.object.visible = false; lights.hemisphere.object.intensity = 0; lights.directional.object.color.setHex(0xcdddfe); // 0x090254; 0xa8a1fd - scene.background = textures.sky_night.object; + scene.background = textures.skyNight.object; lights.directional.object.position.set(100, 100, 100); // math the skybox texture moon light trainLight.visible = true; trainLight2.visible = true; @@ -782,7 +804,7 @@ function toggleNightMode() { lights.hemisphere.object.intensity = 1; lights.directional.object.intensity = 1; lights.directional.object.color.setHex(0xFFFFFF); - scene.background = textures.sky_day.object; + scene.background = textures.skyDay.object; lights.directional.object.position.set(-100, 100, 100); trainLight.visible = false; trainLight2.visible = false; diff --git a/tp/src/standalone/bridge.js b/tp/src/standalone/bridge.js @@ -3,13 +3,16 @@ import * as dat from 'dat.gui'; import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; import { mergeGeometries } from 'three/addons/utils/BufferGeometryUtils.js'; -let scene, camera, renderer, container; +import tierraSecaUrl from '../assets/tierraSeca.jpg' +import ladrillosUrl from '../assets/pared-de-ladrillos.jpg' const textures = { - tierra: { url: '/tierraSeca.jpg', object: null }, - ladrillos: { url: '/pared-de-ladrillos.jpg', object: null }, + tierra: { url: tierraSecaUrl, object: null }, + ladrillos: { url: ladrillosUrl, object: null }, }; +let scene, camera, renderer, container; + function onResize() { camera.aspect = container.offsetWidth / container.offsetHeight; camera.updateProjectionMatrix(); diff --git a/tp/src/standalone/rails.js b/tp/src/standalone/rails.js @@ -11,11 +11,16 @@ let spherePath; let railsPath; let railsFoundationShape; +import tierraUrl from '../assets/tierra.jpg' +import rocaUrl from '../assets/roca.jpg' +import pastoUrl from '../assets/pasto.jpg' +import durmientesUrl from '../assets/durmientes.jpg' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - durmientes: { url: '/durmientes.jpg', object: null }, + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + durmientes: { url: durmientesUrl, object: null }, }; function onResize() { diff --git a/tp/src/standalone/terrain.js b/tp/src/standalone/terrain.js @@ -10,11 +10,16 @@ const heightSegments = 100; const amplitude = 8; const amplitudeBottom = -1.00; +import tierraUrl from '../assets/tierra.jpg' +import rocaUrl from '../assets/roca.jpg' +import pastoUrl from '../assets/pasto.jpg' +import elevationMapUrl from '../assets/elevation_map2.png' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - elevationMap: { url: '/elevation_map2.png', object: null }, + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + elevationMap: { url: elevationMapUrl, object: null }, }; function onResize() { diff --git a/tp/src/standalone/track-map.js b/tp/src/standalone/track-map.js @@ -11,12 +11,18 @@ const heightSegments = 100; const amplitude = 8; const amplitudeBottom = -1.00; +import tierraUrl from '../assets/tierra.jpg' +import rocaUrl from '../assets/roca.jpg' +import pastoUrl from '../assets/pasto.jpg' +import elevationMapUrl from '../assets/elevation_map2.png' +import treeForbiddenMapUrl from '../assets/tree_forbidden_zone_map.png' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - elevationMap: { url: '/elevation_map2.png', object: null }, - treeForbiddenMap: { url: '/tree_forbidden_zone_map.png', object: null } + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + elevationMap: { url: elevationMapUrl, object: null }, + treeForbiddenMap: { url: treeForbiddenMapUrl, object: null } }; function onResize() { diff --git a/tp/src/standalone/trees.js b/tp/src/standalone/trees.js @@ -5,10 +5,14 @@ import { vertexShader, fragmentShader } from '/src/treesShaders.js'; let scene, camera, renderer, container, terrainMaterial, instancedTrees; +import tierraUrl from '../assets/tierra.jpg' +import rocaUrl from '../assets/roca.jpg' +import pastoUrl from '../assets/pasto.jpg' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, }; function onResize() { diff --git a/tp/src/standalone/tunnel.js b/tp/src/standalone/tunnel.js @@ -4,8 +4,10 @@ import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'; let scene, camera, renderer, container; +import maderaUrl from '../assets/madera.jpg' + const textures = { - madera: { url: '/madera.jpg', object: null }, + madera: { url: maderaUrl, object: null }, }; function onResize() { diff --git a/tp/src/terrain.js b/tp/src/terrain.js @@ -6,11 +6,16 @@ const heightSegments = 100; const amplitude = 8; const amplitudeBottom = -1.00; +import rocaUrl from './assets/roca.jpg' +import pastoUrl from './assets/pasto.jpg' +import tierraUrl from './assets/tierra.jpg' +import elevationMapUrl from './assets/elevation_map2.png' + const textures = { - tierra: { url: '/tierra.jpg', object: null }, - roca: { url: '/roca.jpg', object: null }, - pasto: { url: '/pasto.jpg', object: null }, - elevationMap: { url: '/elevation_map2.png', object: null }, + tierra: { url: tierraUrl, object: null }, + roca: { url: rocaUrl, object: null }, + pasto: { url: pastoUrl, object: null }, + elevationMap: { url: elevationMapUrl, object: null }, }; // La funcion devuelve una geometria de Three.js diff --git a/tp/src/trees.js b/tp/src/trees.js @@ -2,9 +2,12 @@ import * as THREE from 'three'; let treesForbiddenMapData, treesForbiddenMap, elevationMap, elevationMapData; +import elevationMapUrl from './assets/elevation_map2.png' +import treeForbiddenMapUrl from './assets/tree_forbidden_zone_map.png' + const textures = { - elevationMap: { url: '/elevation_map2.png', object: null }, - treeForbiddenMap: { url: '/tree_forbidden_zone_map.png', object: null } + elevationMap: { url: elevationMapUrl, object: null }, + treeForbiddenMap: { url: treeForbiddenMapUrl, object: null } }; const widthSegments = 100;
