This page provides a simple demonstration of NetWedit, the JavaScript WYSIWYG editor, and an explanation of how it works.
Below there are two Text boxes where you can start typing in the your text. Alternatively you can copy and paste into the boxes. When you've entered the text, click on a [Mark up] button to open a Markup window, which shows how your text will appear in a browser. You can format the text by selecting regions in the Markup window and clicking on the buttons underneath the text box. Changes will be reflected immediately: you will see HTML code inserted automatically in the respective text box and clicking on the Markup window will update the resulting display. (The Text box shows the HTML Source view).
As this is an experimental piece of software, particularly the case with the limitations of the JavaScript methods used, there is one switch that you can use per web form to modify its behaviour. In the top box it is not set, so when you select a text for formatting, every occurrence of that text will be formatted. Underneath, it has been set and the enabled option tries to get round the limitation so you can select unique occurrences of repeating words. Please compare the two by marking up the word 'to.' Unfortunately, the latter has some drawbacks in presentation, more so for some browsers than others. Please free to refine this by limiting this to a certain class of browsers.
Most of all, please let me know if you have better ideas and solutions!
If you look at the source code you will see at the top, between <HEAD> tags a reference to the include script that contains the NetWedit code:
<script language="JavaScript1.2" src="netwedit0_2.js"> </script>
The source is here.
The script can then be used by calling a function within forms, and specifying a few parameters, as in the following lines:
<INPUT onclick="commence('form1','box')" type=button value="Markup 1">
<INPUT type="hidden" name="backupbox">
<INPUT type="hidden" name="prevbox" value="">
This page contains a single form with two text area fields. Each field has associated with it a pop-up window which is created when a user clicks on the [Markup1] button to start a call to the commence function inside the library file, netwedit0_2.js.
The functions require some parameters in order to pass data to and from the markup window and this form. First of all, two parameters are needed to distinguish the particular form and the particular field - form1 and box respectively. There are two required hidden fields: backupbox is used for the [Undo] button and stores a copy of the contents of the text area box before a formatting button is pressed. It needs to be named: backup<field_name>. Similarly, the prevbox field is used internally, this time to store information about the way carriage returns are handled.
Finally, there is optionally another field, which is included like:
<INPUT type="hidden" name="codebox">
Its inclusion tells the program to apply the 'uniqueness' fix.