IMCE_Wysiwyg API bridge module

The purpose of the Wysiwyg (Editor) project is to provide an API for module developers. Module developers are encouraged to use and code against this API, for example by implementing hook_wysiwyg_plugin(). Of course, there is always room for API improvements if something cannot be done with the current system.

Examples of hook_wysiwyg_plugin() can be found in wysiwyg_editor's module code, in #152046: hook_wysiwyg_plugin(), and in various other issues on drupal.org.

Moving over to IMCE queue.

Following-up on http://drupal.org/node/287321#comment-942961

In above mentioned thread, quicksketch already developed a method that replaces TinyMCE's built-in image file browser with the one from IMCE. However, initialization of this happened inside of tinymce.module, resp. wysiwyg_editor.module, which is discouraged. Wysiwyg Editor not only provides hook_wysiwyg_plugin() now, but also initializes the editor almost completely through jQuery.

I never worked with IMCE (because I'm the maintainer of Image Assist), but it seems like IMCE only needs to add a custom editor configuration setting to the init array (which might need an API enhancement of hook_wysiwyg_plugin(); not sure) and needs to load an external JavaScript [function] (which might need to be turned into a real editor plugin script). I don't know whether that phptemplate function is still necessary then.

subscribing

Better title.

subscribing, might be helping work this out soon

After reviewing quicksketch's patch once more, this should be quite trivial.

1) Implement hook_wysiwyg_plugin() to change TinyMCE's init configuration
2) In hook_wysiwyg_plugin(), load a JavaScript file using drupal_add_js() that contains the required function.
3) Done. :)

Following sun's advice in comment#7 I made a patch file for IMCE integration in Wysiwig API for the stable version 6.x-1.1 of IMCE. To apply this patch please copy the patch file into your site's contributed module directory (path should be something like [path-to-your-site]/sites/all/modules ) and start patching with patch -p0 < imce-287025-8.patch

Additionally this patch sets the tinymce option inline_styles to TRUE to make the editor output more XHTML strict compatible. Please delete the line 'inline_styles' => TRUE, from the options array if you don't want to use this option setting.

To make inline_styles work with Wysiwyg Editor and tinymce you have to modify the 'extended_valid_elements' array of the advimage plugin in wysiwyg_editor.plugins.inc of 6.x-0.3 release of Wysiwig API. I attach a second patch file for this modification. (Though it would be more comfortable to replace this hardcoded setting with a configuration setting somewhere in the administrative interface of the Wysiwig API). Again the 2nd patch has to be applied from your site's contributed module directory.

Any chance of submitting the patch for 5.x as well? Thanks.

There is almost no difference in Wysiwyg API for 5.x and 6.x. So at least the API implementation should work identically. Sorry, cannot speak for IMCE.

Sorry I have no Drupal site with Wysiwig API running this time and I don't know the differences between IMCE 5.x and 6.x. But you can try to add following function to the end of imce.module:

/**
 * Implementation of hook_wysiwyg_plugin().
 */
function imce_wysiwyg_plugin($editor) {
  static $access, $integrated;

  switch ($editor) {
    case 'tinymce':
      if (!isset($access)) {
        $access = function_exists('imce_access') && imce_access();
      }
      if ($access) {
        $result = array(
          'imce' => array(
            'path' => drupal_get_path('module', 'imce') .'/unknown',
            'extensions' => array('imce' => t('IMCE')),
            'url' => 'http://drupal.org/project/imce',
            'options' => array(
              'file_browser_callback' => 'imceImageBrowser',
              'inline_styles' => TRUE,
            ),
            'internal' => FALSE,
            'load' => TRUE,
          ),
        );
        if (!isset($integrated)) {
          $integrated = TRUE;
          drupal_add_js("function imceImageBrowser(fid, url, type, win) {win.open(Drupal.settings.basePath +'?q=imce&app=TinyMCE|url@'+ fid, '', 'width=760,height=560,resizable=1');}", 'inline');
        }
        return $result;
      }
  }
}

If imce_access() is defined in imce.module, then

$access = function_exists('imce_access') && imce_access();

is not required. Simply call the function instead. If not, use module_invoke('imce', 'access'); instead.

This looks strange:

  'path' => drupal_get_path('module', 'imce') .'/unknown',

and should probably have been:

  'path' => drupal_get_path('module', 'imce'),

(or leave it out at all).

This is not required, remove it:

  'internal' => FALSE,

Last, but not least, you want to move this function into a separate JavaScript file (or add to an existing one):

drupal_add_js("function imceImageBrowser(fid, url, type, win) {win.open(Drupal.settings.basePath +'?q=imce&app=TinyMCE|url@'+ fid, '', 'width=760,height=560,resizable=1');}", 'inline');

and remove $integrated instead.

I cleanup up the code of the patch following most of sun's comments above. I did not move the javascript function into a separate new or existing javascript file, because I think this decision should be made by the IMCE module developer ufku. I attach the modified patch for IMCE version 6.x-1.1 as file imce-287025-13.patch.

Sorry, I forgot setting issue status to patch (code needs review)

I have just tried the patch in 5.x. The filebrowser icon does appear when adding an image, but I have no way of selecting an image, whether I click on an image or not on the imce window it makes no difference at all on tinymce, any ideas?

I can't even add the image at all using IMCE inline link if tinymce is enabled.

The only thing I'have made to make it 5.x so far was to change

       $access = imce_access();

to

       $access = user_access('access imce');

as imce_access() does not exist in imce 5.x

I just firebuged the script and I get the following when I click on the image:

uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMNSHTMLTextAreaElement.selectionStart]" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame :: /sites/all/modules/imce/imce_set_inline.js :: imceInsertAtCursor :: line 32" data: no]

I fixed my previous error, basically from what I saw of brahms' patch, the popup does work but it does not properly fill the tinymce image dialog and closing itself properly when the image is selected. If you refer to imce_set_tinymce.js you can see that it also sets up some imce* variables that are used in imce_browser.js. I guess that you can copy the code from there and try it out, what I end up doing was using your code for the wyswyg plugin but instead of adding the inline js, I modified the imce_set_tinymce.js function a little bit and have it included in the _plugin() hook.

