TinyMCE Quattro and its wysiwyg bbcodes

TinyMCE Quattro and its wysiwyg bbcodes 2.7.2

No permission to download
hi i just found an issue with RTL forum
when i click on smiles or add links all window open on the most right
but when its LTR its goes in the center or as should be placed


View attachment 68034


also i add it here
https://github.com/cclaerhout/xen_TinyQuattro/issues/3
It seems the problem comes from the custom XenForo theme I've done. I will have to check it, but that's not my priority. You can just use the default TinyMCE theme and it will work. To do that, read the paragraph 5 of the FAQ.
 
@TBDragon
This problem is because XenForo has an automatic function to convert some 'ltr' css properties to some 'rtl' css properties AND TinyMCE is using the traditional way to specify some css for RTL languages. When TinyMCE gets the modified properties, there's a clash.

XenForo has a feature to disable the automatic conversion but it's property by property (just need to add "rtl-raw." before the css property). There's no way to skip a block of code inside a template. So this would mean to find all properties that would be modified by the XenForo automatic conversion system, then to add before them this prefix: rtl-raw.

Let's make it simple, I'm not going to do that, that would take too much time and more over, that will make the css code ugly. So if a theme is using the "XenForo Style Properties Integration" option for TinyMCE and the user language is a RTL one, I will force the script to use either the original TinyMCE skin or the theme with the XenForo colors I've published on the XenForo website. The first solution would require less work.
 
