181 lines
4.3 KiB
PHP
181 lines
4.3 KiB
PHP
<?php
|
|
if(!defined('__KIMS__')) exit;
|
|
?>
|
|
|
|
<style>
|
|
|
|
:root {
|
|
--ck-color-toolbar-background: #fff;
|
|
--ck-color-toolbar-border: rgba(0, 0, 0, 0.085);
|
|
--ck-border-radius :0
|
|
}
|
|
|
|
.document-editor__toolbar .ck.ck-toolbar {
|
|
border-left-width: 0 !important;
|
|
border-right-width: 0 !important;
|
|
}
|
|
|
|
.document-editor__editable-container {
|
|
overflow-x: hidden;
|
|
padding: calc(2*var(--ck-spacing-large));
|
|
background: var(--ck-color-base-foreground);
|
|
}
|
|
|
|
.document-editor__editable-container .document-editor__editable {
|
|
width: 20.8cm;
|
|
min-height: 21cm;
|
|
padding: 1cm 2cm 2cm;
|
|
border: 1px solid #d3d3d3;
|
|
border-radius: var(--ck-border-radius);
|
|
background: #fff;
|
|
box-shadow: 0 0 5px rgba(0,0,0,.1);
|
|
margin: 0 auto;
|
|
border-radius: 0
|
|
}
|
|
|
|
.ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
|
|
box-shadow: 0 0 5px rgba(0,0,0,.1);
|
|
border: 1px solid #d3d3d3;
|
|
outline: 0
|
|
}
|
|
|
|
</style>
|
|
|
|
<?php if ($g['broswer']!='MSIE 11' && $g['broswer']!='MSIE 10' && $g['broswer']!='MSIE 9'): ?>
|
|
<div class="" >
|
|
<div data-role="loader">
|
|
<div class="d-flex justify-content-center align-items-center text-muted bg-white" style="height:100vh">
|
|
<div class="spinner-border mr-2" role="status"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div data-role="editor" class="d-none">
|
|
<input type="hidden" name="content" value="">
|
|
<div class="document-editor__toolbar border-right"></div>
|
|
<div class="document-editor border-top-0">
|
|
<div class="document-editor__toolbar"></div>
|
|
<div class="document-editor__editable-container">
|
|
<div class="document-editor__editable">
|
|
<?php echo $__SRC__?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<?php getImport('ckeditor5','decoupled-document/build/ckeditor',false,'js'); ?>
|
|
|
|
<script>
|
|
var attach_file_saveDir = '<?php echo $g['path_file']?>site/';// 파일 업로드 폴더
|
|
var attach_module_theme = '_desktop/bs4-default-attach';// attach 모듈 테마
|
|
</script>
|
|
|
|
<script>
|
|
|
|
|
|
let editor;
|
|
|
|
DecoupledDocumentEditor
|
|
.create( document.querySelector( '.document-editor__editable' ),{
|
|
language: 'ko',
|
|
toolbar: [
|
|
'undo',
|
|
'redo',
|
|
'|',
|
|
'heading',
|
|
'|',
|
|
'highlight',
|
|
'|',
|
|
'bold',
|
|
'italic',
|
|
'underline',
|
|
'strikethrough',
|
|
'|',
|
|
'alignment:left',
|
|
'alignment:right',
|
|
'alignment:center',
|
|
'alignment:justify',
|
|
'|',
|
|
'numberedList',
|
|
'bulletedList',
|
|
'|',
|
|
'outdent',
|
|
'indent',
|
|
'|',
|
|
'link',
|
|
'blockquote',
|
|
'imageUpload',
|
|
'insertTable',
|
|
'code',
|
|
'codeBlock',
|
|
'exportPdf',
|
|
'removeFormat'
|
|
],
|
|
extraPlugins: [rbUploadAdapterPlugin],
|
|
mediaEmbed: {
|
|
extraProviders: [
|
|
{
|
|
name: 'other',
|
|
url: /^([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)/
|
|
}
|
|
]
|
|
},
|
|
link: {
|
|
decorators: {
|
|
addTargetToLinks: {
|
|
mode: 'manual',
|
|
label: '새탭에서 열기',
|
|
attributes: {
|
|
target: '_blank',
|
|
rel: 'noopener noreferrer'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
image: {
|
|
toolbar: [
|
|
'imageTextAlternative',
|
|
'imageStyle:full',
|
|
'imageStyle:side'
|
|
]
|
|
}
|
|
} )
|
|
.then( newEditor => {
|
|
editor = newEditor;
|
|
|
|
$('[data-role="loader"]').addClass('d-none') //로더 제거
|
|
$('[data-role="editor"]').removeClass('d-none')
|
|
const toolbarContainer = document.querySelector( '.document-editor__toolbar' );
|
|
toolbarContainer.appendChild( editor.ui.view.toolbar.element );
|
|
editor.editing.view.focus();
|
|
|
|
$('.document-editor__editable-container').on('scroll', function(){
|
|
var height = $(this).scrollTop();
|
|
if(height > 50) {
|
|
$('.document-editor__toolbar').addClass('shadow-sm')
|
|
} else {
|
|
$('.document-editor__toolbar').removeClass('shadow-sm')
|
|
}
|
|
});
|
|
|
|
})
|
|
.catch( error => {
|
|
console.error( error );
|
|
} );
|
|
|
|
</script>
|
|
<?php else: ?>
|
|
<div class="rb-article">
|
|
<div data-role="loader">
|
|
<div class="d-flex justify-content-center align-items-center border text-muted" style="height:80vh">
|
|
<div class="text-center">
|
|
<p class="mb-2">에디터가 지원되지 않는 환경 입니다.</p>
|
|
<small>Edge,Chrome,Firefox,Safari 브라우저 이용을 부탁드립니다.</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php endif; ?>
|