ckeditor for html markup

This commit is contained in:
Arno Kaimbacher 2019-04-16 14:35:16 +02:00
parent 8735a2bbd4
commit 2fd9222f8a
22 changed files with 1384 additions and 1659 deletions

37
resources/assets/js/ckeditor.js vendored Normal file
View file

@ -0,0 +1,37 @@
// import Vue from 'vue';
// import CKEditor from '@ckeditor/ckeditor5-vue';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
// import Essentials from '@ckeditor/ckeditor5-essentials/src/essentials';
// const app = new Vue({
// name: 'app',
// components: {
// // Use the <ckeditor> component in this view.
// ckeditor: CKEditor.component
// },
// props: ['desc_markup'],
// data() {
// return {
// editor: ClassicEditor,
// //desc_markup: '<p>Content of the editor.</p>',
// editorConfig: {
// // The configuration of the editor.
// }
// };
// }
// });
var allEditors = document.querySelectorAll('.ckeditor');
for (var i = 0; i < allEditors.length; ++i) {
ClassicEditor
.create(allEditors[i], {
toolbar: ['heading', '|', 'bold', 'italic', 'link', 'bulletedList', 'numberedList', 'blockQuote']
})
.then(editor => {
console.log(editor);
})
.catch(error => {
console.error(error);
});
}

View file

@ -1,4 +1,4 @@
<template lang="html">
<template>
<div>
<div id="map">
</div>

View file

@ -1,5 +1,5 @@
// https://alligator.io/vuejs/vue-modal-component/
<template lang="html">
<template>
<div class="modal-backdrop">
<div class="popup">
<div class="fm_overlay" >

View file

@ -725,8 +725,8 @@
<script type="text/javascript" src="{{ asset('js/lib.js') }}"></script> --}} {{--
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>--}} {{--
<script type="text/javascript" src="{{ resource_path('assets\js\datasetPublish.js') }}"></script> --}}
<script type="text/javascript" src="{{ asset('backend/publish/datasetPublish.js') }}"></script>
<script type="text/javascript" src="{{ resource_path('assets\js\datasetPublish.js') }}"></script> --}}
<script type="text/javascript" src="{{ asset('backend/publish/datasetPublish.js') }}"></script>

View file

@ -29,8 +29,10 @@
</div>
<div class="pure-u-1 pure-u-md-1-2 pure-div">
{!! Form::label('desc_markup', 'Beschreibung als Markup') !!} {!! Form::textarea('desc_markup', null, ['class' => 'pure-u-23-24',
{!! Form::label('desc_markup', 'Beschreibung als Markup') !!}
{!! Form::textarea('desc_markup', null, ['class' => 'pure-u-23-24 ckeditor',
'size' => '70x6']) !!}
{{-- <ckeditor :editor="editor" v-bind:desc_markup='{{ $license->desc_markup }}' :config="editorConfig"></ckeditor> --}}
</div>
<div class="pure-u-1 pure-u-md-1-2 pure-div">

View file

@ -30,18 +30,14 @@
<script type="text/javascript">
// Backend.Pages.init();
</script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.js"></script>
{{-- <script src="https://cloud.tinymce.com/5/tinymce.min.js"></script> --}}
<script>
{{-- <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.js"></script> --}}
{{-- <script>
$(document).ready(function() {
$('#desc_markup').summernote();
// tinymce.init({
// selector: "#desc_markup",
// plugins: "code",
// // toolbar: "code",
// menubar: "tools"
// });
$('#desc_markup').summernote();
});
</script>
</script> --}}
<script type="text/javascript" src="{{ asset('backend/ckeditor.js') }}"></script>
@endsection

View file

@ -57,7 +57,7 @@
{!! Form::label('en_description', trans('validation.attributes.backend.pages.description'), ['class' => 'col-lg-2 control-label
required']) !!}
<div class="col-lg-10">
{!! Form::textarea('en_description', $page->translate('en')->description, ['class' => 'form-control description', 'placeholder' => trans('validation.attributes.backend.pages.description')])
{!! Form::textarea('en_description', $page->translate('en')->description, ['class' => 'form-control description ckeditor', 'placeholder' => trans('validation.attributes.backend.pages.description')])
!!}
</div>
</div>
@ -76,7 +76,7 @@
{!! Form::label('de_description', trans('validation.attributes.backend.pages.description'), ['class' => 'col-lg-2 control-label
required']) !!}
<div class="col-lg-10">
{!! Form::textarea('de_description', $page->translate('de')->description, ['class' => 'form-control description', 'placeholder' => trans('validation.attributes.backend.pages.description')])
{!! Form::textarea('de_description', $page->translate('de')->description, ['class' => 'form-control description ckeditor', 'placeholder' => trans('validation.attributes.backend.pages.description')])
!!}
</div>
</div>
@ -136,24 +136,13 @@ input[type="radio"], .tab-pane { display: none; }
@endsection
@section("after-scripts")
<script type="text/javascript">
// Backend.Pages.init();
</script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.10/summernote-lite.js"></script>
<script type="text/javascript" src="{{ asset('backend/ckeditor.js') }}"></script>
<script>
$(document).ready(function() {
// $('#description').summernote();
$('.description').summernote({
height: "300px",
callbacks: {
// onImageUpload: function(files, editor, welEditable) {
// app.sendFile(files[0], editor, welEditable);
// }
}
});
document.getElementById("english-option").checked = true;
$(document).ready(function() {
document.getElementById("english-option").checked = true;
});
// var $englishForm = $('#english-form');
// var $germanForm = $('#german-form');
@ -172,7 +161,7 @@ input[type="radio"], .tab-pane { display: none; }
// $germanForm.toggleClass('hidden');
// });
});
</script>
@endsection
@endsection