My intention was to leave, until the developer of this module reviews it, a patch that would leave the module working for both tinymce and wysiwyg module. I am attaching the patch which is against 5.x, not sure if I should open another issue for that version, but the idea is just the same. I am using some JS settings as well.

Better title.

subscribage

@brahms patch in #13 works great. thanks for putting it together.

Patch #13 works fine for me. Testing with IMCE 6.x-1.1 and Wysiwyg 6.x-1.x-dev (2008-Nov-04), it works with links and images. Great work.

Well, to be honest I'd trust the patch tool more than humans when it comes to patching... knowing how many times I made stupid mistakes when I patched manually ;)

Hanoii's patch in #17 is working for me with Drupal 5. Thanks!

Patch #17 works, but there is 404 error looking for /sites/all/modules/wysiwyg/tinymce/jscripts/tiny_mce/plugins/imce/editor_plugin.js?

Cleaned-up some parts of the latest patch.

To prevent the 404 error, you also need to apply the patch in #341267: Add support for extensions that do not need to be loaded for Wysiwyg.

subscribing

subscribing

Hello. I tried patching using #13's solution but I probably didn't do it right. I have Drupal version 6.6 and imce version 6.x-1.1. I used Aptana to patch the imce.module file but it usually caused the site to whitescreen so I would have to go in and add a closing bracket at the end of the file. Once that was done though, the button didn't show up. So I don't know if it is because I didn't patch right or the patch just doesn't work. Can someone post a patched version of the imce.module file so I can test it? Or is that bad for some reason?

After getting over the initial hurdle of actually installing a patch, I'm pleased to report that I have applied this patch (and #341267) and it works with IMCE perfectly.

Thanks.

FYI: #341267: Add support for extensions that do not need to be loaded has been committed. So only #29 is required for IMCE module 5.x. Someone should port this patch to 6.x.

Did you enable the IMCE button in the WYSIWYG profile page? It's there as an option along with the other TinyMCE buttons in the 'buttons and plugins' fieldset. Once I enabled that the 'browse' button shows up on the TinyMCE image and link pop-ups.

Patch #13 working for me with Drupal 6.6, IMCE 6.x-1.1, WYSIWYG API 6.x-1.x.dev from 17th November.

Even if #13 is working, #29 is the proper approach and way to implement this.

I just patched and I now see the button for IMCE in the image popup, but when I click on it I get:

Error: imceBrowserURL is not defined
Source File: http://www.***.com/sites/***.com/modules/imce/imce_set_tinymce.js
Line: 22

What's funny is I do see the script being included in the page:

script type="text/javascript" src="/sites/***.com/modules/imce/imce_set_tinymce.js"

---

UPDATE: this WAS a problem with a badly applied patch... went through and double-checked, and the original window.open line 22 wasn't removed from imce_set_tinymce.js, hence the error. All fixed now.

Here is a 6.x branch patch based on sun's patch in #29. There was no corresponding helper function like imceImageBrowser in the 6.x branch, so I added it back in (it is now no longer TinyMCE specific and so can be part of imce_set_app.js and a generic helper or callback function).

Tested patch in #38 with IMCE 6.x-1.1. Works fine.

Tested patch in #38. Does not work for new image insert. Gives a HTTP ERROR as soon as the following url is opened (if one want to add a new file):
http://localhost/ken/imce&app=editor|url@src

