How to install dolmen.widget.tinymce
- Download and install ActivePython
- Open Command Prompt
- Type
pypm install dolmen.widget.tinymce
Dependencies
- distribute
- fanstatic
- grokcore.view
- js.jquery
- js.tinymce
- zeam.form.base>=1.0
- zeam.form.ztk>=1.0
- zope.interface
- [test] grokcore.component
- [test] zeam.form.ztk[test]
- [test] zope.browserpage
- [test] zope.browserresource
- [test] zope.component
- [test] zope.i18n
- [test] zope.interface
- [test] zope.publisher
- [test] zope.schema
- [test] zope.security
- [test] zope.traversing
Lastest release
dolmen.widget.tinymce is a package that provides a useable and pluggable way to render a text field as a WYSIWG editor in a zeam.form Form.
Example
We are going to develop here a small example, to demonstrate the use of dolmen.widget.tinymce. First, we need to create a model content with a text field:
>>> import grokcore.component as grok >>> from zope.interface import Interface >>> from zope.schema import Text >>> from zope.schema.fieldproperty import FieldProperty >>> class ICave(Interface): ... paintings = Text(title=u'Description of the cave paintings') >>> class Grotto(grok.Context): ... paintings = FieldProperty(ICave['paintings'])
We have now a model that defines a text field. We want to edit/view this content, using a rich editor, allowing to input rich text and to display it as valid HTML. To do so, we define a form:
>>> from zeam.form.ztk import Form, Fields>>> class EditCave(Form): ... grok.name('edit') ... grok.context(ICave) ... ignoreContent = False ... fields = Fields(ICave)>>> grok.testing.grok_component('edit', EditCave) True
At this point, if we instanciate the form, we have a normal rendering:
>>> from zope.publisher.browser import TestRequest >>> homecave = Grotto() >>> request = TestRequest() >>> form = EditCave(homecave, request) >>> form.updateWidgets() >>> print form.fieldWidgets.get('form.field.paintings').render() <textarea id="form-field-paintings" name="form.field.paintings" class="field field-text field-required" cols="80" rows="5"></textarea>
To get the tinyMCE widget, you simply need to use the "mode" of the field, to indicate what you want to render:
>>> from dolmen.widget.tinymce import TINYMCE_INPUT >>> form = EditCave(homecave, request) >>> form.fields['paintings'].mode = TINYMCE_INPUT >>> form.updateWidgets() >>> print form.fieldWidgets.get('form.field.paintings').render() <script type="text/javascript"> $(document).ready(function(){ $('textarea[name="form.field.paintings"]').tinymce(); }); </script> <textarea id="form-field-paintings" name="form.field.paintings" class="field field-text field-required" cols="80" rows="5"></textarea>
The modes can be 'tinymce.input' for an input widget and 'tinymce.display' to display the value as valid html:
>>> from dolmen.widget.tinymce import TINYMCE_DISPLAY >>> homecave.paintings = u"<h1>Very nice paintings</h1><p>Mammoth</p>" >>> form = EditCave(homecave, request) >>> form.fields['paintings'].mode = TINYMCE_DISPLAY >>> form.updateWidgets() >>> print form.fieldWidgets.get('form.field.paintings').render() <div id="form-field-paintings" name="form.field.paintings" class="field"><h1>Very nice paintings</h1><p>Mammoth</p></div>
Changelog
1.0b3 (2011-01-18)
- Corrected entry points and inclusion path.
1.0b2 (2011-01-13)
- Now we're using fanstatic.
1.0b1 (2010-07-06)
- Tuned the menus of the TinyMCE widget, in order to removed useless options.
- The package is now using the latest changes in the zeam.form core, such as the ModeMarker, in order to get sane mode definitions.
1.0a1 (2010-06-06)
- Initial release