From 9f6f4f24dee8d75b2c93027423d9bdc6d6bc57cd Mon Sep 17 00:00:00 2001
From: Dr Masroor Ehsan <masroore@gmail.com>
Date: Sat, 11 Jan 2025 22:21:47 +0600
Subject: [PATCH] UI

---
 .../views/staff/reports/create.blade.php      | 256 +-----------------
 1 file changed, 13 insertions(+), 243 deletions(-)

diff --git a/resources/views/staff/reports/create.blade.php b/resources/views/staff/reports/create.blade.php
index f974ab4..f37321e 100644
--- a/resources/views/staff/reports/create.blade.php
+++ b/resources/views/staff/reports/create.blade.php
@@ -40,19 +40,19 @@
                 @csrf
                 <input type="hidden" value="{{ $study->hash }}" name="hashid">
                 <div
-                    class="ck-editor editor-container editor-container_classic-editor editor-container_include-word-count fixed-container"
+                    class="ck-editor editor-container editor-container_classic-editor fixed-container"
                     id="editor-container">
                     <div class="editor-container__editor">
                         <textarea id="editor" name="content">{{ $report?->getContent() }}</textarea>
                     </div>
-                    <div class="editor_container__word-count" id="editor-word-count"></div>
                 </div>
 
                 <div class="row w-75 mb-4">
                     <div class="col-md mb-md-0 mb-2">
                         <div class="form-check form-check-success custom-option custom-option-basic">
                             <label class="form-check-label custom-option-content" for="radio_prelim">
-                                <input name="report_status" class="form-check-input" type="radio" value="{{ \App\Domain\Report\ReportStatus::Preliminary->value }}"
+                                <input name="report_status" class="form-check-input" type="radio"
+                                       value="{{ \App\Domain\Report\ReportStatus::Preliminary->value }}"
                                        id="radio_prelim" checked/>
                                 <span class="custom-option-header">
                                   <span class="h6 mb-0">Draft</span>
@@ -66,7 +66,8 @@ class="ck-editor editor-container editor-container_classic-editor editor-contain
                     <div class="col-md">
                         <div class="form-check form-check-success custom-option custom-option-basic">
                             <label class="form-check-label custom-option-content" for="radio_final">
-                                <input name="report_status" class="form-check-input" type="radio" value="{{ \App\Domain\Report\ReportStatus::Finalized->value }}"
+                                <input name="report_status" class="form-check-input" type="radio"
+                                       value="{{ \App\Domain\Report\ReportStatus::Finalized->value }}"
                                        id="radio_final"/>
                                 <span class="custom-option-header">
                                   <span class="h6 mb-0">Finalize</span>
@@ -85,174 +86,53 @@ class="ck-editor editor-container editor-container_classic-editor editor-contain
     </div>
 </div>
 
-<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
-        integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
-        crossorigin="anonymous"></script>
 <script src="https://cdn.ckeditor.com/ckeditor5/44.1.0/ckeditor5.umd.js" crossorigin></script>
-<script src="https://cdn.ckeditor.com/ckeditor5-premium-features/44.1.0/ckeditor5-premium-features.umd.js"
-        crossorigin></script>
 <script>
     const {
         ClassicEditor,
-        Autoformat,
         Autosave,
-        BlockQuote,
         Bold,
-        CloudServices,
         Essentials,
-        FindAndReplace,
-        FontBackgroundColor,
-        FontColor,
-        FontFamily,
-        FontSize,
-        Heading,
-        Highlight,
-        Indent,
-        IndentBlock,
         Italic,
         List,
         ListProperties,
-        PageBreak,
         Paragraph,
         PasteFromOffice,
         RemoveFormat,
-        SourceEditing,
         Table,
-        TableCaption,
         TableCellProperties,
         TableColumnResize,
         TableProperties,
         TableToolbar,
-        TextTransformation,
-        Underline,
-        WordCount
+        Underline
     } = window.CKEDITOR;
-    //const { ExportPdf, ExportWord, ImportWord, MultiLevelList, PasteFromOfficeEnhanced, Template } = window.CKEDITOR_PREMIUM_FEATURES;
 
     const LICENSE_KEY =