Javscript Error:
imce is not defined
imce_set_app.js?j()()imce_set_app.js?j (Linie 8)
imce.hooks.load.push(function(win) { }

It seems that there is no imce instance. Any ideas?

Applied patch in #38 in Drupal 6.6 and TinyTinyMCE 6.x-1.10. No image browse button.
May be unrelated, but I see a page not found error of "path/to/your/sites/stylesheet.css"

@Rick - did you add both the image and imce buttons in the WYSIWYG configuration, and also set the correct user permissions in the IMCE config?

Applied the patch in #38 and it works, thanks!

All fixed on this end. Patch wasn't necessary. Unfortunately, I tried so many things and it's been a couple of days that I don't remember how I fixed it. If someone out there could use this info, I can go back and re-trace my steps and post my solution.

subscribing...

+1 for the patch #29 above, works fine here on D5.x too. Much needed, *thank you*

I used #38 for Drupal 6 and all is well as far as I can tell.

Reviewed and tested #38. +1

Patch in #38 did the trick for me (Drupal 6.6, IMCE 6.x-1.1, WYSIWYG 6.x-0.5 using TinyMCE 3.2.1.1). Thanks!

Patch #38 works well for me.

Drupal 6.8, IMCE 6.x-1.1, Wysiwyg API 6.x-0.5 using TinyMCE

Patch #29 worked well for me too (Drupal 5). Commit? Happy New Year, everyone.

Confirming #38 patch works. Commit?!

I can also confirm #38 patch works.
For newbies. IMCE needs now to be enabled at Wysiwyg profile --> Buttons and plugins, like any other tinymce plugin.

+1 for getting this committed

The project page says the developer is away until 2009, so I would suggest applying these patches yourselves for now. If someone has time to ping the other developers listed at http://drupal.org/project/developers/79477 one of them may be interested in committing it, but otherwise I don't think more +1s really add anything but noise :)

Sadly, only ufku has CVS access. The other "developers" listed there are only people who committed translations. So we have to wait.

Patch from #38 works perfectly for me, using Drupal 6.8, IMCE 6.x-1.1, Wysiwyg API 6.x-0.5 and TinyMCE 3.2.1.1

(subscribing)

I get the same error as #40 and I can't figure out what I might be doing different...

My setup: Drupal 6.8, IMCE 6.x-1.1, Wysiwyg API 6.x-0.5 using TinyMCE.

This patch fixes the issue in #40/#59 (which didn't seem to break anything on some browsers, but was ugly no-less).

Hi Grugnog2,

I applied this new patch, but it didn't fix the problem I am having.

The other day I was messing with the imce_set_app.js file to find out where the problem could be and I erased the '|url@' part of the code.

This way, when I click the button I am able to access the editor browser page. So, when I select a file from the browser I have an option to send it to "editorsrc" (not sure if this is right). I click that and the browser page is closed as I'd expect, but nothing is sent to the imce popup dialog box -probably because there are no URLs defined now.

I am not a coder really but perhaps this shows that the problem is with how the "url@" part of the code works?

Thanks.

Tried both patch from #60 and #38. They cause TinyMCE to not have any of it's icons. Uncheck IMCE in buttons and plugins and I get all the TinyMCE icons back. Firefox 3.0.5, Drupal 6.8, TimyMCE 3.2.1.1, and IMCE 6.x-1.1.

subscribing

I will buy beer/coffee to whomever can figure out what my problem (#59) can be.
I will also remember him/her when I get my first round of funding :p

I've gotten the latest WYSIWYG and IMCE working without a glitch. Trying installing the modules with those privded in the attached zip. Remember to fully uninstall your existing installations (which clears the existing database tables) first to make sure you won't encounter any errors after install. You will have to reconfigure everything. Let me know if it works.

Note that I use the latest TinyMCE version so all the TinyMCE files are already included in this attachemet. Many other goodie plugins for TinyMCE that didn't come in the original such as Media, Drupalbreak (working version), Spellchecker (working version) are also included and they all work for me without a glitch.

Another note is that the best browser to use WYSIWYG+TinyMCE is FireFox. Others may give erratic or unpredictable behavior.

Yes I know, this is NOT a patch but I hope it'll perhaps help someone come up with pinpointing the problem in their code or setup.

Beer >> coffee :)

---
Like what you see? Leave a tip!
spiffy[d] | simplicity is bliss

Spiffyd, I looked into the key files (like imce.module and imce_set_app.js), compared my versions to them and they are the same. It must be something about my local setup -I guess- that doesn't get it to work for me.

Anyway, I had been using the #38 (and #60) patch all along, so this time I tried the previous patch at #13. It seems to work without a problem.

Concerning error described in #40
imce_set_app.js depends on imce.js and in my install, it is not included (ver 0.5).
i modified the imce_wysiwyg_plugin function to include imce.js as well

drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce.js');
drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce_set_app.js');

@picco - this is what my updated patch in #60 does. Can you please retest that patch and RTBC if appropriate?

Tested patch #60 successfully.

Running:
Drupal 6.8 (of course, need to apply security update 6.9 and then test again)
Wysiwyg API 6.x-0.5
IMCE 6.x-1.1

Patch 60 seems to work well.

I'm considering to grant me temporary CVS access for IMCE until the maintainer is available again. However, I need a broad consensus for this action. Ideally, let's discuss in #drupal.

I thought I did something wrong with the patch. But I just found out that I forgot to enable the button (IMCE) in WYSIWYG module (admin/settings/wysiwyg/).

Now it works perfect to me.

Thanks for the patch - it sounds like "the" solution for me.

Since I am new here, I am getting a bit confused on of to patch that file on a windows environment.

Do you know a way of patching files for windows?

hi all,
i had to be away for a while and it seems i'll have to deal with lots of issues in the following days.

For this issue, after a quick review i can say that the 5.x patch is not RTBC because it still uses the old dirty method for integration. The hackish method(imceInitiateTinyMCE) is to find all tinymce instances in the page after page-load and change the file_browser settings. This method fails for dynamically loaded instances.
For a proper integration all instances must be loaded with the file_browser_callback property set already. The rest is to have the callback function in the page(inline or in a script file).

For 6.x i don't plan to include any editor specific code in IMCE. There is a generic integration method for any web application. IMO, WYSIWYG API integration should be implemented in its editor specific files and file browsers should not be considered as plugins.

I'll look into this issue further when i refresh my knowledge on the topic.

Yay, finally! :)

Wysiwyg API takes over the integration of all editors and becomes the central interaction API for Drupal modules. Because of that, Wysiwyg API cannot contain or ship with module-specific code. We have to consider filebrowsers as plugins, since IMCE/Asset/Image Assist/Imagebrowser/etc. are all available in contrib. Also, Wysiwyg API's ultimate goal is Drupal core.
btw: TinyMCE module has been officially abandoned and maintainers/developers of FCKeditor module recently joined the Wysiwyg API project.

We are currently finishing the rewrite of the new plugin API, which allows any Drupal module to expose a button for any editor, without editor-specific code. There is an 'epic' patch in Wysiwyg's queue that will probably be committed in the next days.

I agree though that the plugin registration for modules like IMCE (which rather provide an extension) is a bit different and not as fleshed out as the buttons are in the meantime. I would be open to discuss any improvements for the new plugin API.

Given the usage statistics for Wysiwyg API 5.x, there's vastly more interest in 6.x here -- reverting version.

It seems to me that wysiwyg api is becoming the sum of all editor modules with a difference that there is now inc files instead of module files. I can't imagine the issue queue of this sum of modules module when it covers all editors. Do you think this approach will make it to the core? What do others think? I was imagining the wysiwyg api as just a facilitater for other editor modules not as voltron:)

For IMCE integration i can say that there won't be editor specific code in IMCE6x as it is not designed as a plugin for any editor. It just supports extraction of file information from its UI.
In the current approach, besides plugin api i think there should be also a file browser api which may allow users choose among different file browsers for their editors and it should make the the file browsers behave the same on file info extraction.

I understand your hesitance with putting some 'editor specific' code in IMCE 6.x, but would you be open to packaging a separate module with IMCE that would hold the wysiwyg hooks and the js necessary to use with IMCE? This would be pretty trivial to package up. Seems silly to have to have a whole separate module for all 20 lines of code, but if it was packaged with IMCE that would make it a little more palatable. Maybe in a contrib folder, with the module named imce_wysiwyg.module... Thoughts?

Wysiwyg API has been designed in a similar way like Panels. All modules can provide editors, and all modules can provide plugins. This, and the input format integration, is the core-worthy part of Wysiwyg API.

However, Wysiwyg API is still young, fresh, and cool. What's available in 0.x/1.x now is just the first generation of the API. Most of the current efforts are targeting 2.x. Therefore, editor integration files are kept together in Wysiwyg API, so we can improve the API for 2.x and adapt editor integration files as quick as possible.

That said, there is a crowd of people who contribute to Wysiwyg API by giving support in the queue, and due to its state-of-the-art design, I do not expect that there will be a vast increase of issues. Also, it's me who's maintaining it ;)

