diff --git a/apps/common/main/lib/component/ComboBoxFonts.js b/apps/common/main/lib/component/ComboBoxFonts.js index 5d3e28991..2f47283a6 100644 --- a/apps/common/main/lib/component/ComboBoxFonts.js +++ b/apps/common/main/lib/component/ComboBoxFonts.js @@ -51,21 +51,37 @@ define([ Common.UI.ComboBoxFonts = Common.UI.ComboBox.extend((function() { var iconWidth = 302, iconHeight = Asc.FONT_THUMBNAIL_HEIGHT || 26, - isRetina = window.devicePixelRatio > 1, thumbCanvas = document.createElement('canvas'), thumbContext = thumbCanvas.getContext('2d'), - thumbPath = '../../../../sdkjs/common/Images/fonts_thumbnail.png', - thumbPath2x = '../../../../sdkjs/common/Images/fonts_thumbnail@2x.png', + thumbs = [ + {ratio: 1, path: '../../../../sdkjs/common/Images/fonts_thumbnail.png', width: iconWidth, height: iconHeight}, + {ratio: 1.5, path: '../../../../sdkjs/common/Images/fonts_thumbnail@1.5x.png', width: iconWidth * 1.5, height: iconHeight * 1.5}, + {ratio: 2, path: '../../../../sdkjs/common/Images/fonts_thumbnail@2x.png', width: iconWidth * 2, height: iconHeight * 2} + ], + thumbIdx = 0, listItemHeight = 26, - spriteCols = 1; + spriteCols = 1, + applicationPixelRatio = Common.Utils.applicationPixelRatio(); if (typeof window['AscDesktopEditor'] === 'object') { - thumbPath = window['AscDesktopEditor'].getFontsSprite(); - thumbPath2x = window['AscDesktopEditor'].getFontsSprite(true); + thumbs[0].path = window['AscDesktopEditor'].getFontsSprite(''); + thumbs[1].path = window['AscDesktopEditor'].getFontsSprite('@1.5x'); + thumbs[2].path = window['AscDesktopEditor'].getFontsSprite('@2x'); } - thumbCanvas.height = isRetina ? iconHeight * 2 : iconHeight; - thumbCanvas.width = isRetina ? iconWidth * 2 : iconWidth; + var bestDistance = Math.abs(applicationPixelRatio-thumbs[0].ratio); + var currentDistance = 0; + for (var i=1; i 1 ? width / 2 : width; + this.itemWidth = Common.Utils.applicationPixelRatio() > 1 ? width / 2 : width; }, setItemHeight: function(height) { if (this.itemHeight != height) - this.itemHeight = window.devicePixelRatio > 1 ? height / 2 : height; + this.itemHeight = Common.Utils.applicationPixelRatio() > 1 ? height / 2 : height; }, removeTips: function() { diff --git a/apps/common/main/lib/controller/Plugins.js b/apps/common/main/lib/controller/Plugins.js index 22dd05791..2ae5c19c5 100644 --- a/apps/common/main/lib/controller/Plugins.js +++ b/apps/common/main/lib/controller/Plugins.js @@ -102,6 +102,8 @@ define([ Common.Gateway.on('init', this.loadConfig.bind(this)); Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this)); + Common.NotificationCenter.on('uitheme:changed', this.updatePluginsButtons.bind(this)); + Common.NotificationCenter.on('window:resize', this.updatePluginsButtons.bind(this)); }, loadConfig: function(data) { @@ -284,6 +286,14 @@ define([ } }, + updatePluginsButtons: function() { + var storePlugins = this.getApplication().getCollection('Common.Collections.Plugins'), + me = this; + storePlugins.each(function(item){ + me.panelPlugins.updatePluginIcons(item); + }); + }, + onSelectPlugin: function(picker, item, record, e){ var btn = $(e.target); if (btn && btn.hasClass('plugin-caret')) { diff --git a/apps/common/main/lib/util/utils.js b/apps/common/main/lib/util/utils.js index 3226bbf5a..a56b883b4 100644 --- a/apps/common/main/lib/util/utils.js +++ b/apps/common/main/lib/util/utils.js @@ -151,8 +151,10 @@ Common.Utils = _.extend(new(function() { me.zoom = scale.correct ? scale.zoom : 1; me.innerWidth = window.innerWidth * me.zoom; me.innerHeight = window.innerHeight * me.zoom; + me.applicationPixelRatio = scale.applicationPixelRatio || scale.devicePixelRatio; }; me.zoom = 1; + me.applicationPixelRatio = 1; me.innerWidth = window.innerWidth; me.innerHeight = window.innerHeight; if ( isIE ) @@ -227,6 +229,7 @@ Common.Utils = _.extend(new(function() { documentSettingsType: documentSettingsType, importTextType: importTextType, zoom: function() {return me.zoom;}, + applicationPixelRatio: function() {return me.applicationPixelRatio;}, topOffset: 0, innerWidth: function() {return me.innerWidth;}, innerHeight: function() {return me.innerHeight;}, diff --git a/apps/common/main/lib/view/Plugins.js b/apps/common/main/lib/view/Plugins.js index 9a1296b17..d607a1fdf 100644 --- a/apps/common/main/lib/view/Plugins.js +++ b/apps/common/main/lib/view/Plugins.js @@ -151,7 +151,7 @@ define([ var modes = model.get('variations'), guid = model.get('guid'), icons = modes[model.get('currentVariation')].get('icons'), - _icon_url = model.get('baseUrl') + icons[((window.devicePixelRatio > 1) ? 1 : 0) + (icons.length>2 ? 2 : 0)], + _icon_url = model.get('baseUrl') + me.parseIcons(icons), btn = new Common.UI.Button({ cls: 'btn-toolbar x-huge icon-top', iconImg: _icon_url, @@ -250,6 +250,7 @@ define([ var _btn = model.get('button'); if (_btn) { _btn.toggle(true); + this.updatePluginButton(model); if (_btn.menu && _btn.menu.items.length>0) { _btn.menu.items[0].setCaption(this.textStop); } @@ -265,6 +266,7 @@ define([ var _btn = model.get('button'); if (_btn) { _btn.toggle(false); + this.updatePluginButton(model); if (_btn.menu && _btn.menu.items.length>0) { _btn.menu.items[0].setCaption(this.textStart); } @@ -280,6 +282,82 @@ define([ _onAppReady: function (mode) { }, + parseIcons: function(icons) { + if (icons.length && typeof icons[0] !== 'string') { + var theme = Common.UI.Themes.current().toLowerCase(), + style = Common.UI.Themes.isDarkTheme() ? 'dark' : 'light', + idx = -1; + for (var i=0; i0.01 && defUrl) && (bestUrl = defUrl); + return { + 'normal': bestUrl['normal'], + 'hover': bestUrl['hover'] || bestUrl['normal'], + 'active': bestUrl['active'] || bestUrl['normal'] + }; + } else { // old version + var url = icons[((Common.Utils.applicationPixelRatio() > 1) ? 1 : 0) + (icons.length > 2 ? 2 : 0)]; + return { + 'normal': url, + 'hover': url, + 'active': url + }; + } + }, + + updatePluginIcons: function(model) { + if (!model.get('visible')) + return null; + + var modes = model.get('variations'), + icons = modes[model.get('currentVariation')].get('icons'); + model.set('parsedIcons', this.parseIcons(icons)); + this.updatePluginButton(model); + }, + + updatePluginButton: function(model) { + if (!model.get('visible')) + return null; + + var btn = model.get('button'); + if (btn && btn.cmpEl) { + btn.cmpEl.find(".inner-box-icon img").attr("src", model.get('baseUrl') + model.get('parsedIcons')[btn.isActive() ? 'active' : 'normal']); + } + }, + createPluginButton: function (model) { if (!model.get('visible')) return null; @@ -289,8 +367,9 @@ define([ var modes = model.get('variations'), guid = model.get('guid'), icons = modes[model.get('currentVariation')].get('icons'), - icon_url = model.get('baseUrl') + icons[((window.devicePixelRatio > 1) ? 1 : 0) + (icons.length > 2 ? 2 : 0)]; - + parsedIcons = this.parseIcons(icons), + icon_url = model.get('baseUrl') + parsedIcons['normal']; + model.set('parsedIcons', parsedIcons); var _menu_items = []; _.each(model.get('variations'), function(variation, index) { if (variation.get('visible')) diff --git a/apps/common/main/resources/img/header/dark-logo.png b/apps/common/main/resources/img/header/dark-logo.png deleted file mode 100644 index 857f2c82e..000000000 Binary files a/apps/common/main/resources/img/header/dark-logo.png and /dev/null differ diff --git a/apps/common/main/resources/img/header/dark-logo@2x.png b/apps/common/main/resources/img/header/dark-logo@2x.png deleted file mode 100644 index d427eb3f7..000000000 Binary files a/apps/common/main/resources/img/header/dark-logo@2x.png and /dev/null differ diff --git a/apps/common/main/resources/img/header/dark-logo_s.svg b/apps/common/main/resources/img/header/dark-logo_s.svg new file mode 100644 index 000000000..4de1b67a5 --- /dev/null +++ b/apps/common/main/resources/img/header/dark-logo_s.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/apps/common/main/resources/img/header/header-logo.png b/apps/common/main/resources/img/header/header-logo.png deleted file mode 100644 index bace6a100..000000000 Binary files a/apps/common/main/resources/img/header/header-logo.png and /dev/null differ diff --git a/apps/common/main/resources/img/header/header-logo@2x.png b/apps/common/main/resources/img/header/header-logo@2x.png deleted file mode 100644 index 57644434a..000000000 Binary files a/apps/common/main/resources/img/header/header-logo@2x.png and /dev/null differ diff --git a/apps/common/main/resources/img/header/header-logo_s.svg b/apps/common/main/resources/img/header/header-logo_s.svg new file mode 100644 index 000000000..9dd96d4a5 --- /dev/null +++ b/apps/common/main/resources/img/header/header-logo_s.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/apps/common/main/resources/less/buttons.less b/apps/common/main/resources/less/buttons.less index 16b3152a3..9521402dc 100644 --- a/apps/common/main/resources/less/buttons.less +++ b/apps/common/main/resources/less/buttons.less @@ -221,7 +221,8 @@ height: @x-huge-btn-height; img { - height: 27px; + width: @x-huge-btn-icon-size; + height: @x-huge-btn-icon-size; } .inner-box-caption { diff --git a/apps/common/main/resources/less/combobox.less b/apps/common/main/resources/less/combobox.less index 2d4fdf71d..76e674b57 100644 --- a/apps/common/main/resources/less/combobox.less +++ b/apps/common/main/resources/less/combobox.less @@ -64,8 +64,6 @@ &:hover, &:focus { background-color: transparent; - border-color: @border-regular-control-ie; - border-color: @border-regular-control; } } @@ -166,4 +164,4 @@ border-color: @border-control-focus; } } -} \ No newline at end of file +} diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index 5d5d92f25..e662126f2 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -373,7 +373,7 @@ text-align: center; cursor: pointer; font-size: 11px; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-family: @font-family-base; } .resolved { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 24b6e5d01..82a03b18e 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -141,17 +141,8 @@ display: inline-block; vertical-align: middle; - background-image: ~"url('@{common-image-const-path}/header/header-logo.png')"; + background-image: ~"url('@{common-image-const-path}/header/header-logo_s.svg')"; background-repeat: no-repeat; - - @media - only screen and (-webkit-min-device-pixel-ratio: 2), - only screen and (min-resolution: 2dppx), - only screen and (min-resolution: 192dpi) { - background-image: ~"url('@{common-image-const-path}/header/header-logo@2x.png')"; - background-size: 86px auto; - } - } &.link img { diff --git a/apps/common/main/resources/less/plugins.less b/apps/common/main/resources/less/plugins.less index 070b9856f..1e5ac5ded 100644 --- a/apps/common/main/resources/less/plugins.less +++ b/apps/common/main/resources/less/plugins.less @@ -128,10 +128,6 @@ #plugins-panel { .x-huge.icon-top { - img { - height: 26px; - } - .caption { text-overflow: ellipsis; max-width: 60px; diff --git a/apps/common/main/resources/less/toolbar.less b/apps/common/main/resources/less/toolbar.less index c17ec81dc..89479f749 100644 --- a/apps/common/main/resources/less/toolbar.less +++ b/apps/common/main/resources/less/toolbar.less @@ -381,7 +381,8 @@ .extra { #header-logo { i { - .background-ximage-v2('header/dark-logo.png', 86px); + background-image: ~"url('@{common-image-const-path}/header/dark-logo_s.svg')"; + background-repeat: no-repeat; } } } diff --git a/apps/common/main/resources/less/variables.less b/apps/common/main/resources/less/variables.less index 112d516cf..6b0fc5ce8 100644 --- a/apps/common/main/resources/less/variables.less +++ b/apps/common/main/resources/less/variables.less @@ -56,7 +56,7 @@ // Typography // ------------------------- -@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif; +@font-family-sans-serif: Arial, Helvetica, "Helvetica Neue", sans-serif; @font-family-serif: Georgia, "Times New Roman", Times, serif; @font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace; @font-family-tahoma: tahoma, arial, verdana, sans-serif; diff --git a/apps/documenteditor/embed/index_loader.html b/apps/documenteditor/embed/index_loader.html index eca7003ab..f943dccde 100644 --- a/apps/documenteditor/embed/index_loader.html +++ b/apps/documenteditor/embed/index_loader.html @@ -51,7 +51,7 @@ position: absolute; text-align: center; color: #888; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-family: Arial, Helvetica, "Helvetica Neue", sans-serif; line-height: 20px; } diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html index 14003c631..25689a90d 100644 --- a/apps/documenteditor/main/index.html +++ b/apps/documenteditor/main/index.html @@ -237,7 +237,7 @@
+