1. Alejandro Núñez Liz
  2. django-cms-mycmsproject-toporojo


django-cms-mycmsproject-toporojo / cms / static / cms / wymeditor / plugins / resizable / readme.txt

resizable plugin for WYMeditor

The ``resizable`` plugin for WYMeditor_ enables vertical resizing of the
editor area. The plugin is based on the jQuery UI library.

The following packages are required for using the WYMeditor ``resizable``

* jQuery (tested with jQuery ``jquery-1.2.4a.js`` from ``jquery.ui`` package)
* WYMeditor SVN trunk (Revision: 482)
* jQuery-UI (tested with ``jquery.ui-1.5b2``)

It should be possible to use this plugin with ``WYMeditor-0.4`` but I have not

You can download the WYMeditor ``resizable`` plugin here:

* wymeditor-resizable-plugin-0.2.tgz_
* wymeditor-resizable-plugin-0.1.tgz_ 

See the Changelog_ for more infos about the releases.

.. _wymeditor-resizable-plugin-0.2.tgz: http://pyjax.net/download/wymeditor-resizable-plugin-0.2.tgz
.. _wymeditor-resizable-plugin-0.1.tgz: http://pyjax.net/download/wymeditor-resizable-plugin-0.1.tgz

Just extract the downloaded archive into your WYMeditor's ``plugin``

For general instructions on WYMeditor plugins please refer to the `WYMeditor
plugin page`_.

To use the ``resizable`` plugin simply include the plugin's JavaScript file in
your code. You **do not** need to include the jQuery UI files - this is done
automatically by the plugin (see `Internals`_)::

    <script type="text/javascript"

Make sure to adjust the ``src`` attribute to your needs, then initialize the
plugin in WYMeditor's ``postInit`` function::

    wymeditor({postInit: function(wym) {
                            wym.hovertools(); // other plugins...
                            wym.resizable({handles: "s,e",
                                           maxHeight: 600});

The ``resizable`` plugin takes exactly one parameter, which is an object literal
containing the options of the plugin. The WYMeditor ``resizable`` plugin
supports all options of the jQuery UI ``resizable`` plugin. These are the
default values used by the plugin::

    handles: "s,e,se",
    minHeight: 250,
    maxHeight: 600

See the `jQuery UI resizable plugin docs`_ for a list of all options.

That's it! You are now able to resize the WYMeditor vertically, horizontally or
both, depending on your options.

..  _jQuery UI resizable plugin docs: http://docs.jquery.com/UI/Resizables

The plugin takes care of loading the necessary jQuery UI files (``base`` and
``resizable``) from the same path the jQuery library was loaded. Here's how
it's done::

    // Get the jQuery path from the editor, stripping away the jQuery file.
    // see http://www.oreilly.com/catalog/regex/chapter/ch04.html
    // The match result array contains the path and the filename.
    var jQueryPath = wym.computeJqueryPath().match(/^(.*)\/(.*)$/)[1];

    // Make an array of the external JavaScript files required by the plugin.
    var jQueryPlugins = [jQueryPath + '/ui.base.js',
                         jQueryPath + '/ui.resizable.js'];
    // First get the jQuery UI base file

    // Get the jQuery UI resizeable plugin and then init the wymeditor resizable
    // plugin. It is import to do the initialisation after loading the    
    // necessary jQuery UI files has finished, otherwise the "resizable" method
    // would not be available.
    $.getScript(jQueryPlugins[1], function() {     

An alternative approach would be to use an AJAX queue when getting the script
files to ensure that all jQuery files are loaded before the initialisation code
of the plugin is executed. There is an `jQuery AJAX queue plugin`_ which does

.. _jQuery AJAX queue plugin: http://plugins.jquery.com/project/ajaxqueue


- Added full support for all jQuery UI resizable plugin options.
- Refactored and documented code.
- Now contains a packed version (775 bytes).

- Initial release.

.. _WYMeditor:              http://www.wymeditor.org/
.. _WYMeditor plugin page:  http://trac.wymeditor.org/trac/wiki/0.4/Plugins