HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Please upgrade here. These earlier versions are no longer being updated and have security issues.

CLEditor: (yet) another wysiwyg plugin

This discussion is related to the CLEditor jQuery WYSIWYG addon.
rakrak
edited August 2011 in Vanilla 2.0 - 2.8
Progress with jwysiwyg has pretty much stalled without any resolution of the bugs others have highlighted.

Last week I came across a new jQuery wysiwyg plugin called CLEditor.

I've made a Vanilla plugin using it: CLEditor for Vanilla

It's functional with the 'stock' .js and .css, it also allows editing of the HTML - unlike jwysiwyg.

On Vanilla 2.0.3 you need to update the file applications/dashboard/modules/class.headmodule.php - insert this at line 269:
         foreach ($this->_Strings as $String) {
$Head .= $String;
$Head .= "\n";
}
One tweak you can make is to edit line-19 of jquery.cleditor.min.js to remove extra toolbar buttons, eg. cut/copy/paste might not work on your system.

BUGS: There's a bug where both the HTML and WYSIWYG view are visible in 'Write comment' textarea in a Discussion. This is 'fixed' by clicking the HTML button a couple of times. Try this fix:

Edit plugins/cleditor/default.php and change line-43 to:
$Sender->Head->AddString('$("#Form_Body").live("mouseover", function() {$("#Form_Body").cleditor({width:"100%", height:"100%"});});');
There's probably a way of fixing this with a jQuery call, one of these pages might help a jQuery-guru figure it out:
http://premiumsoftware.net/cleditor/docs/GettingStarted.html#internalObject
http://groups.google.com/group/cleditor/browse_thread/thread/d0f916101fe16903/

Try it out and let us know how it goes!
«134

Comments

  • I installed it and activated it without any issues but it's not doing anything. I have tried with creating a new discussion or posting a response to one and the toolbar never shows? I am on 2.0.3. I haven't made any .js changes and don't have any other wysiwyg editor installed. Maybe I'm doing something wrong. :)
  • I have the same problem.
  • rakrak
    edited August 2010
    @flipz & @rusty: on 2.0.3 you need to update the file applications/dashboard/modules/class.headmodule.php - insert this at line 269:
    foreach ($this->_Strings as $String) { $Head .= $String; $Head .= "\n"; }Save the file and reload to see if you can see the CLEditor toolbar

    This fix is mentioned here: http://github.com/ShadauxCat/Garden/commit/4ade3f7d65811bc5d7fa013720fb70ee3a21fdc8 & here: http://vanillaforums.org/discussion/12509/vanilla-2.0.3-released
  • The new editor works fine for new discussions but does not appears for write comments at all. Im on Vanilla 2.0.3.
  • rakrak
    edited August 2010
    @tmilovan: I haven't seen this on the installations I've tested CLEditor. If you view the source of the 'Write comments' page, do you see the CLEditor .css, .js and script tags?
  • tmilovantmilovan New
    edited August 2010
    Yes I do.

  • @tmilovan: And you've applied the fix to class.headmodule.php shown above? Have you tried disabling your other plugins to see if it's conflicting?
  • Please, please make a plug-in for a BBCode editor! :D That'd be so amazing.
  • @rak: yes I did. But I did not tried to dsiable all other plugins since this is my production environment. I'll try it on separate installation.
  • Installed first time no problems.

    How do I stop both HTML & Wysiwyg displaying as a default? Looked in the forums attached but no luck.
  • I have the same problem as @thomaswest14. Everything I type is "copied" to a second box at the bottom and it's the only part that shows the WYSIWYG part.

    So far, I'm 0 for 3 on getting any of these Wysiwyg plugins to work without major quirks.
  • rakrak
    edited August 2010
    @thomaswest14 & @Lykaon: That's a known bug that we're trying to figure out -- Not a true solution, but If you click the 'HTML' button a couple of times it will display just the WYSIWYG view.

    Are you seeing it on 'Start a New Discussion' textareas also?

    CLEditor is the closest to a 100% solution for WYSIWYG on Vanilla I've seen - if we can figure out this little quirk!

    The previous attempt, jwysiwyg, stalled trying to figure out its quirks.

    I've posted a question on the CLEditor Google group, so we hope to have a fix soon - CLEditor's author is on vacation until Aug 30.
  • edited August 2010
    @rak: fwiw, I only see it when replying to a thread. Starting a new discussion doesn't seem to manifest this issue.

    On a side note, any plans to make this addon also work when you edit a post? So far, that seems to be a weakness of all of the wysiwyg plugins.
  • rakrak
    edited August 2010
    @Lykaon: Edit posts will probably take more jQuery work as the 'Edit' textarea is called after the page loads.

    If anyone has any insight into calling jQuery (or having CLEditor 'listen' for new textareas) when the author clicks 'Edit', please comment here.
  • rakrak
    edited August 2010
    Here's a temporary fix for the bug of showing both the HTML and WYSIWYG view (and the 'Edit' textarea problem @Lykaon mentioned). Using jQuery 1.4+'s .live() function, the CLEditor toolbar will be added when you mouseover any textarea.

    Edit plugins/cleditor/default.php and change line-43 to: $Sender->Head->AddString('<script type="text/javascript">$("#Form_Body").live("mouseover", function() {$("#Form_Body").cleditor({width:"100%", height:"100%"});});</script>'); (*updated*)

    A step towards a full solution. Please let us know if this works for you.
  • This fix doesn't seem to work for me. The formatting bar disappears completely (mouse over included) and for some reason the line "$("#Form_Body").live("mouseover", function() {$("#Form_Body").cleditor({width:"100%", height:"100%"});}); " appears at the top of my dashboard above the forum name.
  • rakrak
    edited August 2010
    @SpencerMc: Try copy/pasting the code snippet above again, it's been updated (the <script> tags were getting stripped out).
  • @rak & @Lykaon

    Changed script and works great in both comment and new discussion, if it could work on the edit pages too that would be great but this is the first WYSIWYG editor that I have successfully installed and is working well. 1 out of 3

    Could anyone help me put an 'add image' button / browse/ upload it to the site, with up to 9 images displaying under the discussion or comment similar to the images in the vanilla plugins?
  • @rak:
    That did it! Thanks a ton.
Sign In or Register to comment.