If you will insist on the direction you mentioned, someone will have to write a bridge/glue-module between Wysiwyg API and IMCE. However, Image Assist will soon integrate with the new plugin API (and also the new Inline API) to make its plugin (button) available to all editors, without any editor-specific code. I do not know yet whether there is a common pattern among TinyMCE, FCKeditor & Co. for defining an alternate file browser callback. But in any case, it seems like IMCE's JavaScript would have to be loaded in the popup window or modal dialog of the corresponding editor.

A completely different consideration would be whether IMCE should/would want to expose a button, instead of trying to extending or integrate into editor-specific file browsers. Again, I'm completely open to discuss any ideas or suggestions. If you do not know already, all maintainers and developers of input format/editor/plugin-related modules are discussing most of this stuff in #drupal-wysiwyg - I would be very happy to welcome you there as well. :)

Tried patching (Drupal 6.9, WYSIWYG API 6.x-1.x-dev with TinyMCE, IMCE 6.x-1.1) from #38 and didn't work :( No browse button.

Seeing as you maintainer types seem to be working on it I'll sit and wait like everyone else ;)

subscribing.
--
Sharique uddin Ahmed Farooqui

Concerning error described in #40
I still had 403 error with patch #60 like Jaapx #72
So I try to replace

        $settings = array(
          'imce' => array(
            'url' => url('imce'),
            'appname' => t('editor'),
            'wysiwyg_module' => true,
          ),
        );
        drupal_add_js($settings, 'setting');
        drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce.js');
        drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce_set_app.js');

by
drupal_add_js("function imceImageBrowser(fid, url, type, win) {win.open(Drupal.settings.basePath +'?q=imce&app=TinyMCE|url@'+ fid, '', 'width=760,height=560,resizable=1');}", 'inline');
and It is working well now... :-)

Ps : Does anyone know about authorizing TinyMCE on the edition pane popup of Panel module ? I find this http://www.chapterthree.com/tags/panels but it is not working on me D6.

@steveoriol: Attaching/detaching editors for Panels or any other AHAH/AJAX content is #350035: Implement Drupal.detachBehaviors(). We are working on it, probably to be included in Panels 3.x.

Tried #84, still no luck :(

And when I said I patched from #38, I meant #60, of of course ;)

Hello shadowshifter, can you make sure you have enabled the button (IMCE) in WYSIWYG module (admin/settings/wysiwyg/(format)modify). <= #74

Patch from #60 applied cleanly for me to Drupal 6.5. The final step after applying the patch was simply enabling the plugin (at a screen like this: /admin/settings/wysiwyg/profile/edit/1 ).

My thanks to the contributors!

hey steveoriol, half my problem was I wasn't getting the button in the buttons and plugins. I just revisited the problem after reading your message and went and double checked (again) and it was there this time :) TinyMCE is now broken in Safari (again! It must not like IMCE as it was working fine before I finally managed to enable the button...).

Thanks for your help and everyone else for the patches! Perfect timing too, I'm about to upload the site to its dev folder to show the admin group :)

This seems a cleaner solution.
I would think about the plugin hook for IMCE if there weren't any case 'tinymce': like code.

Sorry if I did not make my point clear: Wysiwyg API will not add contrib module specific code. Maintaining and supporting all external editor libraries and improving the overall API adds enough burden to the project. Unlike the other, obsolete editor integration modules like TinyMCE or FCKeditor module, Wysiwyg API is a clean solution. All modules that want to integrate with an editor, (only) have to implement support for Wysiwyg API. If it was the other way around, Wysiwyg API would not be an API at all, and would have to implement support on behalf of all 4,000+ modules in contrib - which is impossible. This was the attempt of the previous editor integration modules and the primary cause for why Drupal + client-side content-editing sucked. We will definitely not do the same mistake again in Wysiwyg API.

Again, I would be open to discuss whether certain extensions like filebrowsers may need special treatment in the new plugin API. Currently, I am not sure about this question. If you want to, we can discuss in #drupal-wysiwyg in IRC.

I agree that IMCE is the best place for this code right now. While I understand the desire to not have to manage editor specific code for the time being it has to live somewhere and I think the "client" modules are the best place - we certainly don't want to clutter up our main API (that is aimed at core) with this. Ideally at some point we will be able to document how each of the editors handles this specific use case and figure out a generic API for "clients" to support this - but I think that is a ways off.

A pragmatic approach to the entire topic would probably be to implement support for various editors in imce_wysiwyg_plugin() to see what's needed and how it works out. Afterwards, think about possibilities for a new main entry point in the API (if required at all), based on the code in imce_wysiwyg_plugin().

subscribing -- thank you for your efforts

I manually applied the patch in #60 and it worked.

Setup:
acquia-drupal-1.2.1
wysiwyg-6.x-0.5
imce-6.x-1.1
tinymce_3_2_1_1

First I added this to imce/imce.module:

/**
 * Implementation of hook_wysiwyg_plugin().
 */
function imce_wysiwyg_plugin($editor) {
  static $integrated;
  switch ($editor) {
    case 'tinymce':
      if (!imce_access()) {
        return;
      }
      if (!isset($integrated)) {
        $integrated = TRUE;
        $settings = array(
          'imce' => array(
            'url' => url('imce'),
            'appname' => t('editor'),
            'wysiwyg_module' => true,
          ),
        );
        drupal_add_js($settings, 'setting');
        drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce.js');
        drupal_add_js(drupal_get_path('module', 'imce') .'/js/imce_set_app.js');
      }
      return array(
        'imce' => array(
          'extensions' => array('imce' => t('IMCE')),
          'url' => 'http://drupal.org/project/imce',
          'options' => array(
            'file_browser_callback' => 'imceImageBrowser',
            'inline_styles' => TRUE,
          ),
          'load' => FALSE,
        ),
      );
  }
 }

Then I added this to imce/js/imce_set_app.js:

//helper function - used as a wysiwyg callback
function imceImageBrowser(fid, url, type, win) {
  win.open(Drupal.settings.imce.url +'&app='+ Drupal.settings.imce.appname +'|url@'+ fid, '', 'width=760,height=560,resizable=1');
}

Third I edited the input format profile at Site Configuration -> Wysiwyg and enabled BOTH the Image button and the IMCE button.

