fix #2918 @2

diff --git a/src/app/Magic/Fields/Markdown.php b/src/app/Magic/Fields/Markdown.php
index 8c7837beedbc73f80d51a64e96e5fbcfa88ca1a8..57630d0008736881ce32e03b2d32b3fda780089c 100644 (file)
--- a/src/app/Magic/Fields/Markdown.php
+++ b/src/app/Magic/Fields/Markdown.php
@@ -3,10 +3,22 @@
 
 namespace Cubist\Backpack\app\Magic\Fields;
 
+use Cubist\Backpack\CubistBackpackServiceProvider;
 
 class Markdown extends Field
 {
     protected $_adminType = 'simplemde';
+    protected $_viewNamespace = CubistBackpackServiceProvider::NAMESPACE . '::fields';
+
     protected $_databaseType = 'text';
     protected $_translatable = true;
+
+    protected $_simplemdeAttributes = [
+        'spellChecker' => false,
+    ];
+
+    public function getDefaultAttributes()
+    {
+        return array_merge(parent::getDefaultAttributes(), ['simplemdeAttributes' => $this->_simplemdeAttributes]);
+    }
 }

diff --git a/src/resources/views/fields/simplemde.blade.php b/src/resources/views/fields/simplemde.blade.php
new file mode 100644 (file)
index 0000000..ed74111
--- /dev/null
+++ b/src/resources/views/fields/simplemde.blade.php
@@ -0,0 +1,81 @@
+<!-- Simple MDE - Markdown Editor -->
+<div @include('crud::inc.field_wrapper_attributes') >
+    <label>{!! $field['label'] !!}</label>
+    @include('crud::inc.field_translatable_icon')
+    <textarea
+        class="simplemde_area" name="{{ $field['name'] }}"
+        data-simplemdeattrs="{{json_encode($field['simplemdeAttributes'])}}"
+        @include('crud::inc.field_attributes', ['default_class' => 'form-control'])
+       >{{ old(square_brackets_to_dots($field['name'])) ?? $field['value'] ?? $field['default'] ?? '' }}</textarea>
+
+    {{-- HINT --}}
+    @if (isset($field['hint']))
+        <p class="help-block">{!! $field['hint'] !!}</p>
+    @endif
+</div>
+
+
+{{-- ########################################## --}}
+{{-- Extra CSS and JS for this particular field --}}
+{{-- If a field type is shown multiple times on a form, the CSS and JS will only be loaded once --}}
+@if ($crud->checkIfFieldIsFirstOfItsType($field))
+
+    {{-- FIELD CSS - will be loaded in the after_styles section --}}
+    @push('crud_fields_styles')
+        <link rel="stylesheet" href="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
+        <style type="text/css">
+            .CodeMirror-fullscreen, .editor-toolbar.fullscreen {
+                z-index: 9999 !important;
+            }
+
+            .CodeMirror {
+                min-height: auto !important;
+            }
+        </style>
+    @endpush
+
+    {{-- FIELD JS - will be loaded in the after_scripts section --}}
+    @push('crud_fields_scripts')
+        <script src="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
+        <script>
+            jQuery(document).ready(function ($) {
+                initAllMarkdown();
+                $(document).on('cubist.bunchmultiple.added', function () {
+                    initAllMarkdown();
+                });
+                $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+                    setTimeout(function () {
+                        refreshAllMarkdown();
+                    }, 10);
+                });
+            });
+
+            function refreshAllMarkdown() {
+                $('.simplemde_area').each(function () {
+                    $(this).data('simplemde').codemirror.refresh();
+                });
+            }
+
+            function initAllMarkdown() {
+                $('.simplemde_area').each(function () {
+                    if ($(this).data('simplemde') === undefined) {
+                        initOneMarkdown($(this));
+                    }
+                });
+            }
+
+            function initOneMarkdown(el) {
+                var attributes = el.data('simplemdeattrs');
+                attributes.element = $(el).get(0);
+                var simplemde = new SimpleMDE(attributes);
+                simplemde.options.minHeight = simplemde.options.minHeight || "300px";
+                simplemde.codemirror.getScrollerElement().style.minHeight = simplemde.options.minHeight;
+                $(el).data('simplemde', simplemde);
+            }
+        </script>
+    @endpush
+
+@endif
+
+{{-- End of Extra CSS and JS --}}
+{{-- ########################################## --}}