search

Ryanmufasa / CaptainTalk

크로스플랫폼 3조 웹 채팅프로그램 프로젝트
0 stars 0 forks source link

[UI 04] 메인화면(채팅창리스트) 구현 #17

Open ghost opened 2 years ago

ghost commented 2 years ago

HTML과 CSS를 이용하여 채팅방목록이 있는 페이지를 구현하겠습니다.

ghost commented 2 years ago

여유가 있다면 기능구현까지 해보고싶으나, 상황이 여의치 않으면 다른분들이 작업해주셔도 됩니다!!

rlxo4307 commented 2 years ago

작업 합류

rlxo4307 commented 2 years ago

waitingRoom에서 [채팅창 만들기] 버튼을 클릭하면 roomName 팝업창을 실행시켜 (roomName.jsp) 채팅방 이름(room)을 입력받아 makeRoom에서 채팅방 이름을 중복확인 후 채팅방을 개설(db사용)

채팅방 이름이 중복이면 makeRoom_fail 팝업을 띄워 '채팅방 이름 중복' 문구를 띄운 후

  1. 다시 만들기 (romName)
  2. 대기실로 이동(waitingRoom) 선택지를 주어 이동하게 한다

채팅방 이름이 중복이 아니면 makeRoom_success 창을 띄워 '방 생성 성공' 문구를 띄운 후

  1. 대기실로 이동 (waitingRoom) 선택지를 주어 이동하게 한 후 대기실에는 새로 생성한 이름의 채팅창이 보이게 한다.
rlxo4307 commented 2 years ago

ChatVO, ChatDAO 구현

  1. waitingRoom에서 [채팅방 만들기] 버튼 클릭하면 팝업창이 떠서 채팅방 이름을 입력받는다.

  2. roomName.jsp 팝업창에서 채팅방이름을 makeRoom.jsp으로 전달한 후 roomName.jsp은 닫힌다.

  3. makeRoom.jsp에서 ChatDAO.make_room 함수를 통해 채팅방 개설 성공/실패를 makeRoomResult.jsp로 전달한다

  4. 성공시 대기실로 이동/채팅창으로 이동 선택이 2개 주어지며
    대기실로 이동 선택시 makeRoomResult.jsp는 닫히고 waitingRoom.jsp 는 새로고침된다. 채팅방으로 이동 선택시 먼저 띄워져있는 waitingRoom.jsp는 직접 닫아주거나 납두거나 할 수 있다.

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

[ 다음 예정 작업]

  1. 페이지 이동하면서 자동으로 다른 띄워져있는 페이지가 닫히는 기능 알아볼 것
  2. waingRoom.jsp에 만든 채팅방들을 업로드 시킨다
  3. 업로드 된 채팅방 목록을 중 하나를 클릭하면 개별적인 채팅page 생성
  4. 유저가 기존 생성된 채팅방을 클릭하면 Chat.DAO.join_room() 함수를 사용하여 입장
  5. 채팅방에서 나가면 Chat.DAO.out_room(채팅방 멤버에서 삭제), Chat.DAO.delete_room (채팅방에 사람이 없을 시 채팅방 삭제) 을 사용한다.

ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

[ 검토 사항 ] 현재 waingRoom.jsp 에서 팝업 시스템을 이용해서 채팅방 이름을 입력받기 떄문에, 새로고침 기능과 self.close() 기능을 사용해야하므로 불편함이 있다.

form -> action 기능으로 한 페이지씩 이동하면서 진행을 할 것인지

현재 구현한 팝업기능을 고수할 것인지는 고민해봐야 할 문제

rlxo4307 commented 2 years ago
  1. 팝업기능 문제 해결
  2. 부모창을 닫고 자식창에서 다시 watringRoom으로 이동 후 채팅방 입장 가능
  3. makeRoomResult 에서 바로 채팅방으로 입장 가능(동적페이지 구현 문제 남아있음)
  4. 채팅방에서 로그아웃 버튼 생성. 클릭시 A. ChatDAO.out_room, ChatDAO.delete_room을 이용하여 맴버삭제, 빈 채팅방 삭제 기능 구현
rlxo4307 commented 2 years ago

대기실에서 생성돼있는 채팅방에 입장하고 로그아웃 하는 기능은 확인 했는데, 새로운 채팅방 생성할 때(ChatDAO.make_room( ) )에서 sql문 에러 발생

rlxo4307 commented 2 years ago

ChatDAO.jsp

  1. 채팅방 생성
  2. 채팅방 참여
  3. 채팅방 로그아웃
  4. 채팅방 삭제

기능 구현 완료 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ waitingRoom.jsp (대기실)-> main.jsp (채팅방) 로 넘어갈 때

자동으로 채팅방 로그아웃(dao.out_room()), 채팅방 삭제 함수(dao.out_delete())가 실행되는데 이 부분 해결해야 함

아마 function logOut(){ <%dao.out_room(room,name); dao.delete_room();%> location.href='index.jsp'; } 함수가 자동으로 실행되는 것 같다

rlxo4307 commented 2 years ago

function logOut(){ <%dao.out_room(room,name); dao.delete_room();%> location.href='index.jsp'; }이 자동으로 실행되는 이유는

script안에 servlet을 사용했기 때문이었다.

logOut.jsp를 만들고 로그아웃 버튼을 누르면 이 페이지로 이동하게 한 후

dao.out_room(room,name); // 채팅방에서 사용자 삭제 dao.delete_room(); //사용자가 없는 채팅방 삭제 를 실행한 다음

index.jsp로 이동하게 구현하였다.