오픈데이 Openday 7
오늘 한 일
- 날짜를 이어서 칠 수 있게 했다
- 이유: 반복 기간을 정할 때
20270830을 치면202708-30처럼 엉뚱하게 들어갔다 - 브라우저가 주는 날짜 칸은 연도 자리가 네 자리를 넘게 받는다. 그래서 앞 여섯 자리를 연도로 삼키고 나머지가 월·일로 밀린다. 그 타이핑은 가로챌 방법이 없다
- 글자 칸으로 받고 하이픈을 직접 넣게 했다. 숫자만 세므로 하이픈을 쳐도 되고 안 쳐도 된다
- 달력은 옆 버튼으로 남겼다. 치는 길과 고르는 길을 둘 다 둔다
- 칸을 떠날 때 정리한다. 없는 날(2월 30일)이거나 덜 친 것이면 원래 값으로 되돌린다
- 글자 칸으로 바꾸면 휴대폰에서 숫자 자판이 안 올라온다.
inputMode="numeric"한 줄로 되찾았다 - 나라별 날짜 표기는 못 되찾았다. 지금 한국어만 쓰므로 미뤘고, 언어를 붙일 때 여기부터 봐야 한다
- 이유: 반복 기간을 정할 때
막힌 부분
앞자리를 고치면 뒷자리가 망가졌다
2027-08-30에서 맨 앞에 2를 치면 2202-70-83이 됐다.
숫자만 뽑아 앞 여덟 자리로 자르고 다시 모양을 잡는 방식이었다. 그러면 앞에 하나를 끼워 넣는 순간 전체가 한 칸씩 밀려 나가고, 넘친 마지막 자리가 잘려 나간다.
자리 수가 여덟으로 정해진 칸이라 끼워 넣기가 애초에 맞지 않았다. 덮어쓰기로 바꿨다 — 끼운 만큼 그 자리의 숫자를 바꾼다.
- 해결: 커서 앞에 숫자가 몇 개인지를 세어, 넘친 만큼을 그 자리에서 덮어쓴다
- 잘라내기는 조용해서 더 나빴다. 앞자리를 고쳤을 뿐인데 뒷자리가 바뀌는데도 아무 표시가 없다
커서가 자꾸 맨 뒤로 튀었다
값을 다시 써서 칸에 넣으면 커서가 끝으로 간다. 그래서 가운데를 고치려고 하면 한 글자 칠 때마다 커서가 뒤로 도망갔다.
칸에 보이는 글자에는 하이픈이 섞여 있어서 자리 수를 그대로 쓸 수 없었다. 하이픈을 뺀 숫자만으로 「몇 번째 뒤」인지를 세어 두었다가, 다시 그린 뒤 그 자리로 되돌렸다.
- 해결: 커서 자리를 숫자 개수로 기억한다. 하이픈 위치가 바뀌어도 흔들리지 않는다
결과가 그대로일 때 친 글자가 남았다
맨 앞에 원래와 같은 숫자를 치면 결과가 안 바뀐다. 그런데 방금 친 글자가 칸에 그대로 남아 있었다.
값이 바뀌지 않으면 화면을 다시 그리지 않기 때문이다. 값을 물려 주는 칸이라도 물려 줄 값이 그대로면 되돌려 놓지 않는다.
- 해결: 결과가 이전과 같을 때는 칸의 내용을 직접 되돌린다
- 「값을 물려 주면 알아서 맞춰진다」가 항상 참은 아니다. 값이 바뀔 때만 맞춰진다
꽉 찬 칸에 자판으로 들어가면 아무것도 안 쳐졌다
덮어쓰기로 바꾸고 나서 생긴 문제다. 탭으로 칸에 들어오면 커서가 끝에 서는데, 여덟 자리가 꽉 찬 칸의 끝에서는 칠 자리가 없다.
들어올 때 전체를 고르게 했다. 그러면 여덟 자리를 그냥 치면 전부 바뀐다.
- 해결: 칸에 들어오는 순간 내용을 전부 고른다
- 마우스로 가운데를 눌러 고치는 길은 안 막힌다. 칸에 들어오는 것이 먼저 일어나고(전체 고름) 손을 뗄 때 누른 자리로 커서가 모인다 — 브라우저의 순서가 그렇게 돼 있어서 한 줄로 둘 다 된다
하이픈 앞에서 커서가 어색하게 섰다
2027까지 치고 나면 커서가 2027|-에 선다. 다음 숫자를 치면 하이픈 앞에 들어가서, 결과는 맞는데 보기에 어색했다.
- 해결: 하이픈 바로 앞이면 하나 건너뛰어
2027-|에 세운다. 브라우저의 날짜 칸이 자리를 넘어갈 때 하는 것과 같다
달력이 이번 달에 서서 열렸다
날짜를 쳐 놓고 달력을 열면 그 날이 아니라 이번 달이 나왔다.
열기 전에 칸을 비우고 있었다. 그건 넘기기 쪽에서 필요했던 처리인데 그대로 가져온 것이다 — 거기선 같은 날을 골라도 「그 날로 넘긴다」가 일어나야 해서 신호가 필요하다.
이 칸은 값을 정하는 것뿐이라 같은 날을 고르면 아무 일도 안 일어나는 게 맞다. 비울 이유가 없었다.
- 해결: 지금 값을 넣고 연다. 달력이 그 달, 그 날에 선다
- 같은 코드인데 자리에 따라 반대였다. 값을 정하는 자리와 고르면 무언가 하는 자리는 다르게 다뤄야 한다
다음에 할 일
- 모바일 화면 재설계 — 가로로 미끄러지는 방 이동, 마우스를 올려야 보이는 표시, 넓은 광고 자리 모두 손가락 화면을 전제하지 않았다
- 이월 사슬을 날짜가 바뀐 뒤에 실제로 확인하기
- 사람들에게 열기 전 구글 확인 절차 — 소유한 도메인이 필요하다
- 이모지를 정해진 것 중에 고르는 대신 자유롭게 넣거나 아예 빼게 하기
- 언어와 날짜 표기 방식 통일