That was it, as far as i can remember. Of course everything else (IMCE module, Wysiwyg module, TinyMCE editor etc) was properly installed already.

Thank you miles28 for posting #53 !! It may seem trivial to many but for most of us is not! I was about to give up! Now all seems to be working perfectly!

IMCE needs now to be enabled at Wysiwyg profile --> Buttons and plugins, like any other tinymce plugin.

Cheers!

UPDATE: Sorry but enabling the IMCE on the profile, works only on firefox... It breaks TinyMCE on IE6 : TinyMCE not loaded.

Not so cheerful anymore, since most of my users use IE6

meles: should be in the buttons and plugins, probably he last item on the table if you've patched it etc. Start with the patch from #60 and apply following ones if you encounter situations like the submitting users, otherwise the one from #60 -should- do the trick :)

chaloalvarezj: enabling IMCE breaks TinyMCE on Safari as well. I'd say they're browser bugs unfortunaely :(

UPDATE: Sorry but enabling the IMCE on the profile, works only on firefox... It breaks TinyMCE on IE6 : TinyMCE not loaded.
Confirm. TinyMCE loads in all browsers, but works only in Firefox :(

Haven't tested in IE6 but my setup (se above) works in IE7.

thank you AdrianB ! #97 worked

but I have error page not found 404 in wysiwyg/tinymce/jscripts/tiny_mce/plugins/imce/editor_plugin.js

subscribing...

Applied patch manually as per #97. Have it working only in Firefox. Nothing in Chrome and IE7 shows error: "Drupal" is undefined.

subscribing

The only patch I could make work in every browser is #13 ... and reading the other comments it's note the "good" way to make it work (but it will do until there is a real patch).

All the other patches works partially (only in Firefox) or not at all... for example #60, works for me after I modified the URL of the IMCE popup, the one in the patch gives this URL :
http://the.site.domain/imce&app=editor|url@src (which is generated with the code : Drupal.settings.imce.url +'&app='+ Drupal.settings.imce.appname +'|url@'+ fid, when the working URL is http://the.site.domain/?q=imce&app=TinyMCE|url@src (generated with : Drupal.settings.basePath +'?q=imce&app=TinyMCE|url@'+ fid). I have no idea how the other testers got it working with the first URL (I'm getting : Drupal.settings.imce is undefined), I could get it to work with the second, and then it works only in Firefox. So I'm back to #13 while trying to figure why invoking this popup from imce_set_app.js doesn't work in IE and Opera... maybe the context is not the same and the "Drupal" variable is not set (except in Firefox for some reason).

Regarding my solution at #97 (which is the patch from #60 manually applied - it's not my work):

I've tried my setup (acquia-drupal-1.2.1, wysiwyg-6.x-0.5, imce-6.x-1.1 and tinymce_3_2_1_1) and IMCE in TinyMCE works successfully in the following browser:

Safari 3 - Mac OS X
Firefox 3 - Mac OS X
Firefox 2 - Windows XP
Google Chrome 1 - Windows XP
Internet Explorer 7 - Windows XP
Internet Explorer 6 - Windows Server 2003

ok, the following worked for me:

Drupal 6.9
wysiwyg-6.x-0.5
tinyMCE 3.2.1.1
imce-6.x-1.1

and the patch from #13.

DON'T FORGET that after IMCE is installed, another option appears (an "IMCE" checkbox) on the wysiwyg config page (admin/settings/wysiwyg/profile/edit/1) under "buttons and plug-ins", this MUST be checked off! thanks muhleder (see #35)! that was driving me nuts until I saw your post.

tested successfully on Firefox 3.0.6 and IE 7.0.5730.13 on Windows XP.

question: what exactly is the difference between patches in #38 and #13? and don't be a funny and point me to a diff program :-) What I mean is, which of these is the "right" patch? or does it depend on what exact versions you have of the various components?

in an attempt to answer the above question, as a test i reversed path #13 and put in patch #38 instead... still worked in Firefox, but in IE it gives error "imce is undefined".

so #13 is the way to go, i guess?

(an aside... in IE, the textarea appears much wider when running the IMCE editor than it does when just viewing it as a plain textarea containing the HTML... in Firefox, they are the same width... anyone know why?)

Can someone please explain how I'm supposed to patch? I read all the documentation and I'm still lost.

I have putty.exe to SSH into my server, but when I use patch -p0 < 287025_0.patch, I get errors.

Where should I be putting that patch on my server, and how exactly should I patch?

It isn't really this hard, is it?

Thanks All, works for me.

On Drupal 6.9 w/:
- IMCE 6.x-1.1
- Wysiwyg API 6.x-0.5
- tinymce 3.2.1.1
- Patched w/ the patch from #13
- as noted: √ the "IMCE" checkbox on the WYSIWYG config page

I realize though that the img paths end up hardcoded w/ IMCE. As opposed to using Image Assist w/ a image filter tag.
EDIT: I 2nd #111 Grugnog2: "#60 is the correct approach"

Please note sun (the WYSIWYG module maintainer) #36 comment - the patch in #13 is not the correct approach to implementing this.

Please review #60, which is the correct approach and is extensible to allow future support for all WYSIWYG-supported editors that allow custom buttons/image-integrations with no/few additional lines of code. I suspect that most of the problems with that have been to do with Drupal in a subdirectory and/or clean URLs being disabled, so tests and fixes for these cases would be great.

BeatnikDude - Can you show me how you "patched" the module? I've read over Drupal's documentation and I'm quite lost.

Before you continue to put my name on this list, I show you how I would implement this.

Attached patch implements Wysiwyg API support for both TinyMCE and FCKeditor. Works even when switching editors on the same page. Further editors are most likely as easily implemented as those two were.

Patch is against IMCE DRUPAL-6--1, i.e. CVS. Requires the latest development snapshot of Wysiwyg API, which will be available in approx. 12 hours.

For 5.x, the implementation of hook_wysiwyg_plugin() stays the same, but IMCE 5.x might use a different invocation - didn't look into that. Anyway, should be trivial to backport.

when do you think the imce integrsation will be available with out hte patch. included in stock. I hate to use patches on stuff I want to take live.

Sorry, I thought I could clean up the code in last minute, but it turned out to be required.

@everydayjones: If you don't want to patch you can do it manually as I did at #97. Otherwise this is not the place to ask for support on how to patch.

Just tried the patch by sun in #115, and it works for me with WYSIWYG + TinyMCE (both latest, downloaded today).
It works with both 'Image' and 'Advanced image' buttons.

Restating: Patch in #115 works with Wysiwyg API 1.0. (released toyesterday - depending on your timezone) ;)

Yay, following instructions @ post #97 worked for me. Btw this is my first post here on drupal.org. I am also trying to figure how to patch stuff, but in the meantime, just coping and pasting this code worked out great.

What i'm using -
Drupal 6.9
IMCE 6.x-1.1
Wysiwyg 6.x-1.0
TinyMCE 3.2.1.1

Thanks AdrianB, sun, and everyone who was working on this.

patch at #115 works with no problem, i got all up and running in 1 minute with this patch, please commit it!

using:
Drupal 6.9
IMCE 6.x-1.1
Wysiwyg 6.x-1.0
TinyMCE 3.2.1.1

Thanks to sun for posting it ;)

Can also confirm.

patch at #115 works with no problem!

using:
Drupal 6.9
IMCE 6.x-1.1
Wysiwyg 6.x-1.0 + Wysiwyg 6.x-2.x-dev
TinyMCE 3.2.1.1

Thanks to sun for posting it ;)

