mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-01-22 20:59:55 +09:00
Separate editor and uploader related PHP and JS code into their own native files
This commit is contained in:
Kijin Sung
parent
d127e334b0
commit
579201fe7c
5 changed files with 308 additions and 245 deletions
|
|
@ -1,42 +1,17 @@
|
|||
<config autoescape="on" />
|
||||
|
||||
<!--// Configuration -->
|
||||
{@
|
||||
$css_var = new stdClass;
|
||||
$css_var->colorset = $colorset;
|
||||
$css_var->content_font = $content_font ?: 'none';
|
||||
$css_var->content_font_size = $content_font_size ?: 'none';
|
||||
$css_var->content_line_height = $content_line_height ?: 'none';
|
||||
$css_var->content_word_break = $content_word_break ?: 'none';
|
||||
$css_var->content_paragraph_spacing = $content_paragraph_spacing ?: 'none';
|
||||
<include target="config.blade.php" />
|
||||
|
||||
$css_file_list = array_values($editor_additional_css ?: []);
|
||||
$css_content = '';
|
||||
<!--// CSS -->
|
||||
<load target="css/ckeditor.scss" vars="$ckconfig->css_vars" />
|
||||
<load target="^/common/css/xeicon/xeicon.min.css" />
|
||||
|
||||
$filemtime1 = filemtime(RX_BASEDIR . 'common/js/plugins/ckeditor/ckeditor/ckeditor.js');
|
||||
$filemtime2 = file_exists(RX_BASEDIR . 'common/js/plugins/ckeditor/ckeditor/config.js') ? filemtime(RX_BASEDIR . 'common/js/plugins/ckeditor/ckeditor/config.js') : 0;
|
||||
$filemtimestamp = max($filemtime1, $filemtime2, $editor_config_timestamp ?? 0);
|
||||
|
||||
// Start with fixed min-height to prevent layout shift when editor is loaded.
|
||||
if ($editor_toolbar_hide):
|
||||
$editor_height_fixed = $editor_height + 55;
|
||||
elseif ($editor_toolbar === 'simple'):
|
||||
$editor_height_fixed = $editor_height + 71;
|
||||
else:
|
||||
$editor_height_fixed = $editor_height + 137;
|
||||
endif;
|
||||
|
||||
if (str_contains($_SERVER['HTTP_USER_AGENT'], 'Firefox/')):
|
||||
$editor_height_fixed += 2;
|
||||
endif;
|
||||
}
|
||||
|
||||
<!-- CSS -->
|
||||
<load target="css/ckeditor.scss" vars="$css_var" />
|
||||
<load target="../../../../common/css/xeicon/xeicon.min.css" />
|
||||
|
||||
<!-- JS -->
|
||||
<!--// JS -->
|
||||
<!--%load_js_plugin("ckeditor")-->
|
||||
<load target="../../tpl/js/editor_common.js" />
|
||||
<load target="../../tpl/js/editor.app.js" />
|
||||
<load target="js/editor.js" />
|
||||
<load target="js/xe_interface.js" />
|
||||
|
||||
<script>
|
||||
|
|
@ -44,192 +19,25 @@
|
|||
</script>
|
||||
|
||||
<!--@if($enable_autosave)-->
|
||||
<input type="hidden" name="_saved_doc_title" value="{(isset($saved_doc) && $saved_doc) ? escape($saved_doc->title) : ''}" />
|
||||
<input type="hidden" name="_saved_doc_content" value="{(isset($saved_doc) && $saved_doc) ? escape($saved_doc->content) : ''}" />
|
||||
<input type="hidden" name="_saved_doc_document_srl" value="{(isset($saved_doc) && $saved_doc) ? $saved_doc->document_srl : ''}" />
|
||||
<input type="hidden" name="_saved_doc_title" value="{empty($saved_doc) ? '' : $saved_doc->title|escape}" />
|
||||
<input type="hidden" name="_saved_doc_content" value="{empty($saved_doc) ? '' : $saved_doc->content|escape}" />
|
||||
<input type="hidden" name="_saved_doc_document_srl" value="{empty($saved_doc) ? '' : $saved_doc->document_srl}" />
|
||||
<input type="hidden" name="_saved_doc_message" value="{$lang->msg_load_saved_doc}" />
|
||||
<!--@end-->
|
||||
|
||||
<div id="ckeditor_instance_{$editor_sequence}" class="rx_ckeditor" data-editor-sequence="{$editor_sequence}" data-editor-primary-key-name="{$editor_primary_key_name}" data-editor-content-key-name="{$editor_content_key_name}" style="min-height:{$editor_height_fixed}px;"></div>
|
||||
<!--// Main Editor Area -->
|
||||
<div id="ckeditor_instance_{$editor_sequence}" class="rx_ckeditor"
|
||||
data-editor-sequence="{$editor_sequence}"
|
||||
data-editor-primary-key-name="{$editor_primary_key_name}"
|
||||
data-editor-content-key-name="{$editor_content_key_name}"
|
||||
data-editor-config="{json_encode($ckconfig)|escape}"
|
||||
style="min-height:{$ckconfig->initial_height}px;">
|
||||
</div>
|
||||
|
||||
<p cond="$enable_autosave" class="editor_autosaved_message autosave_message" id="editor_autosaved_message_{$editor_sequence}"> </p>
|
||||
<!--@if($enable_autosave)-->
|
||||
<p id="editor_autosaved_message_{$editor_sequence}" class="editor_autosaved_message autosave_message"> </p>
|
||||
<!--@endif-->
|
||||
|
||||
<block cond="$allow_fileupload">
|
||||
<include target="file_upload.html" />
|
||||
</block>
|
||||
|
||||
<script>
|
||||
jQuery(function($){
|
||||
"use strict";
|
||||
<!--@if(!$filemtime2)-->CKEDITOR.config.customConfig = '';<!--@endif-->
|
||||
|
||||
// Import CSS content from PHP.
|
||||
var css_content = {json_encode($css_content)};
|
||||
|
||||
// Get default font name and list of other supported fonts.
|
||||
var default_font_name = {json_encode($content_font ? trim(array_first(explode(',', $content_font)), '\'" ') : null)};
|
||||
var default_font_fullname = {json_encode($content_font ?: null)};
|
||||
if (default_font_fullname === null && window.getComputedStyle) {
|
||||
var test_content = $('<div class="rhymix_content xe_content"></div>').hide().appendTo($(document.body));
|
||||
var test_styles = window.getComputedStyle(test_content[0], null);
|
||||
if (test_styles && test_styles.getPropertyValue) {
|
||||
default_font_fullname = test_styles.getPropertyValue("font-family");
|
||||
if (default_font_fullname) {
|
||||
default_font_name = $.trim(default_font_fullname.split(',')[0].replace(/['"]/g, ''));
|
||||
css_content = ".rhymix_content.editable { font-family:" + default_font_fullname + "; } " + css_content;
|
||||
}
|
||||
}
|
||||
}
|
||||
var font_list = [];
|
||||
<!--@foreach($lang->edit->fontlist as $fontname)-->
|
||||
font_list.push({json_encode(strval($fontname))});
|
||||
<!--@endforeach-->
|
||||
if (default_font_fullname !== null && !$.inArray(default_font_fullname, font_list)) {
|
||||
font_list.push(default_font_fullname);
|
||||
}
|
||||
font_list = $.map(font_list, function(val) {
|
||||
return $.trim(val.split(",")[0]) + "/" + val;
|
||||
}).join(";");
|
||||
|
||||
// Get default font size and list of other supported sizes.
|
||||
var default_font_size = {json_encode(strval($content_font_size ?: '13'))};
|
||||
default_font_size = parseInt(default_font_size.replace(/\D/, ''), 10);
|
||||
var font_sizes = [8, 9, 10, 11, 12, 13, 14, 15, 16, 18, 20, 24, 28, 32, 36, 40, 48];
|
||||
if (!$.inArray(default_font_size, font_sizes)) {
|
||||
font_sizes.push(default_font_size);
|
||||
font_sizes.sort();
|
||||
}
|
||||
font_sizes = $.map(font_sizes, function(val) {
|
||||
return val + "/" + val + "px";
|
||||
}).join(";");
|
||||
|
||||
// Apply auto dark mode.
|
||||
var editor_skin = '{$colorset}';
|
||||
var editor_color = null;
|
||||
<!--@if($editor_auto_dark_mode)-->
|
||||
$('body').addClass('cke_auto_dark_mode');
|
||||
if (getColorScheme() === 'dark') {
|
||||
if (editor_skin !== 'moono-lisa' ) {
|
||||
editor_skin = 'moono-dark';
|
||||
}
|
||||
}
|
||||
<!--@endif-->
|
||||
|
||||
// Initialize CKEditor settings.
|
||||
var settings = {
|
||||
ckeconfig: {
|
||||
height: '{$editor_height}',
|
||||
skin: editor_skin,
|
||||
contentsCss: {json_encode($css_file_list)},
|
||||
xe_editor_sequence: {$editor_sequence},
|
||||
font_defaultLabel: default_font_name,
|
||||
font_names: font_list,
|
||||
fontSize_defaultLabel: default_font_size,
|
||||
fontSize_sizes: font_sizes,
|
||||
toolbarCanCollapse: true,
|
||||
allowedContent: true,
|
||||
startupFocus: {json_encode($editor_focus)},
|
||||
language: "{str_replace('jp','ja',$lang_type)}",
|
||||
iframe_attributes: {},
|
||||
versionCheck: false
|
||||
},
|
||||
loadXeComponent: true,
|
||||
enableToolbar: true
|
||||
};
|
||||
|
||||
// Add style-sheet for the WYSIWYG
|
||||
$(document.getElementsByTagName('link')).each(function() {
|
||||
if ($(this).attr('rel') == 'stylesheet') {
|
||||
settings.ckeconfig.contentsCss.push($(this).attr('href'));
|
||||
}
|
||||
});
|
||||
|
||||
// Prevent removal of icon fonts and Google code.
|
||||
CKEDITOR.dtd.$removeEmpty.i = 0;
|
||||
CKEDITOR.dtd.$removeEmpty.ins = 0;
|
||||
|
||||
// Set the timestamp for plugins.
|
||||
CKEDITOR.timestamp = '{$filemtimestamp}';
|
||||
|
||||
// Add editor components.
|
||||
<!--@if($enable_component)-->
|
||||
{@ $xe_component = array(); }
|
||||
<!--@foreach($component_list as $component_name => $component)-->
|
||||
{@ $xe_component[$component_name] = escape($component->title, false)}
|
||||
<!--@endforeach-->
|
||||
settings.ckeconfig.xe_component_arrays = {json_encode($xe_component)};
|
||||
<!--@else-->
|
||||
settings.ckeconfig.xe_component_arrays = {};
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if(!$enable_default_component)-->
|
||||
settings.enableToolbar = false;
|
||||
settings.ckeconfig.toolbarCanCollapse = false;
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if(!$enable_component)-->
|
||||
settings.loadXeComponent = false;
|
||||
<!--@endif-->
|
||||
|
||||
// Set default toolbar status.
|
||||
settings.ckeconfig.toolbarStartupExpanded = {$editor_toolbar_hide ? 'false' : 'true'};
|
||||
|
||||
// Add or remove plugins based on Rhymix configuration.
|
||||
{@ $editor_additional_plugins[] = 'rx_upload'}
|
||||
<!--@if($editor_additional_plugins)-->
|
||||
settings.ckeconfig.extraPlugins = {json_encode(implode(',', $editor_additional_plugins))};
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if($editor_remove_plugins)-->
|
||||
settings.ckeconfig.removePlugins = {json_encode(implode(',', $editor_remove_plugins))};
|
||||
<!--@endif-->
|
||||
|
||||
// https://github.com/rhymix/rhymix/issues/932
|
||||
if (CKEDITOR.env.iOS) {
|
||||
settings.ckeconfig.extraPlugins = (settings.ckeconfig.extraPlugins ? (settings.ckeconfig.extraPlugins + ',') : '') + 'divarea,ios_enterkey';
|
||||
settings.ckeconfig.removePlugins = (settings.ckeconfig.removePlugins ? (settings.ckeconfig.removePlugins + ',') : '') + 'enterkey';
|
||||
settings.loadXeComponent = false;
|
||||
var additional_styles = '.cke_wysiwyg_div { padding: 8px !important; }';
|
||||
additional_styles += 'html { min-width: unset; min-height: unset; width: unset; height: unset; margin: unset; padding: unset; }';
|
||||
$('head').append('<st' + 'yle>' + additional_styles + String(css_content).replace(/\.rhymix_content\.editable/g, '.cke_wysiwyg_div') + '</st' + 'yle>');
|
||||
}
|
||||
|
||||
// Define the simple toolbar.
|
||||
<!--@if($editor_toolbar === 'simple')-->
|
||||
CKEDITOR.toolbarMode = 'simple';
|
||||
settings.ckeconfig.toolbar = [
|
||||
{ name: 'styles', items: [ 'Font', 'FontSize', '-', 'Bold', 'Italic', 'Underline', 'Strike', 'TextColor', 'BGColor' ] },
|
||||
{ name: 'paragraph', items: [ 'JustifyLeft', 'JustifyCenter', 'JustifyRight' ] },
|
||||
{ name: 'clipboard', items: [ 'Cut', 'Copy', 'Paste' ] },
|
||||
{ name: 'insert', items: [ 'Link', 'Image', 'Table' ] },
|
||||
{ name: 'tools', items: [ 'Maximize', '-', 'Source' ] }
|
||||
];
|
||||
<!--@else-->
|
||||
CKEDITOR.toolbarMode = 'default';
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if(!$html_mode)-->
|
||||
settings.ckeconfig.removeButtons = 'Save,Preview,Print,Cut,Copy,Paste,Source';
|
||||
<!--@endif-->
|
||||
|
||||
CKEDITOR.addCss(css_content);
|
||||
|
||||
// Initialize CKEditor.
|
||||
var ckeApp = $('#ckeditor_instance_{$editor_sequence}').XeCkEditor(settings);
|
||||
|
||||
// Add use_editor and use_html fields to parent form.
|
||||
var parentform = $('#ckeditor_instance_{$editor_sequence}').closest('form');
|
||||
var use_editor = parentform.find("input[name='use_editor']");
|
||||
var use_html = parentform.find("input[name='use_html']");
|
||||
if (use_editor.length) {
|
||||
use_editor.val("Y");
|
||||
} else {
|
||||
parentform.append('<input type="hidden" name="use_editor" value="Y" />');
|
||||
}
|
||||
if (use_html.length) {
|
||||
use_html.val("Y");
|
||||
} else {
|
||||
parentform.append('<input type="hidden" name="use_html" value="Y" />');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<!--@if($allow_fileupload)-->
|
||||
<include target="file_upload.html" />
|
||||
<!--@endif-->
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue