Problems with tinyMCE width and height, joomla 3.7 #15059

schnuti · 2017-04-02T17:07:06Z

I think there are some confusions about the computed values of the width and height values for the tinyMCE editor. Personally I categorize this as a bug.

In theory there could be a lot of default settings but this is more simple.

We get the values from user editable system wide parameters (with some funny results like height=750, the tinyMCE default )):

tinyMCE editor default values
tinyMCE editor settings
this overrides the parameters from the form in all components and views.

Article edit

A second field in article edit as in PR 14520.

Article frontend editing.

The Joomla editor form field will never get any settings from external sources as default.

My propasal is to set the width hardcoded to 100% (or auto) and the height from:

Joomla editor form field default settings
the field's settings in the form field XML
tinyMCE default setting in the code (if no value available). I'm not quite sure about this.
override in a system plug in - onBeforeRender() method

Expected result

As tinyMCE automatically gets the height values from the hidden textarea field, we don't have to explicit set any values in the tinyMCE options. As well, we don't have to set any editor instance values as in #14520.

If you want a width per field, this has to be added to each editor instance as in PR #14520. As far as I could see there is no automatic loading as with the height.

In this PR I have removed the parameters in the tinyMCE editor, removed the tinyMCE options, added defaults in tinyMCE code and deprecated the language strings. I did not change the legacy part. Width is now overridable with a custom template/layout and height by using a custom system plugin - method onBeforerender().

Test instructions:

Add an extra editor field as in Fix TinyMCE ext-buttons. Respect ext-buttons configuration per an editor instance #14520 with height. The original article text field has no expicit value, default 500px height from the form field.

In the article form XML administrator/components/com_content/models/forms/article.xml add one more editor element (somewhere after line
<fieldset name="basic" label="COM_CONTENT_ATTRIBS_FIELDSET_LABEL">)

<field name="text2" type="editor" hide="menu,module,contact" label="Text2" description="" filter="JComponentHelper::filterText" buttons="true" height="250"/>

Check the result without adding the patch. Play with the tinyMCE editor settings a bit. Go to the tab(s) advanced in tinyMCE and modify Width and Height to what a user could enter. e.g. width 50%, height=200.
Have a look to the new second field in article edit, backend categories and frontend article edit/creation as well.
Apply this patch.
There are no settings so just reload the article edit page and .
Check and compare the results.

@Fedik Is it easy to add the width if !100% as in PR 14520? The width could then be set in the form field. Needed?

Related
#14917
#14835

tinyMCE plugin php

Merge Patch 1

brianteeman · 2017-04-02T17:10:07Z

administrator/language/en-GB/en-GB.plg_editors_tinymce.ini

@@ -52,10 +52,6 @@ PLG_TINY_FIELD_FUNCTIONALITY_DESC="Select level of functionality."
 PLG_TINY_FIELD_FUNCTIONALITY_LABEL="Functionality"
 PLG_TINY_FIELD_HR_DESC="Show or hide the Horizontal Rule button."
 PLG_TINY_FIELD_HR_LABEL="Horizontal Rule"
-PLG_TINY_FIELD_HTMLHEIGHT_DESC="Height of HTML editor. Only applies in Advanced and Extended mode."


Please don't remove the unused language strings. You can mark them as unused but the standard says we don't delete thrm

OK! I was not sure. How do I mark them?

Something like

; The following xxx strings are deprecated and will be removed with 4.0

@brianteeman
Thanks. Now I only have to find out how to revert the change and add the new line. I'm only using gitHub occasionally. Any hint?

Fedik · 2017-04-02T17:28:23Z

Is it easy to add the width if !100% as in PR 14520?

sorry, not very understood your question,
14520 already merged

schnuti · 2017-04-02T17:31:16Z

@Fedik
I wrote - as in. That is handle the width in the same way.
Edit: and add the width to the editor instance if the value is not 100% - this is default.

AlexRed · 2017-04-02T18:17:19Z

I have tested this item ✅ successfully on 122caac

Patch ok for me.
Thanks 😃

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/15059.}

schnuti · 2017-04-02T18:45:43Z

@AlexRed
Thanks for testing.
Do you as I, think, it should go into 3.7.0? I guess it's harder to remove the parameters later on. It's late!

AlexRed · 2017-04-02T20:08:39Z

yes, also I hope we can solve the tinyMCE width problem in 3.7.0 or 3.7.1

schnuti · 2017-04-04T05:55:33Z

@brianteeman I've reverted the language change and added a remark

schnuti · 2017-04-05T06:51:59Z

I can't think of any situation where a width <> 100% (see images above) is needed. If you know one, I've now tested a solution using Fediks editor instances that works fine.

ghost · 2017-04-30T06:50:55Z

I have tested this item 🔴 unsuccessfully on 8a2f338

Error on "Articles: Edit" in Backend:

System information

3.7.1-dev
macOS Sierra, 10.12.4
Firefox 53 (64-bit)

MAMP 4.1.1

PHP 7.0.15
MySQLi 5.6.35

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/15059.}

schnuti · 2017-04-30T08:34:14Z

@franz-wohlkoenig
Could you please check if you have the JS file in the directory.
media/editors/tinymce/plugins/jdragdrop/plugin-min.js
It has obviously bin moved to media/editors/tinymce/js/plugins/dragdrop/plugin-min.js

As far as I can see this PR has nothing to do with this javascript loading error.
Related? #15057

ghost · 2017-04-30T08:48:46Z

media/editors/tinymce/plugins/jdragdrop/plugin-min.js

jdragdrop/plugin-min.js doesn't exist.

