[themes] refactoring

apps/common/main/lib/controller/ExternalDiagramEditor.js

@@ -56,7 +56,7 @@ define([
 
 
         var createExternalEditor = function() {
-            !!customization && (customization.uiTheme = Common.localStorage.getItem("ui-theme", "theme-light"));
+            !!customization && (customization.uiTheme = Common.localStorage.getItem("ui-theme-id", "theme-light"));
             externalEditor = new DocsAPI.DocEditor('id-diagram-editor-placeholder', {
                 width       : '100%',
                 height      : '100%',
@@ -245,7 +245,7 @@ define([
 
             showExternalEditor: function () {
                 if ( externalEditor ) {
-                    var value = Common.localStorage.getItem("ui-theme", "theme-light");
+                    var value = Common.localStorage.getItem("ui-theme-id", "theme-light");
                     externalEditor.serviceCommand('theme:change', value);
                 }
 

apps/common/main/lib/controller/Themes.js

@@ -198,18 +198,31 @@ define([
             // get_themes_config('../../common/main/resources/themes/themes.json')
         }
 
+        var get_ui_theme_name = function (objtheme) {
+            if ( typeof(objtheme) == 'string' &&
+                    objtheme.startsWith("{") && objtheme.endsWith("}") )
+            {
+                objtheme = JSON.parse(objtheme);
+            }
+
+            if ( objtheme && typeof(objtheme) == 'object' )
+                return objtheme.id;
+
+            return objtheme;
+        }
+
         return {
             init: function (api) {
                 var me = this;
 
                 $(window).on('storage', function (e) {
-                    if ( e.key == 'ui-theme' ) {
+                    if ( e.key == 'ui-theme' || e.key == 'ui-theme-id' ) {
                         me.setTheme(e.originalEvent.newValue);
                     }
                 })
 
                 this.api = api;
-                var theme_name = Common.localStorage.getItem('ui-theme');
+                var theme_name = get_ui_theme_name(Common.localStorage.getItem('ui-theme'));
                 if ( !themes_map[theme_name] )
                     theme_name = id_default_light_theme;
 
@@ -242,7 +255,7 @@ define([
             },
 
             currentThemeId: function () {
-                return Common.localStorage.getItem('ui-theme') || id_default_light_theme;
+                return get_ui_theme_name(Common.localStorage.getItem('ui-theme')) || id_default_light_theme;
             },
 
             defaultThemeId: function (type) {
@@ -257,7 +270,8 @@ define([
                 return themes_map[this.currentThemeId()].type == 'dark';
             },
 
-            setTheme: function (id, force) {
+            setTheme: function (obj, force) {
+                var id = get_ui_theme_name(obj);
                 if ( (this.currentThemeId() != id || force) && !!themes_map[id] ) {
                     var classname = document.body.className.replace(/theme-\w+\s?/, '');
                     document.body.className = classname;
@@ -270,7 +284,16 @@ define([
 
                     this.api.asc_setSkin(obj);
 
-                    Common.localStorage.setItem('ui-theme', id);
+                    if ( !(Common.Utils.isIE10 || Common.Utils.isIE11) ) {
+                        var theme_obj = {
+                            id: id,
+                            type: obj.type,
+                        };
+
+                        Common.localStorage.setItem('ui-theme', JSON.stringify(theme_obj));
+                    }
+
+                    Common.localStorage.setItem('ui-theme-id', id);
                     Common.NotificationCenter.trigger('uitheme:changed', id);
                 }
             },

apps/common/main/lib/util/htmlutils.js

@@ -32,7 +32,7 @@ var params = (function() {
     return urlParams;
 })();
 
-if ( !!params.uitheme && !localStorage.getItem("ui-theme") ) {
+if ( !!params.uitheme && !localStorage.getItem("ui-theme-id") ) {
     // const _t = params.uitheme.match(/([\w-]+)/g);
 
     if ( params.uitheme == 'default-dark' )
@@ -41,14 +41,14 @@ if ( !!params.uitheme && !localStorage.getItem("ui-theme") ) {
     if ( params.uitheme == 'default-light' )
         params.uitheme = 'theme-classic-light';
 
-    localStorage.setItem("ui-theme", params.uitheme);
+    localStorage.setItem("ui-theme-id", params.uitheme);
 }
 
-var ui_theme_name = localStorage.getItem("ui-theme");
+var ui_theme_name = localStorage.getItem("ui-theme-id");
 if ( !ui_theme_name ) {
     if ( window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ) {
         ui_theme_name = 'theme-dark';
-        localStorage.setItem("ui-theme", ui_theme_name);
+        localStorage.setItem("ui-theme-id", ui_theme_name);
     }
 }
 if ( !!ui_theme_name ) {

apps/presentationeditor/main/app.reporter.js

@@ -93,7 +93,7 @@ require([
     var api = new Asc.asc_docs_api({
         'id-view'  : 'editor_sdk',
         using      : 'reporter',
-        skin       : localStorage.getItem("ui-theme")
+        skin       : localStorage.getItem("ui-theme-id")
     });
 
     var setDocumentTitle = function(title) {

apps/presentationeditor/main/app_dev.reporter.js

@@ -94,7 +94,7 @@ require([
     var api = new Asc.asc_docs_api({
         'id-view'  : 'editor_sdk',
         using      : 'reporter',
-        skin       : localStorage.getItem("ui-theme")
+        skin       : localStorage.getItem("ui-theme-id")
     });
 
     var setDocumentTitle = function(title) {