]> _ Git - cubist_cms-back.git/commitdiff
wip #6693 @3
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 5 Feb 2024 17:40:56 +0000 (18:40 +0100)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 5 Feb 2024 17:40:56 +0000 (18:40 +0100)
src/app/Magic/Fields/GrapesPageBuilder.php
src/resources/views/fields/pagebuilder-grapesjs.blade.php

index df6ae8abc21814456be7303a0fe3ed47b7f5404d..a7db92ca23f6ce4b7a427697c7131f59e291a088 100644 (file)
@@ -8,4 +8,23 @@ class GrapesPageBuilder extends Textarea
 {
     protected $_adminType = 'pagebuilder-grapesjs';
     protected $_viewNamespace = CubistBackpackServiceProvider::NAMESPACE . '::fields';
+
+    public static function getBlocks()
+    {
+        $res = [];
+        $base = resource_path('grapes/blocks');
+        $dr = opendir($base);
+        while ($file = readdir($dr)) {
+            if ($file === '.' || $file === '..') {
+                continue;
+            }
+            $f = $base . '/' . $file;
+            if (!is_dir($f)) {
+                continue;
+            }
+            $res[] = $f;
+        }
+
+        return $res;
+    }
 }
index bc8bbe30aa5f5e6e0c5a85921291553ec771be24..e8591cf49cd9e239f20f0217512a94d5f5298852 100644 (file)
@@ -3,6 +3,8 @@
     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>