Does your IMCE popup window work in FF?

Here is a screenshot: http://drupal.org/files/issues/imce_wysiwyg.jpg

The patch in comment #115 works fine for me using:

Drupal 6.9
IMCE 6.x-1.1
Wysiwyg 6.x-1.0
TinyMCE 3.2.1.1

Thanks to sun and everyone working on this issue!

On my site IMCE popup window works with FF3 and IE7.

Same setup as before, the #115 patch is working when the other (i.e. #60) were giving me error most likely due to a wrong URL generated to open the IMCE popup.

I vote for commit too ;) Thanks sun.

This patch only solves tinymce and fckeditor integration issues. What about other editors? Will there be a new patch and a new release for IMCE for each new editor that wysiwyg module starts to support?
Sorry but this is not the way to go for IMCE. This should be handled wherever the editor specif code resides already or in a separate module. For anyone who wants to go with the new module solution the integration api can be helpful.

What you say is that we'd have another module to integrate IMCE with each specific editor... But without any editor, IMCE is not really useful. I am not minimizing the importance of IMCE, I am just saying that Wysiwyg API, for exemple, offers the hooks to handle plugins, and IMCE really looks like a plugin to me (and following Drupal's core way to handle "modules", they use hooks to declare themselves, it's not the core that tries to detect them).

Since I am pretty sure that Wysiwyg API maintainers won't include this code in their module (I'm refering to your idea of putting it in the "editor specific code"...and it's totally understandable, it's not the role of an API do this) and having a new module only for this doesn't make more sense (maybe you have arguments for this solution ?), that is surely (in my opinion) why sun took this approach. Of course, you're the one to decide where IMCE should go, but I am just trying to figure where exactly this should go and the two options you offer right now seem not really convenient, but I might be wrong ;)

How many modules implement those integration api functions? (besides BUeditor, which is soon replaced by markItUp editor completely)

How many editors implement built-in file browser logic?

I can understand that IMCE suffered from countless other editor integration modules, which either provided their own integration functions or maybe even none at all. However, Wysiwyg API replaces all of them. Ultimately, without exceptions. This means you have one API to program against, requiring almost no code at all. Have a look at the size of this patch - most of it being a clean-up of README.txt. If there will be any other editor that supports file browser logic built-in, what prevents you from committing that support in 6.x-1.3 - really? I do not see a problem with doing that. It will neither break existing sites, nor will it add burden to you.

Again, if you will find a re-usable pattern for this file browser integration code, I'm happy to discuss whether parts of it could be moved into the API. However, as of now, I don't see a pattern in there.

Also, restating what I mentioned earlier: Instead of integrating with a specific file browser callback of an editor, IMCE could as well provide its own editor toolbar button as a so called "Drupal plugin" in 2.x to any editor without implementing any editor-specific code at all. However, IMCE would have to insert the proper resulting HTML code into the editor's content area then (not relying on the editor's file/image/flash dialog magic to do it).

Sorry guys but I have to say it again that this is not the way to go for IMCE. And i don't want to be involved in wysiwyg integration issues.
IMCE is not a plug-in. It's just a file browser which can be easily integrated into web applications by just calling /imce?app=theApplicationName|url@urlFieldIDofTheApplication.

As a third option, you may want to allow custom configuration for admins:
http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/file_browser_c...
http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Customization/C...

That's all I can help.

Patch worked for me. For those who don't know how to do patch

I'm using:
Drupal 6.9
IMCE 6.x-1.1
6.x-1.x-dev
tinymce_3_2_1_1_dev

For those who don't know how to do patch
download the patch from above #115

Your patching two files in the modules/imce directory imce.module and imce_set_app.js in the js directory.
Put the patch in the /modules/imce directory
In terminal type --- patch < imce-DRUPAL-6--1.wysiwyg_.patch
When asked to choose file type the path which is js/imce_set_app.js (or put this patch in the js directory and run patch again -not recommended)
Finally in Drupal Admin go to settings/wysiwyg and enable IMCE under buttons and plugins.

Good Luck!

bredi

Worked for me too!

Thanks Sun!

Trevor

You can move this wherever you want, but not into Wysiwyg API's queue. Wysiwyg API will not implement features on behalf of 4,000 other contrib modules. If your module wants to integrate with a client-side editor, then Wysiwyg API provides your module a single programming interface. A constantly increasing number of contrib modules integrates those functions, which enables users to use those modules' functionalities for content-editing.

If IMCE does not want to provide an integration for client-side content-editing, then I can only recommend one of the other modules/solutions that provide the same or similar functionality.

I'm feeling sorry for users of IMCE, but marking as won't fix, because this is what the IMCE maintainer meant in #127.

Sounds like an imce fork or replacement may be in order. Wysiwyg api is headed to core, and with the tinymce module pretty much abandoned imce is destined to become useless (except for the users of Fck) if it doesn't cooperate with wysiwyg api. It's disappointing to see such stonewalling when we should be working together.

