refreshUI
오브젝트를 outliner에 넣어주고 option을 세팅한 후에 refreshUI에서는 어떤 기능을 수행하는가?
option 설정 직후에 selected object에 대해서 처리한다.
이후 background 배경색 처리
environment와 fog처리를 한다.
selected 오브젝트의 경우 active라는 class가 들어가는데,
이것이 배경색을 바꿔주는 효과와 sidebar의 정보를 채워주는 역할을 할 것이다.
나는 이 중 배경색을 바꿔주는 효과만 알면 충분하다.
setValue 함수의 역할은 단순하다. selected에 active class 지정과 scroll into view.
scroll into view가 뭔지 몰랐는데, 클릭한 dom이 스크롤 화면에 애매하게 걸쳐있는 경우 dom이 화면의 끝쪽에 맞추어 보여지도록 스크롤을 이동시키는 기능이다.
이렇게 애매하게 걸쳐있는 경우를 클릭시 높이를 맞추어준다.
Outliner select
outliner에서 select하는 부분에서는 selectById를 참조하면,
selector.js에서 setKey를 등록하고
Config에서 처리한다.
하지만 배경색은 없다.
CSS active class
dom 구조에서 hover나 focus는 css에 있지 않을까?
문득 기본적이지면서 당연한 생각이 들었다.
main.css
active class가 selected에 대한 것이니 active로 검색하니 css 코드에서 발견했다.
hover의 alpha가 0.02이고, active가 0.04인 것을 보니 이 부분이 selecte object를 표시하는 부분이 맞다.
다 찾은 것 같다.
이제 object translation을 어떻게 구현하였는지를 찾아보자.