이벤트 종류
이벤트 이름 | 버전 | 설명 |
---|---|---|
initialized | 릴리즈 2.1.0 이상 | 에디터가 초기화되었을 때 발생합니다 |
beforeUploadImage | 릴리즈 2.2.0 이상 | 이미지를 업로드 하기 전에 발생합니다 |
afterUploadImage | 릴리즈 2.2.0 이상 | 이미지 업로드가 완료된 후 발생합니다. |
beforeUploadVideo | 릴리즈 2.2.0 이상 | 비디오를 업로드 하기 전에 발생합니다 |
afterUploadVideo | 릴리즈 2.2.0 이상 | 비디오 업로드가 완료된 후 발생합니다 |
beforeUploadFile | 릴리즈 2.2.0 이상 | 파일을 업로드 하기 전에 발생합니다 |
afterUploadFile | 릴리즈 2.2.0 이상 | 파일 업로드가 완료된 후 발생합니다 |
이벤트 등록
API 사용
editor.setEventListener()
이벤트를 등록 할 때 사용하는 API입니다.
editor.setEventListener('이벤트이름', function(e) { });
에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { '이벤트이름': function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수방식 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditor이벤트이름(e) { // 이벤트 이름은 첫자가 대문자 // ex: initialized => SynapEditorInitialized // ex: beforeUploadImage => SynapEditorBeforeUploadImage } new SynapEditor(editorId, editorConfig, html);
이벤트 해제
API 사용
editor.removeEventListener()
등록한 이벤트를 제거 할 때 사용하는 API 입니다.
editor.removeEventListener('이벤트이름');
함수로 전달되는 객체 형태
{ editor: {에디터 객체}, // 에디터 eventType: 'initialized', // 이벤트 이름 cancelable: false, // 이벤트 취소 가능 여부 returnValue: null, // 반환 값 .... }
- editor: 이벤트가 발생한 에디터입니다.
- eventType: 이벤트 이름입니다.
- cancelable: 이벤트 취소 가능 여부입니다.
- returValue: 반환 값입니다. 이벤트 취소가 가능한 이벤트의 경우 (cancelable: true) false를 전달하면 이벤트 진행 취소가 가능합니다.
이벤트 진행 취소
cancelable이 true인 경우, returnValue를 false로 설정하면 이벤트 진행을 취소할 수 있습니다.
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { 'beforeUploadImage': function (e) { e.returnValue = false; // 업로드가 더이상 진행되지 않습니다 } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
이벤트 설명
1. initialized
릴리즈 2.1.0 이상
에디터가 초기화 되었을 때 발생합니다.
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorInitialized(e) { // editor 초기화 완료시 실행 (async) var editor = e.editor; } function SynapEditorInitializedSync(e) { // editor 초기화 완료시 실행 (sync) var editor = e.editor; } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { initialized: function (e) { var editor = e.editor; }, initializedSync: function (e) { var editor = e.editor; } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
{ editor: {에디터 객체}, eventType: 'initialized', cancelable: false, returnValue: null }
2. beforeUploadImage
릴리즈 2.2.0 이상
이미지를 업로드 하기 전에 발생합니다. 이벤트 진행 취소가 가능합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('beforeUploadImage', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorBeforeUploadImage(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { beforeUploadImage: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "beforeUploadImage", cancelable: true, returnValue: null, fileName: "filename.png", // 업로드 대상 파일 이름 isBackground: false // 배경이미지인지 여부 } // release 2.2.1 이상 { editor: SynapEditor, eventType: "beforeUploadImage", cancelable: true, returnValue: null, fileType: "image", // [2.2.1] 파일 타입 fileName: "filename.png", isBackground: false, uploadCount: 0 // [2.2.1] 업로드 중인 파일 수 (아직 업로드 되지 않은 업로드 대상 수) }
3. afterUploadImage
릴리즈 2.2.0 이상
이미지 업로드가 완료된 후 발생합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('afterUploadImage', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorAfterUploadImage(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { afterUploadImage: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "afterUploadImage", cancelable: false, returnValue: null, path: "/upload/path/filename.png", // 업로드된 경로 elementId: "se-123456-abcdefg-7890", // HTML Element Id (wapper) isBackground: false // 배경이미지인지 여부 } // release 2.2.1 이상 { editor: SynapEditor, eventType: "afterUploadImage", cancelable: false, returnValue: null, fileType: "image", // [2.2.1] 파일 타입 path: "/upload/path/filename.png", elementId: "se-123456-abcdefg-7890", isBackground: false }
4. beforeUploadVideo
릴리즈 2.2.0 이상
비디오를 업로드 하기 전에 발생합니다. 이벤트 진행 취소가 가능합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('beforeUploadVideo', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorBeforeUploadVideo(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { beforeUploadVideo: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "beforeUploadVideo", cancelable: true, returnValue: null, fileName: "filename.mp4" // 업로드 대상 파일 이름 } // release 2.2.1 이상 { editor: SynapEditor, eventType: "beforeUploadVideo", cancelable: true, returnValue: null, fileType: "video", // [2.2.1] 파일 타입 fileName: "filename.mp4", uploadCount: 0 // [2.2.1] 업로드 중인 파일 수 (아직 업로드 되지 않은 업로드 대상 수) }
5. afterUploadVideo
릴리즈 2.2.0 이상
비디오 업로드가 완료된 후 발생합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('afterUploadVideo', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorAfterUploadVideo(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { afterUploadVideo: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "afterUploadVideo", cancelable: false, returnValue: null, path: "/upload/path/filename.mp4", // 업로드된 경로 elementId: "se-123456-abcdefg-7890" // HTML Element Id (wapper) } // release 2.2.1 이상 { editor: SynapEditor, eventType: "afterUploadVideo", cancelable: false, returnValue: null, fileType: 'video', // [2.2.1] 파일 타입 path: "/upload/path/filename.mp4", elementId: "se-123456-abcdefg-7890" }
6. beforeUploadFile
릴리즈 2.2.0 이상
파일을 업로드 하기 전에 발생합니다. 이벤트 진행 취소가 가능합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('beforeUploadFile', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorBeforeUploadFile(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { beforeUploadFile: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "beforeUploadFile", cancelable: true, returnValue: null, fileName: "filename.zip" // 업로드 대상 파일 이름 } // release 2.2.1 이상 { editor: SynapEditor, eventType: "beforeUploadFile", cancelable: true, returnValue: null, fileType: "file", // [2.2.1] 파일 타입 fileName: "filename.zip", uploadCount: 0 // [2.2.1] 업로드 중인 파일 수 (아직 업로드 되지 않은 업로드 대상 수) }
7. afterUploadFile
릴리즈 2.2.0 이상
파일 업로드가 완료된 후 발생합니다.
이벤트 등록: API 사용
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var editor = new SynapEditor(editorId, editorConfig, html); editor.setEventListener('afterUploadFile', function (e) { });
이벤트 등록: 함수방식
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; function SynapEditorAfterUploadFile(e) { } new SynapEditor(editorId, editorConfig, html);
이벤트 등록: 에디터 초기화시 등록
var editorId = 'synapEditor'; var editorConfig = {}; var html = ''; var eventListeners = { afterUploadFile: function (e) { } }; new SynapEditor(editorId, editorConfig, html, eventListeners);
함수로 전달되는 객체 형태
함수로 전달되는 파라미터 e의 형식
e
// release 2.2.0 { editor: SynapEditor, eventType: "afterUploadFile", cancelable: false, returnValue: null, path: "/upload/path/filename.zip" // 업로드된 경로 } // release 2.2.1 이상 { editor: SynapEditor, eventType: "afterUploadFile", cancelable: false, returnValue: null, fileType: "file", // [2.2.1] 파일 타입 path: "/upload/path/filename.zip" }