각주 에디터 컴포넌트 + 각주 편집 애드온 0.4.3 (2017-09-30)

0.4.3 업데이트 (2017-09-30)

개요

• 버그 수정 및 미세한 기능 개선이 있었습니다.
• 호환성 테스트는 아직 끝나지 않았습니다. 가령 다음과 같은 문제가 있을 수 있습니다.
  : XE에서 관리자 외에는 각주 입력을 못할 수 있습니다.
  : 크롬 외의 브라우저, 특히 MS 엣지에서는 각주 편집 수행과정에서 높은 확률로 에러가 동반될 수 있습니다.
  : CKEditor 스킨 외에서는 각주 컴포넌트와 애드온 사용을 권장하지 않습니다.

업데이트 사항

1. 각주 섹션을 div태그로 설정하면서 파싱 모듈이 링크 프리뷰를 중복 출력하는 문제 (웹지기님)
   ... 별도 팁 제공 https://xetown.com/rxe_third/750890 (현재 람보님 깃허브에 이슈를 올렸음)
2. 모바일 뷰에서 각주 내용 안에 있는 링크가 동작하지 않는 문제 (웹지기님)
   ... text 메소드 대신 html 메소드 사용
3. 각주 내용의 이미지를 풍선말 등에서 별도 출력하면서 각주 내용의 구성이 깨지는 문제 (웹지기님)
   ... 파싱 모듈 예외 처리하고 html 메소드 사용

언제일지 모를 향후 업데이트 계획

1. 크롬에서 드래그 후 삭제 시 reorder가 되지 않는 문제
2. 엣지와의 호환성 문제 (간장게장님)
3. XE와의 호환성 문제 정리 (간장게장님)
4. CK에디터 외 다른 웹에디터와 호환성 문제
5. XE용 removeHackTag 수정 매뉴얼 작성

0.4.2 업데이트 (2017-09-27)

개요

• 버그 수정이 있었습니다.

업데이트 사항

1. PC 뷰 각주 풍선말에서 gif도 로드 (웹지기님) ... 임베드 파싱 모듈의 출력 내용 자체를 불러오지 않도록 했습니다.
2. 모바일 뷰 각주 입력 팝업창에서 '모바일로 최적화된 화면으로 보기' 옵션 감추기 (웹지기님)

0.4.1 업데이트 (2017-09-25)

개요

• 모바일 뷰가 개선되었습니다.
  : 웹지기님의 피드백으로 모바일 인터페이스가 향상되었습니다.

업데이트 사항

1. 모바일에서 각주 컴포넌트 팝업창 최적화 (웹지기님)^★ ... 이제 모바일에서도 각주 작성이 편리해졌습니다.
2. 모바일 뷰 UI 개선 (웹지기님)
   : 각주 내용 투명도 삭제
   : 각주 내용에서 gif 로드 ... 대신 XE임베드 파싱 모듈에 대한 예외 처리
   : 각주 내용 닫기 버튼 확대
   : 각주 내용에 z-index와 bottom 사용자 옵션 제공 ... 레이아웃 등의 하단 고정 툴바와 겹침 문제 방지 가능
3. 각주 팝업 창의 CK에디터 툴바를 접힘 상태로 기본 설정

0.4 업데이트 (2017-09-23)

개요

• 모바일 뷰 옵션이 추가되었습니다.^★
  : 각주 마커를 클릭했을 때 각주 내용으로 스크롤 이동하는 동작은 이용자들로 하여금 모바일에서 피로감을 느끼게 할 수 있습니다.
  : 이번 버전에서는 모바일 뷰 옵션을 채택하여, 마커를 클릭하면 각주 내용이 스크린 하단의 fixed position을 가지는 요소로 출력되게끔 했습니다.
• 몇몇 부분에서 버그 수정이 있었습니다.^★

업데이트 사항

1. 모바일 UI 개선^★
2. 댓글 에디터에서 각주 컴포넌트가 노출되는 문제 수정 (웹지기님)^★
3. 붙여넣기 이벤트에서 각주 섹션이 여전히 따라 붙는 문제 수정 (토순이와아빠님, 웹지기님)^★

0.3.1 업데이트 (2017-09-21)

개요

• 몇몇 부분에서 버그 수정 및 스타일링 개선이 있었습니다.

업데이트 사항

1. 컴포넌트 설정에서 해시 이동 속도가 안 먹는 버그 수정 (웹지기님)
2. XE에서 팝업 창 사이즈 지정 (Lemony님)
3. 말풍선 미리보기에서 말줄임표 (웹지기님)
4. 각주 마커와 내용에 딸린 하위 요소들의 여백 값들 리셋 (간장게장님)
5. 붙여넣기 이벤트에서 각주 섹션까지 붙는 문제 해결 (토순이와아빠님)

0.3 업데이트 (2017-09-19)

개요

• 각주 스타일링 작업을 완료(?)했습니다.

업데이트 사항

