여러 사용자가 동시에 문서를 편집할 수 있는 실시간 협업 플러그인입니다.

목차



지원 브라우저


사용방법

플러그인 파일 불러오기

<!-- SynapEditor 객체가 존재해야 적용할 수 있기 때문에 에디터 스크립트 파일 아래에 include 해야 합니다 -->
<script src="collaboration.min.js의 url"></script>


플러그인 설정하기

웹소켓 URL 설정 (필수)

웹소켓 URL을 설정합니다. 설정을 하지 않으면 플러그인이 초기화되지 않습니다.

//...
'collaboration.config': { 
    'wsUrl': 'ws://websocket_url:1234'
}
// ...


사용자 이름, 커서 색 설정

사용자의 이름과 커서의 색을 설정할 수 있습니다.

사용자 이름이 설정되지 않은 경우 10개의 형용사와, 10개의 동물 이름을 랜덤하게 조합해 표기합니다.

사용자 커서의 색이 설정되지 않은 경우 10개의 기본 색 목록에서 랜덤으로 설정됩니다.

//...
'collaboration.config': { 
    'userName': 'SynapEditor', // 사용자 이름 설정
    'userColor': '#39B6B8' // 사용자 커서 색 설정
}
// ...


userName, userColor를 설정하지 않은 경우userName, userColor를 설정한 경우



기본 이름, 기본 색 설정

사용자 이름과 색을 설정을 하지 않았을 때 보여질 기본 이름 목록과 기본 색 목록을 설정할 수 있습니다.

사용자 이름(userName)과 색(userColor)을 설정하지 않은 경우 기본 이름 목록과 기본 색 목록에서 랜덤으로 설정됩니다.

//...
'collaboration.config': { 
    'defaultNames': ['강아지', '고양이', '참새'],  // 기본 이름 목록 설정
    'defaultColors': ['#CDB4DB', '#F5CAC3', '#87BBA2']  // 기본 색 목록 설정
}
// ...



접속 사용자 정보 보기

기본 제공 UI




Custom UI



업데이트 기록 보기