You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
174 lines
6.1 KiB
174 lines
6.1 KiB
// import * as THREE from 'three';
|
|
// import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
|
|
// import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
|
|
// import { RenderPixelatedPass } from 'three/addons/postprocessing/RenderPixelatedPass.js';
|
|
// import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
|
|
// import { randFloat } from 'three/src/math/MathUtils.js';
|
|
|
|
// let scene, camera, renderer;
|
|
// let aspect, frustumSize;
|
|
// let time = 0;
|
|
// let lastTime = 0;
|
|
// let controls;
|
|
// let mesh;
|
|
// let composer;
|
|
// let cubeGroup = [];
|
|
// let instancedMesh, dummy, count;
|
|
|
|
// const cont = document.getElementById("container")
|
|
// //cont.style.opacity = "1"
|
|
// cont.style.filter = "blur(0px)"
|
|
|
|
|
|
// // Initialize loading manager
|
|
// const loadingManager = new THREE.LoadingManager();
|
|
// loadingManager.onLoad = function() {
|
|
// // Run init after all resources are loaded
|
|
// init();
|
|
// };
|
|
|
|
// // Load texture with loading manager
|
|
// const textureLoader = new THREE.TextureLoader(loadingManager);
|
|
// const texture = textureLoader.load("public/images/blue-and-white.png");
|
|
// texture.minFilter = THREE.NearestFilter;
|
|
// texture.colorSpace = THREE.SRGBColorSpace;
|
|
// texture.wrapS = THREE.RepeatWrapping;
|
|
// texture.wrapT = THREE.RepeatWrapping;
|
|
|
|
// function init() {
|
|
// SetupRenderer();
|
|
// scene = new THREE.Scene();
|
|
// SetupCamera();
|
|
// SetupControls();
|
|
// composer = new EffectComposer(renderer);
|
|
// const renderPixelatedPass = new RenderPixelatedPass(8, scene, camera);
|
|
// renderPixelatedPass.normalEdgeStrength = 0;
|
|
// renderPixelatedPass.depthEdgeStrength = 1;
|
|
// renderPixelatedPass.pixelAlignedPanning = false;
|
|
// composer.addPass(renderPixelatedPass);
|
|
// const outputPass = new OutputPass();
|
|
// composer.addPass(outputPass);
|
|
// SetupCubes();
|
|
// AddLights();
|
|
// animate();
|
|
// }
|
|
|
|
// function SetupCubes() {
|
|
// const cubeGeometry = new THREE.BoxGeometry();
|
|
// const cubeMaterial = new THREE.MeshPhongMaterial({ map: texture });
|
|
|
|
// // Create an InstancedMesh
|
|
// count = 400;
|
|
// instancedMesh = new THREE.InstancedMesh(cubeGeometry, cubeMaterial, count);
|
|
// scene.add(instancedMesh);
|
|
// dummy = new THREE.Object3D();
|
|
|
|
// for (let i = 0; i < count; i++) {
|
|
// let size = randFloat(5, 8);
|
|
// dummy.scale.set(size, size, size);
|
|
// dummy.position.set(randFloat(-10, 10), randFloat(-8, 8), 0);
|
|
// dummy.updateMatrix();
|
|
// instancedMesh.setMatrixAt(i, dummy.matrix);
|
|
// }
|
|
// }
|
|
|
|
// function SetupRenderer() {
|
|
// renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
|
|
// renderer.setClearColor(0xffffff, 0);
|
|
// renderer.setSize(window.innerWidth, window.innerHeight);
|
|
// document.getElementById('container').appendChild(renderer.domElement);
|
|
// }
|
|
|
|
// function SetupCamera() {
|
|
// aspect = window.innerWidth / window.innerHeight;
|
|
// frustumSize = 10;
|
|
// camera = new THREE.OrthographicCamera(
|
|
// (frustumSize * aspect) / -2,
|
|
// (frustumSize * aspect) / 2,
|
|
// frustumSize / 2,
|
|
// frustumSize / -2,
|
|
// 0.01,
|
|
// 5000
|
|
// );
|
|
|
|
// camera.position.x = 5;
|
|
// }
|
|
|
|
// function SetupControls() {
|
|
// controls = new OrbitControls(camera, renderer.domElement);
|
|
// controls.enableRotate = false;
|
|
// controls.enablePan = false;
|
|
// controls.zoomToCursor = false;
|
|
// controls.mouseButtons = {
|
|
// RIGHT: THREE.MOUSE.ROTATE,
|
|
// MIDDLE: THREE.MOUSE.DOLLY,
|
|
// LEFT: THREE.MOUSE.PAN
|
|
// };
|
|
// camera.position.set(0, 0, 20);
|
|
// controls.update();
|
|
// }
|
|
|
|
// function AddLights() {
|
|
// // Add Ambient Light
|
|
// const ambientLight = new THREE.AmbientLight(0xffffff, 5); // Soft white light
|
|
// scene.add(ambientLight);
|
|
|
|
// // Add Directional Light
|
|
// const directionalLight = new THREE.DirectionalLight(0xffffff, 0); // Soft white light
|
|
// directionalLight.position.set(-5, 0, 5).normalize();
|
|
// scene.add(directionalLight);
|
|
// }
|
|
|
|
// const matrix = new THREE.Matrix4();
|
|
// function animate() {
|
|
// requestAnimationFrame(animate);
|
|
// // Rotate instanced meshes
|
|
// const time = performance.now() * 0.001;
|
|
// const rotationSpeedX = 0.02;
|
|
// const rotationSpeedY = 0.01;
|
|
// lastTime = time;
|
|
|
|
// for (let i = 0; i < count; i++) {
|
|
// instancedMesh.getMatrixAt(i, matrix);
|
|
// matrix.decompose(dummy.position, dummy.rotation, dummy.scale);
|
|
// dummy.rotation.set((i / 1000) * time, (i / 1000) * time, (i / 1000) * time);
|
|
// dummy.updateMatrix();
|
|
// instancedMesh.setMatrixAt(i, dummy.matrix);
|
|
// }
|
|
// instancedMesh.instanceMatrix.needsUpdate = true;
|
|
|
|
// composer.render();
|
|
// //renderer.render(scene, camera)
|
|
// }
|
|
|
|
// window.addEventListener('resize', () => {
|
|
// aspect = window.innerWidth / window.innerHeight;
|
|
// camera.left = (-frustumSize * aspect) / 2;
|
|
// camera.right = (frustumSize * aspect) / 2;
|
|
// camera.top = frustumSize / 2;
|
|
// camera.bottom = -frustumSize / 2;
|
|
// camera.updateProjectionMatrix();
|
|
// renderer.setPixelRatio(window.devicePixelRatio);
|
|
// renderer.setSize(window.innerWidth, window.innerHeight);
|
|
// });
|
|
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
// Check if the current URL contains the path "events"
|
|
if (window.location.pathname.includes("events")) {
|
|
// Select the element you want to change
|
|
const myElement = document.getElementById("events");
|
|
// Add a class to change its style
|
|
myElement.classList.add("active-page");
|
|
}
|
|
else if (window.location.pathname.includes("exhibitions")) {
|
|
// Select the element you want to change
|
|
const myElement = document.getElementById("exhibitions");
|
|
// Add a class to change its style
|
|
myElement.classList.add("active-page");
|
|
} else if (window.location.pathname.includes("conferences")) {
|
|
// Select the element you want to change
|
|
const myElement = document.getElementById("conferences");
|
|
// Add a class to change its style
|
|
myElement.classList.add("active-page");
|
|
}
|
|
});
|
|
|