markerjs2로 업데이트하고 코드를 정리했습니다.
PR 링크는 다음과 같습니다:
7개의 좋아요
에디터 개선이 정말 훌륭하고, 코드도 많이 줄었습니다 
불행히도 편집을 저장한 후 마크다운이 정확하지 않아 게시물이 더 이상 표시되지 않습니다. 문자열 파싱이 제대로 작동하지 않는 것으로 보입니다.
위 이미지의 마크다운은 편집 전 파일입니다. 편집 후 파일名の
(1) 부분이 업로드 경로에 잘못 포함되는 것을 볼 수 있습니다. (1upload 부분을 확인해 보세요. 이제 테마에 JS 테스트를 추가할 수 있으므로, 파일 이름 파싱에 대한 테스트를 추가합시다.
이 문제가 수정될 때까지 메타에서 테마 구성 요소를 잠시 비활성화할 것입니다. 이미 #customization:theme:broken-theme로 표시되어 있으니 새로운 문제는 아닙니다 
7개의 좋아요
이미지 URL을 찾을 때 잘못된 괄호를 감지하는 버그를 수정했습니다.
PR 링크는 다음과 같습니다:
또한 이미지 위에 마우스를 올렸을 때 사용자가 주석을 달거나 자르기(회전/반전)를 선택할 수 있는 기능을 추가할 계획입니다.
6개의 좋아요
Nam, 안녕하세요!
컴포넌트가 meta에 설치되었고 테스트를 해 보았습니다!
몇 가지 피드백을 드립니다:
- 에디터를 여는 방법이 명확하지 않습니다. 여기에 어떤 표시를 추가하는 것이 좋겠습니다(예: 미리보기 영역에 '편집’이라는 단어를 띄우거나 연필 아이콘을 넣는 것):
-
컴포저와 z-index 충돌이 심해서 이미지가 컴포저 뒤에 가려집니다. 컴포저를 크게 줄여야만 전체를 볼 수 있습니다.
-
편집 중인 이미지가 너무 크게 보입니다. 편집 중인 이미지의 크기를 유지하는 방법이 있을까요?
6개의 좋아요
피드백 주셔서 정말 감사합니다!
1번 피드백에 대해 작업 중입니다. 스타일은 변경하겠지만, ‘ANNOTATE’ 또는 ‘CROP’ 버튼을 누르면 요청하신 도구가 열리도록 할 예정입니다.
2번 피드백에 대해서는 문제가 무엇인지 좀 더 자세히 설명해 주시겠어요?
3번은 곧바로 작업하겠습니다.
6개의 좋아요
물론입니다:
제 화면에서는 작성 창(composer)이 이미지 편집기 위에 겹쳐서 표시되므로, 작성 창을 축소하기 전까지는 제대로 편집할 수 없습니다.
여기서 정말 멋진 작업을 해주셔서 감사합니다!
3개의 좋아요
확인해 주셔서 감사합니다!
사용하신 기기, 브라우저, 그리고 버전을 알려 주실 수 있을까요?
제 컴퓨터에서는 편집기가 이미지 편집기 위에 팝업으로 표시됩니다. 제 화면은 다음과 같습니다:
4개의 좋아요
아, 무슨 일이 일어나고 있는지 알 것 같습니다. Discourse 팀(그리고 Discourse for Teams의 일부)에서만 활성화되는 “focused sidebar” 테마로 테스트해 볼 수 있을까요?
z-index 값을 조금 더 올려야 할 것 같습니다. @markvanlan 님이 여기서 도움을 주고 계십니다.
4개의 좋아요
@Nam 이 crop/rotate 기능을 허용하는 멋진 변경 사항을 병합했습니다. 이제 (로컬 업로드 전용) 이미지를 클릭한 후, 주석을 달거나 crop/rotate를 수행하는 선택 단계가 추가되었습니다.
현재 유일한 문제는 crop 모달에서 발생하는 또 다른 z-index 문제입니다(주석 달기 모달의 z-index는 정상입니다). crop 모달의 외부 요소에 안정적인 className이 없으므로, cropro 라이브러리에 이를 추가하기 위해 PR을 열었습니다.
수정:
저는 저장소를 포크하여 필요한 작은 변경 사항을 적용했습니다. 이제 z-index 문제가 더 이상 없습니다.
4개의 좋아요
이미지 편집 시 파일 크기가 너무 큰 문제에 대한 해결책이 없는 것 같습니다.
이는 MarkerJs와 Cropro가 이미지를 편집할 때 이미지 크기를 설정하기 때문입니다.
3개의 좋아요
Meta는 S3와 CDN을 사용하며, 이미지를 업로드하는 동시에 편집하려는 경우에는 잘 작동합니다. AFAIK(제가 아는 한) 기존 이미지를 편집하는 동안에는 작동하지 않습니다.
1개의 좋아요
흥미롭네요. 현재 모든 플러그인과 TC가 비활성화된 다른 사이트에서도 시도해 봤는데, 동일한 문제가 발생합니다. 다만 s3를 비활성화하면 정상적으로 작동하네요. 혹시 아이디어가 있으신가요? 이미지도 이상하게 늘어나 있는데, 원래 2:3 비율이어야 하는데 화면 너비에 맞춰 늘어나고 있습니다.
3개의 좋아요
app.yml에 DISCOURSE_ENABLE_CORS: true가 설정되어 있나요?
2개의 좋아요
아니요, 그 줄이 없고 cors-origins 사이트 설정에도 아무것도 설정되어 있지 않습니다.
1개의 좋아요
설정을 적용하고 다시 빌드해 보세요.
2개의 좋아요
1개의 좋아요
완료된 항목을 편집할 수 없는 문제가 있습니다.
1개의 좋아요
스마트폰에서 이 기능을 시도해 보면, 현재 이미지가 편집되지 않고 현재 이미지 옆의 다음 이미지가 대체됩니다.
확인해 주시겠어요?
1개의 좋아요