이미지 업로드 후 이미지 클릭시 사이즈 조절 레이어가 안나오네요. about smarteditor2 HOT 12 CLOSED

음... 위에서 너무 간략한 설명만 드려서 구현하기 어려우실 수 있습니다.
네이버블로그에서 사용하는 이미지 퀵에디터 플러그인소스를 약간 수정하여 gist에 올려두었습니다.
https://gist.github.com/kyungilpark/a5901e43be5ef7222ef531a466678918
아래 스텝으로 적용하시면 아마 될 겁니다.

1. 해당 소스 다운받아서 SmartEditor2Skin.html에 포함하시고
2. 설정파일(SE2M_Configuration.js)에서 다음과 같이 설정 추가

nhn.husky.SE2M_Configuration.QuickEditor = {
    common : {
        bUseConfig : false
    },
    Image : {
        nImageMaxWidthSize : 9999,
        nImageMaxHeightSize : 9999
    }
};

3. 에디터 생성 스크립트(SE2BasicCreator.js)에서 해당 플러그인 추가

oEditor.registerPlugin(new nhn.husky.SE_QuickEditor_Image(elAppContainer));			// 이미지 퀵에디터

4. 메시지 설정파일(husky_SE2B_Lang_ko_KR.js)에서 메시지 문자열 추가

'SE_QuickEditor_Image.exceedMaxSize' : '이미지 크기를 에디터 가로폭(${nEditorWidth}px)보다 크게 조절하실 수 없습니다.',

from smarteditor2.

이미지 퀵에디터 플러그인은 첨부된 이미지파일정보와 연관이 있어서 오픈소스버전에서는 제외되었습니다.
별도로 구현하셔야 합니다.

from smarteditor2.

그렇다면 구현을 위한 이미지 클릭 이벤트 등은 어떻게 해야 하나요?

from smarteditor2.

에디터에서 발생하는 이벤트들은 플러그인에서 다음과 같이 메서드를 정의하면 받을 수 있습니다.

$ON_EVENT_EDITING_AREA_CLICK : function(we) {
  console.log(we); // we는 jindo에서 랩핑한 이벤트객체입니다.
}

플러그인 작성방법은 가이드문서 참고 바랍니다. (http://naver.github.io/smarteditor2/user_guide/ > 기능추가및변경하기 > 새로운 기능 추가)

사용할 수 있는 이벤트 목록은 예전에 네이버개발자센터 위키에 정리된게 있었는데 이관시기를 놓쳐서 백업을 못해 유실되었습니다. ㅠ.ㅠ 다시 작성해야하는데 시간이 안나서...
일단, 기본적인 이벤트들은 (hp_SE_EditingAreaManager.js)에 정의되어 있으니 참고 바랍니다.

attachDocumentEvents : function(doc){
	this.oApp.registerBrowserEvent(doc, "click", "EVENT_EDITING_AREA_CLICK");
	this.oApp.registerBrowserEvent(doc, "dblclick", "EVENT_EDITING_AREA_DBLCLICK");
	this.oApp.registerBrowserEvent(doc, "mousedown", "EVENT_EDITING_AREA_MOUSEDOWN");
	this.oApp.registerBrowserEvent(doc, "mousemove", "EVENT_EDITING_AREA_MOUSEMOVE");
	this.oApp.registerBrowserEvent(doc, "mouseup", "EVENT_EDITING_AREA_MOUSEUP");
	this.oApp.registerBrowserEvent(doc, "mouseout", "EVENT_EDITING_AREA_MOUSEOUT");
	this.oApp.registerBrowserEvent(doc, "mousewheel", "EVENT_EDITING_AREA_MOUSEWHEEL");
	this.oApp.registerBrowserEvent(doc, "keydown", "EVENT_EDITING_AREA_KEYDOWN");
	this.oApp.registerBrowserEvent(doc, "keypress", "EVENT_EDITING_AREA_KEYPRESS");
	this.oApp.registerBrowserEvent(doc, "keyup", "EVENT_EDITING_AREA_KEYUP");
	this.oApp.registerBrowserEvent(doc, "scroll", "EVENT_EDITING_AREA_SCROLL");
},

from smarteditor2.

정말 감사 합니다. 꾸벅~
테스트 해보겠습니다.

from smarteditor2.

위의 내용대로 해보니 안되어서
혹시나 해서 hp_SE_EditingAreaManager.js 를 찾아 보니 이 파일 자체가 없군요. ㅠㅠ

from smarteditor2.

아... SE2.3.10까지는 머지된 파일만 제공되어 hp_SE_EditingAreaManager.js파일이 따로 없군요..
혹시 어떤 오류가 나면서 안되는 건지 알려주시면 확인해보겠습니다.

from smarteditor2.

SmartEditor2Skin.html 에 hp_SE_QuickEditor_Image.js 파일 추가한뒤,
SE2BasicCreator.js 와 SE2B_Configuration_General.js 에 위에 추가하라고 알려주신것 추가하니
정상적으로 작동 잘 되니 참고하세요 :)

imredcat 님이 질문을 이어서 해주시고 kyungilpark님의 친절한 답변 덕분에 전 해결되었습니다.
감사합니다

from smarteditor2.

아! 잘 작동 됩니다.
"hp_SE_QuickEditor_Image.js" 파일을 "SE2M_Configuration.js" 다음에 로드 해야 되는군요.
정말 정말 감사 합니다. 꾸벅!

from smarteditor2.

@airshivan 님, @imredcat 님
잘된다니 다행이네요.. 확인 감사합니다.
크게 이상이 없다면 추후 버전에 해당 플러그인 포함시키는 걸로 검토해보도록 하겠습니다.

from smarteditor2.

혹시 크롬에서는 사용이 안되는건가요??

from smarteditor2.

@ujo2417
이미지 퀵에디터 샘플을 물어보시는거라면 크롬에서도 동작합니다.
#106 질문처럼 이미지 가장자리 꼭지점에 사각형 포인터가 생기는 것 을 물어보시는거라면 IE브라우저자체 기능으로 크롬에서는 별도 구현하셔야 합니다.

from smarteditor2.