-        //'GPL';
-        'eyJhbGciOiJFUzI1NiJ9.eyJleHAiOjE3MzY4MTI3OTksImp0aSI6IjRkNDQyODQ2LWIwNDUtNDU1Ny1hZTY0LTM3ZDE0OTdkYWIxNSIsInVzYWdlRW5kcG9pbnQiOiJodHRwczovL3Byb3h5LWV2ZW50LmNrZWRpdG9yLmNvbSIsImRpc3RyaWJ1dGlvbkNoYW5uZWwiOlsiY2xvdWQiLCJkcnVwYWwiLCJzaCJdLCJ3aGl0ZUxhYmVsIjp0cnVlLCJsaWNlbnNlVHlwZSI6InRyaWFsIiwiZmVhdHVyZXMiOlsiKiJdLCJ2YyI6ImIwYmRlYmVjIn0.fhO6LXEF3lP_QpHQY2c9hPnensaY2_0AbfgJ0p4wUlQFmIyn-9dwe5rbMh9SdZYgoqOY5J4-zN0-JfO2vFm3vg';
+        //'eyJhbGciOiJFUzI1NiJ9.eyJleHAiOjE3MzY4MTI3OTksImp0aSI6IjRkNDQyODQ2LWIwNDUtNDU1Ny1hZTY0LTM3ZDE0OTdkYWIxNSIsInVzYWdlRW5kcG9pbnQiOiJodHRwczovL3Byb3h5LWV2ZW50LmNrZWRpdG9yLmNvbSIsImRpc3RyaWJ1dGlvbkNoYW5uZWwiOlsiY2xvdWQiLCJkcnVwYWwiLCJzaCJdLCJ3aGl0ZUxhYmVsIjp0cnVlLCJsaWNlbnNlVHlwZSI6InRyaWFsIiwiZmVhdHVyZXMiOlsiKiJdLCJ2YyI6ImIwYmRlYmVjIn0.fhO6LXEF3lP_QpHQY2c9hPnensaY2_0AbfgJ0p4wUlQFmIyn-9dwe5rbMh9SdZYgoqOY5J4-zN0-JfO2vFm3vg';
+        'eyJhbGciOiJFUzI1NiJ9.eyJleHAiOjE3NjcxMzkxOTksImp0aSI6ImQ4ODJkYTBmLWNmYWUtNGU4Mi05ZjYxLTYyYzY4ZmZiZWUzMCIsInVzYWdlRW5kcG9pbnQiOiJodHRwczovL3Byb3h5LWV2ZW50LmNrZWRpdG9yLmNvbSIsImRpc3RyaWJ1dGlvbkNoYW5uZWwiOlsiY2xvdWQiLCJkcnVwYWwiXSwiZmVhdHVyZXMiOlsiRFJVUCJdLCJ2YyI6IjI0OGE5ZjdhIn0.m-nfFNt3CYv4_P81vYJn8nTGJeIXXi2hWIFr7EnWNVNkyW_wmIt3Oh_1lOiQE43kN9LXpM0-jEyomb1sSqkwzw';
 
     const editorConfig = {
         toolbar: {
-            items: [
-                'sourceEditing',
-                'importWord',
-                'exportWord',
-                'exportPdf',
-                'findAndReplace',
-                '|',
-                'heading',
-                '|',
-                'fontSize',
-                'fontFamily',
-                'fontColor',
-                'fontBackgroundColor',
-                '|',
-                'bold',
-                'italic',
-                'underline',
-                'removeFormat',
-                '|',
-                'pageBreak',
-                'link',
-                'insertTable',
-                'insertTemplate',
-                'highlight',
-                'blockQuote',
-                '|',
-                'bulletedList',
-                'numberedList',
-                'multiLevelList',
-                'outdent',
-                'indent'
-            ],
+            items: ['bold', 'italic', 'underline', 'removeFormat', '|', 'insertTable', '|', 'bulletedList', 'numberedList'],
             shouldNotGroupWhenFull: false
         },
         plugins: [
-            Autoformat,
             Autosave,
-            BlockQuote,
             Bold,
-            CloudServices,
             Essentials,
-            FindAndReplace,
-            FontBackgroundColor,
-            FontColor,
-            FontFamily,
-            FontSize,
-            Heading,
-            Highlight,
-            Indent,
-            IndentBlock,
             Italic,
             List,
             ListProperties,
-            PageBreak,
             Paragraph,
             PasteFromOffice,
             RemoveFormat,
-            SourceEditing,
             Table,
-            TableCaption,
             TableCellProperties,
             TableColumnResize,
             TableProperties,
             TableToolbar,
-            TextTransformation,
-            Underline,
-            /*
-            ExportPdf,
-            ExportWord,
-            ImportWord,
-            Template,
-            MultiLevelList,
-            PasteFromOfficeEnhanced,
-            */
-            WordCount
+            Underline
         ],
-        exportPdf: {
-            stylesheets: [
-                /* This path should point to application stylesheets. */
-                /* See: https://ckeditor.com/docs/ckeditor5/latest/features/converters/export-pdf.html */
-                './ck.css',
-                /* Export PDF needs access to stylesheets that style the content. */
-                'https://cdn.ckeditor.com/ckeditor5/44.1.0/ckeditor5.css',
-                'https://cdn.ckeditor.com/ckeditor5-premium-features/44.1.0/ckeditor5-premium-features.css'
-            ],
-            fileName: 'export-pdf-demo.pdf',
-            converterOptions: {
-                format: 'Tabloid',
-                margin_top: '20mm',
-                margin_bottom: '20mm',
-                margin_right: '24mm',
-                margin_left: '24mm',
-                page_orientation: 'portrait'
-            }
-        },
-        exportWord: {
-            stylesheets: [
-                /* This path should point to application stylesheets. */
-                /* See: https://ckeditor.com/docs/ckeditor5/latest/features/converters/export-word.html */
-                './ck.css',
-                /* Export Word needs access to stylesheets that style the content. */
-                'https://cdn.ckeditor.com/ckeditor5/44.1.0/ckeditor5.css',
-                'https://cdn.ckeditor.com/ckeditor5-premium-features/44.1.0/ckeditor5-premium-features.css'
-            ],
-            fileName: 'export-word-demo.docx',
-            converterOptions: {
-                document: {
-                    orientation: 'portrait',
-                    size: 'Tabloid',
-                    margins: {
-                        top: '20mm',
-                        bottom: '20mm',
-                        right: '24mm',
-                        left: '24mm'
-                    }
-                }
-            }
-        },
         fontFamily: {
             supportAllValues: true
         },
@@ -260,66 +140,7 @@ class="ck-editor editor-container editor-container_classic-editor editor-contain
             options: [10, 12, 14, 'default', 18, 20, 22],
             supportAllValues: true
         },
