Mabulig Web App

commit 83647f6e7798220f42187b10b95867082367feaf Author: Impaczus Date: Tue May 26 08:27:41 2026 +0800 Init Commit diff --git a/assets/environment_map.jpg b/assets/environment_map.jpg new file mode 100644 index 0000000..0db5bc9 Binary files /dev/null and b/assets/environment_map.jpg differ diff --git a/assets/studio_small_08_4k.jpg b/assets/studio_small_08_4k.jpg new file mode 100644 index 0000000..65ca63b Binary files /dev/null and b/assets/studio_small_08_4k.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..121c292 --- /dev/null +++ b/index.html @@ -0,0 +1,21 @@ + + + + + Mabulig Web App + + + + + + + \ No newline at end of file diff --git a/index2.html b/index2.html new file mode 100644 index 0000000..cc3eda9 --- /dev/null +++ b/index2.html @@ -0,0 +1,228 @@ + + + + three.js webgl - GLTFloader + + + + + + +

+ three.js - GLTFLoader
+ Royal Esplanade from HDRI Haven +

+ + + + + + + \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 0000000..ae89a2f --- /dev/null +++ b/main.js @@ -0,0 +1,118 @@ +import * as THREE from 'three'; +import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; +import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; +import { UltraHDRLoader } from 'three/addons/loaders/UltraHDRLoader.js'; +import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; + + +const scene = new THREE.Scene(); + +const sizes = { + width: window.innerWidth, + height: window.innerHeight, + } + +//console.log(sizes.width + "x" + sizes.height); + +//RENDERER +const renderer = new THREE.WebGLRenderer({antialias:true}); +renderer.setSize( sizes.width, sizes.height ); +renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)); +renderer.toneMapping = THREE.ACESFilmicToneMapping; +renderer.toneMappingExposure = 1.5; +renderer.outputColorSpace = THREE.SRGBColorSpace; +renderer.shadowMap.enabled = true; +renderer.shadowMap.type = THREE.PCFShadowMap; +document.body.appendChild( renderer.domElement ); + +//CAMERA +const camera = new THREE.PerspectiveCamera( 65, sizes.width / sizes.height, 0.1, 1000 ); +camera.position.x = 0; +camera.position.y = 2; +camera.position.z = 7.5; + +const controls = new OrbitControls( camera, renderer.domElement ); +controls.enableDamping = true; +controls.dampingFactor = 0.05; // Friction +controls.screenSpacePanning = false; // Vertical panning along screen +controls.update(); + + + + +//RESIZING +function handleResize(){ + sizes.width = window.innerWidth; + sizes.height = window.innerHeight; + camera.aspect = sizes.width/sizes.height; + camera.updateProjectionMatrix(); + renderer.setSize( sizes.width, sizes.height ); + renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)); +} +window.addEventListener("resize", handleResize); + + + +//MODEL LOADER +let core_logo_mesh; +const loader = new GLTFLoader(); +loader.load( 'models/MBS-2408 Oreophryne anulata.glb', function ( glb ) { + core_logo_mesh = glb.scene; + scene.add( glb.scene ); + +}, undefined, function ( error ) { + + console.error( error ); + +} ); + +//ENVIRONMENT +const env_loader = new UltraHDRLoader(); +const env_texture = await env_loader.loadAsync( 'assets/studio_small_08_4k.jpg' ); +env_texture.mapping = THREE.EquirectangularReflectionMapping; +scene.background = new THREE.Color(0xe6e6e6); +// scene.background = env_texture; +// scene.backgroundBlurriness = 0.5; +scene.environment = env_texture; +// console.log(scene.environment); + + +//LIGHTS +const ambient_light = new THREE.AmbientLight( 0xFFFFFF , 0.1); // soft white light +scene.add( ambient_light ); +const sun = new THREE.DirectionalLight( 0xFFFFFF, 0.5); +sun.castShadow = true; +scene.add( sun ); +// const helper = new THREE.DirectionalLightHelper( sun, 5 ); +// scene.add( helper ); + + +//EFFECTS PASS +// const composer = new EffectComposer( renderer ); +// const renderPass = new RenderPass(scene, camera); +// composer.addPass(renderPass); +// const bloomPass = new UnrealBloomPass( +// new THREE.Vector2(sizes.width, sizes.height), +// 0.35, // strength +// 1, // radius +// 1 // threshold +// ); +// composer.addPass(bloomPass); + + + +renderer.setAnimationLoop( animate ); + +function animate( time ) { + + //cube.rotation.x = time / 2000; + //cube.rotation.y = time / 1000; + controls.update(); + //core_logo_mesh.rotation.y = time / 1000; + renderer.render( scene, camera ); + //console.log(camera.position); +// if (core_logo_mesh){ +// core_logo_mesh.rotation.y = time / 1500; +// } + //composer.render(); +} \ No newline at end of file diff --git a/models/Frog Zoo.glb b/models/Frog Zoo.glb new file mode 100644 index 0000000..e4099f5 Binary files /dev/null and b/models/Frog Zoo.glb differ diff --git a/models/MBS-2351 Ansonia muelleri.glb b/models/MBS-2351 Ansonia muelleri.glb new file mode 100644 index 0000000..86e9b67 Binary files /dev/null and b/models/MBS-2351 Ansonia muelleri.glb differ diff --git a/models/MBS-2355 Platymantis corrugatus.glb b/models/MBS-2355 Platymantis corrugatus.glb new file mode 100644 index 0000000..60545d2 Binary files /dev/null and b/models/MBS-2355 Platymantis corrugatus.glb differ diff --git a/models/MBS-2357 Hylarana grandocula.glb b/models/MBS-2357 Hylarana grandocula.glb new file mode 100644 index 0000000..2be2a36 Binary files /dev/null and b/models/MBS-2357 Hylarana grandocula.glb differ diff --git a/models/MBS-2358 Sanguirana mearnsi.glb b/models/MBS-2358 Sanguirana mearnsi.glb new file mode 100644 index 0000000..0c748c6 Binary files /dev/null and b/models/MBS-2358 Sanguirana mearnsi.glb differ diff --git a/models/MBS-2362 Hoplobatrachus rugulosus.glb b/models/MBS-2362 Hoplobatrachus rugulosus.glb new file mode 100644 index 0000000..05459c0 Binary files /dev/null and b/models/MBS-2362 Hoplobatrachus rugulosus.glb differ diff --git a/models/MBS-2407 Staurois natator.glb b/models/MBS-2407 Staurois natator.glb new file mode 100644 index 0000000..89039a3 Binary files /dev/null and b/models/MBS-2407 Staurois natator.glb differ diff --git a/models/MBS-2408 Oreophryne anulata.glb b/models/MBS-2408 Oreophryne anulata.glb new file mode 100644 index 0000000..c9a97d2 Binary files /dev/null and b/models/MBS-2408 Oreophryne anulata.glb differ diff --git a/models/MBS-2410 Platymantis guentheri.glb b/models/MBS-2410 Platymantis guentheri.glb new file mode 100644 index 0000000..fbb7023 Binary files /dev/null and b/models/MBS-2410 Platymantis guentheri.glb differ diff --git a/models/MBS-2415 Kaloula pulchra.glb b/models/MBS-2415 Kaloula pulchra.glb new file mode 100644 index 0000000..ae6a63d Binary files /dev/null and b/models/MBS-2415 Kaloula pulchra.glb differ diff --git a/models/MBS-2416 Rhinella marina.glb b/models/MBS-2416 Rhinella marina.glb new file mode 100644 index 0000000..50c706d Binary files /dev/null and b/models/MBS-2416 Rhinella marina.glb differ diff --git a/models/Oreophryne.glb b/models/Oreophryne.glb new file mode 100644 index 0000000..a51b7a8 Binary files /dev/null and b/models/Oreophryne.glb differ diff --git a/models/Oreophryne2.glb b/models/Oreophryne2.glb new file mode 100644 index 0000000..a51b7a8 Binary files /dev/null and b/models/Oreophryne2.glb differ diff --git a/models/Sanguirana_Mearnsi.glb b/models/Sanguirana_Mearnsi.glb new file mode 100644 index 0000000..216e369 Binary files /dev/null and b/models/Sanguirana_Mearnsi.glb differ diff --git a/models/box.glb b/models/box.glb new file mode 100644 index 0000000..3577104 Binary files /dev/null and b/models/box.glb differ