MDL-40668 tinymce: Remove collapsable editor options
We have an alternative (pdw toolbars) Also, allow tinymce to be collapsed down to a single row.
This commit is contained in:
Damyon Wiese
@@ -821,7 +821,7 @@ abstract class moodleform_mod extends moodleform {
|
||||
$label = is_null($customlabel) ? get_string('moduleintro') : $customlabel;
|
||||
|
||||
$mform->addElement('editor', 'introeditor', $label, array('rows' => 10), array('maxfiles' => EDITOR_UNLIMITED_FILES,
|
||||
'noclean' => true, 'context' => $this->context, 'collapsed' => true));
|
||||
'noclean' => true, 'context' => $this->context));
|
||||
$mform->setType('introeditor', PARAM_RAW); // no XSS prevention here, users must be trusted
|
||||
if ($required) {
|
||||
$mform->addRule('introeditor', get_string('required'), 'required', null, 'client');
|
||||
|
||||
@@ -41,7 +41,6 @@ $string['err_rangelength'] = 'You must enter between {$a->format[0]} and {$a->fo
|
||||
$string['err_required'] = 'You must supply a value here.';
|
||||
$string['general'] = 'General';
|
||||
$string['hideadvanced'] = 'Hide advanced';
|
||||
$string['hideeditortoolbar'] = 'Hide editing tools';
|
||||
$string['hour'] = 'Hour';
|
||||
$string['minute'] = 'Minute';
|
||||
$string['miscellaneoussettings'] = 'Miscellaneous settings';
|
||||
@@ -60,7 +59,6 @@ $string['selected'] = 'Selected';
|
||||
$string['showadvanced'] = 'Show advanced';
|
||||
$string['showless'] = 'Show less...';
|
||||
$string['showmore'] = 'Show more...';
|
||||
$string['showeditortoolbar'] = 'Show editing tools';
|
||||
$string['somefieldsrequired'] = 'There are required fields in this form marked {$a}.';
|
||||
$string['time'] = 'Time';
|
||||
$string['timeunit'] = 'Time unit';
|
||||
|
||||
@@ -109,7 +109,6 @@ class tinymce_texteditor extends texteditor {
|
||||
if ($fpoptions) {
|
||||
$PAGE->requires->js_init_call('M.editor_tinymce.init_filepicker', array($elementid, $fpoptions), true);
|
||||
}
|
||||
$this->initialise_collapse_js();
|
||||
}
|
||||
|
||||
protected function get_init_params($elementid, array $options=null) {
|
||||
@@ -276,22 +275,4 @@ class tinymce_texteditor extends texteditor {
|
||||
return new moodle_url("$CFG->httpswwwroot/lib/editor/tinymce/tiny_mce/$this->version/");
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialise javascript form elements
|
||||
* @return void
|
||||
*/
|
||||
public function initialise_collapse_js() {
|
||||
global $PAGE;
|
||||
// This method is called for every editor instance. Ensure it's only run once.
|
||||
// Static is a clunky solution but the best we could find to keep everything simple and encapsulated.
|
||||
static $isinitialised;
|
||||
if ($isinitialised) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Initialise language strings.
|
||||
$PAGE->requires->strings_for_js(array('hideeditortoolbar', 'showeditortoolbar'), 'form');
|
||||
$PAGE->requires->yui_module('moodle-editor_tinymce-collapse', 'M.editor_collapse.init');
|
||||
$isinitialised = true;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12,6 +12,6 @@ Upgrade procedure:
|
||||
2/ bump up version.php
|
||||
3/ update lib/thirdpartylibs.xml
|
||||
4/ reimplement patch in MDL-23646
|
||||
5/ add in "DOM.setStyle(ifr, 'width',DOM.getSize(ifrcon).w); // Resize iframe" (without quotes)
|
||||
5/ reimplement patch in MDL-40668
|
||||
6/ add in "DOM.setStyle(ifr, 'width',DOM.getSize(ifrcon).w); // Resize iframe" (without quotes)
|
||||
after "DOM.setStyle(ifr, 'height',DOM.getSize(ifr).h + dy); // Resize iframe"
|
||||
5/ reminify the js manually (I used uglifyjs)
|
||||
|
||||
@@ -156,10 +156,15 @@
|
||||
_resizeIframe : function(ed, tb_id, dy) {
|
||||
var ifr = ed.getContentAreaContainer().firstChild;
|
||||
var ifrcon = ed.getContentAreaContainer();
|
||||
|
||||
DOM.setStyle(ifr, 'height',DOM.getSize(ifr).h + dy); // Resize iframe
|
||||
DOM.setStyle(ifr, 'width',DOM.getSize(ifrcon).w); // Resize iframe
|
||||
ed.theme.deltaHeight += dy; // For resize cookie
|
||||
var textarea = DOM.get(ed.id);
|
||||
var rows = textarea ? textarea.getAttribute('rows') : 3;
|
||||
|
||||
// For very small text areas - allow the editable region to be smaller than the size of the toolbars.
|
||||
if (rows >= 3) {
|
||||
DOM.setStyle(ifr, 'height',DOM.getSize(ifr).h + dy); // Resize iframe
|
||||
DOM.setStyle(ifr, 'width',DOM.getSize(ifrcon).w); // Resize iframe
|
||||
ed.theme.deltaHeight += dy; // For resize cookie
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
||||
@@ -1,19 +1,3 @@
|
||||
.mform .felement.feditor .toggle_editor_toolbar {
|
||||
background: #EEEEEE;
|
||||
border-color: #BBBBBB;
|
||||
border-radius: 4px 4px 0 0;
|
||||
border-style: solid solid none;
|
||||
border-width: 1px 1px 0;
|
||||
display: inline-block;
|
||||
font-size: 0.7em;
|
||||
padding: 3px 6px;
|
||||
}
|
||||
.mform .felement.feditor .toggle_editor_toolbar:hover {
|
||||
text-decoration: underline;
|
||||
color: red;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.mceToolbar td {
|
||||
float: left;
|
||||
|
||||
Vendored
-151
@@ -1,151 +0,0 @@
|
||||
YUI.add('moodle-editor_tinymce-collapse', function (Y, NAME) {
|
||||
|
||||
var COLLAPSE = function() {
|
||||
COLLAPSE.superclass.constructor.apply(this, arguments);
|
||||
};
|
||||
|
||||
Y.extend(COLLAPSE, Y.Base, {
|
||||
// A location to store the node toggling template so that we do not have to create it each time.
|
||||
toggleNodeTemplate : null,
|
||||
|
||||
/**
|
||||
* Set up basic values for static access.
|
||||
*/
|
||||
init : function() {
|
||||
this.initialise_toggles(10);
|
||||
},
|
||||
|
||||
/**
|
||||
* Has TinyMCE been loaded and the editors been initialised?
|
||||
* Designed mainly for IE
|
||||
* @return bool
|
||||
*/
|
||||
editors_initialised : function() {
|
||||
return typeof tinyMCE !== 'undefined';
|
||||
},
|
||||
|
||||
initialise_toggles : function(refreshes) {
|
||||
var editors_initialised = this.editors_initialised(), self = this, editor;
|
||||
if (!editors_initialised && refreshes) {
|
||||
setTimeout(function() {
|
||||
self.initialise_toggles(refreshes - 1);
|
||||
}, 100);
|
||||
return;
|
||||
}
|
||||
|
||||
// Create the toggle template for use later
|
||||
this.toggleNodeTemplate = Y.Node.create('<a class="toggle_editor_toolbar" />');
|
||||
this.toggleNodeTemplate.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
|
||||
// Delegate clicks of the toggle_editor_toolbar
|
||||
Y.one('body').delegate('click', this.toggle_collapse_from_event, 'a.toggle_editor_toolbar', this);
|
||||
|
||||
// Set up editors which have already been created
|
||||
for (editor in tinyMCE.editors) {
|
||||
this.setup_collapse(tinyMCE.editors[editor]);
|
||||
}
|
||||
|
||||
// Set up for future editors.
|
||||
// I haven't yet found a way of directly delegating the editor.onInit event. Instead we have to listen for the
|
||||
// tinyMCE.onAddEditor event, and then add a further event listener to the editor's onInit event.
|
||||
// onAddEditor is triggered before the editor has been created.
|
||||
// We use Y.Bind to ensure that context is maintained.
|
||||
tinyMCE.onAddEditor.add(Y.bind(this.add_setup_collapse_listener, this));
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup a listener for a new editor which will actually set the editor up
|
||||
* @param {Manager} mgr
|
||||
* @param {Editor} ed
|
||||
*/
|
||||
add_setup_collapse_listener : function (mgr, ed) {
|
||||
// Bind the editor.onInit function to set this editor up. This ensures we maintain our context (this)
|
||||
ed.onInit.add(Y.bind(this.setup_collapse, this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup the toggle system for the provided editor
|
||||
*
|
||||
* @param {Editor} ed The TinyMCE editor instance
|
||||
*/
|
||||
setup_collapse : function(ed) {
|
||||
var textarea = Y.Node(ed.getElement()),
|
||||
editortable = Y.Node(ed.getContainer()).one('> table'),
|
||||
thisToggleNode;
|
||||
|
||||
// Does this text area support collapsing at all?
|
||||
if (!textarea.hasClass('collapsible')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Did we find an appropriate table to work with
|
||||
if (!editortable) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Add toggle button.
|
||||
thisToggleNode = this.toggleNodeTemplate.cloneNode(true);
|
||||
editortable.get('parentNode').insert(thisToggleNode, editortable);
|
||||
|
||||
// Toggle the toolbars initially.
|
||||
if (Y.Node(ed.getElement()).hasClass('collapsed')) {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 0);
|
||||
} else {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 1);
|
||||
}
|
||||
|
||||
// When TinyMCE initialises itself, it adds a height to the table.
|
||||
// Unfortuately, the height it sets is too big for when the editor is collpsed.
|
||||
// Fortunately, the hight is not necessary, so we can just remove it.
|
||||
// (If you re-size the editor then it will remove this style attribute itself.)
|
||||
editortable.setStyle('height', '');
|
||||
editortable.setStyle('width', '');
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle the specified editor toolbars.
|
||||
*
|
||||
* @param {Node} button The toggle button which we have to change the text for
|
||||
* @param {Node} editortable The table which the tinyMCE editor is in
|
||||
* @param {Boolean} newstate The intended toggle state
|
||||
*/
|
||||
toggle_collapse : function(button, editortable, newstate) {
|
||||
var toolbar = editortable.one('td.mceToolbar').ancestor('tr'),
|
||||
statusbar = editortable.one('.mceStatusbar').ancestor('tr');
|
||||
|
||||
// Check whether we have a state already.
|
||||
if (typeof newstate === 'undefined') {
|
||||
if (toolbar.getStyle('display') === 'none') {
|
||||
newstate = 1;
|
||||
} else {
|
||||
newstate = 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Toggle the various states and update the button text to suit
|
||||
if (newstate === 0) {
|
||||
toolbar.hide();
|
||||
statusbar.hide();
|
||||
button.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
} else {
|
||||
toolbar.show();
|
||||
statusbar.show();
|
||||
button.setContent(M.util.get_string('hideeditortoolbar', 'form'));
|
||||
}
|
||||
},
|
||||
|
||||
toggle_collapse_from_event : function(thisevent) {
|
||||
var button = thisevent.target.ancestor('a', true),
|
||||
editortable = thisevent.target.ancestor('span', true).one('table.mceLayout');
|
||||
this.toggle_collapse(button, editortable);
|
||||
}
|
||||
});
|
||||
|
||||
M.editor_collapse = M.editor_collapse || {};
|
||||
M.editor_collapse.init = function(params) {
|
||||
return new COLLAPSE(params);
|
||||
};
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["base", "node", "dom"]});
|
||||
Vendored
-1
@@ -1 +0,0 @@
|
||||
YUI.add("moodle-editor_tinymce-collapse",function(e,t){var n=function(){n.superclass.constructor.apply(this,arguments)};e.extend(n,e.Base,{toggleNodeTemplate:null,init:function(){this.initialise_toggles(10)},editors_initialised:function(){return typeof tinyMCE!="undefined"},initialise_toggles:function(t){var n=this.editors_initialised(),r=this,i;if(!n&&t){setTimeout(function(){r.initialise_toggles(t-1)},100);return}this.toggleNodeTemplate=e.Node.create('<a class="toggle_editor_toolbar" />'),this.toggleNodeTemplate.setContent(M.util.get_string("showeditortoolbar","form")),e.one("body").delegate("click",this.toggle_collapse_from_event,"a.toggle_editor_toolbar",this);for(i in tinyMCE.editors)this.setup_collapse(tinyMCE.editors[i]);tinyMCE.onAddEditor.add(e.bind(this.add_setup_collapse_listener,this))},add_setup_collapse_listener:function(t,n){n.onInit.add(e.bind(this.setup_collapse,this))},setup_collapse:function(t){var n=e.Node(t.getElement()),r=e.Node(t.getContainer()).one("> table"),i;if(!n.hasClass("collapsible"))return;if(!r)return;i=this.toggleNodeTemplate.cloneNode(!0),r.get("parentNode").insert(i,r),e.Node(t.getElement()).hasClass("collapsed")?this.toggle_collapse(i,r,0):this.toggle_collapse(i,r,1),r.setStyle("height",""),r.setStyle("width","")},toggle_collapse:function(e,t,n){var r=t.one("td.mceToolbar").ancestor("tr"),i=t.one(".mceStatusbar").ancestor("tr");typeof n=="undefined"&&(r.getStyle("display")==="none"?n=1:n=0),n===0?(r.hide(),i.hide(),e.setContent(M.util.get_string("showeditortoolbar","form"))):(r.show(),i.show(),e.setContent(M.util.get_string("hideeditortoolbar","form")))},toggle_collapse_from_event:function(e){var t=e.target.ancestor("a",!0),n=e.target.ancestor("span",!0).one("table.mceLayout");this.toggle_collapse(t,n)}}),M.editor_collapse=M.editor_collapse||{},M.editor_collapse.init=function(e){return new n(e)}},"@VERSION@",{requires:["base","node","dom"]});
|
||||
Vendored
-151
@@ -1,151 +0,0 @@
|
||||
YUI.add('moodle-editor_tinymce-collapse', function (Y, NAME) {
|
||||
|
||||
var COLLAPSE = function() {
|
||||
COLLAPSE.superclass.constructor.apply(this, arguments);
|
||||
};
|
||||
|
||||
Y.extend(COLLAPSE, Y.Base, {
|
||||
// A location to store the node toggling template so that we do not have to create it each time.
|
||||
toggleNodeTemplate : null,
|
||||
|
||||
/**
|
||||
* Set up basic values for static access.
|
||||
*/
|
||||
init : function() {
|
||||
this.initialise_toggles(10);
|
||||
},
|
||||
|
||||
/**
|
||||
* Has TinyMCE been loaded and the editors been initialised?
|
||||
* Designed mainly for IE
|
||||
* @return bool
|
||||
*/
|
||||
editors_initialised : function() {
|
||||
return typeof tinyMCE !== 'undefined';
|
||||
},
|
||||
|
||||
initialise_toggles : function(refreshes) {
|
||||
var editors_initialised = this.editors_initialised(), self = this, editor;
|
||||
if (!editors_initialised && refreshes) {
|
||||
setTimeout(function() {
|
||||
self.initialise_toggles(refreshes - 1);
|
||||
}, 100);
|
||||
return;
|
||||
}
|
||||
|
||||
// Create the toggle template for use later
|
||||
this.toggleNodeTemplate = Y.Node.create('<a class="toggle_editor_toolbar" />');
|
||||
this.toggleNodeTemplate.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
|
||||
// Delegate clicks of the toggle_editor_toolbar
|
||||
Y.one('body').delegate('click', this.toggle_collapse_from_event, 'a.toggle_editor_toolbar', this);
|
||||
|
||||
// Set up editors which have already been created
|
||||
for (editor in tinyMCE.editors) {
|
||||
this.setup_collapse(tinyMCE.editors[editor]);
|
||||
}
|
||||
|
||||
// Set up for future editors.
|
||||
// I haven't yet found a way of directly delegating the editor.onInit event. Instead we have to listen for the
|
||||
// tinyMCE.onAddEditor event, and then add a further event listener to the editor's onInit event.
|
||||
// onAddEditor is triggered before the editor has been created.
|
||||
// We use Y.Bind to ensure that context is maintained.
|
||||
tinyMCE.onAddEditor.add(Y.bind(this.add_setup_collapse_listener, this));
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup a listener for a new editor which will actually set the editor up
|
||||
* @param {Manager} mgr
|
||||
* @param {Editor} ed
|
||||
*/
|
||||
add_setup_collapse_listener : function (mgr, ed) {
|
||||
// Bind the editor.onInit function to set this editor up. This ensures we maintain our context (this)
|
||||
ed.onInit.add(Y.bind(this.setup_collapse, this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup the toggle system for the provided editor
|
||||
*
|
||||
* @param {Editor} ed The TinyMCE editor instance
|
||||
*/
|
||||
setup_collapse : function(ed) {
|
||||
var textarea = Y.Node(ed.getElement()),
|
||||
editortable = Y.Node(ed.getContainer()).one('> table'),
|
||||
thisToggleNode;
|
||||
|
||||
// Does this text area support collapsing at all?
|
||||
if (!textarea.hasClass('collapsible')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Did we find an appropriate table to work with
|
||||
if (!editortable) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Add toggle button.
|
||||
thisToggleNode = this.toggleNodeTemplate.cloneNode(true);
|
||||
editortable.get('parentNode').insert(thisToggleNode, editortable);
|
||||
|
||||
// Toggle the toolbars initially.
|
||||
if (Y.Node(ed.getElement()).hasClass('collapsed')) {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 0);
|
||||
} else {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 1);
|
||||
}
|
||||
|
||||
// When TinyMCE initialises itself, it adds a height to the table.
|
||||
// Unfortuately, the height it sets is too big for when the editor is collpsed.
|
||||
// Fortunately, the hight is not necessary, so we can just remove it.
|
||||
// (If you re-size the editor then it will remove this style attribute itself.)
|
||||
editortable.setStyle('height', '');
|
||||
editortable.setStyle('width', '');
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle the specified editor toolbars.
|
||||
*
|
||||
* @param {Node} button The toggle button which we have to change the text for
|
||||
* @param {Node} editortable The table which the tinyMCE editor is in
|
||||
* @param {Boolean} newstate The intended toggle state
|
||||
*/
|
||||
toggle_collapse : function(button, editortable, newstate) {
|
||||
var toolbar = editortable.one('td.mceToolbar').ancestor('tr'),
|
||||
statusbar = editortable.one('.mceStatusbar').ancestor('tr');
|
||||
|
||||
// Check whether we have a state already.
|
||||
if (typeof newstate === 'undefined') {
|
||||
if (toolbar.getStyle('display') === 'none') {
|
||||
newstate = 1;
|
||||
} else {
|
||||
newstate = 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Toggle the various states and update the button text to suit
|
||||
if (newstate === 0) {
|
||||
toolbar.hide();
|
||||
statusbar.hide();
|
||||
button.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
} else {
|
||||
toolbar.show();
|
||||
statusbar.show();
|
||||
button.setContent(M.util.get_string('hideeditortoolbar', 'form'));
|
||||
}
|
||||
},
|
||||
|
||||
toggle_collapse_from_event : function(thisevent) {
|
||||
var button = thisevent.target.ancestor('a', true),
|
||||
editortable = thisevent.target.ancestor('span', true).one('table.mceLayout');
|
||||
this.toggle_collapse(button, editortable);
|
||||
}
|
||||
});
|
||||
|
||||
M.editor_collapse = M.editor_collapse || {};
|
||||
M.editor_collapse.init = function(params) {
|
||||
return new COLLAPSE(params);
|
||||
};
|
||||
|
||||
|
||||
}, '@VERSION@', {"requires": ["base", "node", "dom"]});
|
||||
@@ -1,10 +0,0 @@
|
||||
{
|
||||
"name": "moodle-editor_tinymce-collapse",
|
||||
"builds": {
|
||||
"moodle-editor_tinymce-collapse": {
|
||||
"jsfiles": [
|
||||
"collapse.js"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
-146
@@ -1,146 +0,0 @@
|
||||
var COLLAPSE = function() {
|
||||
COLLAPSE.superclass.constructor.apply(this, arguments);
|
||||
};
|
||||
|
||||
Y.extend(COLLAPSE, Y.Base, {
|
||||
// A location to store the node toggling template so that we do not have to create it each time.
|
||||
toggleNodeTemplate : null,
|
||||
|
||||
/**
|
||||
* Set up basic values for static access.
|
||||
*/
|
||||
init : function() {
|
||||
this.initialise_toggles(10);
|
||||
},
|
||||
|
||||
/**
|
||||
* Has TinyMCE been loaded and the editors been initialised?
|
||||
* Designed mainly for IE
|
||||
* @return bool
|
||||
*/
|
||||
editors_initialised : function() {
|
||||
return typeof tinyMCE !== 'undefined';
|
||||
},
|
||||
|
||||
initialise_toggles : function(refreshes) {
|
||||
var editors_initialised = this.editors_initialised(), self = this, editor;
|
||||
if (!editors_initialised && refreshes) {
|
||||
setTimeout(function() {
|
||||
self.initialise_toggles(refreshes - 1);
|
||||
}, 100);
|
||||
return;
|
||||
}
|
||||
|
||||
// Create the toggle template for use later
|
||||
this.toggleNodeTemplate = Y.Node.create('<a class="toggle_editor_toolbar" />');
|
||||
this.toggleNodeTemplate.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
|
||||
// Delegate clicks of the toggle_editor_toolbar
|
||||
Y.one('body').delegate('click', this.toggle_collapse_from_event, 'a.toggle_editor_toolbar', this);
|
||||
|
||||
// Set up editors which have already been created
|
||||
for (editor in tinyMCE.editors) {
|
||||
this.setup_collapse(tinyMCE.editors[editor]);
|
||||
}
|
||||
|
||||
// Set up for future editors.
|
||||
// I haven't yet found a way of directly delegating the editor.onInit event. Instead we have to listen for the
|
||||
// tinyMCE.onAddEditor event, and then add a further event listener to the editor's onInit event.
|
||||
// onAddEditor is triggered before the editor has been created.
|
||||
// We use Y.Bind to ensure that context is maintained.
|
||||
tinyMCE.onAddEditor.add(Y.bind(this.add_setup_collapse_listener, this));
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup a listener for a new editor which will actually set the editor up
|
||||
* @param {Manager} mgr
|
||||
* @param {Editor} ed
|
||||
*/
|
||||
add_setup_collapse_listener : function (mgr, ed) {
|
||||
// Bind the editor.onInit function to set this editor up. This ensures we maintain our context (this)
|
||||
ed.onInit.add(Y.bind(this.setup_collapse, this));
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup the toggle system for the provided editor
|
||||
*
|
||||
* @param {Editor} ed The TinyMCE editor instance
|
||||
*/
|
||||
setup_collapse : function(ed) {
|
||||
var textarea = Y.Node(ed.getElement()),
|
||||
editortable = Y.Node(ed.getContainer()).one('> table'),
|
||||
thisToggleNode;
|
||||
|
||||
// Does this text area support collapsing at all?
|
||||
if (!textarea.hasClass('collapsible')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Did we find an appropriate table to work with
|
||||
if (!editortable) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Add toggle button.
|
||||
thisToggleNode = this.toggleNodeTemplate.cloneNode(true);
|
||||
editortable.get('parentNode').insert(thisToggleNode, editortable);
|
||||
|
||||
// Toggle the toolbars initially.
|
||||
if (Y.Node(ed.getElement()).hasClass('collapsed')) {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 0);
|
||||
} else {
|
||||
this.toggle_collapse(thisToggleNode, editortable, 1);
|
||||
}
|
||||
|
||||
// When TinyMCE initialises itself, it adds a height to the table.
|
||||
// Unfortuately, the height it sets is too big for when the editor is collpsed.
|
||||
// Fortunately, the hight is not necessary, so we can just remove it.
|
||||
// (If you re-size the editor then it will remove this style attribute itself.)
|
||||
editortable.setStyle('height', '');
|
||||
editortable.setStyle('width', '');
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle the specified editor toolbars.
|
||||
*
|
||||
* @param {Node} button The toggle button which we have to change the text for
|
||||
* @param {Node} editortable The table which the tinyMCE editor is in
|
||||
* @param {Boolean} newstate The intended toggle state
|
||||
*/
|
||||
toggle_collapse : function(button, editortable, newstate) {
|
||||
var toolbar = editortable.one('td.mceToolbar').ancestor('tr'),
|
||||
statusbar = editortable.one('.mceStatusbar').ancestor('tr');
|
||||
|
||||
// Check whether we have a state already.
|
||||
if (typeof newstate === 'undefined') {
|
||||
if (toolbar.getStyle('display') === 'none') {
|
||||
newstate = 1;
|
||||
} else {
|
||||
newstate = 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Toggle the various states and update the button text to suit
|
||||
if (newstate === 0) {
|
||||
toolbar.hide();
|
||||
statusbar.hide();
|
||||
button.setContent(M.util.get_string('showeditortoolbar', 'form'));
|
||||
} else {
|
||||
toolbar.show();
|
||||
statusbar.show();
|
||||
button.setContent(M.util.get_string('hideeditortoolbar', 'form'));
|
||||
}
|
||||
},
|
||||
|
||||
toggle_collapse_from_event : function(thisevent) {
|
||||
var button = thisevent.target.ancestor('a', true),
|
||||
editortable = thisevent.target.ancestor('span', true).one('table.mceLayout');
|
||||
this.toggle_collapse(button, editortable);
|
||||
}
|
||||
});
|
||||
|
||||
M.editor_collapse = M.editor_collapse || {};
|
||||
M.editor_collapse.init = function(params) {
|
||||
return new COLLAPSE(params);
|
||||
};
|
||||
@@ -1,9 +0,0 @@
|
||||
{
|
||||
"moodle-editor_tinymce-collapse": {
|
||||
"requires": [
|
||||
"base",
|
||||
"node",
|
||||
"dom"
|
||||
]
|
||||
}
|
||||
}
|
||||
+2
-12
@@ -53,7 +53,7 @@ class MoodleQuickForm_editor extends HTML_QuickForm_element {
|
||||
/** @var array options provided to initalize filepicker */
|
||||
protected $_options = array('subdirs' => 0, 'maxbytes' => 0, 'maxfiles' => 0, 'changeformat' => 0,
|
||||
'areamaxbytes' => FILE_AREA_MAX_BYTES_UNLIMITED, 'context' => null, 'noclean' => 0, 'trusttext' => 0,
|
||||
'return_types' => 7, 'collapsible' => 0, 'collapsed' => 0);
|
||||
'return_types' => 7);
|
||||
// $_options['return_types'] = FILE_INTERNAL | FILE_EXTERNAL | FILE_REFERENCE
|
||||
|
||||
/** @var array values for editor */
|
||||
@@ -365,17 +365,7 @@ class MoodleQuickForm_editor extends HTML_QuickForm_element {
|
||||
if (!is_null($this->getAttribute('onblur')) && !is_null($this->getAttribute('onchange'))) {
|
||||
$editorrules = ' onblur="'.htmlspecialchars($this->getAttribute('onblur')).'" onchange="'.htmlspecialchars($this->getAttribute('onchange')).'"';
|
||||
}
|
||||
$str .= '<div><textarea id="'.$id.'" name="'.$elname.'[text]" rows="'.$rows.'" cols="'.$cols.'" spellcheck="true"';
|
||||
$classes = array();
|
||||
if (isset($this->_options['collapsed']) && $this->_options['collapsed']) {
|
||||
$this->_options['collapsible'] = 1;
|
||||
$classes[] = 'collapsed';
|
||||
}
|
||||
if (isset($this->_options['collapsible']) && $this->_options['collapsible']) {
|
||||
$classes[] = 'collapsible';
|
||||
}
|
||||
$str .= ' class="' . implode(' ', $classes) . '"';
|
||||
$str .= $editorrules.'>';
|
||||
$str .= '<div><textarea id="'.$id.'" name="'.$elname.'[text]" rows="'.$rows.'" cols="'.$cols.'" spellcheck="true"'.$editorrules.'>';
|
||||
$str .= s($text);
|
||||
$str .= '</textarea></div>';
|
||||
|
||||
|
||||
@@ -350,7 +350,7 @@ class mod_quiz_mod_form extends moodleform_mod {
|
||||
$repeatedoptions = array();
|
||||
$repeatarray[] = $mform->createElement('editor', 'feedbacktext',
|
||||
get_string('feedback', 'quiz'), array('rows' => 3), array('maxfiles' => EDITOR_UNLIMITED_FILES,
|
||||
'noclean' => true, 'context' => $this->context, 'collapsed' => 1));
|
||||
'noclean' => true, 'context' => $this->context));
|
||||
$repeatarray[] = $mform->createElement('text', 'feedbackboundaries',
|
||||
get_string('gradeboundary', 'quiz'), array('size' => 10));
|
||||
$repeatedoptions['feedbacktext']['type'] = PARAM_RAW;
|
||||
@@ -372,7 +372,7 @@ class mod_quiz_mod_form extends moodleform_mod {
|
||||
$mform->insertElementBefore($mform->createElement('editor',
|
||||
"feedbacktext[$nextel]", get_string('feedback', 'quiz'), array('rows' => 3),
|
||||
array('maxfiles' => EDITOR_UNLIMITED_FILES, 'noclean' => true,
|
||||
'context' => $this->context, 'collapsed' => 1)),
|
||||
'context' => $this->context)),
|
||||
'boundary_add_fields');
|
||||
$mform->insertElementBefore($mform->createElement('static',
|
||||
'gradeboundarystatic2', get_string('gradeboundary', 'quiz'), '0%'),
|
||||
|
||||
@@ -104,7 +104,7 @@ abstract class question_edit_form extends question_wizard_form {
|
||||
$this->context = context::instance_by_id($record->contextid);
|
||||
|
||||
$this->editoroptions = array('subdirs' => 1, 'maxfiles' => EDITOR_UNLIMITED_FILES,
|
||||
'context' => $this->context, 'collapsed' => 1);
|
||||
'context' => $this->context);
|
||||
$this->fileoptions = array('subdirs' => 1, 'maxfiles' => -1, 'maxbytes' => -1);
|
||||
|
||||
$this->category = $category;
|
||||
@@ -186,7 +186,7 @@ abstract class question_edit_form extends question_wizard_form {
|
||||
$mform->addRule('name', null, 'required', null, 'client');
|
||||
|
||||
$mform->addElement('editor', 'questiontext', get_string('questiontext', 'question'),
|
||||
array('rows' => 15), $this->get_non_collabsible_editor_options());
|
||||
array('rows' => 15), $this->editoroptions);
|
||||
$mform->setType('questiontext', PARAM_RAW);
|
||||
|
||||
$mform->addElement('text', 'defaultmark', get_string('defaultmark', 'question'),
|
||||
@@ -196,7 +196,7 @@ abstract class question_edit_form extends question_wizard_form {
|
||||
$mform->addRule('defaultmark', null, 'required', null, 'client');
|
||||
|
||||
$mform->addElement('editor', 'generalfeedback', get_string('generalfeedback', 'question'),
|
||||
array('rows' => 10), $this->get_non_collabsible_editor_options());
|
||||
array('rows' => 10), $this->editoroptions);
|
||||
$mform->setType('generalfeedback', PARAM_RAW);
|
||||
$mform->addHelpButton('generalfeedback', 'generalfeedback', 'question');
|
||||
|
||||
@@ -694,9 +694,12 @@ abstract class question_edit_form extends question_wizard_form {
|
||||
|
||||
/**
|
||||
* Returns an array of editor options with collapsed options turned off.
|
||||
* @deprecated since 2.6
|
||||
* @return array
|
||||
*/
|
||||
protected function get_non_collabsible_editor_options() {
|
||||
return array_merge($this->editoroptions, array('collapsed' => 0));
|
||||
debugging('get_non_collabsible_editor_options() is deprecated, use $this->editoroptions instead.', DEBUG_DEVELOPER);
|
||||
return $this->editoroptions;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,5 +1,9 @@
|
||||
This files describes API changes for question type plugins.
|
||||
|
||||
=== 2.6 ===
|
||||
+ The changes in MDL-32750 were reverted in favour of the new pdw toggle toolbars
|
||||
plugin for TinyMCE. The get_non_collapsible_editor_options method has been deprecated.
|
||||
|
||||
=== 2.5 ===
|
||||
|
||||
* There have been some tweaks to the helper class that is used to write
|
||||
|
||||
Reference in New Issue
Block a user