HtmlArea3 for Zope ReadMe

This is a Zope product integrating htmlArea 3 alpha into Zope. HtmlArea is a free textarea replacement by interactive tools, available at http://www.interactivetools.com/products/htmlarea/.

The Zope product is available at http://www.zope.org/Members/to_be/htmlarea3. It is protected by the GNU General Public License and enables you to edit text using common options known from text processing programs.

Note:

• The textarea replacement uses the editable content feature which is supported by MS Internet Explorer on Windows, Versions >= 5.5, and Mozilla (any OS), Versions >= 1.3 (or other Gecko-based browsers based on a comparable current build).
  For other browsers, the standard textarea remains unchanged.
• This version is based on HtmlArea 3.0 alpha; since August 2003 there is a beta version which has some bugs fixed, some more features, and a lot of changes (file names, Javascript logic etc.). However, the integration of the beta is not yet as fully developed as this one by far, so you will most likely want to use this alpha-based product.
• If you don't need Mozilla support, you may instead use htmlArea (2.03) for Zope. Using the mixin class, the only change needed is to use another import directory.
• This Zope product simply integrates the Javascript code into Zope, applying very few minor changes to the Javascript code and some comfort for the usage; when you encounter problems with the Javascript code, please contact Interactive Tools.
• The Zope product was developed using Zope 2.6.1; it has been tested successfully with Zope 2.5.1. It might not work with earlier versions, but it's always worth a try: You can perform a quick check in the README tab of the product, including a quite neat demo.

To use HtmlArea3, do one the following:

A) Use the methods (strongly recommended)

This is the recommended way to use HtmlArea for Zope. It provides you with some comfort using it, and shields you from the necessity to update your code when you want to use a new htmlArea version which might use other file names, functions etc.

Note:

you don't need to use the mixin class anymore, since the methods are now globally available. It is still there, though (of course!)

1. Preparations

   There are 3 methods to get it running:

   1. Do nothing ;-)

      When you unpacked the archive and restarted Zope, there is nothing more needed to be done; Zope registers the methods (unless you switched off this feature), and you may use them happily in all of your DTMLMethods etc. Try the demo (in the product's Readme tab)! If it works, you can start right away.

      Note:

      You can use this method for one version of the HtmlArea for Zope products in your Zope only. If you want to try htmlArea 2.03 or htmlArea 3 beta simultaneously, you must decide which one should be the globally visible one, and use the others by the methods 2 or 3.

      You can use the HTMLAREA4ZOPE_PUBLIC environment variable to control the product which you want to be the one. To choose HtmlArea 3 (alpha) for Zope, use the value 3.0alpha; to suppress the method registration, use None (a string! We are talking of environment variables).

   2. Mix in the Mixin class

      When the first (preferred) method won't work (due to a certain Zope version, maybe), you can apply this to your own class:

      from Products.HtmlArea3 import HtmlArea
      (...)
      class MyClass(HtmlArea.HtmlAreaMixin):
          (...)

   3. Use the MixedIn product

      If the first method doesn't work and you don't have an own product to tune using method 2, you can use the htmlArea3MixedIn product, available at http://www.zope.org/Members/to_be/htmlarea3mixedin. This gives you a folder class which simply mixes in the HtmlAreaMixin class; all objects contained in such a folder (which support acquisition) can now use the htmlArea for Zope methods. If you have installed both htmlArea3 for Zope and htmlArea3MixedIn, you can import this little Demo and tinker with it.

2. Use the methods

   There are several simple to use methods which do the magic. In top-down order:

   1. To include the Javascript code, put:

      <dtml-var htmlArea_prefix>

      into your HTML head; this gives to you the tooltips in your preferred language.
   2. To make the tooltips be shown in another language, use:

      <dtml-var "htmlArea_prefix(lang='xy')">

   3. to include the styles, use:

      <dtml-var htmlArea_style>

      (at the same place), e.g. colouring the buttons background grey.
   4. For each textarea you want to modify, enter:

      <dtml-var "htmlArea('yourFieldNameHere', val)">

      This creates the textarea and converts it. The htmlArea method allows you to choose certain predefined toolbars (see the demo), and even to switch single buttons on or off easily. If you prefer, you may build the textarea yourself and use the htmlArea_editor method.
   5. Alternatively you can convert simply all textareas hanging around using:

      <dtml-var htmlArea_all>

      Of course, in this case you must create the textareas yourself, and you can't customize them individually.
   That's it - you're done!

B) Just insert the code manually

Alternatively, you can insert the code of htmlArea_prefix (found in Products/HtmlArea3/dtml) in another way into your sources, e.g. by inserting it in your standard_html_header (formatted for readability):

<script type="text/javascript"
        src="/misc/HtmlArea3/htmlarea.js"></script>
<script type="text/javascript"
        src="/misc/HtmlArea3/dialog.js"></script>
<script type="text/javascript"
        src="/misc_/HtmlArea3/htmlarea-lang-en.js"></script>

Of course you may use any other of the provided language files instead of htmlarea-lang-en.js; just have a look in the product's directory.

If you want the default styles, include:

<link rel="stylesheet"
      type="text/css"
      src="/misc_/HtmlArea3/htmlarea.css">

(formatted for convenience; you may put it in single line) into your code. You can override the styles there by using another stylesheet if you like.

For each textarea you want to modify, enter:

<textarea name="yourFieldNameHere" (...)>
         (...)
</textarea>
(...)
<script language="javascript1.2"><!--
HTMLArea('yourFieldNameHere');
//--></script>

You may customise the editors according to the guidance provided by Interactive Tools; but you must do it yourself, since you don't use the methods (you lose 90% of this product's magic, but at least the Javascript code etc. is known to Zope. Consider this the ancient Zope versions support, or just look here to see what the basics of HtmlArea usage are).

For all questions regarding the (Javascript) htmlarea itself, please refer to Interactive tools. There is plenty of documentation available online.

For questions and suggestions regarding the Zope product, feel free to contact me via email to tobias.herp (at) gmx.de.

Tobias Herp 2003