Merge pull request craftcms#1 from riekusdn/bugfix/new-ckeditor-version

Bugfix/new ckeditor version
HAWK-Marketing · Sep 23, 2019 · 657bee2 · 657bee2
2 parents b722ecc + 4f16d66
commit 657bee2
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 17 deletions.
diff --git a/Simple.json b/Simple.json
@@ -0,0 +1,12 @@
+{
+    "toolbar": {
+        "items": ["heading", "|", "bold", "italic", "link", "bulletedList", "numberedList", "imageUpload", "blockQuote", "insertTable", "mediaEmbed", "undo", "redo"]
+    },
+    "image": {
+        "toolbar": ["imageStyle:full", "imageStyle:side", "|", "imageTextAlternative"]
+    },
+    "table": {
+        "contentToolbar": ["tableColumn", "tableRow", "mergeTableCells"]
+    },
+    "language": "en"
+}
diff --git a/lib/ckeditor/dist/ckeditor.js b/lib/ckeditor/dist/ckeditor.js
diff --git a/lib/ckeditor/dist/ckeditor.js.map b/lib/ckeditor/dist/ckeditor.js.map
diff --git a/src/Field.php b/src/Field.php
@@ -39,6 +39,11 @@ public static function displayName(): string
      */
     public $purifierConfig;
 
+    /**
+     * @var string|null The CKEditor config file to use
+     */
+    public $ckeditorConfig;
+
     /**
      * @var bool Whether the HTML should be purified on save
      */
@@ -60,6 +65,7 @@ public function getSettingsHtml()
         return Craft::$app->getView()->renderTemplate('ckeditor/_field_settings', [
             'field' => $this,
             'purifierConfigOptions' => $this->_getCustomConfigOptions('htmlpurifier'),
+            'ckeditorConfigOptions' => $this->_getCustomConfigOptions('ckeditor'),
         ]);
     }
 
@@ -100,7 +106,7 @@ public function serializeValue($value, ElementInterface $element = null)
         }
 
         // Get the raw value
-        $value = (string)$value;
+        $value = (string) $value;
 
         if (!$value) {
             return null;
@@ -124,7 +130,7 @@ public function serializeValue($value, ElementInterface $element = null)
     public function isValueEmpty($value, ElementInterface $element): bool
     {
         /** @var \Twig_Markup|null $value */
-        return $value === null || parent::isValueEmpty((string)$value);
+        return $value === null || parent::isValueEmpty((string) $value, $element);
     }
 
     /**
@@ -135,14 +141,18 @@ public function getInputHtml($value, ElementInterface $element = null): string
         $view = Craft::$app->getView();
         $id = $view->formatInputId($this->handle);
         $nsId = $view->namespaceInputId($id);
-        $encValue = htmlentities((string)$value, ENT_NOQUOTES, 'UTF-8');
+        $encValue = htmlentities((string) $value, ENT_NOQUOTES, 'UTF-8');
+        $ckeditorConfig = Json::encode($this->_getCkeditorConfig());
 
         $js = <<<JS
 ClassicEditor
-    .create(document.getElementById('{$nsId}'))
+    .create(document.getElementById('{$nsId}'), {$ckeditorConfig})
     .then(function(editor) {
         $(editor.element).closest('form').on('submit', function() {
-            editor.updateEditorElement();
+            editor.updateSourceElement();
+        });
+        editor.model.document.on( 'change:data', () => {
+            editor.updateSourceElement();
         });
     })
 ;
@@ -158,7 +168,7 @@ public function getInputHtml($value, ElementInterface $element = null): string
         $view->registerCss($css);
         $view->registerJs($js);
 
-        return "<textarea id='{$id}' name='{$this->handle}'>{$encValue}</textarea>";
+        return "<textarea style=\"display: none;\" id='{$id}' name='{$this->handle}'>{$encValue}</textarea>";
     }
 
     /**
@@ -167,7 +177,7 @@ public function getInputHtml($value, ElementInterface $element = null): string
     public function getStaticHtml($value, ElementInterface $element): string
     {
         /** @var \Twig_Markup|null $value */
-        return '<div class="text">'.($value ?: '&nbsp;').'</div>';
+        return '<div class="text">' . ($value ?: '&nbsp;') . '</div>';
     }
 
     // Private Methods
