From 8d2958738f21555e37d64418c0748760bd265e52 Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Wed, 14 Jun 2023 00:51:05 +0200
Subject: [PATCH] add option to hide the "Powered by CKEditor" banner

---
 .../widgets/type_widgets/content_widget.js    |  6 ++--
 .../options/appearance/powered_by_ckeditor.js | 32 +++++++++++++++++++
 src/routes/api/options.js                     |  1 +
 src/routes/index.js                           |  1 +
 src/services/options_init.js                  |  1 +
 src/views/desktop.ejs                         |  6 ++++
 6 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 src/public/app/widgets/type_widgets/options/appearance/powered_by_ckeditor.js

diff --git a/src/public/app/widgets/type_widgets/content_widget.js b/src/public/app/widgets/type_widgets/content_widget.js
index 9c075ef46..27acf5521 100644
--- a/src/public/app/widgets/type_widgets/content_widget.js
+++ b/src/public/app/widgets/type_widgets/content_widget.js
@@ -31,6 +31,7 @@ import VacuumDatabaseOptions from "./options/advanced/vacuum_database.js";
 import DatabaseAnonymizationOptions from "./options/advanced/database_anonymization.js";
 import BackendLogWidget from "./content/backend_log.js";
 import AttachmentErasureTimeoutOptions from "./options/other/attachment_erasure_timeout.js";
+import PoweredByCKEditorOptions from "./options/appearance/powered_by_ckeditor.js";
 
 const TPL = `<div class="note-detail-content-widget note-detail-printable">
     <style>
@@ -53,10 +54,11 @@ const TPL = `<div class="note-detail-content-widget note-detail-printable">
 
 const CONTENT_WIDGETS = {
     _optionsAppearance: [
-        ZoomFactorOptions,
-        NativeTitleBarOptions,
+        PoweredByCKEditorOptions,
         ThemeOptions,
         FontsOptions,
+        ZoomFactorOptions,
+        NativeTitleBarOptions,
         MaxContentWidthOptions
     ],
     _optionsShortcuts: [ KeyboardShortcutsOptions ],
diff --git a/src/public/app/widgets/type_widgets/options/appearance/powered_by_ckeditor.js b/src/public/app/widgets/type_widgets/options/appearance/powered_by_ckeditor.js
new file mode 100644
index 000000000..135b8db1e
--- /dev/null
+++ b/src/public/app/widgets/type_widgets/options/appearance/powered_by_ckeditor.js
@@ -0,0 +1,32 @@
+import OptionsWidget from "../options_widget.js";
+import utils from "../../../../services/utils.js";
+
+const TPL = `
+<div class="options-section">
+    <h4>Powered by CKEditor banner</h4>
+    
+    <p>CKEditor by default displays a small banner in the editing area. Some users may find this distracting, so it is possible to hide it.</p>
+    
+    <select class="powered-by-ckeditor-select form-control">
+        <option value="show">shown</option>
+        <option value="hide">hidden</option>
+    </select>
+</div>`;
+
+export default class PoweredByCKEditorOptions extends OptionsWidget {
+    doRender() {
+        this.$widget = $(TPL);
+        this.$poweredByCKEditorSelect = this.$widget.find(".powered-by-ckeditor-select");
+        this.$poweredByCKEditorSelect.on('change', async () => {
+            const hidePoweredByCKEditor = this.$poweredByCKEditorSelect.val() === 'hide' ? 'true' : 'false';
+
+            await this.updateOption('hidePoweredByCKEditor', hidePoweredByCKEditor);
+
+            utils.reloadFrontendApp("Powered by CKEditor change");
+        });
+    }
+
+    async optionsLoaded(options) {
+        this.$poweredByCKEditorSelect.val(options.hidePoweredByCKEditor === 'true' ? 'hide' : 'show');
+    }
+}
diff --git a/src/routes/api/options.js b/src/routes/api/options.js
index 05dbcd1d8..0cab790d2 100644
--- a/src/routes/api/options.js
+++ b/src/routes/api/options.js
@@ -56,6 +56,7 @@ const ALLOWED_OPTIONS = new Set([
     'disableTray',
     'customSearchEngineName',
     'customSearchEngineUrl',
+    'hidePoweredByCKEditor'
 ]);
 
 function getOptions() {
diff --git a/src/routes/index.js b/src/routes/index.js
index e83b4fcd4..462ca2d79 100644
--- a/src/routes/index.js
+++ b/src/routes/index.js
@@ -29,6 +29,7 @@ function index(req, res) {
         mainFontSize: parseInt(options.mainFontSize),
         treeFontSize: parseInt(options.treeFontSize),
         detailFontSize: parseInt(options.detailFontSize),
+        hidePoweredByCKEditor: options.hidePoweredByCKEditor === 'true',
         maxEntityChangeIdAtLoad: sql.getValue("SELECT COALESCE(MAX(id), 0) FROM entity_changes"),
         maxEntityChangeSyncIdAtLoad: sql.getValue("SELECT COALESCE(MAX(id), 0) FROM entity_changes WHERE isSynced = 1"),
         instanceName: config.General ? config.General.instanceName : null,
diff --git a/src/services/options_init.js b/src/services/options_init.js
index 560d3994f..772941b13 100644
--- a/src/services/options_init.js
+++ b/src/services/options_init.js
@@ -89,6 +89,7 @@ const defaultOptions = [
     { name: 'eraseUnusedAttachmentsAfterSeconds', value: '2592000', isSynced: true },
     { name: 'customSearchEngineName', value: 'DuckDuckGo', isSynced: true },
     { name: 'customSearchEngineUrl', value: 'https://duckduckgo.com/?q={keyword}', isSynced: true },
+    { name: 'hidePoweredByCKEditor', value: 'false', isSynced: true },
 ];
 
 function initStartupOptions() {
diff --git a/src/views/desktop.ejs b/src/views/desktop.ejs
index 0f2ee750a..083c4deaf 100644
--- a/src/views/desktop.ejs
+++ b/src/views/desktop.ejs
@@ -44,6 +44,12 @@
     .note-split {
         max-width: <%= maxContentWidth %>px;
     }
+
+    <% if (hidePoweredByCKEditor) { %>
+    .ck-powered-by-balloon {
+        display: none !important;
+    }
+    <% } %>
 </style>
 
 <!-- Required for correct loading of scripts in Electron -->