-        heading: {
-            options: [
-                {
-                    model: 'paragraph',
-                    title: 'Paragraph',
-                    class: 'ck-heading_paragraph'
-                },
-                {
-                    model: 'heading1',
-                    view: 'h1',
-                    title: 'Heading 1',
-                    class: 'ck-heading_heading1'
-                },
-                {
-                    model: 'heading2',
-                    view: 'h2',
-                    title: 'Heading 2',
-                    class: 'ck-heading_heading2'
-                },
-                {
-                    model: 'heading3',
-                    view: 'h3',
-                    title: 'Heading 3',
-                    class: 'ck-heading_heading3'
-                },
-                {
-                    model: 'heading4',
-                    view: 'h4',
-                    title: 'Heading 4',
-                    class: 'ck-heading_heading4'
-                },
-                {
-                    model: 'heading5',
-                    view: 'h5',
-                    title: 'Heading 5',
-                    class: 'ck-heading_heading5'
-                },
-                {
-                    model: 'heading6',
-                    view: 'h6',
-                    title: 'Heading 6',
-                    class: 'ck-heading_heading6'
-                }
-            ]
-        },
-        //initialData: '',
         licenseKey: LICENSE_KEY,
-        link: {
-            addTargetToExternalLinks: true,
-            defaultProtocol: 'https://',
-            decorators: {
-                toggleDownloadable: {
-                    mode: 'manual',
-                    label: 'Downloadable',
-                    attributes: {
-                        download: 'file'
-                    }
-                }
-            }
-        },
         list: {
             properties: {
                 styles: true,
@@ -339,65 +160,14 @@ class: 'ck-heading_heading6'
                 {
                     title: 'Introduction',
                     description: 'Simple introduction to an article',
-                    icon: '<svg width="45" height="45" viewBox="0 0 45 45" fill="none" xmlns="http://www.w3.org/2000/svg">\n    <g id="icons/article-image-right">\n        <rect id="icon-bg" width="45" height="45" rx="2" fill="#A5E7EB"/>\n        <g id="page" filter="url(#filter0_d_1_507)">\n            <path d="M9 41H36V12L28 5H9V41Z" fill="white"/>\n            <path d="M35.25 12.3403V40.25H9.75V5.75H27.7182L35.25 12.3403Z" stroke="#333333" stroke-width="1.5"/>\n        </g>\n        <g id="image">\n            <path id="Rectangle 22" d="M21.5 23C21.5 22.1716 22.1716 21.5 23 21.5H31C31.8284 21.5 32.5 22.1716 32.5 23V29C32.5 29.8284 31.8284 30.5 31 30.5H23C22.1716 30.5 21.5 29.8284 21.5 29V23Z" fill="#B6E3FC" stroke="#333333"/>\n            <path id="Vector 1" d="M24.1184 27.8255C23.9404 27.7499 23.7347 27.7838 23.5904 27.9125L21.6673 29.6268C21.5124 29.7648 21.4589 29.9842 21.5328 30.178C21.6066 30.3719 21.7925 30.5 22 30.5H32C32.2761 30.5 32.5 30.2761 32.5 30V27.7143C32.5 27.5717 32.4391 27.4359 32.3327 27.3411L30.4096 25.6268C30.2125 25.451 29.9127 25.4589 29.7251 25.6448L26.5019 28.8372L24.1184 27.8255Z" fill="#44D500" stroke="#333333" stroke-linejoin="round"/>\n            <circle id="Ellipse 1" cx="26" cy="25" r="1.5" fill="#FFD12D" stroke="#333333"/>\n        </g>\n        <rect id="Rectangle 23" x="13" y="13" width="12" height="2" rx="1" fill="#B4B4B4"/>\n        <rect id="Rectangle 24" x="13" y="17" width="19" height="2" rx="1" fill="#B4B4B4"/>\n        <rect id="Rectangle 25" x="13" y="21" width="6" height="2" rx="1" fill="#B4B4B4"/>\n        <rect id="Rectangle 26" x="13" y="25" width="6" height="2" rx="1" fill="#B4B4B4"/>\n        <rect id="Rectangle 27" x="13" y="29" width="6" height="2" rx="1" fill="#B4B4B4"/>\n        <rect id="Rectangle 28" x="13" y="33" width="16" height="2" rx="1" fill="#B4B4B4"/>\n    </g>\n    <defs>\n        <filter id="filter0_d_1_507" x="9" y="5" width="28" height="37" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">\n            <feFlood flood-opacity="0" result="BackgroundImageFix"/>\n            <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>\n            <feOffset dx="1" dy="1"/>\n            <feComposite in2="hardAlpha" operator="out"/>\n            <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.29 0"/>\n            <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1_507"/>\n            <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1_507" result="shape"/>\n        </filter>\n    </defs>\n</svg>\n',
-                    data: "<h2>Introduction</h2><p>In today's fast-paced world, keeping up with the latest trends and insights is essential for both personal growth and professional development. This article aims to shed light on a topic that resonates with many, providing valuable information and actionable advice. Whether you're seeking to enhance your knowledge, improve your skills, or simply stay informed, our comprehensive analysis offers a deep dive into the subject matter, designed to empower and inspire our readers.</p>"
+                    icon: '<',
+                    data: ""
                 }
             ]
         }
     };
 
