Switch to TinyMCE

motorradig/app/Http/Controllers/AdminController.php

@@ -59,7 +59,6 @@ class AdminController extends Controller
         return view('admin.edit_home')->with('content',$page->content);
     }
     public function store_home(Request $request) {
-        dd($request);
         $request->validate(
             [
                 'pagecontent' => 'required'

motorradig/app/Http/Controllers/PageController.php

@@ -87,6 +87,10 @@ class PageController extends Controller
     public function page_home() {
         $page=Page::where('name','home')->first();
         $content=$page->content;
+
+        $content = rtrim(ltrim($content,'"'),'"');
+
+
         return view('home')->with('content',$content);
     }
 

motorradig/package-lock.json

@@ -8596,11 +8596,6 @@
                 }
             }
         },
-        "suneditor": {
-            "version": "2.36.4",
-            "resolved": "https://registry.npmjs.org/suneditor/-/suneditor-2.36.4.tgz",
-            "integrity": "sha512-xOB96cQWzt8PQ8fSF6Q5NzxMPpOFTeaQBbHTx+ZuUt6s7hxh2LE8bh0yU+hLmeoXfBCTtV/A0zb+e7sLy2G0BA=="
-        },
         "supports-color": {
             "version": "5.5.0",
             "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",

motorradig/package.json

@@ -24,7 +24,6 @@
     },
     "dependencies": {
         "@fortawesome/fontawesome-free": "^5.14.0",
-        "lightbox2": "^2.11.3",
-        "suneditor": "^2.36.4"
+        "lightbox2": "^2.11.3"
     }
 }

motorradig/resources/js/app.js

@@ -5,4 +5,3 @@
  */
 
 require('./bootstrap');
-require('./suneditor');

motorradig/resources/js/bootstrap.js

@@ -40,3 +40,4 @@ window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 //     cluster: process.env.MIX_PUSHER_APP_CLUSTER,
 //     forceTLS: true
 // });
+

motorradig/resources/js/suneditor.js

@@ -1,25 +0,0 @@
-import 'suneditor/dist/css/suneditor.min.css'
-import suneditor from 'suneditor'
-import plugins from 'suneditor/src/plugins'
-
-suneditor.create('sample', {
-    plugins: plugins,
-    buttonList: [
-        ['undo', 'redo'],
-        ['font', 'fontSize', 'formatBlock'],
-        ['paragraphStyle', 'blockquote'],
-        ['bold', 'underline', 'italic', 'strike', 'subscript', 'superscript'],
-        ['fontColor', 'hiliteColor', 'textStyle'],
-        ['removeFormat'],
-        '/', // Line break
-        ['outdent', 'indent'],
-        ['align', 'horizontalRule', 'list', 'lineHeight'],
-        ['table', 'link', 'image', 'video', 'audio' /** ,'math' */], // You must add the 'katex' library at options to use the 'math' plugin.
-        /** ['imageGallery'] */ // You must add the "imageGalleryUrl".
-        ['fullScreen', 'showBlocks', 'codeView'],
-        ['preview', 'print'],
-        ['save', 'template']
-    ]
-})
-
-

motorradig/resources/views/admin/edit_home.blade.php

@@ -11,7 +11,7 @@
 
 
                         <form style="background-color: #fff;" class="text-dark" method="post" action="/admin/store_home"
-                              onsubmit = "event.preventDefault(); updateAndSubmit();"
+
                               enctype="multipart/form-data">
                             @csrf
 
@@ -20,8 +20,8 @@
 {{--                                <textarea class="col-10" name="pagecontent" rows="20" cols="50">--content--  --}}
 {{--                                </textarea>  --}}
 
-                                <textarea style="width:100%; height:100vh;" name="pagecontent" id="sample">
-                                    {!!  $content !!}
+                                <textarea style="width:100%; height:100vh;" name="pagecontent" id="mytextarea">
+                                    {!! $content !!}
                                 </textarea>
 
                             </div>
@@ -39,12 +39,19 @@
         </div>
     </div>
 
+    <!-- Taken from https://www.tiny.cloud/docs/quick-start/ -->
+    <!-- Nag-free version: https://medium.com/@petehouston/remove-tinymce-warning-notification-on-cloud-api-key-70a4a352b8b0 -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.9.2/tinymce.min.js" referrerpolicy="origin"></script>
+
     <script>
+        tinymce.init({
+            selector: '#mytextarea'
+        });
+    </script>
+
+    <script>
+
         function updateAndSubmit() {
-
-            alert(suneditor);
-            alert(suneditor.suneditor);
-
             var htmlString = JSON.stringify($('.richText-editor').html());
             alert(htmlString);
             /*

motorradig/resources/views/home.blade.php

@@ -24,9 +24,9 @@
                     </span>
                     -->
 
-                    <textarea style="width:100%; height:100vh;" id="sample">
-                        {!!  $content !!}
-                    </textarea>
+                    <div style="width:100%; height:100vh;" id="sample">
+                        {{  $content }}
+                    </div>
                 </div>
             </div>
         </div>