ICEFiction 개발기 ⑨: 패널을 열었더니 쓰던 줄이 밀렸다 (v0.12.0)

오른쪽 패널을 열었더니 쓰던 줄이 왼쪽으로 밀렸다. 방금까지 보고 있던 문장이 눈에서 도망간다. 패널을 닫으면 다시 돌아온다. 열 때마다, 닫을 때마다 원고가 흔들렸다.

이번 판(v0.12.0)은 그 흔들림을 없애는 데서 시작했다. 무엇이 달라졌는지는 47초짜리 영상으로 먼저 보는 편이 빠르다.

패널을 원고 위에 띄우는 안은 만들었다가 되돌렸다

처음 떠올린 해법은 쉬운 쪽이었다. 패널을 원고 위에 띄우면 원고는 자리를 안 옮긴다. 만들어 놓고 보니 두 가지가 걸렸다.

하나는 당연한 문제였다. 패널이 글자를 가린다. 원고를 안 밀려고 만든 기능인데 정작 원고가 안 보인다.

다른 하나는 예상 못 했다. 갤러리 카드와 검색 패널은 가려지면 클릭 자체가 막힌다. 눈에는 보이는데 눌리지 않는다. 이건 내가 눈으로 본 게 아니라 E2E 테스트가 먼저 잡았다 — 늘 지나가던 클릭이 갑자기 실패했다.

그래서 되돌리고 다른 방식을 택했다. 한쪽 패널이 열리면 반대쪽에 같은 만큼 여백을 비워 둔다. 원고는 남은 자리의 가운데에 그대로 앉아 있다. 실제로 재 보니 오른쪽 패널(340px)을 열 때 예전에는 원고가 170px 밀렸는데, 지금은 0이다. 창이 좁아 원고 폭이 답답하면 끄면 된다.

같은 글꼴인데 따옴표 모양이 다르다

원고를 읽다가 대사 줄마다 따옴표 생김새가 다른 걸 발견했다. 어떤 줄은 위아래로 곧고, 어떤 줄은 둥글게 말려 있다. 같은 글꼴로 쓰고 있는데 왜 다를까.

글꼴 문제가 아니었다. 아예 다른 글자였다. 자판으로 치는 "(U+0022)와 출판물에서 쓰는 “ ”(U+201C·U+201D)는 서로 다른 문자다. 내장 글꼴 4종을 열어 확인해 보니 넷 다 두 글자를 모두 갖고 있었다. 폴백 문제도 아니라는 뜻이다.

원인은 섞여 들어온 경로였다. 손으로 친 대사는 곧은 따옴표, AI가 쓴 대사는 둥근 따옴표였다. 한 원고 안에 두 종류가 함께 쌓이고 있었던 것이다.

그래서 고치는 방법도 글꼴이 아니라 글자다. 보기 설정에서 모양을 고르면 앞으로 치는 따옴표와 AI가 넣는 글이 그 모양으로 맞춰지고, 이미 쓴 원고는 단추 하나로 한 번에 바뀐다. 낫표(「」)는 건드리지 않는다.

책 전체 바꾸기 — 안전망을 먼저 만들고 결정을 뒤집었다

여러 문서를 한 번에 바꾸는 기능은 예전에 일부러 뺐다. 되돌릴 수단이 없는 상태에서 원고 수십 개를 한 번에 건드리는 건 위험하다고 봤기 때문이다.

이번에 그 결정을 뒤집었다. 대신 순서를 바꿨다 — 기능을 만들고 안전망을 붙인 게 아니라, 안전망이 먼저 성립하는지 확인하고 기능을 열었다. 바꾸기 직전 원본을 책 폴더의 .backups/ 안에 복사하고, 백업에 실패한 파일은 아예 바꾸지 않는다. 확인 창에는 문서 수·건수·백업 사실을 다 적는다.

만들면서 알게 된 게 하나 있다. 다중 파일 치환의 진짜 위험은 파일이 아니라 지금 열려 있는 문서다. 파일을 다 바꿔 놓아도 화면이 옛 본문을 들고 있으면, 뒤늦게 도는 자동 저장이 방금 바꾼 파일을 조용히 되돌려 놓는다. 순서를 못 박아야 했다 — 먼저 저장하고, 바꾸고, 열린 문서를 다시 읽는다.

그밖에 손본 것들

• 제목 위 여백 — 제목 줄 위를 문단 간격의 세 배로 벌렸다. 설정값을 늘리는 게 아니라 CSS가 계산하므로, 문단 간격을 바꾸면 제목 여백도 같이 따라온다.
• 갤러리 두 모양 — 표지형과 리스트형을 섹션마다 따로 기억한다. 그림이 붙는 원고·인물은 표지로, 설정·메모는 제목과 줄거리로 훑는 게 편했다.
• Enter로 따옴표 밖으로 — 대사를 다 썼으면 닫는 부호를 또 치지 않아도 된다. 다만 커서 뒤가 줄 끝까지 닫는 부호로만 차 있을 때만 개입한다. 공백 한 칸이라도 남아 있으면 손대지 않는다.
• AI 결과 줄바꿈 정리 — 문단 간격을 쓰는 중이면 AI가 넣은 빈 줄을 한 번으로 모은다. 안 그러면 원고가 두 배로 벌어진다.
• 자료 삭제 — 지우면 trash/로 옮긴다. 문서 삭제와 같은 방식이다.
• 좌우 패널 너비를 같게 — 둘 다 340px. 화면이 한쪽으로 기울지 않는다.

고친 버그 두 개

사용자(나 자신)가 신고한 것 하나. 굵게 처리한 대사를 앱이 대사로 못 알아봤다. 연속 대사를 붙이는 기능이 그 줄만 건너뛰었다. 대사인지 판단하는 코드가 줄의 첫 글자만 보고 있었는데, 첫 글자가 따옴표가 아니라 강조 마커였던 것이다. 서식은 대사가 입은 옷이지 대사의 종류가 아니다 — 앞쪽 마커를 걷어내고 판단하도록 고쳤다.

또 하나는 서식 단축키가 선택 양끝의 공백까지 삼키던 문제다. 마크다운은 닫는 마커 바로 앞에 공백이 있으면 강조로 읽지 않는다. 즉 겉보기엔 굵어졌는데 파일에서는 깨진 상태가 된다. 이미 망가진 줄은 통째로 골라 단축키를 두 번 누르면 복구된다.

검증

유닛 224개, 에디터 E2E 62개, 검색 14개, 책장 5개, 이미지 9개, AI 폴더 10개, AI 어댑터 8개 통과. 타입 검사 0 errors, 빌드 성공. 맥 전용으로 갈라지는 코드는 없다.

다음 후보는 내보내기다. TXT·DOCX·EPUB — 원고가 표준 마크다운으로 남아 있으니, 이제 밖으로 꺼내는 길을 만들 차례다.