-    configUpdateAlert(editorConfig);
-
-    ClassicEditor.create(document.querySelector('#editor'), editorConfig).then(editor => {
-        const wordCount = editor.plugins.get('WordCount');
-        document.querySelector('#editor-word-count').appendChild(wordCount.wordCountContainer);
-
-        document.querySelector('#editor-menu-bar').appendChild(editor.ui.view.menuBarView.element);
-
-        return editor;
-    });
-
-    /**
-     * This function exists to remind you to update the config needed for premium features.
-     * The function can be safely removed. Make sure to also remove call to this function when doing so.
-     */
-    function configUpdateAlert(config) {
-        if (configUpdateAlert.configUpdateAlertShown) {
-            return;
-        }
-
-        const isModifiedByUser = (currentValue, forbiddenValue) => {
-            if (currentValue === forbiddenValue) {
-                return false;
-            }
-
-            if (currentValue === undefined) {
-                return false;
-            }
-
-            return true;
-        };
-
-        const valuesToUpdate = [];
-
-        configUpdateAlert.configUpdateAlertShown = true;
-
-        if (!isModifiedByUser(config.licenseKey, '<YOUR_LICENSE_KEY>')) {
-            valuesToUpdate.push('LICENSE_KEY');
-        }
-
-        if (valuesToUpdate.length) {
-            window.alert(
-                [
-                    'Please update the following values in your editor config',
-                    'to receive full access to Premium Features:',
-                    '',
-                    ...valuesToUpdate.map(value => ` - ${value}`)
-                ].join('\n')
-            );
-        }
-    }
-
+    ClassicEditor.create(document.querySelector('#editor'), editorConfig);
 </script>
 </body>
 </html>