에디터 변경

hwe/b_dipcenter.php

@@ -52,19 +52,15 @@ if ($me['level'] >= 5) {
 var editable = <?=($me['level']>=5?'true':'false')?>;
 </script>
 <?=WebUtil::printJS('../e_lib/jquery-3.3.1.min.js')?>
-<?=WebUtil::printJS('../e_lib/trumbowyg/trumbowyg.min.js')?>
-<?=WebUtil::printJS('../e_lib/trumbowyg/langs/ko.min.js')?>
-<?=WebUtil::printJS('../e_lib/trumbowyg/plugins/colors/trumbowyg.colors.min.js')?>
-<?=WebUtil::printJS('../e_lib/trumbowyg/plugins/fontfamily/trumbowyg.fontfamily.js')?>
-<?=WebUtil::printJS('../e_lib/trumbowyg/trumbowyg.fontsize.js')?>
+<?=WebUtil::printJS('../e_lib/bootstrap.bundle.min.js')?>
+<?=WebUtil::printJS('../e_lib/summernote/summernote-bs4.min.js')?>
+<?=WebUtil::printJS('../e_lib/summernote/lang/summernote-ko-KR.js')?>
 
 <?=WebUtil::printJS('../d_shared/common_path.js')?>
 <?=WebUtil::printJS('js/dipcenter.js')?>
 
 <?=WebUtil::printCSS('../e_lib/bootstrap.min.css')?>
-<?=WebUtil::printCSS('../e_lib/trumbowyg/ui/trumbowyg.min.css')?>
-<?=WebUtil::printCSS('../e_lib/trumbowyg/plugins/colors/ui/trumbowyg.colors.css')?>
-<?=WebUtil::printCSS('../e_lib/trumbowyg/trumbowyg.fontsize.css')?>
+<?=WebUtil::printCSS('../e_lib/summernote/summernote-bs4.css')?>
 <?=WebUtil::printCSS('../d_shared/common.css')?>
 <?=WebUtil::printCSS('css/common.css')?>
 <?=WebUtil::printCSS('css/dipcenter.css')?>

hwe/css/dipcenter.css

@@ -1,4 +1,23 @@
 #scoutMsgForm .viewer{
     max-height:200px;
     overflow: hidden;
+}
+
+.note-editor.card {
+    background:inherit;
+    color:inherit;
+    font-family: inherit;
+    border:none;
+}
+
+.note-editor.note-frame .note-editing-area .note-editable {
+    background:inherit;
+    color:inherit;
+    font-family: inherit;
+    padding:0;
+}
+
+.note-editor.note-frame .note-statusbar{
+    background-color:#444444;
+    border-top: 1px solid rgba(0,0,0,0.125);
 }

hwe/js/dipcenter.js

@@ -4,9 +4,7 @@
 
 jQuery(function($){
 
-jQuery.trumbowyg.langs.ko.fontFamily = '글꼴';
-
-function guiEditorInit($obj, editable){
+    function guiEditorInit($obj, editable){
     var $submitBtn = $obj.find('.submit');
     var $noticeInput = $obj.find('.input_form');
     var $editForm = $obj.find('.edit_form');
@@ -17,51 +15,30 @@ function guiEditorInit($obj, editable){
     function enableEditor(){
         editMode = true;
         $cancelEdit.show();
-        $editForm.removeClass('viewer').trumbowyg({
-            autogrow: true,
-            autogrowOnEnter: true,
-            lang: 'ko',
-            removeformatPasted: true,
-            imageWidthModalEdit: true,
-            minimalLinks: true,
-            btns: [
-                ['viewHTML'],
-                ['undo', 'redo'], // Only supported in Blink browsers
-                ['formatting'],
-                ['fontfamily', 'fontsize'],
-                ['foreColor', 'backColor'],
-                ['emoji'],
-                ['strong', 'em', 'del'],
-                ['link'],
-                ['insertImage'],
-                ['justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull'],
-                ['unorderedList', 'orderedList'],
-                ['horizontalRule'],
-                ['removeformat'],
-                ['fullscreen']
+        $editForm.removeClass('viewer').summernote({
+            minHeight:200,
+            maxHeight:null,
+            focus:true,
+            lang:'ko-KR',
+            toolbar: [
+                // [groupName, [list of button]]
+                ['do', ['undo', 'redo']],
+                ['style', ['bold', 'italic', 'underline', 'clear']],
+                ['font2', ['fontname', 'fontsize']],
+                ['font', ['strikethrough', 'superscript', 'subscript']],
+                ['color', ['color']],
+                ['in', ['picture', 'link', 'video', 'table', 'hr']],
+                ['para', ['ul', 'ol', 'paragraph']],
+                ['height', ['height', 'codeview']]
             ],
-            plugins: {
-                fontfamily : {
-                    fontList:[
-                        {name:'맑은 고딕', family:"'맑은 고딕'"},
-                        {name:'나눔 고딕', family:"'Nanum Gothic', sans-serif"},
-                        {name:'나눔 명조', family:"'Nanum Myeongjo', serif"},
-                        {name:'나눔손글씨 펜체', family:"'Nanum Pen Script', cursive"},
-                        {name:'굴림', family:"'굴림'"},
-                        {name:'굴림체', family:"'굴림체'"},
-                        {name:'바탕', family:"'바탕'"},
-                        {name:'바탕체', family:"'바탕체'"},
-                        {name:'궁서', family:"'궁서'"},
-                        {name:'궁서체', family:"'궁서체'"},
-                    ]
-                }
-            },
-        }).trumbowyg('html', $noticeInput.val());
+            fontNames: ['맑은 고딕', 'Nanum Gothic', 'Nanum Myeongjo', 'Nanum Pen Script', '굴림', '굴림체', '바탕', '바탕체', '궁서', '궁서체']
+
+        }).summernote('code', $noticeInput.val());
     }
 
     function disableEditor(){
         editMode = false;
-        $editForm.trumbowyg('destroy');
+        $editForm.summernote('destroy');
         $cancelEdit.hide();
         $editForm.html($noticeInput.val()).addClass('viewer');
     }
@@ -81,7 +58,7 @@ function guiEditorInit($obj, editable){
             enableEditor();
             return false;
         }
-        $noticeInput.val($editForm.trumbowyg('html'));
+        $noticeInput.val($editForm.summernote('code'));
     });
 
     $cancelEdit.click(function(e){