완전히 다시 설계했습니다. 기존의 "비율 계산해서 자동으로 늘리고 줄이는" 방식 자체를 걷어내고, PC와 Mobile을 처음부터 끝까지 완전히 분리된 값으로 저장하는 구조로 바꿨습니다.
새 구조 (웹진 + 매거진 에디터 공통):
- 각 레이어(텍스트/이미지/도형/아이콘/동영상/표/모듈/그룹 전부)마다 PC 전용 스냅샷과 Mobile 전용 스냅샷을 따로 저장합니다 — 위치(top/left), 크기(width/height), 텍스트는 추가로 내용(줄바꿈 포함)·폰트크기·자간·행간까지.
- PC ↔ Mobile 전환 시: 지금 보이는 상태를 "떠나는 모드"의 스냅샷으로 저장 → 화면 폭 변경 → "들어가는 모드"의 스냅샷이 있으면 그대로 복원, 없으면 지금 상태 그대로 둠(반응형 기본값 유지).
- 즉 Mobile에서 도형 크기·위치·텍스트 줄바꿈을 직접 수정하면, 그 값은 PC 값과 완전히 무관하게 별도로 기억되고, PC로 돌아가도 PC 값은 전혀 건드려지지 않습니다. 말씀하신 "이중 작업"이 정확히 이렇게 동작하게 됩니다.
- 기존에 있던 "폭 비율만큼 도형 높이를 자동 계산해서 늘리는" 로직은 완전히 제거했습니다 — 이게 바로 "엉뚱하게 바뀌는" 원인이었어서, 이제는 자동 계산 없이 각 모드에서 마지막으로 사람이 설정한 값을 그대로 씁니다.
- 저장 버튼을 누르면, 지금 보고 있는 모드의 상태를 먼저 스냅샷으로 확정한 뒤 저장하므로 모드를 안 바꾸고 바로 저장해도 최신값이 반영됩니다.
공개 웹진 페이지도 동일한 방식으로 변경: 화면 폭이 768px 이하면 저장된 Mobile 스냅샷을, 아니면 PC 스냅샷을 적용합니다. 방문자가 창 크기를 바꾸거나 폰을 회전해도 실시간으로 재적용됩니다. (매거진은 아직 공개 뷰어가 없어 에디터 쪽만 동일하게 적용됨.)
미리보기 1회성 — 미리보기 버튼을 눌러 진입한 뒤, 아무 마우스 클릭이나 키 입력이 있으면 즉시 편집 모드로 돌아오도록 전역 리스너를 추가했습니다. (미리보기 버튼을 다시 누르는 것도 여전히 동일하게 작동합니다.)
정렬 1회성 — 정렬 탭에서 좌/우/중앙/상/중/하 정렬을 적용하면, 별도로 디자인 탭을 누르지 않아도 자동으로 디자인 탭으로 돌아오게 했습니다.
2. 목록 클릭 → 편집한 그대로 보기 — 이미 /webzine/view/{id}가 실제 디자인(design_data)을 그대로 렌더링하고 있어서 손댈 게 없었습니다. 확인만 했습니다.
3. 댓글 + 목록 버튼 — 이 부분은 실제 DB 구조를 하나 건드렸어요:
기존 comments 테이블은 post_id만 있어서, 게시글과 웹진의 id가 겹치면(둘 다 1번부터 시작) 댓글이 엉뚱한 글에 섞일 위험이 있었습니다. 그래서 content_type 컬럼을 추가했습니다(기존 행은 전부 자동으로 'post'로 채워지는 안전한 추가라 기존 게시글 댓글에는 영향 없음).
CommentController(저장/수정/삭제), Comment 모델을 이 타입을 인식하도록 수정하고, 게시글 쪽의 댓글 조회/카운트 쿼리에도 content_type='post' 조건을 추가해 안전하게 분리했습니다.
WebzineController::view()에서 웹진 전용 댓글을 조회하도록 연결하고, webzine/view.php에 댓글 목록/답글/수정/삭제/작성 폼과 하단 "목록" 버튼을 게시글 댓글과 완전히 동일한 마크업/클래스로 추가했습니다 — 그래서 사이트 공용 JS(main.js)가 그대로 동작하고 새 JS는 필요 없었습니다.