Codox
Search…
TinyMCE
Enable real-time co-editing for TinyMCE.

Overview

Add the following JavaScript block to your application to enable real-time co-editing for TinyMCE.
1
var config = {
2
docId : "docId",
3
user : {
4
name : "Joe Smith",
5
},
6
apiKey : "7bdf58a1-e722-4868-bee9-b7e7c65a09b6",
7
};
8
9
tinymce.init({
10
external_plugins : {
11
wave : "https://cdn2.codox.io/waveTinymce/2.x/plugin.min.js"
12
},
13
wave : config
14
}
Copied!
Enable codox through TinyMCE's external_plugins. To start a co-editing session, supply a configuration object to the plugin.
The values for docIdandusername should come from your document management service. Codox expects docIdto be globally unique across your service.
For general information about TinyMCE plugins, please click here.

Multiple Instances

Every co-editing session should have its distinct codox object. That means if you are running multiple instances of TinyMCE editor on the same page or with in the same application, there should be multiple instances of codox, one for each TinyMCE editor instance or document fragment (note: each document fragment should be uniquely identifiable).
You may want to directly access the codox object associated with each editor to register and respond to session and error events as follows:
1
// access the codox instance
2
var codox = tinymce.get('editor_id').plugins.wave.codox;
3
4
// register session handlers
5
codox.on("content_changed", function(data){
6
7
});
8
9
// register error handlers
10
codox.on("error", function(data){
11
12
});
Copied!

Parameters

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

Summary

Key
Value
docId
(required)
string
user
(required)
object
apiKey
(required)
string
autoStart
(optional)
boolean
Additional configration paramaters can be found here

Description

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 TinyMCE integration. You can obtain a key from your account.

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.
Last modified 5mo ago