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

A rather broken tinymce and nl2br

edited May 2011 in Vanilla 2.0 - 2.8
Hi folks,

My first post here, and hopefully it will be fruitful.

OK, so first of all, I was really surprised with the VanillaTinymce plugin. To be honest, it's broken so I don't understand why it was released in that state.

Anyway, I've tidied it up, renamed the files so they can be actually be found, moved all config JS out of the PHP classes and into external files where they belong (this is MVC after all), and am happy to repost once I have solved the next issue:

So, with the TinyMC plugin enabled, HTML output is being stored correctly, but Vanilla is still adding [br] tags to newlines, resulting in very broken-looking output.

Is there an option to disable nl2br which I presume is being called somewhere, or is there a controller post-process / hook where I can remove extra [br] tags before outputting the HTML?

Thanks very much,


  • Options
    edited May 2011
    I see there's a configuration option that I could set:

    $Configuration['Garden']['Format']['ReplaceNewlines'] = TRUE;

    Can someone help me set this? I figure I need to do it in the extension constructor, extension setup, or discussion controller pre render or something (I don't know the vanilla API yet).

    $some_object->Set('Garden.Format.ReplaceNewlines', FALSE)

    If I could be pointed in the right direction, that would be great :)
  • Options
    yu_tangyu_tang New
    edited May 2011
    Try this.

    It is stable enough for me.
  • Options
    edited May 2011
    Sweet, I found what and where to put the code. In the extension's constructor:

    Gdn::Factory(Gdn::AliasConfig)->Set('Garden.Format.ReplaceNewlines', FALSE);
  • Options
    Ah, thanks yu_tang, I'll check that out as well.
  • Options
    edited May 2011
    Great solution!

    Your (I presume it's yours?) Vanilla-Fu is impressive. I think you could probably make use of the config code I pasted above, rather than the _cleanPostedData() method you have. I tested with both, and unless I'm missing something, the config way is cleaner / safer.

    Also, if I may suggest an improvement to your code (which I had in my fledgling extension) it would be to externalise the code where you declare the toolbar in the plugin body.

    Instead, do something like the following:
    $file = "default"; // alternative config files here
    Then in a config folder, you can have alternative JavaScript configs that can be edited by the user:

    // config/default.js
    $(document).ready(function() {

    // General options
    theme : "advanced",
    plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,advlist",

    theme_advanced_buttons1 : 'formatselect,removeformat,forecolor,|,bold,italic,underline,|,link,unlink,|,bullist,numlist,|,outdent,indent,blockquote,|,image,media,|,cleanup,code,|,search,replace',
    theme_advanced_buttons2 : null,
    theme_advanced_buttons3 : null,

    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,
    Thanks loads for the extension - it seems to work really well so far.

  • Options
    That would be a nice update, it would make it easier to customize. Maybe you can submit your changes on github @dave_stewart?
  • Options
    edited May 2011
    Yeah, actually I've made it even easier than that now. The config js just contains an object:
    var tinymceConfig =
    theme: "advanced",

    theme_advanced_buttons1: 'formatselect,removeformat,forecolor,|,bold,italic,underline,|,link,unlink,|,bullist,numlist,|,outdent,indent,blockquote,|,image,media,|,cleanup,code,|,search,replace',
    theme_advanced_buttons2: null,
    theme_advanced_buttons3: null,

    theme_advanced_toolbar_location: "top",
    theme_advanced_toolbar_align: "left",
    theme_advanced_statusbar_location: "none",
    theme_advanced_resizing: true,
    Inside injectTinyMCE.js there is now a config object that is extended by the user config object:
    editor = jQuery(this).tinymce(jQuery.extend(config, tinymceConfig));
    This has several advantages:

    - runs the core code, but allows the user to override it
    - removes the $enabledPlugins code from the main plugin PHP
    - doesn't break encapsulation

    The only downside at the moment is that the tinymceConfig object is global. It could also be attached via to an element as well, but I'm not too worried - I'll let Igor worry about that should he choose to.

    I've forked the repo on GitHub, so will tidy up at my end and will submit a pull request.

    I don't know Vanilla well enough to know if I'm doing things the "Vanilla way", but it's a good improvement on an already excellent extension.
Sign In or Register to comment.