Repository navigation
TinyMCE toolbar goes top left when using the visibility settings for the field in a template #2097
Description
Activity
I think it's related to the inline mode combined with the sticky toolbar, as it also occurs with the original theme, though I've never been able to identify how or why it's doing that.
@cb2004 please try the lastest PW dev 3.0.252
@matjazpotocnik sorry, I cant remember which site this was on now. @ryancramerdesign have you made an attempt at fixing it?
@ryancramerdesign reproducible on 3.0.271.
When a sticky inline TinyMCE field is hidden by showIf, ProcessWire hides only the inputfield wrapper. TinyMCE’s detached toolbar remains active, recalculates against zero-sized editor geometry, and stays at the top-left after the field reappears.
Possible fix:
diff --git a/wire/modules/Inputfield/InputfieldTinyMCE/InputfieldTinyMCE.js b/wire/modules/Inputfield/InputfieldTinyMCE/InputfieldTinyMCE.js index 3a21606..4ec7c7d 100644 --- a/wire/modules/Inputfield/InputfieldTinyMCE/InputfieldTinyMCE.js +++ b/wire/modules/Inputfield/InputfieldTinyMCE/InputfieldTinyMCE.js @@ -800,6 +800,17 @@ var InputfieldTinyMCE = { return false; */ }) + .on('hideInputfield showInputfield', function(e, $inputfield) { + jQuery($inputfield).find('.' + t.cls.inline + '.' + t.cls.loaded).each(function() { + var editor = tinymce.get(this.id); + if(!editor) return; + if(e.type === 'hideInputfield') { + editor.hide(); + } else { + editor.show(); + } + }); + }) .on('sortstop', function(e) { var $editors = jQuery(e.target).find('.' + t.cls.loaded); if($editors.length) {
So for example a TinyMCE field should only be visible if field2!="", once that field2 is filled in the TinyMCE field is hidden, when field2 is empty again and the TinyMCE field reappears the toolbar has gone for a walk into the top left.
This could be related to the new admin theme, and/or the sticky toolbar, I haven't had time to test as I am head deep in the project right now.