Quill

Enable real-time co-editing for Quill.

Overview

Add the Codox Wave JavaScript library and css files:

<script src="https://app.codox.io/plugins/wave.client.js?apiKey=8a97c7db-5155-4245-9f9d-16e3dfd11ef2&app=quilljs" type="text/javascript"></script>
<link href="https://cdn1.codox.io/lib/css/wave.client.css" rel="stylesheet">

The value of apiKeyin the query string should be set to the one created for your Quill integration on the dashboard:

JavaScript code

Add the following JavaScript block to your application to enable real-time co-editing for Quill. Replace the apiKey field with your own, which you can get here.

var editor = new Quill("#editor", {modules: {'toolbar': toolbar }, theme: "snow" });
var config = {
"app" : "quilljs",
"editor" : editor,
"docId" : "document_1",
"user" : {
"name" : "Joe Smith",
},
"apiKey" : "8a97c7db-5155-4245-9f9d-16e3dfd11ef2",
};
//start co-editing
var codox = new Codox();
codox.init(config);

The values for docIdandusername should come from your document management service. Wave expects docIdto be globally unique across your service.

Multiple Instances

Every co-editing session should have its distinct codox object. That means if you are running multiple instances of Quill editor on the same page or with in the same application, there should be multiple instances of codox, one for each Quill editor instance or document fragment (note: each document fragment should be uniquely identifiable).

Parameters

The config parameter is a JSON object with the following key-value pairs

Summary

Key

Value

app

(required)

string

docId

(required)

string

user

(required)

object

apiKey

(required)

string

editor

(required)

Quill

autoStart

(optional)

boolean

Additional configration paramaters can be found here

Description

app

string

The static string value 'quilljs'

docId

string

A unique identifier for the document. In a content management service, this could for example be the resource identifier for the document.

user

object

A user meta-data object.

Key

Value

name

(optional)

string

email

(optional)

string

avatar

(optional)

string

id

(optional)

string

For a content management service, this field should be set for each logged-in user based on their credentials. The value of user.name will be used to render the default text-based initials avatar. To create an image-based avatar, set user.avatar to the path of the image resource.

apiKey

string

The API key for the Quill integration. You can obtain a key from your Wave account.

editor

Quill

A reference to a Quill editor instance, in which the co-editing session should be bootstrapped.

autoStart (optional)

boolean

Set to true, to start the co-editing session automatically on init(config). Set to false to initialize but delay start the co-editing (see the start() client API). Default setting is true.