dejvino/music-video-gen
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: dejvino:383ba8baf190154bae771d43d47e9e966d19e8b9
Branches Tags
dejvino:main
..
compare: dejvino:cdd90a4c5732b5f86c51e609312a5a4e2768fd72
Branches Tags
dejvino:main

No commits in common. "383ba8baf190154bae771d43d47e9e966d19e8b9" and "cdd90a4c5732b5f86c51e609312a5a4e2768fd72" have entirely different histories.
383ba8baf1 ... cdd90a4c57

4 changed files with 29 additions and 5 deletions
Show Stats Expand all files Collapse all files

14
party-cathedral/index.html
View File

@ -21,6 +21,20 @@
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>
</head> </head>
<body> <body>
<!-- Hidden Video Element --><video id="video" playsinline muted class="hidden"></video>
<!-- Controls for loading video --><div id="controls" class="fixed bottom-4 left-1/2 transform -translate-x-1/2 z-20 flex flex-col items-center space-y-2">
<!-- Hidden File Input that will be triggered by the button --><input type="file" id="fileInput" accept="video/mp4" class="hidden" multiple>
<div class="flex space-x-4">
<!-- Load Tapes Button --><button id="loadTapeButton" class="px-8 py-3 bg-[#cc3333] text-white font-bold text-lg uppercase tracking-wider rounded-lg hover:bg-red-700 transition duration-150 active:translate-y-px">
BEHOLD THE SPECTACLE
</button>
</div>
</div>
<!-- 3D Canvas will be injected here by Three.js --> <!-- 3D Canvas will be injected here by Three.js -->
</body> </body>
</html> </html>

9
party-cathedral/src/core/animate.js
View File

@ -7,17 +7,18 @@ function updateCamera() {
const globalTime = Date.now() * 0.0001; const globalTime = Date.now() * 0.0001;
const lookAtTime = Date.now() * 0.0002; const lookAtTime = Date.now() * 0.0002;
const camAmplitude = new THREE.Vector3(1.0, 0.1, 10.0);
const lookAmplitude = 8.0;
// Base Camera Position in front of the TV // Base Camera Position in front of the TV
const baseX = 0; const baseX = 0;
const baseY = 3.6; const baseY = 2.6;
const baseZ = -5.0; const baseZ = 0.0;
const camAmplitude = new THREE.Vector3(1.0, 1.0, 6.0);
// Base LookAt target (Center of the screen) // Base LookAt target (Center of the screen)
const baseTargetX = 0; const baseTargetX = 0;
const baseTargetY = 1.6; const baseTargetY = 1.6;
const baseTargetZ = -30.0; const baseTargetZ = -30.0;
const lookAmplitude = 8.0;
// Camera Position Offsets (Drift) // Camera Position Offsets (Drift)
const camOffsetX = Math.sin(globalTime * 3.1) * camAmplitude.x; const camOffsetX = Math.sin(globalTime * 3.1) * camAmplitude.x;

9
party-cathedral/src/core/init.js
View File

@ -47,6 +47,15 @@ export function init() {
// 9. Event Listeners // 9. Event Listeners
window.addEventListener('resize', onWindowResize, false); window.addEventListener('resize', onWindowResize, false);
state.fileInput.addEventListener('change', loadVideoFile);
// Button logic
state.loadTapeButton.addEventListener('click', () => {
state.fileInput.click();
});
// Auto-advance to the next video when the current one finishes.
state.videoElement.addEventListener('ended', playNextVideo);
// Start the animation loop // Start the animation loop
animate(); animate();

2
party-cathedral/src/scene/party-guests.js
View File

@ -69,7 +69,7 @@ export class PartyGuests extends SceneFeature {
const pos = new THREE.Vector3( const pos = new THREE.Vector3(
(Math.random() - 0.5) * 10, (Math.random() - 0.5) * 10,
guestHeight / 2, guestHeight / 2,
(Math.random() * 20) - 6 // Position them in the main hall (Math.random() * 20) - 12 // Position them in the main hall
); );
guest.position.copy(pos); guest.position.copy(pos);
state.scene.add(guest); state.scene.add(guest);