TinyMCE Quattro and its wysiwyg bbcodes

TinyMCE Quattro and its wysiwyg bbcodes 2.7.2

No permission to download
Hey there, I didn't have the time to read all of the pages on this... but seems this is more of a just more advanced editor that one can decide which buttons and options are available to use, more customizable, and allow for more formatting of text. Am I correct? Because it seems really cool! Those other icons posted, are those just options the admin can use for the buttons?
 
Hey there, I didn't have the time to read all of the pages on this... but seems this is more of a just more advanced editor that one can decide which buttons and options are available to use, more customizable, and allow for more formatting of text. Am I correct? Because it seems really cool! Those other icons posted, are those just options the admin can use for the buttons?
You can also use it as a basic editor. As far I can see, comparing to the new default editor, its main advantage is that it's more accurate (lists are working much better, the unlink function only unlinks the part of the selection, etc), but I'm not going to spend time to compare any further. Anyone is free to use which editor suites him the best. Both editors can also work together since this editor will only be activated for users who have the permissions to use it. This editor is not more customizable than the default editor with this addon, but it's easier to do it (read this about it). The other icons are meant to be selected by admin (users don't have any interests to select which icon is going to be used for a function). Users will see the results of course (unless if buttons have permissions).
 
Last edited:
There are some typos and errors in "tiny_quattro_phrases" template in your most recent version which results in some phrases not to be translated.

This is the corrected template, maybe you want to update it in the next version:
Code:
<xen:comment>
    We are inside a JavaScript file. All phrases must be escaped
</xen:comment>

    fullscreen: "{xen:jsescape {xen:phrase sedo_quattro_fullscreen}}",
    notitle: "{xen:jsescape {xen:phrase sedo_quattro_titleismissing}}",
    more_colors: "{xen:jsescape {xen:phrase sedo_quattro_more_colors}}",
    size: "{xen:jsescape {xen:phrase sedo_quattro_size}}",
    font_size: "{xen:jsescape {xen:phrase sedo_quattro_font_size}}",
    font_family: "{xen:jsescape {xen:phrase sedo_quattro_font_family}}",
    apply: "{xen:jsescape {xen:phrase apply}}",
    insert: "{xen:jsescape {xen:phrase insert}}",
    update: "{xen:jsescape {xen:phrase update}}",
    cancel: "{xen:jsescape {xen:phrase cancel}}",
    switch_text: ["{xen:jsescape {xen:phrase use_bb_code_editor}}", "{xen:jsescape {xen:phrase use_rich_text_editor}}"],
    unlink: "{xen:jsescape {xen:phrase unlink}}",

    <xen:comment>autotranslation</xen:comment>
    alignleft_desc: "{xen:jsescape {xen:phrase align_left}}",
    aligncenter_desc:  "{xen:jsescape {xen:phrase align_center}}",
    alignright_desc: "{xen:jsescape {xen:phrase align_right}}",
    alignjustify_desc: "{xen:jsescape {xen:phrase quattro_align_justify}}",
    backcolor_desc: "{xen:jsescape {xen:phrase sedo_quattro_select_background_color}}",
    forecolor_desc: "{xen:jsescape {xen:phrase text_color}}",
    bold_desc: "{xen:jsescape {xen:phrase bold_ctrl_b}}",
    italic_desc: "{xen:jsescape {xen:phrase italic_ctrl_i}}",
    underline_desc: "{xen:jsescape {xen:phrase underline_ctrl_u}}",
    strikethrough_desc: "{xen:jsescape {xen:phrase strike_through}}",
    removeformat_desc: "{xen:jsescape {xen:phrase remove_formatting}}",
    undo_desc: "{xen:jsescape {xen:phrase undo_ctrl_z}}",
    redo_desc: "{xen:jsescape {xen:phrase redo_ctrl_y}}",
    outdent_desc: "{xen:jsescape {xen:phrase outdent}}",
    indent_desc: "{xen:jsescape {xen:phrase indent}}",
    bullist_desc: "{xen:jsescape {xen:phrase unordered_list}}",
    numlist_desc: "{xen:jsescape {xen:phrase ordered_list}}",
    xen_link_desc: "{xen:jsescape {xen:phrase  sedo_quattro_insert_edit_link}}",
    xen_unlink_desc: "{xen:jsescape {xen:phrase unlink}}",
    xen_media_desc: "{xen:jsescape {xen:phrase media}}",
    xen_image_desc: "{xen:jsescape {xen:phrase sedo_quattro_insert_edit_image}}",
    xen_code_desc: "{xen:jsescape {xen:phrase code}}",
    xen_quote_desc: "{xen:jsescape {xen:phrase quote}}",
    xen_smilies_desc: "{xen:jsescape {xen:phrase smilies}}",
    xen_nonbreaking_desc: "{xen:jsescape {xen:phrase sedo_quattro_nonbreaking}}",
    restoredraft_desc: "{xen:jsescape {xen:phrase sedo_quattro_restoredraft}}",

