mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-04-02 01:52:10 +09:00
#1087 ckeditor 정리
- xeEditor plugin 제거 및 app로 변경 - ckeditor config를 app 파일로 이동 - 툴바 접기 설정이 잘못 반영된 문제 수정
This commit is contained in:
bnu
parent
a6c15ffb0e
commit
e1c6be4bf3
7 changed files with 109 additions and 119 deletions
Binary file not shown.
|
Before Width: | Height: | Size: 3.5 KiB |
|
|
@ -1,2 +1 @@
|
|||
ckeditor/ckeditor.js
|
||||
xeEditor.plugin.js
|
||||
|
|
|
|||
|
|
@ -1,76 +0,0 @@
|
|||
(function($){
|
||||
"use strict";
|
||||
var App = window.xe.getApp('xeEditorApp')[0];
|
||||
var CK = window.CKEDITOR;
|
||||
|
||||
var xeCKEditor = App.createPlugin("CKEditor", {
|
||||
instance_prefix : 'ckeditor_instance_',
|
||||
|
||||
init : function() {
|
||||
var self = this;
|
||||
CKEDITOR.on('instanceCreated', function(evt){
|
||||
self.cast('CKEDITOR_CREATED');
|
||||
});
|
||||
|
||||
CKEDITOR.on('ready', function(evt){
|
||||
self.cast('CKEDITOR_READY');
|
||||
});
|
||||
|
||||
CKEDITOR.on('instanceReady', function(evt){
|
||||
self.cast('CKEDITOR_INSTANCE_READY');
|
||||
});
|
||||
|
||||
CKEDITOR.on('instanceLoaded', function(evt){
|
||||
self.cast('CKEDITOR_LOADED');
|
||||
});
|
||||
},
|
||||
editorInit : function(sequence, obj) {
|
||||
var self = this;
|
||||
var $editor_area = jQuery("#ckeditor_instance_"+sequence);
|
||||
var $form = $editor_area.closest('form');
|
||||
var $contentField = $('input[name=' + obj.content_key + ']');
|
||||
var ckconfig = obj.ckconfig || {};
|
||||
ckconfig.xe_editor_sequence = sequence;
|
||||
|
||||
$form.attr('editor_sequence', sequence);
|
||||
|
||||
var insance = CKEDITOR.appendTo(this.instance_prefix + sequence, ckconfig, obj.content);
|
||||
$editor_area.data('cke_instance', insance);
|
||||
|
||||
insance.on('change', function(e){
|
||||
if($contentField.length){
|
||||
$contentField.val(e.editor.getData());
|
||||
}
|
||||
});
|
||||
this.sequence = sequence;
|
||||
window.editorRelKeys[sequence] = {};
|
||||
window.editorRelKeys[sequence].primary = $form.find('[name='+obj.primary_key+']')[0];
|
||||
window.editorRelKeys[sequence].content = $form.find('[name='+obj.content_key+']')[0];
|
||||
window.editorRelKeys[sequence].func = function(seq) {
|
||||
return self.getContent.call(self, seq);
|
||||
};
|
||||
window.editorRelKeys[sequence].pasteHTML = function(text){
|
||||
insance.insertHtml(text, 'html');
|
||||
};
|
||||
},
|
||||
getContent : function(seq) {
|
||||
var self = this;
|
||||
var content = _getCkeInstance(seq).getData();
|
||||
self.cast('GET_CONTENT', [content]);
|
||||
|
||||
return content;
|
||||
},
|
||||
API_ONREADY : function() {
|
||||
},
|
||||
API_GET_CONTENT: function() {
|
||||
},
|
||||
getInstance : function(name) {
|
||||
return CKEDITOR.instances[name];
|
||||
},
|
||||
autosave: function(seq) {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
App.registerPlugin(new xeCKEditor());
|
||||
})(jQuery);
|
||||
|
|
@ -208,6 +208,7 @@ class editorModel extends editor
|
|||
if(!$colorset) $colorset = 'moono';
|
||||
Context::set('colorset', $colorset);
|
||||
Context::set('skin', $skin);
|
||||
Context::set('module_type', $option->module_type);
|
||||
|
||||
if($skin=='dreditor')
|
||||
{
|
||||
|
|
@ -332,6 +333,7 @@ class editorModel extends editor
|
|||
$editor_config = $this->getEditorConfig($module_srl);
|
||||
|
||||
$config = new stdClass();
|
||||
$config->module_type = $type;
|
||||
|
||||
// Configurations listed according to a type
|
||||
if($type == 'document')
|
||||
|
|
@ -374,6 +376,7 @@ class editorModel extends editor
|
|||
}
|
||||
// Pre-set option variables of editor
|
||||
$option = new stdClass();
|
||||
$option->module_type = $config->module_type;
|
||||
$option->skin = $config->editor_skin;
|
||||
$option->content_style = $config->content_style;
|
||||
$option->content_font = $config->content_font;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,6 @@
|
|||
.cke_button__xe_component_label {
|
||||
display: inline !important;
|
||||
}
|
||||
.cke_button__xe_component_icon {
|
||||
display: none !important;
|
||||
}
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
{@ $css_content .= chr(125);}
|
||||
<!--@endif-->
|
||||
|
||||
<div id="ckeditor_instance_{$editor_sequence}"></div>
|
||||
<div id="ckeditor_instance_{$editor_sequence}" 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}px;"></div>
|
||||
|
||||
<!--%load_js_plugin("jquery.fileupload")-->
|
||||
<div cond="$allow_fileupload" id="xe-uploader-container-{$editor_sequence}" class="xe-uploader-container clearfix" data-editor-sequence="{$editor_sequence}">
|
||||
|
|
@ -58,37 +58,14 @@
|
|||
<script>
|
||||
(function($){
|
||||
"use strict";
|
||||
var editor_primary_key_name = '{$editor_primary_key_name}';
|
||||
var editor_content_key_name = '{$editor_content_key_name}';
|
||||
|
||||
// editor
|
||||
$(function(){
|
||||
var pl = xe.getApp('xeEditorApp')[0].getPlugin('ckeditor')[0];
|
||||
var editor_id = 'ckeditor_instance_{$editor_sequence}';
|
||||
|
||||
var ckconfig = {
|
||||
height: '{$editor_height}',
|
||||
bodyClass: 'xe_content editable',
|
||||
toolbarCanCollapse: true,
|
||||
toolbarGroups: [
|
||||
{ name: 'clipboard', groups: [ 'undo', 'clipboard' ] },
|
||||
{ name: 'editing', groups: [ 'find', 'selection' ] },
|
||||
{ name: 'insert' },
|
||||
{ name: 'tools' },
|
||||
{ name: 'document', groups: [ 'mode' ] },
|
||||
'/',
|
||||
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
|
||||
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
|
||||
{ name: 'links' },
|
||||
{ name: 'styles' },
|
||||
{ name: 'colors' },
|
||||
{ name: 'others' }
|
||||
],
|
||||
skin: '{$colorset}',
|
||||
allowedContent: true,
|
||||
contentsCss: '{$content_style_path}/editor.css',
|
||||
removePlugins: 'stylescombo,language',
|
||||
removeButtons: 'Save,Preview,Print,Cut,Copy,Paste'
|
||||
xe_editor_sequence: {$editor_sequence}
|
||||
};
|
||||
<!--@if($enable_component)-->
|
||||
ckconfig.extraPlugins = 'xe_component';
|
||||
|
|
@ -104,19 +81,19 @@
|
|||
|
||||
<!--@if(!$enable_default_component)-->
|
||||
ckconfig.toolbar = [];
|
||||
ckconfig.toolbarCanCollapse = true;
|
||||
ckconfig.toolbarCanCollapse = false;
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if($module_type === 'comment')-->
|
||||
ckconfig.toolbarStartupExpanded = false;
|
||||
<!--@endif-->
|
||||
|
||||
<!--@if($css_content)-->CKEDITOR.addCss('{$css_content}');<!--@end-->
|
||||
|
||||
pl.editorInit("{$editor_sequence}", {
|
||||
'ckconfig' : ckconfig,
|
||||
'content': jQuery('[name='+editor_content_key_name+']').val(),
|
||||
'primary_key': editor_primary_key_name,
|
||||
'content_key': editor_content_key_name
|
||||
$('#ckeditor_instance_{$editor_sequence}').XeCkEditor({
|
||||
ckeconfig : ckconfig,
|
||||
content_field: jQuery('[name={$editor_content_key_name}]')
|
||||
});
|
||||
|
||||
var INS = pl.getInstance('{$editor_sequence}');
|
||||
});
|
||||
|
||||
// uploader
|
||||
|
|
@ -131,6 +108,7 @@
|
|||
<!--@endif-->
|
||||
})(jQuery);
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.clearfix:before, .clearfix:after {
|
||||
content: "";
|
||||
|
|
|
|||
|
|
@ -1,32 +1,112 @@
|
|||
(function($){
|
||||
"use strict";
|
||||
var XeEditorApp = xe.createApp('xeEditorApp', {
|
||||
var settings = {
|
||||
bodyClass: 'xe_content editable',
|
||||
toolbarCanCollapse: true,
|
||||
toolbarGroups: [
|
||||
{ name: 'clipboard', groups: [ 'undo', 'clipboard' ] },
|
||||
{ name: 'editing', groups: [ 'find', 'selection' ] },
|
||||
{ name: 'insert' },
|
||||
{ name: 'tools' },
|
||||
{ name: 'document', groups: [ 'mode' ] },
|
||||
'/',
|
||||
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
|
||||
{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
|
||||
{ name: 'links' },
|
||||
{ name: 'styles' },
|
||||
{ name: 'colors' },
|
||||
{ name: 'others' },
|
||||
],
|
||||
allowedContent: true,
|
||||
removePlugins: 'stylescombo,language',
|
||||
removeButtons: 'Save,Preview,Print,Cut,Copy,Paste',
|
||||
};
|
||||
|
||||
var XeCkEditor = xe.createApp('XeCkEditor', {
|
||||
editor_sequence: null,
|
||||
init : function() {
|
||||
var self = this;
|
||||
CKEDITOR.on('instanceCreated', function(evt){
|
||||
self.cast('CKEDITOR_CREATED');
|
||||
});
|
||||
|
||||
CKEDITOR.on('ready', function(evt){
|
||||
self.cast('CKEDITOR_READY');
|
||||
});
|
||||
|
||||
CKEDITOR.on('instanceReady', function(evt){
|
||||
self.cast('CKEDITOR_INSTANCE_READY');
|
||||
});
|
||||
|
||||
CKEDITOR.on('instanceLoaded', function(evt){
|
||||
self.cast('CKEDITOR_LOADED');
|
||||
});
|
||||
},
|
||||
API_ONREADY : function() {
|
||||
},
|
||||
editorInit : function(containerEl, opts) {
|
||||
var self = this;
|
||||
var $containerEl = containerEl;
|
||||
var $form = $containerEl.closest('form');
|
||||
var $contentField = opts.content_field;
|
||||
var data = $containerEl.data();
|
||||
var editor_sequence = $containerEl.data().editorSequence;
|
||||
var ckeconfig = $.extend({}, settings, opts.ckeconfig || {});
|
||||
|
||||
this.editor_sequence = data.editorSequence;
|
||||
|
||||
$form.attr('editor_sequence', data.editorSequence);
|
||||
|
||||
var insance = CKEDITOR.appendTo($containerEl[0], ckeconfig, $contentField.val());
|
||||
$containerEl.data('cke_instance', insance);
|
||||
|
||||
insance.on('change', function(e){
|
||||
if($contentField.length){
|
||||
$contentField.val(e.editor.getData());
|
||||
}
|
||||
});
|
||||
|
||||
window.editorRelKeys[data.editorSequence] = {};
|
||||
window.editorRelKeys[data.editorSequence].primary = $form.find('[name='+data.editorPrimaryKeyName+']')[0];
|
||||
window.editorRelKeys[data.editorSequence].content = $form.find('[name='+data.editorContentKeyName+']')[0];
|
||||
window.editorRelKeys[data.editorSequence].func = function(seq) {
|
||||
return self.getContent.call(self, seq);
|
||||
};
|
||||
window.editorRelKeys[data.editorSequence].pasteHTML = function(text){
|
||||
insance.insertHtml(text, 'html');
|
||||
};
|
||||
},
|
||||
getContent : function(seq) {
|
||||
this.cast('GET_CONTENT');
|
||||
var self = this;
|
||||
var content = _getCkeInstance(seq).getData();
|
||||
self.cast('GET_CONTENT', [content]);
|
||||
|
||||
return content;
|
||||
},
|
||||
getInstance : function(name) {
|
||||
return CKEDITOR.instances[name];
|
||||
},
|
||||
API_EDITOR_CREATED : function(){
|
||||
},
|
||||
});
|
||||
|
||||
// Shortcut function in jQuery
|
||||
$.fn.xeEditorApp = function(opts) {
|
||||
var u = new XeEditorApp(this.eq(0), opts);
|
||||
if(u) xe.registerApp(u);
|
||||
$.fn.XeCkEditor = function(opts) {
|
||||
var u = new XeCkEditor(this.eq(0), opts);
|
||||
|
||||
if(u) {
|
||||
xe.registerApp(u);
|
||||
u.editorInit(this.eq(0), opts);
|
||||
}
|
||||
|
||||
return u;
|
||||
};
|
||||
|
||||
// Shortcut function in XE
|
||||
window.xe.createXeEditor = function() {
|
||||
var u = new XeEditorApp();
|
||||
window.xe.XeCkEditor = function() {
|
||||
var u = new XeCkEditor();
|
||||
|
||||
return u;
|
||||
};
|
||||
var u = new XeEditorApp();
|
||||
xe.registerApp(u);
|
||||
|
||||
})(jQuery);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue