From 40a7e66834e423804f073dda9106203d6abeb31f Mon Sep 17 00:00:00 2001 From: Maxim Kadushkin Date: Tue, 2 Feb 2021 15:37:00 +0300 Subject: [PATCH] [dark theme] keep theme name for next session --- apps/api/documents/api.js | 3 +++ .../lib/controller/ExternalDiagramEditor.js | 10 ++++++++++ .../main/app/controller/Main.js | 20 ++++++++++++++----- .../main/app/controller/Toolbar.js | 6 ++++-- apps/documenteditor/main/index.html | 5 +++++ .../main/app/controller/Main.js | 18 ++++++++++++----- apps/presentationeditor/main/index.html | 5 +++++ .../main/app/controller/Main.js | 19 +++++++++++++++++- apps/spreadsheeteditor/main/index.html | 5 +++++ .../main/index_internal.html | 4 ++++ 10 files changed, 82 insertions(+), 13 deletions(-) diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js index 860f1097a..56edaaab0 100644 --- a/apps/api/documents/api.js +++ b/apps/api/documents/api.js @@ -862,6 +862,9 @@ if (config.parentOrigin) params += "&parentOrigin=" + config.parentOrigin; + if (config.editorConfig && config.editorConfig.customization && config.editorConfig.customization.uiTheme ) + params += "&uitheme=" + config.editorConfig.customization.uiTheme; + return params; } diff --git a/apps/common/main/lib/controller/ExternalDiagramEditor.js b/apps/common/main/lib/controller/ExternalDiagramEditor.js index d74983b0b..3fb29f3b4 100644 --- a/apps/common/main/lib/controller/ExternalDiagramEditor.js +++ b/apps/common/main/lib/controller/ExternalDiagramEditor.js @@ -56,6 +56,7 @@ define([ var createExternalEditor = function() { + !!customization && (customization.uiTheme = Common.localStorage.getItem("uitheme", "theme-light")); externalEditor = new DocsAPI.DocEditor('id-diagram-editor-placeholder', { width : '100%', height : '100%', @@ -242,6 +243,15 @@ define([ } }, + showExternalEditor: function () { + if ( externalEditor ) { + var value = Common.localStorage.getItem("uitheme", "theme-light"); + externalEditor.serviceCommand('theme:change', value); + } + + this.diagramEditorView.show(); + }, + warningTitle: 'Warning', warningText: 'The object is disabled because of editing by another user.', textClose: 'Close', diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index f103c8820..0693247d1 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -189,6 +189,9 @@ define([ case '2': this.api.SetFontRenderingMode(2); break; } + value = Common.localStorage.getItem("uitheme", "theme-light"); + me.api.asc_setSkin(value == "theme-dark" ? 'flatDark' : "flat"); + this.api.asc_registerCallback('asc_onError', _.bind(this.onError, this)); this.api.asc_registerCallback('asc_onDocumentContentReady', _.bind(this.onDocumentContentReady, this)); this.api.asc_registerCallback('asc_onOpenDocumentProgress', _.bind(this.onOpenDocument, this)); @@ -1119,12 +1122,19 @@ define([ $('#header-logo').children(0).click(e => { e.stopImmediatePropagation(); - $(':root').toggleClass('theme-dark'); - // getComputedStyle(document.documentElement).getPropertyValue('--background-normal'); - - if (AscCommon.GlobalSkin.Name == 'flat') + var value = Common.localStorage.getItem("uitheme", "theme-light"); + var classname = document.documentElement.className.replace(/theme-\w+\s?/, ''); + document.documentElement.className = classname; + if ( value != "theme-dark" ) { me.api.asc_setSkin('flatDark'); - else me.api.asc_setSkin("flat"); + $(':root').addClass('theme-dark'); + Common.localStorage.setItem("uitheme", "theme-dark"); + } else { + me.api.asc_setSkin("flat"); + Common.localStorage.setItem("uitheme", "theme-light"); + } + + // getComputedStyle(document.documentElement).getPropertyValue('--background-normal'); }) }, diff --git a/apps/documenteditor/main/app/controller/Toolbar.js b/apps/documenteditor/main/app/controller/Toolbar.js index 5fac11458..b86b8c340 100644 --- a/apps/documenteditor/main/app/controller/Toolbar.js +++ b/apps/documenteditor/main/app/controller/Toolbar.js @@ -2056,12 +2056,14 @@ define([ Common.NotificationCenter.trigger('edit:complete', this.toolbar); } else { + var controller = this.getApplication().getController('Common.Controllers.ExternalDiagramEditor'); if (!this.diagramEditor) - this.diagramEditor = this.getApplication().getController('Common.Controllers.ExternalDiagramEditor').getView('Common.Views.ExternalDiagramEditor'); + this.diagramEditor = controller.getView('Common.Views.ExternalDiagramEditor'); if (this.diagramEditor && me.api) { this.diagramEditor.setEditMode(false); - this.diagramEditor.show(); + // this.diagramEditor.show(); + controller.showExternalEditor(); chart = me.api.asc_getChartObject(type); if (chart) { diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html index 033f6c1e3..b1b175c42 100644 --- a/apps/documenteditor/main/index.html +++ b/apps/documenteditor/main/index.html @@ -204,6 +204,11 @@ window.frameEditorId = params["frameEditorId"]; window.parentOrigin = params["parentOrigin"]; + var ui_theme_name = params.uitheme || localStorage.getItem("uitheme"); + if ( !!ui_theme_name ) { + document.documentElement.classList.add(ui_theme_name); + } + if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) document.write(' diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index 9ac6fda7b..cecfcbde6 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -170,6 +170,9 @@ define([ Common.Utils.InternalSettings.set("pe-settings-fontrender", value); this.api.SetFontRenderingMode(parseInt(value)); + value = Common.localStorage.getItem("uitheme", "theme-light"); + me.api.asc_setSkin(value == "theme-dark" ? 'flatDark' : "flat"); + this.api.asc_registerCallback('asc_onError', _.bind(this.onError, this)); this.api.asc_registerCallback('asc_onDocumentContentReady', _.bind(this.onDocumentContentReady, this)); this.api.asc_registerCallback('asc_onOpenDocumentProgress', _.bind(this.onOpenDocument, this)); @@ -843,12 +846,17 @@ define([ $('#header-logo').children(0).click(e => { e.stopImmediatePropagation(); - $(':root').toggleClass('theme-dark'); - // getComputedStyle(document.documentElement).getPropertyValue('--background-normal'); - - if (AscCommon.GlobalSkin.Name == 'flat') + var value = Common.localStorage.getItem("uitheme", "theme-light"); + var classname = document.documentElement.className.replace(/theme-\w+\s?/, ''); + document.documentElement.className = classname; + if ( value != "theme-dark" ) { me.api.asc_setSkin('flatDark'); - else me.api.asc_setSkin("flat"); + $(':root').addClass('theme-dark'); + Common.localStorage.setItem("uitheme", "theme-dark"); + } else { + me.api.asc_setSkin("flat"); + Common.localStorage.setItem("uitheme", "theme-light"); + } }) }, diff --git a/apps/presentationeditor/main/index.html b/apps/presentationeditor/main/index.html index b8d706261..24629fc9b 100644 --- a/apps/presentationeditor/main/index.html +++ b/apps/presentationeditor/main/index.html @@ -232,6 +232,11 @@ window.frameEditorId = params["frameEditorId"]; window.parentOrigin = params["parentOrigin"]; + var ui_theme_name = params.uitheme || localStorage.getItem("uitheme"); + if ( !!ui_theme_name ) { + document.documentElement.classList.add(ui_theme_name); + } + if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) document.write(' diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index e96020b8d..485c1189e 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -176,6 +176,9 @@ define([ Common.Utils.InternalSettings.set("sse-settings-fontrender", value); this.api.asc_setFontRenderingMode(parseInt(value)); + value = Common.localStorage.getItem("uitheme", "theme-light"); + this.api.asc_setSkin(value == "theme-dark" ? 'flatDark' : "flat"); + this.api.asc_registerCallback('asc_onOpenDocumentProgress', _.bind(this.onOpenDocument, this)); this.api.asc_registerCallback('asc_onEndAction', _.bind(this.onLongActionEnd, this)); this.api.asc_registerCallback('asc_onError', _.bind(this.onError, this)); @@ -908,7 +911,16 @@ define([ $('#header-logo').children(0).click(e => { e.stopImmediatePropagation(); - $(':root').toggleClass('theme-dark'); + document.documentElement.className = document.documentElement.className.replace(/theme-\w+\s?/, ''); + if ( "theme-dark" != Common.localStorage.getItem("uitheme", "theme-light") ) { + me.api.asc_setSkin('flatDark'); + $(':root').addClass('theme-dark'); + Common.localStorage.setItem("uitheme", "theme-dark"); + } else { + me.api.asc_setSkin("flat"); + Common.localStorage.setItem("uitheme", "theme-light"); + } + // getComputedStyle(document.documentElement).getPropertyValue('--background-normal'); }) }, @@ -2042,6 +2054,11 @@ define([ case 'processmouse': this.onProcessMouse(data.data); break; + case 'theme:change': + document.documentElement.className = + document.documentElement.className.replace(/theme-\w+\s?/, data.data); + this.api.asc_setSkin(data.data == "theme-dark" ? 'flatDark' : "flat"); + break; } } }, diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html index 1f0df81ad..6b4cd55b2 100644 --- a/apps/spreadsheeteditor/main/index.html +++ b/apps/spreadsheeteditor/main/index.html @@ -232,6 +232,11 @@ window.frameEditorId = params["frameEditorId"]; window.parentOrigin = params["parentOrigin"]; + var ui_theme_name = params.uitheme || localStorage.getItem("uitheme"); + if ( !!ui_theme_name ) { + document.documentElement.classList.add(ui_theme_name); + } + if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) document.write(' diff --git a/apps/spreadsheeteditor/main/index_internal.html b/apps/spreadsheeteditor/main/index_internal.html index 72175b2c0..55273445e 100644 --- a/apps/spreadsheeteditor/main/index_internal.html +++ b/apps/spreadsheeteditor/main/index_internal.html @@ -162,6 +162,10 @@ window.frameEditorId = params["frameEditorId"]; window.parentOrigin = params["parentOrigin"]; + if ( !!params.uitheme ) { + document.documentElement.classList.add(params.uitheme); + } + if(/MSIE \d|Trident.*rv:/.test(navigator.userAgent)) document.write('