오늘은 Wires와 work mode를 구현했다.

나는 crxMouse Gestures라는 Chrome 확장 프로그램을 사용하고 있다. 이 프로그램은 오른쪽 클릭을 사용해서 제스처 기능을 사용할 수 있도록 해준다. 문제는 그것 때문에 오른쪽 클릭을 활용하는 프로그램 내 기능을 활용할 수 없게 된다는 것이다. 따라서 이번 SchBoard 2에서는 클릭의 종류에 따라 기능이 나눠지는 대신에 작업 모드라는 것을 제시하여, 특정 작업만을 보다 깊게 수행할 수 있도록 의도했다. 따라서 오늘은 작업 기능에 따라 다르게 작동하는 프로그램을 구현할 필요가 있었다.

오늘 구현한 작업 기능은 배치 모드와 와이어링 모드이다.

배치 모드는 Components를 잡고 이동하여 내가 원하는 장소에 놓을 수 있게 하는 기능이고, 와이어링 모드는 소켓과 소켓을 와이어로 잇는 기능이다.

배치 모드

배치 모드를 만들면서 가장 중요한 점은 역시 어떻게 Component가 움직이고 더 이상 움직이지 않는 것을 구현하느냐이다.

기본적으로 이 프로그램에서는 board 좌표계와 screen 좌표계로 2개의 좌표계를 사용하고 있다. screen 좌표계는 우리가 보는 화면 왼쪽 위를 (0, 0)으로 두는 좌표계이다. 실제로 요소가 화면에 배치될 때에는 screen 좌표계를 사용하여 배치해야 한다. 다른 좌표계는 board 좌표계이다. board 좌표게는 임의의 한 점을 (0, 0)으로 정해서 그것을 기준으로 x 방향, y 방향으로 얼마나 떨어져있느냐를 나타낸다. 이것이 필요한 이유는, SchBoard를 사용하면서 만드는 기계가 어디까지나 확장될 수 있게 하기 위함이며, 그것을 위해서 만들어진 보드 위를 Top-Down 형식으로 바라보는 UX가 필요했다고 생각했기 때문이다. board 좌표계에서의 (0, 0) 점이 어디에 보이는지는 현재 카메라가 어디에 있는지에 따라 달라진다.

이 좌표계에 대한 구현은 이미 저번 개발일에 완료한 상태였다. 하지만 배치 모드와 같이 사용자가 느끼는 위치와 프로그램 내의 위치를 한 번에 고려해야 하는 기능은 구현이 까다롭다. 사용자의 마우스 커서 위치를 screen 좌표계에서 받아 그것을 board 좌표계로 변환하고, 그것을 기준으로 얼마나 마우스 커서가 움직였는지에 따라 Component의 위치를 조정하여야 한다. 두 좌표계 사이의 변수들을 헷갈리지 않도록 조심해야 하는 부분이다.

와이어링 모드

와이어링 모드에서 가장 중요한 것은 어떤 소켓에 어떤 와이어를 연결할 것이냐 하는 것이다. 소켓은 gameObject들을 담아놓는 리스트에 직접적으로 담겨있지 않고 Component의 멤버변수인 list의 요소로 존재하기 때문에 모든 소켓에 대해서 어떤 소켓을 선택했는지 알아보는 것은 비교적 까다롭다. 하지만 별로 어려운 것은 아니다.

기존 버전의 SchBoard에서 와이어는 그 출력과 입력의 구분이 명확하지 않았는데, 프로그램을 사용하면서 보니까 입력 기능을 하는 소켓에는 두 개 이상의 와이어를 연결하면 오류가 발생하는 일이 있었다. 따라서 이번에는 하나의 와이어가 입력 기능을 하는 소켓과 출력 기능을 하는 소켓을 잇는 한 가지 경우만을 구현해내기 위해서 소켓의 타입을 지정하게 했고, 입력과 입력, 출력과 출력 기능을 각각 담당하는 소켓들과는 서로 연결되지 못하도록 했다.

와이어 배치 모드 (아직 안 만듬)

아직 구현되지 않은 기능이기는 하나, 와이어 배치 모드는 와이어가 그리드에 있는 한 점을 경유하도록 하는 비주얼 기능이다. 와이어 배치 모드는 와이어를 이루는 각각의 직선들까지의 마우스 커서에서의 거리를 계산하여 가장 가까운 것에 해당하는 직선의 구간에 새로운 점을 만드는 것으로 구현이 가능하리라.

다음 개발일

다음 개발일에는 다음과 같은 기능을 구현해야 하겠다.

• Component 계산 구현
• 탭
• Wire 정보 전송 기능

최적화를 위해서, Component 계산과 Wire 정보 전송 기능은 필요할 때만 진행하는 것이 좋으리라. 따라서 계산을 필요로 하는 Component와 Wire를 모아놓는 큐를 제시하여 일정 틱마다 또는 틱마다 몇 번씩 큐의 요소의 기능을 수행하도록 하느 방식으로 계산을 구현하는 것이 좋으리라.

탭... 은 어떻게 구현해야 할지 아직 잘 모르겠다. 잘 생각해보는 것이 좋겠다.

추신

저번 개발일 날 개발 일지를 작성하고 나서 SchBoard 2를 GitHub에 업로드했다. 이 링크를 통해 확인해볼 수 있다.