소리꽃 KeyBloom 8

이 글은 소리꽃 KeyBloom 시리즈의 14번째 기록입니다. (총 21개)

오늘 한 일

색 모드를 파티클·건반 공용 5종으로 통일 — 단색 / Min~Max 그라데이션 / 파스텔 / 무지개 / 팔레트
- 이유: 원래 파티클은 그라데이션·무지개만, 건반은 단색·그라데·파스텔·무지개로 목록이 서로 달랐다. 같은 색 규칙을 한 곳에 모으고 목록을 맞추니 파티클은 단색·파스텔이, 건반은 팔레트가 새로 생김
팔레트 모드 추가 — 색을 최대 8개 지정하면 노트마다 그 안에서 한 색씩, 직전 노트에 나온 색은 빼고 나옴. 파티클과 건반이 같은 노트에는 같은 색
- 이유: Min~Max 두 색만으론 다채로움이 부족했다. 색을 직접 여러 개 골라 돌리고 싶었음. 스크럽하거나 다시 재생해도 같은 노트는 늘 같은 색이 나오게 함
팔레트 편집기 — 색 칸을 4열로 배치, +로 추가·×로 제거(최소 1색)

팔레트에 색을 5개 넣었는데 1·2번 색만 계속 나왔다
- 원인: 노트마다 색을 정하는 해시 계산이 큰 수 곱셈을 쓰는데, 그 값이 자바스크립트가 정확히 다룰 수 있는 정수 범위를 넘겨서 아랫자리가 뭉개졌다. 하필 그 아랫자리로 색 번호를 골라서 몇 색으로 쏠림
- 해결: 정수 전용 곱셈으로 바꾸니 5색이 고르게 나옴
광택을 올리면 파티클 주변에 네모가 생겼다
- 원인: 팔레트·단색 모드의 색은 hex(#4a90d9)인데, 발광 글로우를 만드는 색 변환 함수가 hex를 처리 못 해서 가장자리가 투명이 아니라 불투명으로 남았다 → 스프라이트 전체가 색 네모
- 해결: hex도 처리하는 기존 변환 함수로 교체(무지개·그라데는 원래부터 정상)
색 칸을 4열로 바꾸니 패널 폭을 넘쳤고, 페이지에 스크롤바가 두 개 생겼다
- 해결: 그리드를 패널 폭에 맞춰 칸이 줄어들게, 페이지 자체는 스크롤 안 되게 잠금(스크롤은 패널 안쪽만)