...
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
//...
'collaboration.config': {
'wsUrl': 'ws://websocket_url:1234'
}
// ... |
실시간 협업
...
문서 Id 설정 (선택)
실시간 협업을 시작할 문서의 Id를 설정합니다.
...
| userName, userColor를 설정하지 않은 경우 | userName, userColor를 설정한 경우 |
|---|
- 이름: 10개의 형용사와, 10개의 동물 이름을 랜덤하게 조합해 영문으로 표기
- 색: 기본으로 정의된 10개의 색 중 랜덤으로 표기
| - 이름: userName 에 설정한 이름 표기
- 색: userColor에 설정한 색으로 표기
|
| |
사용자 이미지 설정 (선택)
userData에 사용자 이미지 Url을 설정하면 기본으로 제공되는 접속 사용자 UI에 이미지를 표시할 수 있습니다.
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
//...
'collaboration.config': {
'userName': '사이냅',
'userColor': '#39B6B8',
'userData': {
'profileImage': '/img/path.png' // 사용자 이미지 Url
}
}
// ... |
| 설정 전 | 설정 후 |
|---|
 Image Added
|  Image Added
|
기본 이름, 기본 색 설정 (선택)
사용자 이름과 색을 설정을 하지 않았을 때 보여질 기본 이름 목록과 기본 색 목록을 설정할 수 있습니다.
...
| config | script |
|---|
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
| var synapEditorConfig = {
...
'collaboration.config': {
'wsUrl': 'ws://websocket_url:1234',
'docId': 'documentId' // 실시간 협업을 시작할 문서 Id
},
...
} |
|
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
| var editor = new SynapEditor(id, synapEditorConfig);
var collaboration = editor.plugins.collaboration;
collaboration.init(); |
|
...
| config | script |
|---|
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
| var synapEditorConfig = {
...
'collaboration.config': {
'wsUrl': 'ws://websocket_url:1234'
},
...
} |
|
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
| var editor = new SynapEditor(id, synapEditorConfig);
var collaboration = editor.plugins.collaboration;
collaboration.changeDocument('documentId'); // 실시간 협업을 시작할 문서 Id |
|
destroy()를 사용하여 실시간 협업 종료하기
...
