I think the resize plugin is not getting all of the javascript files it needs to make it's window resizable.
specifically
/sites/all/libraries/wymeditor/wymeditor/plugins/resizable/jquery.wymeditor.resizable.js
The wymeditor read me states in
library/wymeditor/README

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"
            src="/js/wymeditor/plugins/resizable/jquery.wymeditor.resizable.js">
    </script>

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});
                         }
               })

Items are set correctly as far as I can tell in the HTML.

 <label for="edit-field-ann-body-0-value">Body: </label>
 <textarea cols="60" rows="20" name="field_ann_body[0][value]" id="edit-field-ann-body-0-value"  class="form-textarea"></textarea>
</div>
<fieldset class=" collapsible collapsed"><legend>Input format</legend><div class="form-item" id="edit-field-ann-body-0-format-1-1-wrapper">
 <label class="option" for="edit-field-ann-body-0-format-1-1"><input type="radio" id="edit-field-ann-body-0-format-1-1" name="field_ann_body[0][format]" value="1"   class="form-radio wysiwyg wysiwyg-format-1 wysiwyg-editor-none wysiwyg-field-edit-field-ann-body-0-value wysiwyg-status-1 wysiwyg-toggle-1 wysiwyg-resizable-1" /> Filtered HTML</label>
 <div class="description"><ul class="tips"><li>Web page addresses and e-mail addresses turn into links automatically.</li><li>Allowed HTML tags: &lt;a&gt; &lt;em&gt; &lt;strong&gt; &lt;cite&gt; &lt;code&gt; &lt;ul&gt; &lt;ol&gt; &lt;li&gt; &lt;dl&gt; &lt;dt&gt; &lt;dd&gt;</li><li>Lines and paragraphs break automatically.</li></ul></div>
</div>
<div class="form-item" id="edit-field-ann-body-0-format-2-1-wrapper">
 <label class="option" for="edit-field-ann-body-0-format-2-1"><input type="radio" id="edit-field-ann-body-0-format-2-1" name="field_ann_body[0][format]" value="2"   class="form-radio wysiwyg wysiwyg-format-2 wysiwyg-editor-none wysiwyg-field-edit-field-ann-body-0-value wysiwyg-status-1 wysiwyg-toggle-1 wysiwyg-resizable-1" /> Full HTML</label>
 <div class="description"><ul class="tips"><li>Web page addresses and e-mail addresses turn into links automatically.</li><li>Lines and paragraphs break automatically.</li></ul></div>
</div>
<div class="form-item" id="edit-field-ann-body-0-format-3-1-wrapper">
 <label class="option" for="edit-field-ann-body-0-format-3-1"><input type="radio" id="edit-field-ann-body-0-format-3-1" name="field_ann_body[0][format]" value="3"  checked="checked"  class="form-radio wysiwyg wysiwyg-format-3 wysiwyg-editor-wymeditor wysiwyg-field-edit-field-ann-body-0-value wysiwyg-status-1 wysiwyg-toggle-1 wysiwyg-resizable-1" /> Simple</label>

This is the javascript files in the head

<script type="text/javascript" src="/sites/all/libraries/wymeditor/wymeditor/jquery.wymeditor.min.js?k"></script>
<script type="text/javascript" src="/sites/all/modules/wysiwyg/editors/js/wymeditor.js?k"></script>
<script type="text/javascript" src="/sites/all/modules/wysiwyg/editors/js/none.js?k"></script>

Attached is my settings for WYMeditor:
http://drupal.org/files/WYMeditor.gif

Also the path bar does not show but I might need to make that a different post. I will report more as I look at it. I thought it would be a good idea to report it though.

CommentFileSizeAuthor
WYMeditor.gif17.16 KBmikeybusiness
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

TwoD’s picture

Title: WYMeditor - Not Resizable when set in wysiwyg prefs » WYMeditor: Add support for native plugins
Version: 6.x-2.0-alpha1 » 6.x-2.x-dev
Category: bug » feature
Priority: Minor » Normal
Status: Active » Postponed

I'm sorry but our WYMeditor implementation does not yet support plugins at all. The interest for this editor has been relatively low so other things have been prioritized as plugin initialization is handled a bit different than in most other editors. One of the major obstacles in doing this is that WYMeditor requires function references for some of its settings. We can't create or pass JavaScript function references on the server, where all settings are generated, both because PHP and JavaScript can't reference each other, and because of limitations in drupal_add_js().

