Document Comparison

Release 3.1.0 and above, Release 2.19.0 and above.

A plugin that allows you to compare the added/deleted history of saved documents.

When using the Document Comparison plugin, the editor's content is saved to a database as editor document model JSON data, and is retrieved to compare the document's change history.

The content must be saved as the editor document model (JSON), not HTML.

(HTML can be stored separately according to the customer's policy.)

Notes

A database that can manage document change history is required.

How to Use

Loading Plugin Files

<!-- The SynapEditor object must exist for this to take effect,
     so include after the editor script files. -->
<script src="url of documentComparison.min.js"></script>
<link rel="stylesheet" href="url of documentComparison.min.css">

UI

Using the plugin name 'documentComparison', you can add a button to the toolbar area.

Add to Toolbar

// synapeditor.config.js
//...
'editor.toolbar': [
    //...,
    'documentComparison',
    //...
],
// ...

Add to Menu

// synapeditor.config.js
//...
'editor.menu.definition': {
    //...,
    'tools': [
        //...,
        'documentComparison',
        //...
    ],
    //...
},
//...

Configure the Plugin

Available Keys

Sets the URL to send the request to.

API address that retrieves the saved document list.

Without this setting, the document history plugin does not function.

Sets the URL to send the request to.

API address that retrieves the data of one document from the saved document list.

Without this setting, the document history plugin does not function.

Plugin Configuration Example

// synapeditor.config.js
/**
 * Configure the Document Comparison API.
 */
'documentComparison.config': {
    'list': { // Config for the saved document list.
        'url': '/getDocumentVersionList', // Get(POST)
        'headers': {
            "Content-Type": "application/json"
        },
        'params': {
        }
    },
    'data': { // Config for one of the saved document versions.
        'url': '/getDocumentVersionData', // Get(POST) and Delete(DELETE)
        'headers': {
            "Content-Type": "application/json"
        },
        'paramKey': 'id' // The history id corresponding to each doc_id (document number)
    }
}

API Setup Example

When comparing document history, you must save and load the editor's content as SEModel (JSON type). (Separate HTML storage is required; this example does not include HTML storage.)

Instead of getPublishingHtml() and openHTML() used for storing as HTML, you must use getBodyModelJSON() and openSEModel().

• Save: getBodyModelJSON()
• Load: openSEModel()

// Open the editor as SEModel (JSON type)
window.editor = new SynapEditor(editorId, that.editorConfig);
window.editor.openSEModel(json); // json retrieved from the DB

var documentComparisonPlugin = window.editor.plugins.documentComparison;
if (documentComparisonPlugin) {
    // addListParam: Adds a parameter for the document history list query API
    //               (e.g. /getDocumentVersionList).
    documentComparisonPlugin.addListParam('docId', docId);
}

// Save as model
var json = window.editor.getBodyModelJSON(true);
// POST `json` (SEModel: editor model) to the document history save API
// (e.g. /saveDocumentVersionData)

DB Schema Example

The DB schema configuration is provided as an example, and we recommend configuring it in whatever form the customer prefers.

Get Document History List

[request]

To retrieve the document history list, the editor sends a request to the specified customer system URL. This URL corresponds to the 'list' - 'url' value of the previously set 'documentComparison.config'.

Request URL:    http://hostname/getDocumentVersionList
Request Method: POST

[response]

When the document history list is retrieved, the customer should return a response like the following:

[
    {
        "id": "1",
        "date": "2024-12-23 10:39:04",
        "author": "synap"
    },
    {
        "id": "2",
        "date": "2024-12-23 11:21:31",
        "author": "synap"
    }
]

Get Single Document History

[request]

To retrieve a single document history, the editor sends a request to the specified customer system URL. This URL corresponds to the 'data' - 'url' value of the previously set 'documentComparison.config'.

Request URL:    http://hostname/getDocumentVersionData
Request Method: POST

[response]

When a single document history is retrieved, the customer should return a response like the following:

// Output of getBodyModelJSON()

Delete Single Document History

[request]

To delete a single document history, the editor sends a delete request to the specified customer system URL. This URL corresponds to the 'data' - 'url' value of the previously set 'documentComparison.config'.

Request URL:    http://hostname/getDocumentVersionData
Request Method: DELETE

Save Document History Data

When saving document history data, no separate configuration or API is provided, as this requires settings tailored to the customer's server environment.

The following example is based on the DB schema structure above.

[request]