/forum/site_media/js/wym/wymeditor/plugins/resizable/readme.txt

  1
  2
  3resizable plugin for WYMeditor
  4##############################
  5
  6The ``resizable`` plugin for WYMeditor_ enables vertical resizing of the
  7editor area. The plugin is based on the jQuery UI library.
  8
  9Requirements
 10============
 11The following packages are required for using the WYMeditor ``resizable``
 12plugin:
 13
 14* jQuery (tested with jQuery ``jquery-1.2.4a.js`` from ``jquery.ui`` package)
 15* WYMeditor SVN trunk (Revision: 482)
 16* jQuery-UI (tested with ``jquery.ui-1.5b2``)
 17
 18It should be possible to use this plugin with ``WYMeditor-0.4`` but I have not
 19tried.
 20
 21Download
 22========
 23You can download the WYMeditor ``resizable`` plugin here:
 24
 25* wymeditor-resizable-plugin-0.2.tgz_
 26* wymeditor-resizable-plugin-0.1.tgz_ 
 27
 28See the Changelog_ for more infos about the releases.
 29
 30.. _wymeditor-resizable-plugin-0.2.tgz: http://pyjax.net/download/wymeditor-resizable-plugin-0.2.tgz
 31.. _wymeditor-resizable-plugin-0.1.tgz: http://pyjax.net/download/wymeditor-resizable-plugin-0.1.tgz
 32
 33Installation
 34============
 35Just extract the downloaded archive into your WYMeditor's ``plugin``
 36directory.
 37
 38Usage
 39=====
 40For general instructions on WYMeditor plugins please refer to the `WYMeditor
 41plugin page`_.
 42
 43To use the ``resizable`` plugin simply include the plugin's JavaScript file in
 44your code. You **do not** need to include the jQuery UI files - this is done
 45automatically by the plugin (see `Internals`_)::
 46
 47    <script type="text/javascript"
 48            src="/js/wymeditor/plugins/resizable/jquery.wymeditor.resizable.js">
 49    </script>
 50
 51Make sure to adjust the ``src`` attribute to your needs, then initialize the
 52plugin in WYMeditor's ``postInit`` function::
 53
 54    wymeditor({postInit: function(wym) {
 55                            wym.hovertools(); // other plugins...
 56                            wym.resizable({handles: "s,e",
 57                                           maxHeight: 600});
 58                         }
 59               })
 60
 61The ``resizable`` plugin takes exactly one parameter, which is an object literal
 62containing the options of the plugin. The WYMeditor ``resizable`` plugin
 63supports all options of the jQuery UI ``resizable`` plugin. These are the
 64default values used by the plugin::
 65
 66    handles: "s,e,se",
 67    minHeight: 250,
 68    maxHeight: 600
 69
 70See the `jQuery UI resizable plugin docs`_ for a list of all options.
 71
 72That's it! You are now able to resize the WYMeditor vertically, horizontally or
 73both, depending on your options.
 74
 75..  _jQuery UI resizable plugin docs: http://docs.jquery.com/UI/Resizables
 76
 77Internals
 78=========
 79The plugin takes care of loading the necessary jQuery UI files (``base`` and
 80``resizable``) from the same path the jQuery library was loaded. Here's how
 81it's done::
 82
 83    // Get the jQuery path from the editor, stripping away the jQuery file.
 84    // see http://www.oreilly.com/catalog/regex/chapter/ch04.html
 85    // The match result array contains the path and the filename.
 86    var jQueryPath = wym.computeJqueryPath().match(/^(.*)\/(.*)$/)[1];
 87
 88    // Make an array of the external JavaScript files required by the plugin.
 89    var jQueryPlugins = [jQueryPath + '/ui.base.js',
 90                         jQueryPath + '/ui.resizable.js'];
 91    
 92    // First get the jQuery UI base file
 93    $.getScript(jQueryPlugins[0]);
 94
 95    // Get the jQuery UI resizeable plugin and then init the wymeditor resizable
 96    // plugin. It is import to do the initialisation after loading the    
 97    // necessary jQuery UI files has finished, otherwise the "resizable" method
 98    // would not be available.
 99    $.getScript(jQueryPlugins[1], function() {     
100        jQuery(wym._box).resizable(final_options);
101    });
102
103An alternative approach would be to use an AJAX queue when getting the script
104files to ensure that all jQuery files are loaded before the initialisation code
105of the plugin is executed. There is an `jQuery AJAX queue plugin`_ which does
106that. 
107
108.. _jQuery AJAX queue plugin: http://plugins.jquery.com/project/ajaxqueue
109
110Changelog
111=========
112
1130.2
114---
115- Added full support for all jQuery UI resizable plugin options.
116- Refactored and documented code.
117- Now contains a packed version (775 bytes).
118
1190.1
120---
121- Initial release.
122
123.. _WYMeditor:              http://www.wymeditor.org/
124.. _WYMeditor plugin page:  http://trac.wymeditor.org/trac/wiki/0.4/Plugins