David Cook
6d73e951be
This patch adds the ability to use a WYSIWYG editor for system preferences. The key files that I touch are: 1) admin/systempreferences.pl 2) koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences.tt 3) koha-tmpl/intranet-tmpl/prog/en/modules/admin/systempreferences.tt I also add: 4) koha-tmpl/intranet-tmpl/prog/en/includes/wysiwyg-systempreferences.inc and 5) koha-tmpl/intranet-tmpl/lib/tiny_mce/plugins/advimage This plugin is part of the TinyMCE distribution. It used to be in Koha, but then someone removed it. It's useful for preferences like "opacheader" though. *If you're using anything except IE, this should work super well. If you're using IE, it'll probably only work for keyboard input and dragging text within the editor box but not from outside of it. IE has worse security, so you can probably paste using the context menu paste. *While I think a WYSIWYG editor can be useful, there might be times where the content is displayed differently than it is in the editor because of higher level CSS and Javascript. Signed-off-by: Martin Persson <xarragon@gmail.com> Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
61 lines
2.6 KiB
C++
61 lines
2.6 KiB
C++
[% #Enable tinymce for system preferences %]
|
|
<script type="text/javascript" src="[% interface %]/lib/tiny_mce/tiny_mce.js"></script>
|
|
<script>
|
|
|
|
[%# Save TinyMCE content and trigger an event on the original element %]
|
|
function wysiwyg_change (ed){
|
|
ed.save();
|
|
var original_textarea = ed.getElement();
|
|
$(original_textarea).trigger("input");
|
|
}
|
|
|
|
tinyMCE.init({
|
|
setup : function(ed) {
|
|
ed.onInit.add(function(editor){
|
|
[%-
|
|
#Ideally, it would be nice just to use the "oninput" event, which captures keyboard input, dragging, pasting, etc.
|
|
#However, it doesn't work in IE when the event listener is for an element which is "contenteditable". Since TinyMCE
|
|
#uses a "contenteditable" body element in an iframe element, it's never going to fire in IE.
|
|
|
|
#We can get around this a bit by using "onkeyup" and "ondragend".
|
|
|
|
#"ondragend" occurs after you drag content within the editor. "ondrop" is for when you drag content from outside the
|
|
#editor but it doesn't "dirty" the editor, which makes it useless, as the editor won't save unless it's dirty.
|
|
#"onpaste" is useless in this same way.
|
|
|
|
#Reference:
|
|
#https://developer.mozilla.org/en-US/docs/Web/Events/input
|
|
#https://connect.microsoft.com/IE/feedbackdetail/view/794285
|
|
-%]
|
|
|
|
tinyMCE.dom.Event.bind(editor.getBody(), 'input keyup dragend', function(e){
|
|
if (ed.isDirty()){
|
|
wysiwyg_change(ed);
|
|
}
|
|
});
|
|
});
|
|
|
|
// Register change when TinyMCE command returns isDirty()
|
|
ed.onExecCommand.add(function(ed, cmd, ui, val) {
|
|
if (ed.isDirty()){
|
|
wysiwyg_change(ed);
|
|
}
|
|
});
|
|
|
|
},
|
|
mode : "specific_textareas",
|
|
editor_selector : "mce",
|
|
theme : "advanced",
|
|
content_css : "[% themelang %]/css/tinymce.css",
|
|
plugins : "table,save,advhr,advlink,contextmenu,advimage",
|
|
theme_advanced_buttons1 : "bold,italic,|,cut,copy,paste,|,justifyleft,justifycenter,justifyright,justifyfull,|,formatselect,|,image,link,unlink,anchor,cleanup,help,code,advhr,",
|
|
theme_advanced_buttons2 : "tablecontrols,|,bullist,numlist,|,outdent,indent,|,undo,redo,|,removeformat,|,visualaid,|,sub,sup,|,charmap|,forecolor,backcolor",
|
|
theme_advanced_buttons3 : "",
|
|
theme_advanced_toolbar_location : "top",
|
|
theme_advanced_toolbar_align : "left",
|
|
theme_advanced_path_location : "bottom",
|
|
theme_advanced_resizing : true,
|
|
apply_source_formatting : true
|
|
});
|
|
//]]>
|
|
</script>
|