From a2bdf70cf7c7929bee451aa26034962453311a1b Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 5 Mar 2024 13:15:47 +0300 Subject: [PATCH 1/3] Refactoring button hint --- apps/common/main/lib/component/Button.js | 90 ++++++++++-------------- 1 file changed, 36 insertions(+), 54 deletions(-) diff --git a/apps/common/main/lib/component/Button.js b/apps/common/main/lib/component/Button.js index 1faefe2f15..bee39ad5d3 100644 --- a/apps/common/main/lib/component/Button.js +++ b/apps/common/main/lib/component/Button.js @@ -475,44 +475,6 @@ define([ isGroup = el.hasClass('btn-group'), isSplit = el.hasClass('split'); - if (me.options.hint) { - var modalParents = me.cmpEl.closest('.asc-window'); - - if (typeof me.options.hint == 'object' && me.options.hint.length>1 && $('button', el).length>0) { - var btnEl = $('button', el); - me.btnEl = $(btnEl[0]); - me.btnMenuEl = $(btnEl[1]); - } else { - me.btnEl = me.cmpEl; - me.btnEl.attr('data-toggle', 'tooltip'); - } - me.btnEl.tooltip({ - title : (typeof me.options.hint == 'string') ? me.options.hint : me.options.hint[0], - placement : me.options.hintAnchor||'cursor' - }); - me.btnMenuEl && me.btnMenuEl.tooltip({ - title : me.options.hint[1], - placement : me.options.hintAnchor||'cursor' - }); - - if (modalParents.length > 0) { - me.btnEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); - me.btnMenuEl && me.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); - var onModalClose = function(dlg) { - if (modalParents[0] !== dlg.$window[0]) return; - var tip = me.btnEl.data('bs.tooltip'); - if (tip) { - if (tip.dontShow===undefined) - tip.dontShow = true; - - tip.hide(); - } - Common.NotificationCenter.off({'modal:close': onModalClose}); - }; - Common.NotificationCenter.on({'modal:close': onModalClose}); - } - } - if (_.isString(me.toggleGroup)) { me.enableToggle = true; } @@ -662,6 +624,8 @@ define([ me.rendered = true; + me.options.hint && me.createHint(me.options.hint); + if (me.pressed) { me.toggle(me.pressed, true); } @@ -822,14 +786,14 @@ define([ return (this.cmpEl) ? this.cmpEl.is(":visible") : $(this.el).is(":visible"); }, - updateHint: function(hint, isHtml) { + createHint: function(hint, isHtml) { this.options.hint = hint; - if (!this.rendered) return; - - var cmpEl = this.cmpEl, - modalParents = cmpEl.closest('.asc-window'); + var me = this, + cmpEl = this.cmpEl, + modalParents = cmpEl.closest('.asc-window'), + tipZIndex = modalParents.length > 0 ? parseInt(modalParents.css('z-index')) + 10 : undefined; if (!this.btnEl) { if (typeof this.options.hint == 'object' && this.options.hint.length>1 && $('button', cmpEl).length>0) { @@ -840,28 +804,46 @@ define([ this.btnEl = cmpEl; this.btnEl.attr('data-toggle', 'tooltip'); } - } + if (modalParents.length > 0) { + var onModalClose = function(dlg) { + if (modalParents[0] !== dlg.$window[0]) return; + var tip = me.btnEl.data('bs.tooltip'); + if (tip) { + if (tip.dontShow===undefined) + tip.dontShow = true; - if (this.btnEl.data('bs.tooltip')) - this.btnEl.removeData('bs.tooltip'); - if (this.btnMenuEl && this.btnMenuEl.data('bs.tooltip')) - this.btnMenuEl.removeData('bs.tooltip'); + tip.hide(); + } + Common.NotificationCenter.off({'modal:close': onModalClose}); + }; + Common.NotificationCenter.on({'modal:close': onModalClose}); + } + } this.btnEl.tooltip({ html: !!isHtml, title : (typeof hint == 'string') ? hint : hint[0], - placement : this.options.hintAnchor||'cursor' + placement : this.options.hintAnchor||'cursor', + zIndex : tipZIndex }); this.btnMenuEl && this.btnMenuEl.tooltip({ html: !!isHtml, title : hint[1], - placement : this.options.hintAnchor||'cursor' + placement : this.options.hintAnchor||'cursor', + zIndex : tipZIndex }); + }, - if (modalParents.length > 0) { - this.btnEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); - this.btnMenuEl && this.btnMenuEl.data('bs.tooltip').tip().css('z-index', parseInt(modalParents.css('z-index')) + 10); - } + updateHint: function(hint, isHtml) { + this.options.hint = hint; + if (!this.rendered) return; + + if (this.btnEl && this.btnEl.data('bs.tooltip')) + this.btnEl.removeData('bs.tooltip'); + if (this.btnMenuEl && this.btnMenuEl.data('bs.tooltip')) + this.btnMenuEl.removeData('bs.tooltip'); + + this.createHint(hint, isHtml); if (this.disabled || !Common.Utils.isGecko) { var tip = this.btnEl.data('bs.tooltip'); From fea4f30ba2ede9d663f44f63c58a0d1dbec25d3a Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 5 Mar 2024 20:39:03 +0300 Subject: [PATCH 2/3] Fix tooltips in TreeView --- apps/common/main/lib/component/TreeView.js | 29 +++++-------------- apps/common/main/lib/util/Tip.js | 2 +- .../main/app/controller/Navigation.js | 2 ++ .../main/app/controller/Navigation.js | 1 + 4 files changed, 12 insertions(+), 22 deletions(-) diff --git a/apps/common/main/lib/component/TreeView.js b/apps/common/main/lib/component/TreeView.js index 145dea7735..c8d84708b2 100644 --- a/apps/common/main/lib/component/TreeView.js +++ b/apps/common/main/lib/component/TreeView.js @@ -58,6 +58,7 @@ define([ selected: false, allowSelected: true, disabled: false, + getTipFromName: true, level: 0, index: 0 } @@ -368,29 +369,16 @@ define([ name = record.get('name'), me = this; - if (name.length > 37 - record.get('level')*2) - record.set('tip', name); - else - record.set('tip', ''); - - var el = item.$el || $(item.el); - var tip = el.data('bs.tooltip'); - if (tip) { - if (tip.dontShow===undefined) - tip.dontShow = true; - el.removeData('bs.tooltip'); - (tip.tip()).remove(); - } - if (record.get('tip')) { + record.get('getTipFromName') && record.set('tip', name.length > 37 - record.get('level')*2 ? name : ''); + + var el = item.$el || $(item.el), + tip = el.data('bs.tooltip'); + if (tip) + tip.updateTitle(record.get('tip')); + else if (record.get('tip') && el.attr('data-toggle')!=='tooltip') { // init tooltip el.attr('data-toggle', 'tooltip'); - el.tooltip({ - title : record.get('tip'), - placement : 'cursor', - zIndex : this.tipZIndex - }); if (this.delayRenderTips) el.one('mouseenter', function(){ - el.attr('data-toggle', 'tooltip'); el.tooltip({ title : record.get('tip'), placement : 'cursor', @@ -399,7 +387,6 @@ define([ el.mouseenter(); }); else { - el.attr('data-toggle', 'tooltip'); el.tooltip({ title : record.get('tip'), placement : 'cursor', diff --git a/apps/common/main/lib/util/Tip.js b/apps/common/main/lib/util/Tip.js index d9951a90e7..c2f01988e4 100644 --- a/apps/common/main/lib/util/Tip.js +++ b/apps/common/main/lib/util/Tip.js @@ -241,7 +241,7 @@ clearTimeout(self.timeout); self.hoverState = 'in'; - if (this._updateTitle) { + if (this._updateTitle!==undefined) { this.tip().find('.tooltip-inner')[this.options.html ? 'html' : 'text'](this.options.title); this._updateTitle = undefined; } diff --git a/apps/documenteditor/main/app/controller/Navigation.js b/apps/documenteditor/main/app/controller/Navigation.js index fbe85f0e8b..14be80b3e9 100644 --- a/apps/documenteditor/main/app/controller/Navigation.js +++ b/apps/documenteditor/main/app/controller/Navigation.js @@ -166,6 +166,7 @@ define([ arr[0].set('isNotHeader', true); arr[0].set('name', this.txtBeginning); arr[0].set('tip', this.txtGotoBeginning); + arr[0].set('getTipFromName', false); } var me = this; @@ -376,6 +377,7 @@ define([ arr[0].set('isNotHeader', true); arr[0].set('name', this.txtBeginning); arr[0].set('tip', this.txtGotoBeginning); + arr[0].set('getTipFromName', false); } this.getApplication().getCollection('Navigation').reset(arr); if (this.panelNavigation && this.panelNavigation.viewNavigationList && this.panelNavigation.viewNavigationList.scroller) diff --git a/apps/pdfeditor/main/app/controller/Navigation.js b/apps/pdfeditor/main/app/controller/Navigation.js index 42785771d2..c03fd92176 100644 --- a/apps/pdfeditor/main/app/controller/Navigation.js +++ b/apps/pdfeditor/main/app/controller/Navigation.js @@ -218,6 +218,7 @@ define([ arr[0].set('isNotHeader', true); arr[0].set('name', this.txtBeginning); arr[0].set('tip', this.txtGotoBeginning); + arr[0].set('getTipFromName', false); } this.getApplication().getCollection('Navigation').reset(arr); if (this.panelNavigation && this.panelNavigation.viewNavigationList && this.panelNavigation.viewNavigationList.scroller) From ea6fe16dd67a838c51112a76105f0565a57ffd7f Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 5 Mar 2024 21:56:42 +0300 Subject: [PATCH 3/3] Delayed rendering for button hints --- apps/common/main/lib/component/Button.js | 75 +++++++++++++++++------- 1 file changed, 55 insertions(+), 20 deletions(-) diff --git a/apps/common/main/lib/component/Button.js b/apps/common/main/lib/component/Button.js index bee39ad5d3..88f69376da 100644 --- a/apps/common/main/lib/component/Button.js +++ b/apps/common/main/lib/component/Button.js @@ -261,6 +261,7 @@ define([ options : { id : null, hint : false, + delayRenderHint : true, enableToggle : false, allowDepress : true, toggleGroup : null, @@ -352,6 +353,7 @@ define([ me.style = me.options.style; me.rendered = false; me.stopPropagation = me.options.stopPropagation; + me.delayRenderHint = me.options.delayRenderHint; // if ( /(? 0) { var onModalClose = function(dlg) { @@ -811,38 +856,28 @@ define([ if (tip) { if (tip.dontShow===undefined) tip.dontShow = true; - tip.hide(); } + if (me.btnMenuEl) { + tip = me.btnMenuEl.data('bs.tooltip'); + if (tip) { + if (tip.dontShow===undefined) + tip.dontShow = true; + tip.hide(); + } + } Common.NotificationCenter.off({'modal:close': onModalClose}); }; Common.NotificationCenter.on({'modal:close': onModalClose}); } + this._isTooltipInited = true; } - - this.btnEl.tooltip({ - html: !!isHtml, - title : (typeof hint == 'string') ? hint : hint[0], - placement : this.options.hintAnchor||'cursor', - zIndex : tipZIndex - }); - this.btnMenuEl && this.btnMenuEl.tooltip({ - html: !!isHtml, - title : hint[1], - placement : this.options.hintAnchor||'cursor', - zIndex : tipZIndex - }); }, updateHint: function(hint, isHtml) { this.options.hint = hint; if (!this.rendered) return; - if (this.btnEl && this.btnEl.data('bs.tooltip')) - this.btnEl.removeData('bs.tooltip'); - if (this.btnMenuEl && this.btnMenuEl.data('bs.tooltip')) - this.btnMenuEl.removeData('bs.tooltip'); - this.createHint(hint, isHtml); if (this.disabled || !Common.Utils.isGecko) {