@@ -182,7 +192,7 @@ public function getStaticHtml($value, ElementInterface $element): string
     private function _getCustomConfigOptions(string $dir): array
     {
         $options = ['' => Craft::t('app', 'Default')];
-        $path = Craft::$app->getPath()->getConfigPath().DIRECTORY_SEPARATOR.$dir;
+        $path = Craft::$app->getPath()->getConfigPath() . DIRECTORY_SEPARATOR . $dir;
 
         if (is_dir($path)) {
             $files = FileHelper::findFiles($path, [
@@ -216,6 +226,16 @@ private function _getPurifierConfig(): array
         ];
     }
 
+    private function _getCkeditorConfig(): array
+    {
+        if ($config = $this->_getConfig('ckeditor', $this->ckeditorConfig)) {
+            return $config;
+        }
+
+        // Default config
+        return Json::decode('{}');
+    }
+
     /**
      * Returns a JSON-decoded config, if it exists.
      *
@@ -229,12 +249,11 @@ private function _getConfig(string $dir, string $file = null)
             return false;
         }
 
-        $path = Craft::$app->getPath()->getConfigPath().DIRECTORY_SEPARATOR.$dir.DIRECTORY_SEPARATOR.$file;
+        $path = Craft::$app->getPath()->getConfigPath() . DIRECTORY_SEPARATOR . $dir . DIRECTORY_SEPARATOR . $file;
 
         if (!is_file($path)) {
             return false;
         }
-
         return Json::decode(file_get_contents($path));
     }
 }
diff --git a/src/templates/_field_settings.html b/src/templates/_field_settings.html
@@ -1,5 +1,22 @@
 {% import '_includes/forms' as forms %}
 
+<div id="purifier-config-container">
+    {{ forms.selectField({
+        label: "CKEditor Config"|t('ckeditor'),
+        instructions: "You can save custom {name} configs as {ext} files in {path}."|t('ckeditor', {
+            name: 'CKEditor Config',
+            ext: '`.json`',
+            path: '`config/ckeditor/`'
+        }) ~
+        ' <a href="https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/configuration.html"
+            target="_blank">'~"View available settings"|t('ckeditor')~'</a>',
+        id: 'ckeditorConfig',
+        name: 'ckeditorConfig',
+        options: ckeditorConfigOptions,
+        value: field.ckeditorConfig
+    }) }}
+</div>
+
 {{ forms.checkboxField({
     label: "Purify HTML?"|t('ckeditor'),
     instructions: 'Removes any potentially-malicious code on save, by running the submitted data through <a href="http://htmlpurifier.org/" target="_blank">HTML Purifier</a>.'|t('ckeditor'),
@@ -10,7 +27,7 @@
     toggle: 'purifier-config-container'
 }) }}
 
-<div id="purifier-config-container"{% if not field.purifyHtml %} class="hidden"{% endif %}>
+<div id="purifier-config-container" {% if not field.purifyHtml %} class="hidden" {% endif %}>
     {{ forms.selectField({
         label: "HTML Purifier Config"|t('ckeditor'),
         instructions: "You can save custom {name} configs as {ext} files in {path}."|t('ckeditor', {
@@ -27,7 +44,7 @@
 </div>
 
 {% if craft.app.db.isMysql %}
-    {{ forms.selectField({
+{{ forms.selectField({
         label: "Column Type"|t('ckeditor'),
         id: 'column-type',
         name: 'columnType',
@@ -39,4 +56,4 @@
         value: field.columnType,
         warning: (field.id ? "Changing this may result in data loss."|t('ckeditor')),
     }) }}
-{% endif %}
+{% endif %}