같은 방에 입장된 클라이언트들은 그리기, 지우기, 첨부한 이미지 공유하기, 이미지 위치 옮기기 등의 기능을 공유합니다.

• 마우스 드래그를 종료(mouse up)하는 행위가 트리거가 되어서 마지막으로 그어진 선의 좌표, 두께, 색상을 오브젝트의 형태로 묶은 뒤 연결돼있던 웹소켓 커넥션을 통해 서버로 전송합니다. 그 후 서버에서 같은 room space 에 존재하는 클라이언트에게 broadcast 하여 데이터를 발신하면 클라이언트는 데이터를 수신함과 동시에 Canvas 가 업데이트 됩니다.

  

• Ctrl + Z 키 또는 ↩버튼을 클릭하면 마지막으로 생성된 선이 삭제되고 삭제 명령또한 웹소켓으로 공유되어 상대 클라이언트에서 마지막 선이 삭제됩니다.

  

• 이미지를 첨부하면 이미지 파일 과 이미지 파일의 좌표 또한 공유됩니다. 토글 스위치를 on 한다면 그림을 그리는 기능이 비활성화 되고 이미지 파일을 드래그해서 옮길 수 있는 상태로 전환됩니다. 또한 이미지 파일 위에 필기를 해야 하는 상황을 대비해 이미지 파일은 Ctrl + Z 키의 영향을 받지 않고 생성된 모든 선보다 z축 기준 뒤쪽 공간에 위치합니다.