tinymce dark mode

degami · degami · commit 671d1046c458 · 2025-11-13T00:11:20.000+01:00
diff --git a/app/base/abstracts/Controllers/AdminPage.php b/app/base/abstracts/Controllers/AdminPage.php
@@ -176,6 +176,7 @@ protected function prepareTemplate(): Template
                     'massEditUrl' => $this->getUrl('crud.app.base.controllers.admin.json.massedit'),
                     'mediaPasteUrl' => $this->getUrl('crud.app.site.controllers.admin.json.mediapaste'),
                     'currentLocale' => $this->getCurrentLocale(),
+                    'defaultTinymceOptions' => FORMS_DEFAULT_TINYMCE_OPTIONS,
                 ]
             ) . ");"
         );
diff --git a/app/base/controllers/Admin/Blocks.php b/app/base/controllers/Admin/Blocks.php
@@ -232,7 +232,7 @@ function ($el) {
                             [
                                 'type' => 'tinymce',
                                 'title' => 'Content',
-                                'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                                'tinymce_options' => $this->getUserTinymceOptions(),
                                 'default_value' => $block_content,
                                 'rows' => 20,
                             ]
diff --git a/app/base/controllers/Admin/Commerce/GiftCards.php b/app/base/controllers/Admin/Commerce/GiftCards.php
@@ -122,7 +122,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $product_content,
                     'rows' => 20,
                 ])->addField('media_id', [
diff --git a/app/base/traits/AdminFormTrait.php b/app/base/traits/AdminFormTrait.php
@@ -13,6 +13,7 @@
 
 namespace App\Base\Traits;
 
+use App\App;
 use App\Base\Abstracts\Models\BaseModel;
 use App\Base\Abstracts\Models\FrontendModel;
 use App\Base\Interfaces\Model\PhysicalProductInterface;
@@ -354,4 +355,25 @@ protected function addPhysicalProductFormElements(FAPI\Form $form, &$form_state)
 
         return $form;
     }
+
+    protected function getUserTinymceOptions(): array
+    {
+        $user = App::getInstance()->getAuth()->getCurrentUser();
+        $uiSettings = $user->getUserSession()->getSessionKey('uiSettings');
+
+        $isDarkMode = $uiSettings['darkMode'] ?? $this->getEnvironment()->getVariable('ADMIN_DARK_MODE', false);
+
+        $default_options = FORMS_DEFAULT_TINYMCE_OPTIONS;
+
+        if ($isDarkMode) {
+            $default_options['skin'] = 'oxide-dark';
+            $default_options['content_css'] = 'dark';
+        }
+
+        if (isset($user_settings['tinymce_options']) && is_array($user_settings['tinymce_options'])) {
+            return array_merge($default_options, $user_settings['tinymce_options']);
+        }
+
+        return $default_options;
+    }
 }
diff --git a/app/site/controllers/Admin/Cms/Events.php b/app/site/controllers/Admin/Cms/Events.php
@@ -176,7 +176,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $event_content,
                     'rows' => 20,
                 ]);
diff --git a/app/site/controllers/Admin/Cms/News.php b/app/site/controllers/Admin/Cms/News.php
@@ -128,7 +128,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $news_content,
                     'rows' => 20,
                 ]);
diff --git a/app/site/controllers/Admin/Cms/Pages.php b/app/site/controllers/Admin/Cms/Pages.php
@@ -170,7 +170,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $page_content,
                     'rows' => 20,
                 ]);
