Spaces:
Running
Running
cutechicken
commited on
Update game.js
Browse files
game.js
CHANGED
@@ -42,35 +42,6 @@ class TankPlayer {
|
|
42 |
this.scene = new THREE.Scene();
|
43 |
this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
|
44 |
this.renderer = new THREE.WebGLRenderer({ antialias: true });
|
45 |
-
// 조준선 관련 속성 추가
|
46 |
-
this.aimLine = null;
|
47 |
-
this.aimLineLength = 100; // 조준선 길이
|
48 |
-
this.createAimLine();
|
49 |
-
}
|
50 |
-
// 조준선 생성 메서드
|
51 |
-
createAimLine() {
|
52 |
-
const geometry = new THREE.BufferGeometry();
|
53 |
-
const material = new THREE.LineBasicMaterial({
|
54 |
-
color: 0xff0000,
|
55 |
-
linewidth: 1,
|
56 |
-
transparent: true,
|
57 |
-
opacity: 0.5
|
58 |
-
});
|
59 |
-
|
60 |
-
// 시작점과 끝점으로 선 생성
|
61 |
-
const points = [
|
62 |
-
new THREE.Vector3(0, 0, 0),
|
63 |
-
new THREE.Vector3(0, 0, this.aimLineLength)
|
64 |
-
];
|
65 |
-
geometry.setFromPoints(points);
|
66 |
-
|
67 |
-
this.aimLine = new THREE.Line(geometry, material);
|
68 |
-
this.aimLine.position.y = 0.5; // 포탑 높이에 맞춤
|
69 |
-
|
70 |
-
// 포탑 그룹에 조준선 추가
|
71 |
-
if (this.turretGroup) {
|
72 |
-
this.turretGroup.add(this.aimLine);
|
73 |
-
}
|
74 |
}
|
75 |
// 별도의 메서드로 분리
|
76 |
createExplosionEffect(scene, position) {
|
@@ -283,12 +254,6 @@ class TankPlayer {
|
|
283 |
scene.add(this.body);
|
284 |
this.isLoaded = true;
|
285 |
this.updateAmmoDisplay();
|
286 |
-
// 조준선 추가
|
287 |
-
this.createAimLine();
|
288 |
-
|
289 |
-
scene.add(this.body);
|
290 |
-
this.isLoaded = true;
|
291 |
-
this.updateAmmoDisplay();
|
292 |
|
293 |
} catch (error) {
|
294 |
console.error('Error loading tank models:', error);
|
@@ -456,17 +421,6 @@ startReload() {
|
|
456 |
const absoluteTurretRotation = mouseX;
|
457 |
this.turretGroup.rotation.y = absoluteTurretRotation - this.body.rotation.y;
|
458 |
this.turretRotation = absoluteTurretRotation;
|
459 |
-
// 조준선 업데이트
|
460 |
-
if (this.aimLine) {
|
461 |
-
// 조준선의 투명도를 거리에 따라 조절
|
462 |
-
const points = this.aimLine.geometry.attributes.position.array;
|
463 |
-
for (let i = 0; i < points.length; i += 3) {
|
464 |
-
const distance = Math.sqrt(points[i] * points[i] + points[i + 2] * points[i + 2]);
|
465 |
-
const opacity = 1 - (distance / this.aimLineLength);
|
466 |
-
this.aimLine.material.opacity = Math.max(0.2, opacity);
|
467 |
-
}
|
468 |
-
}
|
469 |
-
|
470 |
|
471 |
// 총알 업데이트 및 충돌 체크
|
472 |
for (let i = this.bullets.length - 1; i >= 0; i--) {
|
@@ -972,42 +926,21 @@ class Game {
|
|
972 |
|
973 |
async initialize() {
|
974 |
try {
|
975 |
-
// BGM
|
976 |
-
if (!this.bgm) {
|
977 |
this.bgm = new Audio('sounds/BGM.ogg');
|
978 |
this.bgm.volume = 0.5;
|
979 |
this.bgm.loop = true;
|
|
|
|
|
980 |
}
|
981 |
-
|
982 |
-
// 사용자 상호작용 후 BGM 재생
|
983 |
-
const playBGM = () => {
|
984 |
-
if (this.bgm && !this.bgmPlaying) {
|
985 |
-
this.bgm.play()
|
986 |
-
.then(() => {
|
987 |
-
this.bgmPlaying = true;
|
988 |
-
})
|
989 |
-
.catch(error => {
|
990 |
-
console.error('BGM playback failed:', error);
|
991 |
-
});
|
992 |
-
}
|
993 |
-
};
|
994 |
-
|
995 |
// 시작 사운드 재생
|
996 |
const startSounds = ['sounds/start1.ogg', 'sounds/start2.ogg', 'sounds/start3.ogg'];
|
997 |
const randomStartSound = startSounds[Math.floor(Math.random() * startSounds.length)];
|
998 |
const startAudio = new Audio(randomStartSound);
|
999 |
startAudio.volume = 0.5;
|
1000 |
-
|
1001 |
-
// 시작 사운드 재생 후 BGM 시작
|
1002 |
-
startAudio.play()
|
1003 |
-
.then(() => {
|
1004 |
-
playBGM();
|
1005 |
-
})
|
1006 |
-
.catch(error => {
|
1007 |
-
console.error('Start sound playback failed:', error);
|
1008 |
-
playBGM(); // 시작 사운드 실패해도 BGM 시작
|
1009 |
-
});
|
1010 |
-
|
1011 |
|
1012 |
// 렌더러 설정
|
1013 |
this.renderer.shadowMap.enabled = true;
|
@@ -1905,11 +1838,7 @@ class Game {
|
|
1905 |
|
1906 |
// Start game
|
1907 |
window.startGame = function() {
|
1908 |
-
|
1909 |
-
if (startScreen) {
|
1910 |
-
startScreen.style.display = 'none';
|
1911 |
-
}
|
1912 |
-
|
1913 |
document.body.requestPointerLock();
|
1914 |
|
1915 |
if (!window.gameInstance) {
|
@@ -1918,25 +1847,18 @@ window.startGame = function() {
|
|
1918 |
|
1919 |
// 게임 시작 설정
|
1920 |
window.gameInstance.isStarted = true;
|
1921 |
-
window.gameInstance.initialize()
|
1922 |
-
console.error('Failed to initialize game:', error);
|
1923 |
-
});
|
1924 |
};
|
1925 |
|
1926 |
// Initialize game
|
1927 |
document.addEventListener('DOMContentLoaded', () => {
|
1928 |
-
// 게임
|
1929 |
window.gameInstance = new Game();
|
1930 |
|
1931 |
-
// 기본적인 씬
|
1932 |
window.gameInstance.setupScene();
|
1933 |
-
window.gameInstance.animate();
|
1934 |
|
1935 |
// 시작 화면 표시
|
1936 |
-
|
1937 |
-
if (startScreen) {
|
1938 |
-
startScreen.style.display = 'flex';
|
1939 |
-
startScreen.style.justifyContent = 'center';
|
1940 |
-
startScreen.style.alignItems = 'center';
|
1941 |
-
}
|
1942 |
});
|
|
|
42 |
this.scene = new THREE.Scene();
|
43 |
this.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
|
44 |
this.renderer = new THREE.WebGLRenderer({ antialias: true });
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
45 |
}
|
46 |
// 별도의 메서드로 분리
|
47 |
createExplosionEffect(scene, position) {
|
|
|
254 |
scene.add(this.body);
|
255 |
this.isLoaded = true;
|
256 |
this.updateAmmoDisplay();
|
|
|
|
|
|
|
|
|
|
|
|
|
257 |
|
258 |
} catch (error) {
|
259 |
console.error('Error loading tank models:', error);
|
|
|
421 |
const absoluteTurretRotation = mouseX;
|
422 |
this.turretGroup.rotation.y = absoluteTurretRotation - this.body.rotation.y;
|
423 |
this.turretRotation = absoluteTurretRotation;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
424 |
|
425 |
// 총알 업데이트 및 충돌 체크
|
426 |
for (let i = this.bullets.length - 1; i >= 0; i--) {
|
|
|
926 |
|
927 |
async initialize() {
|
928 |
try {
|
929 |
+
// BGM이 아직 재생되지 않은 경우에만 재생
|
930 |
+
if (!this.bgmPlaying && !this.bgm) {
|
931 |
this.bgm = new Audio('sounds/BGM.ogg');
|
932 |
this.bgm.volume = 0.5;
|
933 |
this.bgm.loop = true;
|
934 |
+
this.bgm.play();
|
935 |
+
this.bgmPlaying = true;
|
936 |
}
|
937 |
+
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
938 |
// 시작 사운드 재생
|
939 |
const startSounds = ['sounds/start1.ogg', 'sounds/start2.ogg', 'sounds/start3.ogg'];
|
940 |
const randomStartSound = startSounds[Math.floor(Math.random() * startSounds.length)];
|
941 |
const startAudio = new Audio(randomStartSound);
|
942 |
startAudio.volume = 0.5;
|
943 |
+
startAudio.play();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
944 |
|
945 |
// 렌더러 설정
|
946 |
this.renderer.shadowMap.enabled = true;
|
|
|
1838 |
|
1839 |
// Start game
|
1840 |
window.startGame = function() {
|
1841 |
+
document.getElementById('startScreen').style.display = 'none';
|
|
|
|
|
|
|
|
|
1842 |
document.body.requestPointerLock();
|
1843 |
|
1844 |
if (!window.gameInstance) {
|
|
|
1847 |
|
1848 |
// 게임 시작 설정
|
1849 |
window.gameInstance.isStarted = true;
|
1850 |
+
window.gameInstance.initialize();
|
|
|
|
|
1851 |
};
|
1852 |
|
1853 |
// Initialize game
|
1854 |
document.addEventListener('DOMContentLoaded', () => {
|
1855 |
+
// 게임 인스턴스만 생성하고 초기화는 하지 않음
|
1856 |
window.gameInstance = new Game();
|
1857 |
|
1858 |
+
// 기본적인 씬 설정만 수행
|
1859 |
window.gameInstance.setupScene();
|
1860 |
+
window.gameInstance.animate(); // 렌더링 시작
|
1861 |
|
1862 |
// 시작 화면 표시
|
1863 |
+
document.getElementById('startScreen').style.display = 'block';
|
|
|
|
|
|
|
|
|
|
|
1864 |
});
|