I'll turn this into a feature request for adding plugin support for WYMeditor. It'll be postponed for now, but anyone may create patches if they have time to do so.

The settings you see on the profile page are a leftover from when this module only supported TinyMCE and we currently do not have a way to remove the irrelevant ones, or add new ones, separately for each editor yet. That part will be fixed with: #313497: Allow configuration of advanced editor settings for Wysiwyg 3.x.

mikeybusiness’s picture

I see. Thanks for the nice reply. The re-size feature is really the only aspect keeping me from using it for end users. It has a nice visual aid for showing you the structure of the copy as you type. The code it creates seems clean and that visual aid is a step toward dummy-proof. Then again I have not used it on a production site. My users always find ways to make something not work right. :) - Thanks again.

MXT’s picture

Subscribing: I need this new feature too.

I tried several editors, but I think WYMeditor is a very nice tool: it produces very clean XHTML strict code (the code can't be contaminated by visual informations like font styles and weights, borders, colors, ...), very easy to use for the end user (he can do just only what have to do without the risk to degenerates visually and on the code quality) for very cleaned resulting end-user generated web pages.

Thank you!

MXT

(always sorry for my bad english)

jennifer.chang’s picture

Status: Postponed » Active

I am also very interested in WYMeditor.

Integrating ALL the editors into a single wysiwyg module seems to be backfiring. Wouldn't wymeditor users be better served with a dedicated module? (All the module dependencies seem an overkill).

wymeditor is my only choice for editor, and what prevents me from using it fully is that I have not yet found a way to add my custom buttons and plugins. Has anyone managed to do so?

Also, could you clarify what you mean by " limitations in drupal_add_js()"?

What would be the way to have *full* wymeditor support, with native + custom plugins and buttons.

timd.mackey’s picture

I really want to be able to use WYMeditor with drupal as well. Until WYSIWYG has support for WYMeditor plugins, WYMeditor is severely crippled. Is there any possibility that this will be added?

TwoD’s picture

Status: Active » Postponed

(All the module dependencies seem an overkill)
Wysiwyg module currently has no dependencies.

Also, could you clarify what you mean by " limitations in drupal_add_js()"?
drupal_add_js() can not convert PHP Regular expressions, functions or function references to their JavaScript equivalents. I've got a workaround which I intend to implement as part of #313497: Allow configuration of advanced editor settings.
As long as your custom button definitions do not require custom JavaScript functions, you can implement hook_wysiwyg_editor_settings_alter() and add them there. When the above issue is fixed, we'll have a good base for creating a GUI for this and adding better support for WYMeditor customizations.

John Pitcairn’s picture

Subscribe.

WYMeditor is the best I've found so far if I want clean markup and don't want all the "extras" that other editors support (ie impose on me). I'm currently looking at updating to WYMeditor 0.5rc2.

Thanks for the tip on hook_wysiwyg_settings_alter(), I'll look at that - I had being adding a custom js file which altered Drupal.settings.

gerlos’s picture

Subscribe.

I like this editor too, it's exactly what I need on my website, but it's a pity that my users can't resize the textarea when using it!
Please, add this feature!

rv0’s picture

subscribe..

i really like WYMeditor too

timd.mackey’s picture

Status: Postponed » Active

I hope someone with a good knowledge of Javascript and Drupal module development comes along and writes a patch for this, because I really want to have a proper implementation of WYMEditor on my site! What I have now is kind of a hack and doesn't work very well.

I don't know why the original WYMEditor module was ever abandoned, because this module certainly isn't a replacement as is claimed on the WYMEditor module page.

kabojnk’s picture

Since so many people are subscribed to this, I thought I'd post my workaround for WYMeditor. This isn't beautiful, but it's not necessarily ugly either. The best part is it's probably the friendliest solution that doesn't involve patching WYSIWYG. I should also add that this solution was programmed for Drupal 7, but it should be easy enough to backport to D6.

I don't like hacking third-party modules, so what i did was made my own module. It's relatively simple, too, for what I need:

In my th_utils.module:

function th_utils_form_alter(&$form, &$form_state, $form_id) {

	if (arg(0) == 'node' && ((arg(1) == 'add' && strlen(arg(2)) > 0) || arg(2) == 'edit')) {
		drupal_add_js('/sites/all/modules/custom/th_utils/scripts/wymeditor-alter.js', array('type' => 'file', 'scope' => 'footer', 'weight' => 5));
	}
}

Note: I only needed to use WYMeditor on node add/edit forms--obviously you can change the hook to fit when you need the script loaded. Also, notice that in the drupal_add_js() comments that I have the script loading at the footer, with a weight of 5, which makes the script load after wysiwyg.js. Loading the wymeditor-alter.js file after wysiwyg.js

The Javascript file is essentially an altered copy of wymeditor.js found in /editors inside the WYSIWYG module directory.
In my wymeditor-alter.js file:

(function ($) {
		
	delete Drupal.wysiwyg.editor.attach.wymeditor;
	delete Drupal.wysiwyg.editor.detach.wymeditor;
	delete Drupal.wysiwyg.editor.instance.wymeditor;
		
	//console.log(Drupal.wysiwyg.editor.attach.wymeditor);
	Drupal.wysiwyg.editor.attach.wymeditor = function (context, params, settings) {
		
		
		
		// Prepend basePath to wymPath.
	  settings.wymPath = settings.basePath + settings.wymPath;  

		// recreate postInit method
		settings.postInit = function(instance) {
			$(instance._doc).focus(function () {
	      Drupal.wysiwyg.activeId = params.field;
	    });
			
			//construct the button's html
			            var html = "<li class='wym_tools_newbutton'>"
			                     + "<a name='NewButton' href='#'"
			                     + " style='background-image:"
			                     + " url(../wymeditor/skins/default/icons.png)'>"
			                     + "Do something"
			                     + "</a></li>";

			            //add the button to the tools box
			            jQuery(instance._box)
			            .find(instance._options.toolsSelector + instance._options.toolsListSelector)
			            .append(html);

			            //handle click event
			            jQuery(instance._box)
			            .find('li.wym_tools_newbutton a').click(function() {
											alert("TEST");
			                //do something
			                instance.paste('Lorem ipsum dolor sit amet, consectetuer adipiscing elit.');
			                return(false);
			            });
			
			
			console.log("postInit() has run");
		};

	  // Attach editor.
	  $('#' + params.field).wymeditor(settings);
	};

	/**
	 * Detach a single or all editors.
	 */
	Drupal.wysiwyg.editor.detach.wymeditor = function (context, params) {
	  if (typeof params != 'undefined') {
	    var $field = $('#' + params.field);
	    var index = $field.data(WYMeditor.WYM_INDEX);
	    if (typeof index != 'undefined') {
	      var instance = WYMeditor.INSTANCES[index];
	      instance.update();
	      $(instance._box).remove();
	      $(instance._element).show();
	      delete instance;
	    }
	    $field.show();
	  }
	  else {
	    jQuery.each(WYMeditor.INSTANCES, function () {
	      this.update();
	      $(this._box).remove();
	      $(this._element).show();
	      delete this;
	    });
	  }
	};

	Drupal.wysiwyg.editor.instance.wymeditor = {
	  insert: function (content) {
	    var $field = $('#' + this.field);
	    var index = $field.data(WYMeditor.WYM_INDEX);
	    if (typeof index != 'undefined') {
	      var instance = WYMeditor.INSTANCES[index];
	      instance.insert(content);
	    }
	  }
	};
})(jQuery);

I don't believe it's necessary to redefine all of the functions (much of this stuff was trial-and-error), but the most important one to look at is Drupal.wysiwyg.editor.attach.wymeditor(). If you notice in there, there's a function called postInit()... this is where you can add your plugins and such. In this case, I added a custom button to my toolbar.

So, this way you can have your own custom module that utilizes WYMeditor native plugins and extras without having to worry about problems upgrading WYSIWYG in the future. If the wymeditor.js file ever changes in future versions, simply just paste it into your custom module's wymeditor-alter.js file and make the appropriate changes again.

ben.denham’s picture

#11 works perfectly.

We have used it to enable the WYMeditor resizable plugin on our Drupal 7 site.

The only modifications required to use the module to enable the resizable plugin were:

  1. Including the resizable plugin JS file in th_utils_form_alter. I also made both urls relative (by removing the first "/"):
    drupal_add_js('sites/all/modules/custom/jh_utils/scripts/wymeditor-alter.js', array('type' => 'file', 'scope' => 'footer', 'weight' => 5));
    drupal_add_js('sites/all/libraries/wymeditor/wymeditor/plugins/resizable/jquery.wymeditor.resizable.js', array('type' => 'file', 'scope' => 'header', 'weight' => 5));
  2. Placing the following JavaScript in the PostInit function:
    instance.resizable();

Thanks kabojnk!