Note that NOT implementing support for Wysiwyg API in IMCE will also lead to countless support and feature requests in IMCE's and also Wysiwyg API's issue queue. I'm marking approximately 3-4 issues per week as duplicate of this issue. The trouble will increase while this issue is marked "won't fix", because it no longer shows up in the default issue queue view.

Like previous people stated, I think this decision is wrong, because IMCE does not really make sense without an editor. Also, considering that IMCE _could_ potentially be used as file browser for the ImageField or Image Attach module (and others), expecting all those modules to implement support for IMCE, while only some users may have it installed, is nothing else than a utopian dream. From both example modules, neither ImageField nor Image Attach will implement those integration functions.

That is, because there are a bunch of other modules in contrib that provide the same or similar functionality. Consider Asset, Image Assist, ImageBrowser, etc. If modules would implement built-in support for IMCE, they would have to implement support for the other modules as well. So, the entire idea does neither work for Wysiwyg API nor any other module IMCE could be integrated with.

Sorry, I might sound harsh or arrogant here. I just don't see the actual problem of committing this simple and clean patch in #115.

I think that it is also worth noting that even if the current maintainer doesn't want to deal with bug fixes to accommodate the Wysiwyg api there is no shortage of developers who would be willing to co-maintain and post patches. If there were something in Sun's patch that interferes with the functioning of imce or would require a major rewrite then I would understand the reluctance... and if people were asking the maintainer to do the work of the integration I would also understand, but the patch is done, it has been tested and it works... what is the justification for keeping it out?

Please don't make this into a matter of principle, or personal pride. We all depend on each other's code to produce good sites.

As i said before there are three other solutions for this issue. Allowing custom configuration for admins seems the best to me, and the patch in this thread seems the worst.
Again, there won't be any editor specific code in imce.
A generic plug-in hook that requests url or name of the browser is ok but not any code like case 'tinymce'...case 'helleditor'...

Then from a practical user perspective I think Aaron Hawkins' suggestion of a IMCE fork is the way forward, unfortunately. IMCE + sun's patch = tIMCE (or whatever better name there is :)).

Note that you don't need to completely fork. Just create a new imce_wysiwyg.module, put the code in #115 into it (you don't even need to rename the function as it performs on behalf of imce.module), put the JS function into a new JS file (and add this to the loaded files in the .module).

Afterwards, create a imce_wysiwyg.info file:

name = IMCE for Wysiwyg
description = Integrates IMCE into client-side editors on behalf of IMCE module.
core = 6.x
dependencies[] = imce
dependencies[] = wysiwyg

This is a no-brainer and actually so little code that a separate module for this would be insane. It would take me no longer than 10 minutes to create the entire project and downloadable release on drupal.org. But I'm not interested in IMCE, so I will not do this.

However, I would rather highly recommend investigating whether the co-maintainer option for this Wysiwyg API integration would be a viable option.

I can't understand why the patch in this thread is the worst option to solve this problem. The code is written, and it works *now*. Count me as another wishing this could get committed. The IMCE module is the obvious place.

Maybe, to drive this home, everyone who would be up for co-maintaining the Wysiwyg API integration code (or a imce_wysiwyg sub-module that ships with IMCE), should apply here in a more formal manner? I.e. say who you are, what you did for Drupal, whether you (co-)maintain other projects already (or not), etc. to turn this into a real option for ufku.

I would be willing to co-maintain a sub-module. However I fear I might have stirred up some bad blood with some of the things I said in this thread.

Modules I wrote and maintain: JQuery menu, Advanced Book Blocks, Advanced Taxonomy Blocks and Consistent Language Interface.

It would be good if at least one other person would step up as well.

I would really like to get on the CVS bandwagon, and have looked for a good start, which this could be. I'm working full time using Drupal, so this could be a good time to start giving more back.

Good luck with your new project.
If andybody has any questions regarding IMCE, feel free to contact.

So close! I've got the latest WYSIWYG API (dev version) and IMCE working (unpatched release) with Tiny MCE (unhacked). It works in Firefox and Safari. It just breaks with a javascript error in IE. #373231: IE6 & 7 & 8 - TinyMCE fails to Load

Anyroads. I'm not going to flog a dead horse. WYSIWYG API is well and truly the real deal, I'll stick with that and see what else I can work out.

Thanks for all the good work on this thread! Anyone who submitted patches is awesome, this stuff is beyond my abilities.

Which dev version 1.x or 2.x and date?
I tried both 1.x and 2.x, both did not work for me.
---
Sharique

Hi, Ufku, Sun, Aaron, KingMoore, and everybody else,

I was looking at Aaron's comments in #136 (creating a WYSIWYG API to IMCE bridge) and was wondering if that was still an intelligent approach to this problem.

Did this get resolved in another way?

I see several points of view:
- IMCE is a file browser with an API
- WYSIWYG is a file browser with an API
- Some people prefer Image_assist
- Some people prefer IMCE

We don't all have to agree with each other, but I do think we should make the best open source CMS out there. It really helps us in the long run. There are interesting alternatives to Drupal like Silverstripe and Joomla.

Anyways, I couldn't fork IMCE as I couldn't maintain the bugs and fixes.

I could build a bridge based on Aaron's recommendations (#136), if that still makes sense to do...

Am I the only one that sees this as a major problem with Drupal? Don't get me wrong I think Drupal is a fantastic Open Source CMS with a great community and some brilliant add on modules, and having done little more than answer the odd forum question I am in no position to complain.

However, not having text / image editing capabilities that work smoothly out of the box is a massive issue for most semi technical users (like me) and will turn a lot of people off Drupal very quickly. Lets face it being able to edit content is one of the core features of a "content" management system.

I have hacked together a handful of sites using Drupal over the last year, and found some brilliant contributions and support here, but every time it comes to adding the text and image editor modules it is like pulling teeth. I have tried TinyMCE and FCK combined with IMCE, ImageAssist and others but in all cases the results vary depending on what versions you are running, whether they conflict with other modules etc.. Surely this functionality is so critical to a CMS it should be core! (and I mean no disrespect to the developers of these modules as once they are working they do a good job)

You only have to take a look through the forums to see how many people struggle with this particular problem.

At the moment it's like giving away a Ferrari then telling them they have to go fit they're own tyres and breaks before they can use it.