diff --git a/app/site/controllers/Admin/Cms/Taxonomy.php b/app/site/controllers/Admin/Cms/Taxonomy.php
@@ -153,7 +153,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $term_content,
                     'rows' => 2,
                 ])->addField('parent_id', [
diff --git a/app/site/controllers/Admin/Commerce/Books.php b/app/site/controllers/Admin/Commerce/Books.php
@@ -128,7 +128,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $product_content,
                     'rows' => 20,
                 ])->addField('price', [
diff --git a/app/site/controllers/Admin/Commerce/DownloadableProducts.php b/app/site/controllers/Admin/Commerce/DownloadableProducts.php
@@ -134,7 +134,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ])->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $product_content,
                     'rows' => 20,
                 ])->addField('media_id', [
diff --git a/app/site/controllers/Admin/ContactForms.php b/app/site/controllers/Admin/ContactForms.php
@@ -264,7 +264,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ->addField('content', [
                     'type' => 'tinymce',
                     'title' => 'Content',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $contact_content,
                     'rows' => 20,
                 ]);
diff --git a/app/site/controllers/Admin/Links.php b/app/site/controllers/Admin/Links.php
@@ -157,7 +157,7 @@ public function getFormDefinition(FAPI\Form $form, array &$form_state): FAPI\For
                 ->addField('description', [
                     'type' => 'tinymce',
                     'title' => 'Description',
-                    'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,
+                    'tinymce_options' => $this->getUserTinymceOptions(),
                     'default_value' => $link_description,
                     'rows' => 20,
                 ])->addField('active', [
diff --git a/config/forms_defines.php b/config/forms_defines.php
@@ -17,7 +17,7 @@
     '<div class="alert alert-info"><ul>%s</ul></div>'
 );
 define(
-    'DEFAULT_TINYMCE_OPTIONS',
+    'FORMS_DEFAULT_TINYMCE_OPTIONS',
     [
     'menubar' => false,
     'plugins' => "code,link,lists,advlist,preview,searchreplace,media,table,block_plugin,ai_translate_plugin",
diff --git a/js/src/admin/admin.init.js b/js/src/admin/admin.init.js
@@ -69,11 +69,36 @@
                 });
 
                 $('#darkmode-selector').on('change', function () {
+                    const isDarkMode = $(this).is(':checked');
+
                     $elem.appAdmin('updateUserUiSettings', 
-                        {'darkMode': $(this).is(':checked')},
+                        {'darkMode': isDarkMode},
                         function (data) {
                             //document.location.reload();
                             $('body').toggleClass('dark-mode');
+
+                            if (typeof tinymce === 'undefined' || !tinymce.activeEditor) {
+                                return;
+                            }
+
+                            const activeEditor = tinymce.activeEditor;
+                            const textareaId = activeEditor.id; // ID del textarea originale
+                            const content = activeEditor.getContent();
+                            const defaultOptions = $elem.appAdmin('getSettings').defaultTinymceOptions || {};
+
+                            activeEditor.remove();
+
+                            setTimeout(() => {
+                                tinymce.init({
+                                    ...defaultOptions,
+                                    selector: `#${textareaId}`,
+                                    skin: isDarkMode ? 'oxide-dark' : 'oxide',
+                                    content_css: isDarkMode ? 'dark' : 'default',
+                                    setup: (ed) => {
+                                        ed.on('init', () => ed.setContent(content));
+                                    },
+                                });
+                            }, 100);
                         }
                     );
                 });
diff --git a/scss/partials/dark-mode.scss b/scss/partials/dark-mode.scss
@@ -85,6 +85,7 @@ body.dark-mode {
     .card {
         background-color: $color-darkgrey2 !important;
         color: $color-almostwhite3;
+        border: solid 1px $color-gray2;
 
         .card-header {
             color: $color-almostwhite;

Original file line number	Diff line number	Diff line change
`@@ -176,6 +176,7 @@ protected function prepareTemplate(): Template`
`176`	`176`	`'massEditUrl' => $this->getUrl('crud.app.base.controllers.admin.json.massedit'),`
`177`	`177`	`'mediaPasteUrl' => $this->getUrl('crud.app.site.controllers.admin.json.mediapaste'),`
`178`	`178`	`'currentLocale' => $this->getCurrentLocale(),`
	`179`	`+ 'defaultTinymceOptions' => FORMS_DEFAULT_TINYMCE_OPTIONS,`
`179`	`180`	`]`
`180`	`181`	`) . ");"`
`181`	`182`	`);`
Original file line number	Diff line number	Diff line change
`@@ -232,7 +232,7 @@ function ($el) {`
`232`	`232`	`[`
`233`	`233`	`'type' => 'tinymce',`
`234`	`234`	`'title' => 'Content',`
`235`		`- 'tinymce_options' => DEFAULT_TINYMCE_OPTIONS,`
	`235`	`+ 'tinymce_options' => $this->getUserTinymceOptions(),`
`236`	`236`	`'default_value' => $block_content,`
`237`	`237`	`'rows' => 20,`
`238`	`238`	`]`