1. 각주 내용에서 각주 마커로 이동 링크 장착 (오징님)
2. 해시 링크 이동시 상단 툴바 높이 옵션 적용 (오징님)^★
3. 해시 링크 이동시 이동 속도 설정 추가
4. 각주 번호 마우스오버시 말풍선, 마우스클릭시 각주내용으로 이동 (웹지기님)^★
5. 각주 해시 링크 이동시 링크 타겟에 하이라이트 효과
6. 자동링크 애드온에 대비하여, 링크 타겟 클릭시 타겟 속성 동적 삭제 (웹지기님)

0.2 업데이트 (2017-09-17)

기능 향상

1. 각주 입력창에서 CK에디터 4.7.3 버전을 CDN을 통해 불러오게 됩니다.
2. 각주 아이콘을 교체했습니다. (VJT님, 휴리파파님)
3. 각주 내용 섹션의 제목 내용과 제목 태그를 사용자가 직접 지정할 수 있습니다. (웹지기님) ... 각주 컴포넌트 설정에서 할 수 있습니다.
4. 각주 창 팝업 후 커서가 에디터 안으로 자동 포커스됩니다. (socialskyo님)
5. 각주 내용 섹션 아래로 커서 이동이 가능하게끔, 각주 생성 후에는 맨 아래에 <p>&nbsp;</p>를 추가하게 됩니다. (socialskyo님)
6. 댓글단에서는 각주 컴포넌트 작동을 금지합니다. (웹지기님) ... 각주 편집 애드온이 활성화돼야만 댓글에서 각주 컴포넌트 버튼의 출력을 막을 수 있습니다.

버그 수정

1. 새로운 글쓰기 상황에서 각주 편집 애드온이 동작하지 않는 문제를 해결했습니다.
2. IE에서 각주번호가 포함되지 않은 영역을 복사하거나 잘라낼 때 동작하지 않던 문제를 해결했습니다.
3. 에디터에서 소스 보기를 했다가 다시 에디터로 돌아올 때 이벤트 전체가 무효화된 문제를 해결했습니다.
4. 본문에서 각주 번호가 모두 사라질 때 각주 내용 섹션도 제거하게 됩니다. 반면 각주 내용 섹션이 없을 때 각주 붙여넣기가 시도되는 경우에는 각주 내용 섹션도 되살아나게 됩니다.
5. 각주 입력 및 붙여넣기 후 커서가 각주 번호 안으로 위치하던 문제를 해결했습니다. 각주 번호 끝에 공백 문자를 첨가함으로써 새로 생성된 sup 태그에 문서 편집이 영향을 받지 않을 수 있도록 했습니다.

개요

• 각주 에디터 컴포넌트와 별책부록 편집용 애드온을 첨부해봅니다.
• 현재 업로드하는 버전은 베타테스트용입니다.
• 컴포넌트 파일은 각주 입력과 수정, 애드온 파일은 각주 복사-잘라내기-붙여넣기-삭제 기능을 담당합니다.
• 컴포넌트 파일은 필수이며, 애드온 설치를 하지 않으시면, 위의 편집기능을 수동으로 하셔야 하며, 본문에서 스타일링된 디스플레이를 구현할 수 없습니다.

1. 다운로드 및 설치

• 각주 에디터 컴포넌트 : ap_footnote.0.4.3.zip : /modules/editor/components/ap_footnote

에디터 컴포넌트 0.4.2 ap_footnote.0.4.2.zip
에디터 컴포넌트 0.4.1 ap_footnote.0.4.1.zip
에디터 컴포넌트 0.4 ap_footnote.0.4.zip
에디터 컴포넌트 0.3.1 ap_footnote.0.3.1.zip
에디터 컴포넌트 0.3 ap_footnote.0.3.zip
에디터 컴포넌트 0.2 ap_footnote.0.2.zip
에디터 컴포넌트 0.1 ap_footnote.0.1.zip

• 각주 편집용 애드온 : ap_footnote_editable.0.4.3.zip : /addons/ap_footnote_editable

편집용 애드온 0.4.2 ap_footnote_editable.0.4.2.zip
편집용 애드온 0.4.1 ap_footnote_editable.0.4.1.zip
편집용 애드온 0.4 ap_footnote_editable.0.4.zip
편집용 애드온 0.3.1 ap_footnote_editable.0.3.1.zip
편집용 애드온 0.3 ap_footnote_editable.0.3.zip
편집용 애드온 0.2 ap_footnote_editable.0.2.zip
편집용 애드온 0.1 ap_footnote_editable.0.1.zip

2. 권장 환경

• 라이믹스 + 크롬60 / IE11 + CKEditor
• 위 환경이 아니라면 편집용 애드온이 오작동을 일으킬 수 있습니다.

3. 사용방법

• 따로 말씀 안 드려도 아시리라 믿습니다. 에디터에서 아래 그림의 아이콘을 클릭하고 입력하면 됩니다

4. 덧붙이는 말

• 개발 현황은 링크에서 확인할 수 있습니다. http://bit.ly/2etMIwY