@MichaelCole,
"WYSIWYG is a file browser with an API"
Wysiwyg api isn't a file browser, it's an api for "What you see is what you get" html editors such as FCK and Tinymce.

Since TinyMCE module is obsolete and incompatible with newer versions of JQuery(_update), I'm looking to shift my sites over to the Wysiwyg API of that. We can't do that without some way of registering IMCE (or some other file upload plugin) with Wysiwyg API.

I've only skim-read this issue but I can see the case on both sides - IMCE wants to remain a pure "file browser available to whichever text editor wants it", while Wysiwyg API wishes to remain a pure "means for different text editors and plugins to work together". Both drives are completely sound and reasonable. Neither should implement code for integrating a specific plugin with a specific text editor because that's not what they're for.

The only reasonable solution is, as suggested, a bridge module which makes implements Wysiwyg's hooks in order to make IMCE available as a plugin for TinyMCE (and potentially any other text editors which become integrated with Wysiwyg module, though that's a discussion best left for another time).

Incidentally: Does the patch in #115 work with Drupal 5.x?

To answer my own question: No it does not. IMCE has gone through some big changes in JS file location and user access settings between 5.x and 6.x. However, a brief look at the 5.x module seems to have picked up the appropriate JS activities; I have integrated this into sun's #115 patch and created a fancy-ass module all of my own. This works for me under TinyMCE ... I haven't tested it for FCKEditor but the javascript I've included appears the to be the same as imce.module so I can see no reason why it wouldn't work.

For clarity: This is a Drupal 5.x module which works with IMCE 5.x-1.2 and Wysiwyg API 5.x-1.0.

@kingandy,
Thank you,
Would you create an official project page for that module please? I think there are a lot of people who are going to need it. Or if you don't have a cvs account I could set the project up for you.

Aaron and El Andy,

If a bridge module works as advertised, I'm all for that solution. Let's get the project page up and get a release out. Let me know if I can be of help.

Subscribing. A solution to this problem is critical, as per comment #145

@Aaron: No, I don't have a CVS account ... I'd use this as an excuse to apply but I gather that might take some time and it would be great to get this up and running as soon as possible...

@whoever creates the imce_wysiwyg project: Please grant me CVS access before creating the first release. Also, I'm usually available in #drupal-wysiwyg, so feel free to ping me there.

@sun,
The project has been created and you have been granted CVS access. http://drupal.org/project/imce_wysiwyg.

@Everybody else,
I've tested the bridge module and it works well for me. I am closing this issue since it is clear that the bridge is the only solution that is going to be accepted by both parties. Once sun has reviewed the bridge module you will be able to download it from the link above.

excellent work guys. excited to see a downloadable release and get the hacked versions off my site.

I tried #97 but when I clicked on the IMCE Browse button, the popup window displays a Forbidden error: "You don't have permission to access /drupal/imce&app=editor|url@src on this server." I'm working on:

Drupal 6.9 + Wysiwyg API 6.x-1.0 + TinyMCE 3.2.1.1 + IMCE 6.x-1.1

Am I missing anything? I was logged in as User-1 so I shouldn't be running into permission errors, right?

Thanks so much for everyone who has contributed to the integration patch. Can't wait for it to be uploaded to the new project page :)

subscribing

Moving over to IMCE Wysiwyg's queue.

babe, what browser are you experiencing this issue?

FF 3.0.6 and IE 7

kyutbabe> As I mentioned in #124, I had also an error due to the URL and it was also a "403 Forbidden" error. Patch in #115 fixes this, while waiting for a release for Drupal 6.x of the new bridge module :)

Please test the patch in #380944: Documentation and code clean-up. Thanks.

subscribing

I am so confused with so many patches and comments.

My problem is, the IMCE icon in TinyMCE > Insert Image is not appeared. Then, how to get the icon appeared in the Insert Image popup window?

Currently using Drupal 6.10 + Wysiwyg API 6.x-1.0 + TinyMCE 3.2.2 + IMCE 6.x-1.2 (NOT WORKS)

Previously using Drupal 6.10 + TinyMCE 6.x-1.1-dev + IMCE 6.x-1.2 (WORKS)

Please, help me with this. Hopefully to hear from you. Thank you.

Hello,
Yeah this issue was long, but just by looking in which issue queue you posted your question, you would have found the answer : IMCE Wysiwyg API bridge. You must install this new module in addition of Wysiwyg API (and the editor itself, TinyMCE) and IMCE. Then you must edit one of the Wysiwyg API profiles you have setup and enable the "IMCE" plugin (in th "Buttons and plugins" fieldset, also there you should have "Image enabled"), only then you will have the "Browse" button when you will try to add an image in TinyMCE. Good luck !

If you have further issues, you should fill in your own issue I think, this one was closed since it gave birth to the new module.

a couple of bug fixes as displayed here http://trac.bytecraft.com.my/pulut/changeset/197 for the D5 port

@Jeffrey04: Heh. I don't know which module you are coding against, but that's definitely not the code of this module. ;)

@sun sorry for not saying clearly, the patch was for the module posted in #148

Dears,

Firstly, I am sure for my English that it is not very well.

Good, I am blind person and I used the tinymce editor. But it does not worked more together with imce stopen of send image for server.

I am trying to use o wysiwyg, but the wysig has your active diferent of tinymce. When I changed of filtered to ful, editing a content, the wysiwyg does not active.

The persons without deficience achieve to say the editor, but the screan reader does not detect.

My suggestion is that use the same control of the tinymce, for roles. If roleis active with wysiwyg, the editor is displayed, if not, not displayed.

Case is not possible, how can I to do to use the wysiwyg editor with my screan reader?

thanks,

Sandro

Friends,

I found the better_formats module that it makes what I needed. It select the filter editor for rules.

Now, when I creat a new content, the filter already is choose the full, where is configured o wysiwyg.

But, o wysiwyg is not detected for my screen reader yet.

I think I go to need to continue with o tinymce and to descovery like to solve the problem of the integration betuin the tinymce and imce.

Anybody has some solution?

Thanks,

Sandro

Please create a separate issue. This one was fixed a long time ago. Thanks.

Ok,

I created a new isui here:

http://drupal.org/node/475802

Thanks,

Sandro