구조. TODO

[tomtomjhj]

시작: client/index.html,

startMenuWrapper 활성화, 3개 버튼

startButton, spectateButton

클릭시 일반플레이어/관전자로 게임 시작, gameAreaWrapper 활성화

vrButton

클릭시 마지막 리플레이를 webvr로 보여줌. 새로운 페이지로 리다이렉트할 것

게임진행 server/

socket.io 이벤트들

• io.on('connection', function(socket) {...}) : 소켓이 서버에 연결되었을 때 실행. 인자로 주는 콜백에서 소켓으로 부터 전달받는 이벤트를 등록함

• socket.on('userRequiresGame', function (userName, userType) {...}) : 소켓이 'userRequiresGame'이벤트를 보낼 때 실행. 서버에 유저의 이름과 타입(플레이어/관전자)를 등록하고 타입에 따라 적절히 유저 정보(카메라의 위치/방향 등)을 초기화 하고 다음 이벤트('serverAcceptsPlayer', 'serverAcceptsSpectator') 발생시킴

• socket.emit('serverAcceptsPlayer', maze, currentUser)

• socket.emit('serverAcceptsSpectator', maze, currentUser)

• socket.on('playerSendsUpdates', function (data) {...} :플레이어가 보낸 데이터들을 서버에 업데이트

  • data 형식: {time:?, x:?, y:?, z:?, cx:?, cy:?, cz:?, state:? } (time은 현재 시간을 millisecond로 나타낸 것, 현재 위치가 (x,y,z), 카메라 방향이 (cx,cy,cz))

• socket.emit('serverSendsUpdates', players) : 각 플레이어들에게 다른 플레이어들의 데이터를 보내줌 players = [{ name,x,y,z,cx,cy,cz, state }, ...], (자기 자신은 제외하고 보냄)

• socket.emit('roundFinished', potg, result) : 한 라운드가 종료되었음을 알리고 플레이어가 이겼는지 졌는지 알려준다.

• socket.emit('serverStartsNewRound', maze) : 각 플레이어들에게 새로운 라운드가 시작했음을 알리고 새로 생성한 미로를 전송

• socket.on('playerWins', function(potg) : 플레이어가 끝났다고 서버에 업데이트

• socket.on('playerShoots' function(beam) {..}): 플레이어가 광선 발사

  • beam = { shooter, victim, startPoint, endPoint}: 쏜 사람, 맞은 사람(nullable), 발사 위치, 소멸 위치

• io.emit('serverBroadcastsBeam, beam)`: 발사된 빔 정보를 모듯 유저에게 전달

• socket.emit('youAreDead', data): 광선 맞은 플레이어가 죽었음을 죽은 플레이어에게 알림 -> 죽으면 나가지게하는게 깔끔?

• socket.broadcast.emit('playerDies', data):

  • data = {killer, victim }, 각각 이름만 포함해도 괜찮을듯

    게임진행 , client/js/

    socket.io 이벤트들

• 서버의 이벤트와 대칭

  구조

• app.js : 메인. 처음 화면에서 버튼 처리하고 game 모듈, global 모듈 불러와 구체적인 게임 처리함. vrButton 클릭시 리다이렉트

• global.js : 파일 간 전역 변수 공유 위한 모듈

• game.js: 기존의 index.html에서 복사해온것들. 적절히 묶어서 export해 app.js에서 사용할 것 ~~

[tomtomjhj]

할 것

• 기존 코드 리팩토링 -- 주기적으로 플레이어 정보를 서버로 넘겨야('playerSendsUpdates')
• 다른 플레이어들 정보 받아 보여주는 기능 구현
• 다른 플레이어를 표시할 모델 만들기
• 관전자 기능 구현

[tomtomjhj]

빔 쏘기에 관한 것들

• 빔 발사 이벤트 받아서 -> serverBroadcastsBeam 모든 소켓에게 빔 정보 날려줌, testBeam(빔 경로상에 있는 사람들 확인)-> 죽음 이벤트 보내주기
• 클라이언트에서 빔 오브젝트 표시. 모델은 간단하게 THREE.Line 쓰면 될듯
  • Line의 점은 어디서 계산?, Line은 2초정도 표시된 후 사라지도록 한다
• 'serverSendsUpdates' 이벤트에 관한 수정사항 반영할것 (빔 오브젝트 전달하기).
• 빔 맞아서 죽을 때 어디서부터 다시 시작할지 결정 : 닉네임 화면으로

• ??

  클라이언트에서 raycast로 맞을 대상 다 보내는 것으로 해야