media/editors/tinymce/js/plugins/dragdrop/plugin-min.js

Folder exist.

schnuti · 2017-04-30T08:56:33Z

@franz-wohlkoenig
I think you somehow got out of sync.
see e.g.
https://github.com/joomla/joomla-cms/tree/staging/media/editors/tinymce/js/plugins/dragdrop

ghost · 2017-04-30T09:04:33Z

@schnuti got same Path&File as https://github.com/joomla/joomla-cms/tree/staging/media/editors/tinymce/js/plugins/dragdrop

schnuti · 2017-04-30T09:23:05Z

@franz-wohlkoenig
Do you really find it on your instance? Do you override the tinyMCE settings? (personally I love it!)
As I said "This PR do not change anything regarding Javascript""

ghost · 2017-04-30T09:32:11Z

Do you really find it on your instance?

Do you override the tinyMCE settings?

Clean Install of latest nightly Build. After applied PR got Error described in Comment

schnuti · 2017-04-30T09:40:33Z

@franz-wohlkoenig
That's as far I go, I have my solution - override-. I do NOT need this patch.
By!

schnuti · 2017-04-30T14:17:17Z

@franz-wohlkoenig
I have to apologize! There are no conflicts above - but there should be,
My PR overrides somehow #15057 that moves the js to an "external" path.
I get no differences with staging.
How can I fix that? New PR?

ghost · 2017-05-01T08:31:09Z

@schnuti sorry, don't know how to fix, maybe @Bakual can help?

schnuti · 2017-05-01T10:54:47Z

As I understand this should not be possible.
As I said - when I compare with JoomlaCMS/staging I get " Able to merge." and an update is not possible!
My guess for now is that the PatchTester is the problem copying the old PHP file to the test system and that a commit to Joomla staging would work.
But I would need some advise.

Bakual · 2017-05-01T19:48:04Z

Yep, Patchtester can cause some funny results if the PR branch doesn't have conflicts but is outdated neverthless. Because it copies the files instead of merging the changes.
You can merge (or rebase) the staging branch into your PR branch to fix that issue.

Update from Joomla/cms staging

schnuti · 2017-05-02T07:46:56Z

@Bakual
Thanks for the hint. I found a way to merge the staging changes into the PR branch using the GitHub web interface.
@franz-wohlkoenig
Could you give it another try. I've tested and it works for me using the PatchTester.
Thanks for testing and finding the problem in the first place!

schnuti added 4 commits April 2, 2017 17:11

tinyMCE width and height

8e95962

tinyMCE plugin php

Update tinymce.xml

9f9895a

Update en-GB.plg_editors_tinymce.ini

afdcaca

Merge pull request #3 from schnuti/patch-1

122caac

Merge Patch 1

joomla-cms-bot added Language Change This is for Translators PR-staging labels Apr 2, 2017

brianteeman reviewed Apr 2, 2017

View reviewed changes

brianteeman mentioned this pull request Apr 3, 2017

TinyMCE plugin Advanced Options #14917

Closed

schnuti added 2 commits April 4, 2017 07:41

Reverted language change and added a remark for 4.0

5c85d23

Typo

8a2f338

ghost mentioned this pull request Apr 4, 2017

Editor field Joomla! 3.7 #14508

Closed

Merge pull request #6 from joomla/staging

612fd84

Update from Joomla/cms staging

brianteeman modified the milestone: Joomla 4.0 Jun 8, 2017

schnuti closed this Jun 23, 2017

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Problems with tinyMCE width and height, joomla 3.7 #15059

Problems with tinyMCE width and height, joomla 3.7 #15059

schnuti commented Apr 2, 2017 •

edited

brianteeman Apr 2, 2017

schnuti Apr 2, 2017

brianteeman Apr 2, 2017

schnuti Apr 2, 2017

Fedik commented Apr 2, 2017

schnuti commented Apr 2, 2017 •

edited

AlexRed commented Apr 2, 2017

schnuti commented Apr 2, 2017

AlexRed commented Apr 2, 2017

schnuti commented Apr 4, 2017

schnuti commented Apr 5, 2017

ghost commented Apr 30, 2017 •

edited by ghost

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented May 1, 2017

schnuti commented May 1, 2017

Bakual commented May 1, 2017

schnuti commented May 2, 2017

Problems with tinyMCE width and height, joomla 3.7 #15059

Problems with tinyMCE width and height, joomla 3.7 #15059

Conversation

schnuti commented Apr 2, 2017 • edited

brianteeman Apr 2, 2017

Choose a reason for hiding this comment

schnuti Apr 2, 2017

Choose a reason for hiding this comment

brianteeman Apr 2, 2017

Choose a reason for hiding this comment

schnuti Apr 2, 2017

Choose a reason for hiding this comment

Fedik commented Apr 2, 2017

schnuti commented Apr 2, 2017 • edited

AlexRed commented Apr 2, 2017

schnuti commented Apr 2, 2017

AlexRed commented Apr 2, 2017

schnuti commented Apr 4, 2017

schnuti commented Apr 5, 2017

ghost commented Apr 30, 2017 • edited by ghost

System information

MAMP 4.1.1

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented Apr 30, 2017

schnuti commented Apr 30, 2017

schnuti commented Apr 30, 2017

ghost commented May 1, 2017

schnuti commented May 1, 2017

Bakual commented May 1, 2017

schnuti commented May 2, 2017

schnuti commented Apr 2, 2017 •

edited

schnuti commented Apr 2, 2017 •

edited

ghost commented Apr 30, 2017 •

edited by ghost