[JS] egbEditor의 레이아웃 구성변경 및 이미지 추가와 갤러리 기능

안녕하세요. 샌드위치 입니다. egbStyleCss를 만들다 보니 자연스럽게 egbEditor를 제작 할 수 있게 되었는데요.

해당 에디터는 egbStyleCss를 기반으로 동작되도록 설계하고 만들어졌습니다. 이번에 새롭게 바꾼 레이아웃 입니다.

사실 이 레이아웃을 바꾼지 꾀 오래되었는데요. 블로그에 글쓰는 것을 미루다보니 이제야 글을 쓰게 되었습니다.

가운데에 편집 화면이 자리하는 만큼 윈쪽과 오른쪽의 사이드에 작은 아이콘으로 표시를 했습니다. 마진값을 주어 편집 화면이 영역을 침범 할 수 없도록 했고, 편집 화면의 컨텐츠가 많아지면 스크롤이 생기도록 했으며 자연스럽게 레이어 구성을 하여 편집 화면에 간섭이 없도록 하였습니다.

매우 심플한 구성이지만 최대한 실제 편집화면이 라이브 되는 모습과 비슷한 느낌을 주도록 했습니다. 새롭게 추가된 이미지 추가와 갤러리 입니다.

이미지를 업로드 하면 ajax로 백엔드로 전송하고 반환값을 받습니다. 성공한 경우 알림창을 띄워 정상적으로 업로드가...