[kupu-dev] Add charmap to kupu

[Guido Wesdorp]

Jordi Martinez wrote:
> I would like to add a button to the toolbar. If you click on it I need a
> dialog box with the list of phonetics symbols. The user click on every 
> symbol he/she needs and they appear in a text box he/she could edit
>
> When finish to add symbols click on the ok button and the text in the 
> text box is inserted in the document
>
> Similar how windows charmap works but only for phonetics symbols
>
>   
Yes, I understood that, see my previous mail... :)

Longer answer:

The first step is to create a layer (called 'Implementation' in Kupu) 
that glues HTML snippets into the toolbar and body of the Kupu HTML 
file. To do this, you create a directory with .kupu (XSLT) files, which 
contain information about what XSL files to include (include.kupu), what 
parts to include (wire.kupu) and snippets of HTML (other .kupu files). I 
guess in your case you will want to copy and adjust include.kupu, 
wire.kupu, head.kupu and toolbar.kupu from the plone layer to make them 
include your custom .js files and the button, and create a file called 
something like 'charmap.kupu' for the dialog box, which you add to 
include.kupu and wire.kupu. For more information about the .kupu files, 
see doc/TEMPLATE-SYSTEM.txt and check out a simple layer such as 
'widgeteer' to see how it's built up.

Then you write JS code that gets triggered by the user selecting, or 
clicking or whatnot, a character in your charmap. This could be written 
as a Kupu plugin (known as 'Tools' in Kupu), but I guess you could just 
add a function to your dialog box too, since you won't really use the 
plugin framework. This should contain the code I wrote in my previous 
script, and some more code to close the dialog, etc.

Then you copy the Kupu init file, in Plone's case 
plone/kupu_plone_layer/kupuinit.js, to your layer directory and adjust 
it so that your dialog pops up if the button gets clicked. There's 
plenty of examples of how to write a simple button in the init file 
already, it's a two liner that says 'create a button, register to Kupu', 
basically. Make sure to copy the plone layer's head.kupu file to your 
layer, and adjust it so it uses your init code instead of Plone's.

When those steps are taken, you can add your layer to the root make file 
, or create a local make file, and run it so it builds the template (see 
info in the docs). This should overwrite (if done well) the default 
Plone HTML with your customized version.

I understand the current make situation isn't very easy to work with, 
though it's rather flexible it's relatively cumbersome to create a new 
layer. Hopefully, though, this information, along with the docs, is 
enough to get you started...

Cheers,

Guido