<xen:comment>tinymce I18n translation object</xen:comment>

    I18n: {
        <xen:comment>extend_i18n</xen:comment>
        "Words: {0}": "{xen:jsescape {xen:if "in_array({$xenOptions.quattro_wordcount}, array('char','charwp'))", "{xen:phrase sedo_quattro_characters}", "{xen:phrase sedo_quattro_words}"}}",
        "Special characters": "{xen:jsescape {xen:phrase sedo_quattro_specialcharacters}}",
        "Special character": "{xen:jsescape {xen:phrase sedo_quattro_specialcharacters}}",
        "Smilies picker": "{xen:jsescape {xen:phrase sedo_quattro_smiliespicker}}",
        "Fullscreen": "{xen:jsescape {xen:phrase sedo_quattro_fullscreen}}",
        "Paste as text": "{xen:jsescape {xen:phrase sedo_quattro_pasteastext}}",
        "Please use Ctrl+V/Cmd+V keyboard shortcuts to paste contents.": "{xen:jsescape {xen:phrase sedo_quattro_paste_alert_message}}",
        "Paste is now in plain text mode. Contents will now be pasted as plain text until you toggle this option off.": "{xen:jsescape {xen:phrase sedo_quattro_paste_plain_alert_message}}",
        "close": "{xen:jsescape {xen:phrase close}}",
        "Close": "{xen:jsescape {xen:phrase close}}",
        "Find": "{xen:jsescape {xen:phrase sedo_quattro_find}}",
        "Find and replace": "{xen:jsescape {xen:phrase sedo_quattro_find_and_replace}}",
        "Replace with": "{xen:jsescape {xen:phrase sedo_quattro_replacewith}}",
        "Match case": "{xen:jsescape {xen:phrase sedo_quattro_match_case}}",
        "Whole words": "{xen:jsescape {xen:phrase sedo_quattro_whole_words}}",
        "Replace": "{xen:jsescape {xen:phrase sedo_quattro_replace}}",
        "Replace all": "{xen:jsescape {xen:phrase sedo_quattro_replace_all}}",
        "Prev": "{xen:jsescape {xen:phrase sedo_quattro_prev}}",
        "Next": "{xen:jsescape {xen:phrase sedo_quattro_next}}"
    }

We also had to create a new phrase called "sedo_quattro_pasteastext" because "Paste as text" was not phrased. It is already included in the template, but you need to add it in your addon to0.

Code:
    <phrase title="sedo_quattro_pasteastext" version_id="0" version_string="1.0"><![CDATA[Paste as text]]></phrase>

Hope this helps. ;-)
 
@HWS, sure it helps, thanks ! I've updated the xml file on github. I prefer to wait a little before publishing a release here. By the way, I've noticed yesterday that I didn't activate the patch for the Firefox & Overlay problem on my website (Firefox version: 23.0.1)... and it's still working. So I have to check if someone has fixed the problem or if my patch configuration (enable/disable) is not working.
 
You can also use it as a basic editor. As far I can see, comparing to the new default editor, its main advantage is that it's more accurate (lists are working much better, the unlink function only unlinks the part of the selection, etc), but I'm not going to spend time to compare any further. Anyone is free to use which editor suites him the best. Both editors can also work together since this editor will only be activated for users who have the permissions to use it. This editor is not more customizable than the default editor with this addon, but it's easier to do it (read this about it). The other icons are meant to be selected by admin (users don't have any interests to select which icon is going to be used for a function). Users will see the results of course (unless if buttons have permissions).

