92 lines
3.2 KiB
PHP
92 lines
3.2 KiB
PHP
@assets
|
|
<link rel="stylesheet" href="https://unpkg.com/easymde/dist/easymde.min.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
<script src="https://unpkg.com/easymde/dist/easymde.min.js"></script>
|
|
@endassets
|
|
@script
|
|
<script>
|
|
const editor = new EasyMDE({
|
|
element: document.getElementById('editor'),
|
|
spellChecker: false,
|
|
previewImagesInEditor: true,
|
|
uploadImage: false,
|
|
autoDownloadFontAwesome: false,
|
|
status: [{
|
|
className: 'upload-image',
|
|
defaultValue: '',
|
|
}],
|
|
toolbar: [{
|
|
name: 'bold',
|
|
action: EasyMDE.toggleBold,
|
|
className: 'fa fa-bold',
|
|
title: 'Bold',
|
|
}, {
|
|
name: 'italic',
|
|
action: EasyMDE.toggleItalic,
|
|
className: 'fa fa-italic',
|
|
title: 'Italic',
|
|
}, {
|
|
name: 'strikethrough',
|
|
action: EasyMDE.toggleStrikethrough,
|
|
className: 'fa fa-strikethrough',
|
|
title: 'Strikethrough',
|
|
}, {
|
|
name: 'link',
|
|
action: EasyMDE.drawLink,
|
|
className: 'fa fa-link',
|
|
title: 'Create Link',
|
|
}, '|',
|
|
{
|
|
name: 'heading',
|
|
action: EasyMDE.toggleHeadingSmaller,
|
|
className: 'fa fa-heading',
|
|
title: 'Heading',
|
|
}, '|',
|
|
{
|
|
name: 'quote',
|
|
action: EasyMDE.toggleBlockquote,
|
|
className: 'fa fa-quote-left',
|
|
title: 'Quote',
|
|
}, {
|
|
name: 'code',
|
|
action: EasyMDE.toggleCodeBlock,
|
|
className: 'fa fa-code',
|
|
title: 'Code',
|
|
}, {
|
|
name: 'unordered-list',
|
|
action: EasyMDE.toggleUnorderedList,
|
|
className: 'fa fa-list-ul',
|
|
title: 'Unordered List',
|
|
}, {
|
|
name: 'ordered-list',
|
|
action: EasyMDE.toggleOrderedList,
|
|
className: 'fa fa-list-ol',
|
|
title: 'Ordered List',
|
|
}, '|',
|
|
{
|
|
name: 'undo',
|
|
action: EasyMDE.undo,
|
|
className: 'fa fa-rotate-left',
|
|
title: 'Undo',
|
|
}, {
|
|
name: 'redo',
|
|
action: EasyMDE.redo,
|
|
className: 'fa fa-rotate-right',
|
|
title: 'Redo',
|
|
},
|
|
|
|
],
|
|
});
|
|
|
|
editor.codemirror.on('change', function() {
|
|
@this.set('message', editor.value(), false);
|
|
});
|
|
|
|
// Listen for event called saved
|
|
$wire.on('saved', () => {
|
|
editor.clearAutosavedValue();
|
|
editor.value('');
|
|
});
|
|
</script>
|
|
@endscript
|