Fix visibility of alt-key hints when we need to scroll tabs, add hints to scroll buttons

This commit is contained in:
JuliaSvinareva 2021-08-17 16:55:46 +03:00
parent be00f799e3
commit d9757ca68e
2 changed files with 15 additions and 4 deletions

View file

@ -260,6 +260,8 @@ Common.UI.HintManager = new(function() {
_getControls();
_currentControls.forEach(function(item, index) {
if (!_isItemDisabled(item)) {
var leftBorder = 0,
rightBorder = docW;
if ($(_currentSection).prop('id') === 'toolbar' && ($(_currentSection).find('.toolbar-mask').length > 0 || item.closest('.group').find('.toolbar-group-mask').length > 0)) {
return;
}
@ -269,6 +271,15 @@ Common.UI.HintManager = new(function() {
return;
}
}
if (_currentLevel === 0 && item.closest('.tabs.short').length > 0) {
var blockTabs = item.closest('.tabs.short');
leftBorder = blockTabs.offset().left;
rightBorder = leftBorder + blockTabs.width();
if (!item.hasClass('scroll')) {
leftBorder += 20;
rightBorder -= 20;
}
}
var hint = $('<div style="" class="hint-div">' + item.attr('data-hint-title') + '</div>');
var direction = item.attr('data-hint-direction');
// exceptions
@ -327,7 +338,7 @@ Common.UI.HintManager = new(function() {
left = offset.left + (item.outerWidth() - 18) / 2 + offsets[1];
}
if (top < maxHeight && left < docW && top > topSection && top < bottomSection) {
if (top < maxHeight && left < docW && top > topSection && top < bottomSection && left > leftBorder && left + 18 < rightBorder) {
hint.css({
top: top,
left: left
@ -452,7 +463,7 @@ Common.UI.HintManager = new(function() {
}
}
}
if (curr.prop('id') === 'btn-goback' || curr.closest('.btn-slot').prop('id') === 'slot-btn-options' || curr.prop('id') === 'left-btn-thumbs') {
if (curr.prop('id') === 'btn-goback' || curr.closest('.btn-slot').prop('id') === 'slot-btn-options' || curr.prop('id') === 'left-btn-thumbs' || curr.hasClass('scroll')) {
_resetToDefault();
return;
}

View file

@ -93,7 +93,7 @@ define([
var _template_tabs =
'<section class="tabs">' +
'<a class="scroll left"></a>' +
'<a class="scroll left" data-hint="0" data-hint-direction="bottom" data-hint-offset="-7, 0" data-hint-title="V"></a>' +
'<ul>' +
'<% for(var i in items) { %>' +
'<% if (typeof items[i] == "object") { %>' +
@ -105,7 +105,7 @@ define([
'<% } %>' +
'<% } %>' +
'</ul>' +
'<a class="scroll right"></a>' +
'<a class="scroll right" data-hint="0" data-hint-direction="bottom" data-hint-offset="-7, 0" data-hint-title="R"></a>' +
'</section>';
this.$layout = $(options.template({