if(is_string($value)){
$value=json_decode($value);
}
+
+ $blocks=\Cubist\Backpack\Magic\Fields\GrapesPageBuilder::getBlocks();
@endphp
@include('crud::fields.inc.wrapper_start')
@push('crud_fields_scripts')
@basset('https://unpkg.com/grapesjs/dist/grapes.min.js')
+ @basset('https://unpkg.com/grapesjs-preset-webpage@1.0.2/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-blocks-basic@1.0.1/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-plugin-forms@2.0.5/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-component-countdown@1.0.1/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-plugin-export@1.0.11/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-tabs@1.0.6/dist/grapesjs-tabs.min.js')
+ @basset('https://unpkg.com/grapesjs-custom-code@1.0.1/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-touch@0.1.1/dist/grapesjs-touch.min.js')
+ @basset('https://unpkg.com/grapesjs-parser-postcss@1.0.1/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-tooltip@0.1.7/dist/index.js')
+ @basset('https://unpkg.com/grapesjs-tui-image-editor@0.1.3/dist/grapesjs-tui-image-editor.min.js')
+ @basset('https://unpkg.com/grapesjs-typed@1.0.5/dist/grapesjs-typed.min.js')
+ @basset('https://unpkg.com/grapesjs-style-bg@2.0.1/dist/index.js')
@bassetBlock('cubist/grapesjs-field.js')
<script>
jQuery(document).ready(function ($) {
+
+ $(document).on('keydown', ".grapesjs-init", function (e) {
+ if (e.keyCode === 13) {
+ e.preventDefault();
+ return false;
+ }
+ });
+
const inlineStorage = (editor) => {
editor.Storage.add('inline', {
load() {
let input = $(editor.config.container + '-input');
- console.log($(input).val());
let d = JSON.parse($(input).val());
if (d.data !== undefined && d.data !== null) {
return d.data;
};
function initUntriggeredGrapesJS() {
+
+
$('.grapesjs:not(.grapesjs-init)').each(function (i, obj) {
+ const customComponents = editor => {
+ };
+
+ let blocks = ['link-block', 'quote', 'text-basic'];
+ @foreach($blocks as $block)
+ {!! file_get_contents($block.'/block.js') !!};
+ @endforeach
+
let id = (Math.round(Math.random() * 10000000));
$(obj).attr('id', 'gjs-' + id);
let e = grapesjs.init({
container: '#gjs-' + id,
style: '.txt-red{color: red}',
- plugins: [inlineStorage],
+ plugins: ['grapesjs-preset-webpage', inlineStorage, customComponents],
+ pluginsOpts: {
+ 'grapesjs-preset-webpage': {
+ 'blocks':blocks,
+ }
+ },
storageManager: {type: 'inline'},
+ blockManager: {
+ blocks: blocks,
+ },
});
$(obj).prev('input').attr('id', 'gjs-' + id + '-input')
$(obj).data('grapesjs', e);
@endpush
<input type="hidden" name="{{ $field['name'] }}"
- value="@json($value)"/>
+ value="{{json_encode($value)}}"/>
<div class="grapesjs"></div>