0522-holiday
Intro
역시 휴일은 좀 무너진다.
어찌되었든 다시 코딩 시작…
어제 배탈이 나서 이상하게 코딩에 집중을 못했다.
오늘의 할 일
- 1순위 크롱 pr nextStep
- 만도 코드 보고 공부 ArrayParser 공부
- 개념들 하나씩 정리하는 핸드 북 만들기 !
- Daily Algorithm … 다시 해야지 고고
nextStep
처음에는 1번 표시 및 3초뒤에 자동입력됩니다. 선택을 누르시거나 취소를 누르세요 이렇게 장황하게 문구를 적었는데 별로 …
사용자 입장에서 안 좋은 것 같다.
그냥 1번 번호를 바로 보이고 타이머를 아래에 보여주는 것이 훨씬 직관적이다.
굳이 선택 / 취소 정도야 알아서 하게 끔
그리고 기존에 히스토리 3개를 보여주어야 하는 것에서 번호입력은
1번
12번
이렇게 보여주는 것 보다
1번
12번 입력시 1번은 안 보이게 하고 보여주는 것이 날 것 같다.
아이디어 1
안내 모달을 띄우는 생각도 있었는데 지금 하는 것에서는 오버 킬 일 것 같다.
타이머
타이머로 넘어가서는
1번 클릭되고 2번이 다시 클릭되서 12번으로 중첩되었을 떄
1번에서 한 일
스텝7
체크리스트 작성
체크리스트
[ O] 자판기의 숫자패드를 눌러서 상품을 선택할 수 있다.
– [O] 눌린 버튼 알림을 알려준다.
- [O] 번호가 클릭되면 해당 번호를 디스플레이 창에 보여준다.
- [O] 해당 번호를 가운데 정렬해서 보여준다.
– 자동 선택 되기 전(3초전) 추가 클릭시에 눌린 버튼 알림을 알려준다. - [O] 번호가 추가 클릭되면 해당 번호를 텍스트와 합쳐서 번호를 보여준다.
- [O] 타이머 표시를 추가해준다.
— [O] 번호 추가 입력시 타이머 정보를 갱신해준다
— [O] 타이머가 0초가 되었을 떄 ! 선택 Method를 실행시킨다 - 선택 버튼이 클릭되거나 자동선택으로 선택이 되면
– [O] 선택되었다는 알림과 함께 음료수를 선택하고 모델을 업데이트하고 음료가 나왔다는 알림을 알려준다.
— [O] 모델에서는 해당 버튼 텍스트에 맞는 스낵을 가지고 온다.
— [O] 지금 있는 가격으로 살 수 있는지 알려준다.
—- [O] 살 수 있으면 가격을 업데이트 시키고 뷰에 산 스낵 정보를 보내줘서 음료가 나왔다는 알림을 준다.
— [O] 살 수 없으면 살 수 없다는 알림을 준다.
[O] 없는 번호를 클릭하면 알림을 주고 선택했던 정보를 클리어한다.
[O] 두자리수 이상 버튼은 클릭 못하도록 설정 하기
[O] 선택 및 취소버튼 입력시 다시 넘버버튼 활성화
– 코드 짜면서 이슈
- 너무 길다… 장황하다 앞뒤로 좀 나눠야겠다.
- 해결방안
- 정적 data는 따른 파일에 나눠서 가지고 있자.
- 모델 뷰 컨트롤러도 파일 분리시켜 놓자
분리 OK!
- 모델 뷰 컨트롤러도 파일 분리시켜 놓자
처음에 로그 창에 돈 입력된 것처럼 3개를 띄우고 설명까지 뛰어놨었는데 너무 장황한 느낌이 들었다.
고로 -> 입력번호만 띄우고 ,따로 타이머를 보여주는 창을 보여주기로 결정고민 선택 버튼이 세자리수를 선택 하지 못하도록 강제 하는 편이 나으련지
사용자가 잘 못 눌렀으면 알아서 취소를 하고 다시 작성하게 하는 것이 나을런지 …
나라면 굳이 사용성을 더 택하는 것이 좋은 것 같아서 3개이상은 입력 안되도록 수정을 하였다.
대신 기능이 추가되면서 관계와 연관된 메소드들이 엄청 추가된다.
block을 했을시에는 대신에 또 취소로 클리어하라는 알림을 설정해야 함
- 버튼 number button들만 찾아서 disabled
- 취소 및 선택 버튼을 누르면 클리어하고 다시 disabled를 다시 풀음
css 가운데 정렬 역시 line-Height로 하니 이상해서 다시 display-table을 이용했다
대신에 추가 된 텍스트는 table-footer인가 속성으로 바꾸어 줬다.