Thank you very much! I have a feeling I will be adding this ;) ... List's HAVE irritated many a time, I do lists to my mods and just within the forum ALL THE TIME... and sometimes they really make me want to pull my hair out! LOL! ... I am the type of person that anything that provides MORE options is better for me. I like the ability to have a lot of options. With me being a newbie to installing my own add-ons, is this a difficult add on to install? Like I saw a bunch of different code stuff, do I need to change a lot of templates or anything?
 
is this a difficult add on to install?
No, it is not. Check the main page to get the instructions. There are some needed addons.
Like I saw a bunch of different code stuff, do I need to change a lot of templates or anything?
You don't need to change anything. Just configure the addon (permissions for example). The provided "code stuff" is meant to be used for those who know a little to code and want to create some advanced UI for their buttons.

I advice you to have a look at the screenshots I attach to the presentation of the addons. They help you to see the different sections.
 
2 small issues:
  1. If MCE4 opens in an overlay for editing a very long post, there are no scrollbars shown. You have to manually click into the editor and use the arrow buttons of your keyboard to enlarge the edit field and init the scroll bars. Only after that you can scroll the input field of the editor in the overlay using the mouse.

  2. The smilies neither in smilies menu nor in the smilies picker do show their names at mouse over. This makes it hard to choose the correct smiley. With MCE3 (and redactor) hovering over a smiley shows the name (description) of the smiley.
But beside of that: Perfect work! Thank you, Cedric!
 
cclaerhout updated TinyMCE Quattro with a new update entry:

Version 1.1.4 released

Version 1.1.4 released

  • Update to TinyMCE 4.0.5
    The main modification is a new option to automatically restore the
    TinyMCE draft when there is one and when the editor is empty. This option can be configured inside the XenForo Options (TinyMCE Quattro section of course)
  • Fix a visual bug with the right border of the quickreply editor with Chrome
  • Fix some typo with phrases that prevented to translate some phrases (Thanks to HWS)
  • Patch for the autoresize plugin that was...

Read the rest of this update entry...
 
ask before reload is broken in the recent version..

Basically everytime I navigate away from a page without even touching the editor the pop up appears....

I tried disabling the Auto restore draft thing, thinking this could be the cause of it.. same problem..

Xenforo 1.1.5
 
another issue, seems to be intermittant..

when I click on the thread title it take me to the last post.. rather than the last read post..

A cursor is in the Editor when this happens
 
I couldn't roll back to previous version.. (i know I would have to uninstall first)

I just upped the files from 1.1.3, last read post issue, and navigate away issues resolved..

Obviously the auto restore draft thing doesn't work..
 
@cclaerhout, Great work and a fast response on the fixes btw...

the option.. in TinyQuattro - XenForo parser


Code:
- Activate the RTE Editor on mobile devices?
This option will bypass the XenForo protection (all version below the 1.2) that prevents to load the Rich Text Editor (wysiwyg) on mobile devices.

Is not working.. The editor is not loading unless I switch my browser to Desktop Mode on my Samsung Galaxy S3

Using 1.1.5
 
Last edited:
Thanks for adding the description to the smilies picker. However it doesn't show the description, but only the bbcode which is used to be inserted for the smilie. This does not help very much, because the bbcode can be very weird and must not have any relation to the actual description. In our case the description also is in the local language. So people are still confused when selecting a smilie.

As you can see here in redactor and in old MCE3 the tooltip/title always used to be the actual description AND the bbcode of each smilie. If you can do only one of those, the description would be much more helpful.
 
Last edited:
Just a feature request...

Can we have a user option so the end user can choose which editor they can use.. ?

Most love the change.. the odd one or two (as you would expect) dont..



Xenforo default or Tiny MCE..
 
There is a real lot of work behind this implantation, congratulation Cedric.

I have a question, I need, really urgently, the implantation of some custom BBCode to this editor, is the tutorial in post 2/3 of this topic doing that ? (I need a title, and table BBCode)
 
I have a strange bug,

When I upload a file (attachement handler) - an image - the attach tag is totaly invisible, and not displayed into the editor content's.

When I post the message, it looks invisible, but the image were saved. When I edit the message that attach tags are here.
 
Back
Top Bottom