프론트엔드/제작 일지

190516 크롬 확장프로그램 [트와이스 새 탭] 제작일지

Marshall K 2019. 5. 16. 21:56

익스텐션 링크


사족이지만, 저는 이 익스텐션이 굉장히 마음에 드네요 ㅎㅎ 유용하게 잘 쓰고 있습니다.



이제 영어도 지원합니다.

사용자의 언어가 한국어라면 한국어로 표시되고, 그 외의 언어라면 영어로 표시됩니다.


할 일 목록에 "할 일 완료"를 사용할 수 있게 됐습니다.



그와 관련해서 각종 옵션도 추가됐습니다.




완료한 일정은 화면 우측 하단에 있는 아이콘을 클릭하면 모아볼 수 있습니다.

다시 목록 앞의 동그라미를 누르면 완료가 취소되며, 우측 상단의 쓰레기통을 누르면 완료한 일정을 모두 제거합니다.



배경에 슬라이드쇼를 사용할 수 있습니다.


배경에 재생하는 비디오도 추가 중입니다.

현재 음악 방송을 추가 중입니다.



생각보다 발생한 버그가 아주 많더라고요. ㅠㅠ


그중에 제일 중요한 버그 수정을 하나 적자면,

예전엔 To do list의 아이템에 ID를 부여할 때 To do list가 모인 Array(이하 Array)의 length에 1을 더해 부여했습니다.

그렇게 부여하면 발생하는 꽤 큰 문제가 있습니다.


아이템 1234가 있다고 가정합시다.

아이템 3을 삭제하면 124가 남고, Array의 length는 3입니다. 그래서 다음에 추가하는 아이템의 ID는 다시 4가됩니다.

결과적으로 아이템 1244가 생기게 되는 겁니다.

3번째 아이템을 수정 / 삭제하거나 4번째 아이템을 수정 / 삭제하면 3, 4번째에 동시에 적용됩니다.


물론 페이지를 다시 불러오면 저장소에서 아이템을 하나씩 가져오며 1234로 다시 ID가 부여되겠지만, 새로 고침을 하지 않으면 계속 두 개가 하나의 아이템으로 간주될겁니다.


그래서 이젠 임시 숫자를 하나 생성하고, 그 숫자를 ID로 부여합니다.

최초 로딩엔 임시 숫자가 1이고, To do list에 아이템을 추가할 때마다 1을 더합니다.


예전엔 Array에서 항목을 찾을 때, Array[id-1]을 하면 그 항목을 찾을 수 있었는데, 이젠 함수로 찾아야 합니다.

todoarray.find(a => a.id === +target.getAttribute("data-id"))


대신, 처음 사용한 방식을 사용할 때 발생하던 문제가 절대 발생하지 않습니다.

1234에서 3을 삭제해도 임시 숫자는 4일 테고, 다음 아이템을 추가하면 아이템들의 ID는 1245가 됩니다.



뭐 외에도 기능 추가하고 버그 잡고 업데이트를 계속하다 보니 올리는 업데이트만 몇 갠질 모르겠네요 ㅋㅋㅋ;;