Skip to content

Commit 25bb123

Browse files
Update index.html
1 parent a766269 commit 25bb123

File tree

1 file changed

+89
-6
lines changed

1 file changed

+89
-6
lines changed

index.html

+89-6
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
<title>Infinite Hallway</title>
7+
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
8+
<script src="https://kit.fontawesome.com/6c2b708adc.js" crossorigin="anonymous"></script>
79
</head>
810
<style>
911
@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
@@ -67,6 +69,37 @@
6769
justify-content: center;
6870
align-items: center;
6971
}
72+
#controller-forward {
73+
position: fixed;
74+
bottom: 80px;
75+
right: 60px;
76+
font-size: 40px;
77+
color: antiquewhite;
78+
}
79+
80+
#controller-right {
81+
position: fixed;
82+
bottom: 42px;
83+
right: 20px;
84+
font-size: 40px;
85+
color: antiquewhite;
86+
}
87+
88+
#controller-back {
89+
position: fixed;
90+
right: 60px;
91+
bottom: 2px;
92+
font-size: 40px;
93+
color: antiquewhite;
94+
}
95+
96+
#controller-left {
97+
position: fixed;
98+
bottom: 42px;
99+
right: 100px;
100+
font-size: 40px;
101+
color: antiquewhite;
102+
}
70103

71104
</style>
72105
<body>
@@ -85,10 +118,27 @@ <h1 style="font-size:60px;">WELCOME TO AYAN'S</br>INFINITE HALL OF FAME</h1>
85118
</div>
86119
</div>
87120
<div class="container"><p id="textHover">click to open</p></div>
121+
<div id="arrow">
122+
<p id="controller-forward"><i class="fal fa-arrow-circle-up"></i></p>
123+
<p id="controller-right"><i class="fal fa-arrow-circle-right"></i></p>
124+
<p id="controller-back" ><i class="fal fa-arrow-circle-down"></i></p>
125+
<p id="controller-left"><i class="fal fa-arrow-circle-left"></i></p>
126+
</div>
88127
</body>
128+
<script>
129+
var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
130+
if (isMobile) {
131+
document.getElementById("instructions").style.display = "none";
132+
document.getElementById("blocker").style.display = "none";
133+
}
134+
else{
135+
document.getElementById("arrow").style.display = "none";
136+
137+
}
138+
</script>
89139
<script type="module">
90140
import * as THREE from 'https://cdn.skypack.dev/[email protected]';
91-
import { PointerLockControls } from 'https://cdn.skypack.dev/[email protected]/examples/jsm/controls/PointerLockControls.js';
141+
import { PointerLockControls } from '/PointerlockcontrolsMobile.js';
92142
import { GLTFLoader } from 'https://cdn.skypack.dev/[email protected]/examples/jsm/loaders/GLTFLoader.js'
93143
import { DRACOLoader } from 'https://cdn.skypack.dev/[email protected]/examples/jsm/loaders/DRACOLoader.js'
94144

@@ -100,7 +150,7 @@ <h1 style="font-size:60px;">WELCOME TO AYAN'S</br>INFINITE HALL OF FAME</h1>
100150
let raycaster2;
101151
let currentIntersect = null;
102152
let enableRaycast = true;
103-
153+
let audio1 = new Audio('/models/Hall.mp3');
104154
let urls = {
105155
0:"https://bookshub.pythonanywhere.com/",
106156
1:"https://jivanam.pythonanywhere.com/",
@@ -294,6 +344,43 @@ <h1 style="font-size:60px;">WELCOME TO AYAN'S</br>INFINITE HALL OF FAME</h1>
294344
}
295345

296346
};
347+
const forward = document.getElementById('controller-forward')
348+
forward.addEventListener("touchstart", function () {
349+
moveForward = true;
350+
})
351+
forward.addEventListener("touchend", function () {
352+
moveForward = false;
353+
})
354+
forward.addEventListener("touchmove", function () {
355+
moveForward = false;
356+
})
357+
const right = document.getElementById('controller-right')
358+
right.addEventListener("touchstart", function () {
359+
moveRight = true;
360+
})
361+
right.addEventListener('touchend', function () {
362+
moveRight = false
363+
})
364+
const left = document.getElementById('controller-left')
365+
left.addEventListener("touchstart", function () {
366+
moveLeft = true;
367+
})
368+
left.addEventListener('touchend', function () {
369+
moveLeft = false
370+
})
371+
const back = document.getElementById('controller-back')
372+
back.addEventListener("touchstart", function () {
373+
moveBackward = true;
374+
})
375+
back.addEventListener('touchend', function () {
376+
moveBackward = false
377+
})
378+
document.addEventListener('touchmove',function(){
379+
if(audio1.currentTime == 0){
380+
audio1.volume = 0.1;
381+
audio1.play()
382+
}
383+
})
297384
window.addEventListener('click', () =>
298385
{
299386
if(currentIntersect)
@@ -393,8 +480,6 @@ <h1 style="font-size:60px;">WELCOME TO AYAN'S</br>INFINITE HALL OF FAME</h1>
393480

394481
const time = performance.now();
395482

396-
if ( controls.isLocked === true ) {
397-
398483
if (camera.position.x > hallBox.max.x-5){
399484
camera.position.x-=0.5
400485
}
@@ -444,8 +529,6 @@ <h1 style="font-size:60px;">WELCOME TO AYAN'S</br>INFINITE HALL OF FAME</h1>
444529

445530
}
446531

447-
}
448-
449532
prevTime = time;
450533

451534
renderer.render( scene, camera );

0 commit comments

Comments
 (0)