스마트 에디터 이벤트 생성, 키이벤트
안녕하세요.
이번에 프로젝트를 진행하면서
스마트 에디터를 사용하면서 이벤트를 새롭게 정의할 일이 생겼습니다.
스마트 에디터는 네이버 에디터를 사용 하였습니다.
한참을 구글링하다....어찌어찌 구현하였기에 정리해두려고 합니다.
우선 저의 소스 경로 입니다.
webapp/wcom/se2 에 스마트 에디터가 있습니다.
그럼 이제 키 이벤트를 구현해보겠습니다.
1. 플러그인 등록
webapp/wcom/se2/SE2BasicCreator.js
SE2BasicCreator.js 파일에 들어가 보겠습니다.
마지막줄에 다음과 같은 코드가 있습니다.
oEditor.registerPlugin(new nhn.husky.SE2B_CSSLoader()); // CSS lazy load
oEditor.registerPlugin(new nhn.husky.SE_OuterIFrameControl(elAppContainer, 100));
oEditor.registerPlugin(new nhn.husky.SE_ToolbarToggler(elAppContainer, htParams.bUseToolbar));
oEditor.registerPlugin(new nhn.husky.LeeEvent(elAppContainer));
여기 밑에 제가 만들 플러그인을 등록 하겠습니다.
oEditor.registerPlugin(new nhn.husky.LeeEvent(elAppContainer));
2. 함수 구현
저도 완벽하게 분석하여 구현한것은 아니라....
쓰는방법만 알고 있습니다.
아까 등록했던 nhn.husky.LeeEvent 를 구현해보면
name을 적고
init으로 초기 생성자(?)개념으로 구현을하고
$ON_MSG_APP_READY : function(){
this.oApp.exec("REGISTER_HOTKEY", ["ctrl+v", "LeeEventFunction", []]);
},
를통해 조합키가 동작할 수 있도록 함수를 등록합니다.
그리고
$ON_LeeEventFunction : function(){
alert(123);
}
함수에서 구현할 내용을 적습니다.
저는 이번 함수를 구현하면서
webapp/wcom/se2/smarteditor2.js 에 구현되어있는 함수들을 참고하였습니다.
조금이나마 도움이 되셧으면 합니다.
nhn.husky.LeeEvent = jindo.$Class({ name : "LeeEvent", $init : function(elAppContainer){ this._assignHTMLElements(elAppContainer); }, _assignHTMLElements : function(elAppContainer){ elAppContainer = jindo.$(elAppContainer) || document; }, $ON_MSG_APP_READY : function(){ this.oApp.exec("REGISTER_HOTKEY", ["ctrl+v", "LeeEventFunction", []]); }, $ON_LeeEventFunction : function(){ alert(123); } });
'개발 > javascript,jquery' 카테고리의 다른 글
javascript setInterval, setTimeout 몇 초후 실행, 몇초마다 실행 (0) | 2017.09.09 |
---|---|
attr과 prop의 차이 적어두기! (0) | 2017.08.10 |
javascript Ajax 사용 방법 (0) | 2017.03.10 |
[javascript]자바스크립트 concat, slice, join, for (0) | 2016.04.17 |
자바스크립트 jstl 함수 (0) | 2016.04.15 |
[jquery]제이쿼리 find(), parent() (0) | 2016.04.13 |
[javascript]자바스크립트 reduce, map, filter (0) | 2016.04.11 |