TineMCE refactoring

Unified all tinyMCE instances used across AAC, now they are initiated in one single file
+ added option to upload images within editor (CTRL-C CTRL-V)
+ there is new folder: user/, which will be used for all user generated data, like image uploads, guild images, etc.
This commit is contained in:
slawkens
2023-02-02 15:41:33 +01:00
parent 77460b0832
commit 9de8145f82
7 changed files with 133 additions and 85 deletions

View File

@@ -3,8 +3,7 @@
<div class="card-header">
<h5 class="m-0">{% if action == 'edit' %}Edit{% else %}Add{% endif %} page</h5>
</div>
<form class="form-horizontal" method="post"
action="?p=pages&action={% if action == 'edit' %}edit{% else %}add{% endif %}">
<form id="form" class="form-horizontal" method="post" action="?p=pages&action={% if action == 'edit' %}edit{% else %}add{% endif %}">
{% if action == 'edit' %}
<input type="hidden" name="id" value="{{ id }}"/>
{% endif %}
@@ -41,65 +40,51 @@
{% if not php %}
<div class="form-group row">
<label for="enable_tinymce">Enable TinyMCE
<input type="checkbox" id="enable_tinymce" name="enable_tinymce"
title="Check if you want to use TinyMCE Editor"
value="1"{% if enable_tinymce %} checked{% endif %}{% if action == 'edit' %} disabled{% endif %}/>
<input type="checkbox" id="enable_tinymce" name="enable_tinymce" title="Check if you want to use TinyMCE Editor" value="1"{% if enable_tinymce %} checked{% endif %}{% if action == 'edit' %} disabled{% endif %}/>
{% if action == 'edit' %}
<input type="hidden" name="enable_tinymce" value="{% if enable_tinymce %}1{% else %}0{% endif %}"/>
{% endif %}
</label>
</div>
{% endif %}
<label for="editor">Content</label>
<div class="form-group row">
<label for="body">Content</label>
<textarea class="form-control" id="body" name="body" maxlength="65000" cols="50"
rows="10">{{ body|raw }}</textarea>
<textarea class="form-control" id="editor" name="body" maxlength="65000" cols="50" rows="10">{{ body|raw }}</textarea>
</div>
</div>
<div class="card-footer">
<button type="submit" class="btn btn-info"><i class="fas fa-update"></i> Update</button>
<button type="button" onclick="window.location = '{{ constant('ADMIN_URL') }}?p=pages';" class="btn btn-danger float-right"><i class="fas fa-cancel"></i> Cancel</button>
</div>
</form>
</div>
<script type="text/javascript" src="{{ constant('BASE_URL') }}tools/tinymce/tinymce.min.js"></script>
{{ include('tinymce.html.twig') }}
<script type="text/javascript">
$(function () {
$('#enable_tinymce').on('change', function (e) {
if (!this.checked) {
tinymce.remove('#body');
tinymce.remove('#editor');
} else {
if (tinymce.editors.length > 0) {
if (tinymce.get('#editor')!== null){
tinymce.activeEditor.show();
} else {
init_tinymce();
tinymceInit();
}
}
});
{% if not php and enable_tinymce %}
init_tinymce();
tinymceInit();
{% endif %}
function init_tinymce() {
tinymce.init({
selector: "#body",
theme: "modern",
plugins: 'code print preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists textcolor wordcount spellchecker imagetools contextmenu colorpicker textpattern help emoticons',
toolbar1: 'formatselect | bold italic strikethrough forecolor backcolor | emoticons link | alignleft aligncenter alignright alignjustify | numlist bullist outdent indent | removeformat code',
image_advtab: true,
relative_urls: false,
remove_script_host: false,
document_base_url: "{{ constant('BASE_URL') }}"
});
}
function decodeHtml(html) {
var txt = document.createElement("textarea");
txt.innerHTML = html;
return txt.value;
}
});
</script> {% endif %}
</script>
{% endif %}