Last edited:
Version 2.1.2 preview on Github
  • update to TinyMCE 4.0.18 (changelog #1, #2)
  • force to use the TinyMCE default skin on RTL languages if the theme was using the XenForo integration mode (explanation) - thanks to TBDragon
  • A few tweaks for RTL languages with the menu
 
I haven't updated this in a while, and I was checking the newest version on a test installation of xen, and I discovered this issue: For some reason, after you type a thread title and hit the Tab key, the focus does not move to the editor. It used to. Instead, the focus seems to move to the button bar.

I tried various things to make this work again but couldn't figure it out.

You've done a superb job on improving this, by the way.
 
Last edited:
Another thing: If I turn the menu bar on, there's a Table menu, but it's really not functional. There's only a few unselectable Skins listed. Is there a way to remove a menu item that is not functional? Can I remove "table" altogether, that is?

By the way, I like that the menu system is off by default. While the menus give a less cluttered look (with the buttons turned OFF), they do require two clicks to access functions that used to require only one, and therefore they're probably only appropriate for select installations.
 
Another question/suggestion: Regarding the dialog boxes that pop up--for example, "Find and replace"--is there a way to allow the Esc key to dismiss those boxes, as one can do typically in Windows? Currently the boxes require a click to dismiss.
 
Another thing: If I turn the menu bar on, there's a Table menu, but it's really not functional. There's only a few unselectable Skins listed. Is there a way to remove a menu item that is not functional? Can I remove "table" altogether, that is?

By the way, I like that the menu system is off by default. While the menus give a less cluttered look (with the buttons turned OFF), they do require two clicks to access functions that used to require only one, and therefore they're probably only appropriate for select installations.

well the menu bar works fine for me as for the Table bbcode i have that disabled it in options some where i believe..

and as for missing buttons i just ad them in

as for my set up i spent hours just configuring all the options

7uVJK.png

^ for smiles when you click on it you see the small list click on the main smilies again and you get the extended view thats if you configured it in options

7uVK4.png


as for the actual skin this the default one i don't bother making special skins for each theme to much work but if you want to make skins here:

http://skin.tinymce.com/

and place skins here: js/sedo/tinyquattro/tinymce/skins

has to be with whole folder

then just go theme options and look for
  • TinyMCE Quattro Style properties.
  • Uncheck "XenForo Style Properties Integration"
  • On the field below write down your skin directory name
 
I haven't updated this in a while, and I was checking the newest version on a test installation of xen, and I discovered this issue: For some reason, after you type a thread title and hit the Tab key, the focus does not move to the editor.
Works with FF and Chrome. I can't test at the moment with IE, I went back to my former laptop, it looks IE has some problems and refuse to load some JS. I'm not if it's coming from TinyMCE or from my IE. I will test this first. Do you still have IE 10, if yes, can you try to see if the editor loads correctly ?Looks to come from my IE version or my system, I will make an update.

Now about the focus problem, if it's confirmed that the focus doesn't move to the editor on IE... well, to be honest I have no motivation to spend several hours on such a bug for such a browser. I know that some bugs have been fixed in the last TinyMCE version (not released here), so I can give a try first.

Another thing: If I turn the menu bar on, there's a Table menu, but it's really not functional. There's only a few unselectable Skins listed. Is there a way to remove a menu item that is not functional? Can I remove "table" altogether, that is?
Post a screenshot please. Do you enable the table Bb Code in the options ? If yes, they should have a full menu.

By the way, I like that the menu system is off by default. While the menus give a less cluttered look (with the buttons turned OFF), they do require two clicks to access functions that used to require only one, and therefore they're probably only appropriate for select installations.
That's why you can display both a button and a menu item for the same function. Some options need to have a direct button, that's more convenient. Which makes me think I've to force the display of the quote button on one of my forum.

Another question/suggestion: Regarding the dialog boxes that pop up--for example, "Find and replace"--is there a way to allow the Esc key to dismiss those boxes, as one can do typically in Windows? Currently the boxes require a click to dismiss.
No, TinyMCE doesn't have implement shortcuts for its modal. It's not hard to do, but I'm going to make a break, there are thousands lines of code, the editor is working, its dom management is really good, that's the most important.

@cclaerhout
if i go here or any other downloaded related to tinymce
http://www.tinymce.com/download/plugins.php

can i just place any theme, plugin and so on in here? js/sedo/tinyquattro/tinymce

i know this is ported to xenforo but should be some way to improving it more it adding more plugins that you have not yet ported...
Yes, but you will have to use the setup listener I've coded to enable the plugin or add new settings using php (see the bottom of the FAQ) AND you might have to integrate some of the plugin functions to the XenForo, especially if this plugin is using attachments. You can try but if you never play with code before, it might not be easy.
 
Last edited:
This has probably been asked before, but I couldn't find it and it isn't in the FAQ.

I installed this and had a couple of users trialling it, myself included. All good.

However I had complaints from other users that since the install of this add-on, copy-paste functionality was behaving oddly, this was in the standard redactor editor as well as the bbcode editor. I tested it out and sure enough, the number of spaces within a code block (and presumably outside as well) were being truncated - six spaces might become three.

This was causing angst for a certain section of my users as they would copy-paste things like League tables from other applications. Suddenly the formatting was wrong as the columns were out of whack. This despite the users never having been given access to TinyMCE. As soon as I deactivated the plugin, the issue went away, turn it on and it returned.

What is going on?
 
This has probably been asked before, but I couldn't find it and it isn't in the FAQ.

I installed this and had a couple of users trialling it, myself included. All good.

However I had complaints from other users that since the install of this add-on, copy-paste functionality was behaving oddly, this was in the standard redactor editor as well as the bbcode editor. I tested it out and sure enough, the number of spaces within a code block (and presumably outside as well) were being truncated - six spaces might become three.

This was causing angst for a certain section of my users as they would copy-paste things like League tables from other applications. Suddenly the formatting was wrong as the columns were out of whack. This despite the users never having been given access to TinyMCE. As soon as I deactivated the plugin, the issue went away, turn it on and it returned.

What is going on?
I don't have time to make any tests this week. Check the parser options of this addon. Basically, 4 white spaces are converted to a tabulation.
 
I don't have time to make any tests this week. Check the parser options of this addon. Basically, 4 white spaces are converted to a tabulation.
There doesn't appear to be any option to change that value - I've used the defaults. I thought the normal value for tabulation was 8 spaces.
 
There doesn't appear to be any option to change that value - I've used the defaults. I thought the normal value for tabulation was 8 spaces.
No in this addon, 4 spaces = 1 tab (in most of scripts and with this addon I've used this rule that came from the former TinyMCE version). 6 spaces = 1 tab + 2 white spaces.

Again, if you don't want this option, disable it in the parser options (Activate the Wysiwyg HTML > BbCode Parser Patch). But align/adjust text with whitespaces is not the right thing to do, that's the tabulations purpose.
 
Last edited:
hey guys,
just a quick question.
Recently updated to the last version and I have started to experience an issue with XenForo's edit function on mobile devices.
Tinymce doesnt populate the editor with the original text it just stays blank.

If I disable the editor on mobile devices the text is rendered just fine.
No issue on desktops.

Anyone noticed a similar issue?
Apologies if it has been raised before or I missed something in the thread/faq.


NB: We are using an old xenforo version (1.1.5) with a fair bit of custom code to let us use add-ons that should only work on 1.2 so that could very well be the problem..

Edit it does probably come from my version,
showWyswig is always set to false on mobile device -> the $messageHtml variable is empty.
Could not find yet something in tinymce quattro add-on updating that variable.

Guess my only option is to modify XenForo_ViewPublic_Helper_Editor::getEditorTemplate to properly compute $showWysiwyg ?

thanks
 
Last edited:
@HotCopper
I'm not sure but :
  • As you said, you're using an old XenForo version that add JavaScript problems. With Firefox the problem was similar but the editor text area was blank and couldn't not even be edited. There's a workaround for this but it will only work with Firefox. If you can edit the editor text area, this is not this problem.
  • I don't understand your explanation about the $showWysiwyg variable. Does the RTE editor is correctly loaded or is it the "Bb Code Editor"/Textarea box ? I might have done a mistake somewhere but I didn't see it on my websites. Could you try on a dev board with a more recent XenForo version to check if the problem occurs? Thanks.
P.S: I will also have to edit the TinyMCE version because MCE developers found IOS7 had introduced a few bugs.
 
Last edited:
hey guys,
just a quick question.
Recently updated to the last version and I have started to experience an issue with XenForo's edit function on mobile devices.
Tinymce doesnt populate the editor with the original text it just stays blank.

If I disable the editor on mobile devices the text is rendered just fine.
No issue on desktops.
With Xenforo 1.3.1, I'm having a similar issues on Desktop IE11. Clicking the "reply" or "Insert Quotes" for multi-quotes fails.

I'm not sure how to debug the line, which appears to be failing only in IE, in the file retro_quickreply.js;
Code:
ed.execCommand('insertHtml', false, ajaxData.quoteHtml);
 
I've tested the addon on my forum and I see that this version of tinymce miss some desired functions of the original full tinymce editor i can see here:
http://skin.tinymce.com

how is it possible to implement the other original functions too?
 
Top Bottom