Instantiating CWI

Instantiating CWI

There are two ways to create an instance of CWI:

  • Use a script within the HTML document containing the code to instantiate CWI

  • Include a reference to JavaScript file containing the code to instantiate CWI

If you decide to choose the last option the code shown below goes into a JavaScript file.

Let's have a look at the code and discuss the different parameters.

<script> var host = [hostname]; var user = [username]; var pw = [password]; var congree = window.Congree || {}; window.Congree = congree; congree.loadSidebar = function (user, pw) { congree.sidebar = new Congree.Sidebar({ serverAddress: "[hostname]/Congree", authentication: { userName: user, password: pw, accessTokenURL: "[hostname]/congreeidentityserver/connect/token", loginType: "[authentication type]" }, initialRuleSetName: "[ruleset]", requestValidTerms: [term requests], culture: "[culture]", editors: [ Congree.AdapterFor.TextInput([DOM selector], [Name for Linguistic Engine]), Congree.AdapterFor.TextInput([DOM selectors], [Name for Lingiustic Engine]), Congree.AdapterFor.CKEditor4([DOM selector], [Name for Linguistic Engine]) ] }); congree.sidebar.show([Congree Sidebar root]); }; </script>

Initialization parameters

Parameter

Description

Sample

Parameter

Description

Sample

hostname

The name of the server where Congree UCC is deployed. Provide the hostname along with the protocol, e.g. http or https.

 

username

Depending on the type of authentication the user name is either the name of a user defined in Congree's user management (Congree authentication) or the name of a user authenticated within the host application (TrustCMS authentication). The trust cms secret is configured on the Congree UCC server. 

 

authentication type

CWI supports Congree authentication and TrustCMS. For Congree Authentication the value is 'usernamePassword'. For TrustCMS it is 'cms'.

 

rule set

While initializing CWI it is possible to assign a default rule set.

 

term requests

This value can be set to true or false. Setting it to true will display all correctly used terms in the Linguistic Check Panel. Setting the value to false will not show them.

 

culture

The UI language. Possible values are "de-DE" or "en-US".

 

 

CWI Adapters

In order to be able to handle different elements and structures within an HTML page CWI comes along with a couple of different adapters:

  • Congree.AdapterFor.TextInput for the HTML elements input and textarea

  • Congree.AdapterFor.TextCKEditor4 for CKEditor

  • Congree.AdapterFor.TinyMCE for TinyMce

  • Congree.AdapterFor.Xyleme for Xyleme

Invoking one ore more adapters will force CWI to listen to those structures and subscribing to events onchange and onselection. Any modification withing those structures will invoke a linguistic checks of the contents within those elements.

To specify the contents to be checked further it is possible to pass DOM selectors as the first parameter. DOM selectors can be elements names, css class names or id values.

<textarea id="summary">Check this content</textarea> <textarea class="help">Check this text too</textarea> <textarea>Do not check this text.</textarea>

To check the contents in the textarea elements shown in the code above the setting would look like this:

Congree.AdapterFor.TextInput('#summary'), Congree.AdapterFor.TextInput('.help'),

The third textarea is not being treated as there is no setting forcing CWI to take care of it.

If nothing else is specified, CWI passes a generic XML node to Congree's Linguistic Engine created based on the elements in the source. For the examples above the XML node passed looks like this:

<doc><text>Check this content.</text></text>Check this text too.<text></doc>

To be able to distinguish the semantics of the elements and to allow for a context specific check it is possible to pass a second parameter to the adapters defining the name of the element to be used when the content is passed to the Linguistic Engine.

Congree.AdapterFor.TextInput('#summary', 'summary'), Congree.AdapterFor.TextInput('.help', 'summary'),

Using the code above the content passed to the Linguistic Engine will look like this:

<doc><summary>Check this content.</summary><help>Check this text too.</help></doc>