Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[Header] Change icon for current user

Browse source
This commit is contained in:
Julia Radzhabova 2022-02-03 23:14:59 +03:00
parent 175cdd9fb5
commit 06a0f34d49
2 changed files with 73 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
apps/common/main/lib/view/Header.js
View file

@ -111,7 +111,7 @@ define([
'<div class="btn-slot" id="slot-btn-favorite"></div>' +
'</div>' +
'<div class="hedset">' +
'<div class="btn-slot" id="slot-btn-user-name"></div>' +
'<div class="btn-slot slot-btn-user-name"></div>' +
'<div class="btn-current-user btn-header hidden">' +
'<i class="icon toolbar__icon icon--inverse btn-user"></i>' +
'</div>' +
@ -135,7 +135,12 @@ define([
// '<label id="title-doc-name" /></label>' +
'<input id="title-doc-name" autofill="off" autocomplete="off"/></input>' +
'</div>' +
'<label id="title-user-name"></label>' +
'<div class="hedset">' +
'<div class="btn-slot slot-btn-user-name"></div>' +
'<div class="btn-current-user btn-header hidden">' +
'<i class="icon toolbar__icon icon--inverse btn-user"></i>' +
'</div>' +
'</div>' +
'</section>';
function onResetUsers(collection, opts) {
@ -281,12 +286,7 @@ define([
if (appConfig.user.guest && appConfig.canRenameAnonymous) {
if (me.labelUserName) {
me.labelUserName.addClass('clickable');
me.labelUserName.on('click', function (e) {
Common.NotificationCenter.trigger('user:rename');
});
} else if (me.btnUserName) {
if (me.btnUserName) {
me.btnUserName.on('click', function (e) {
Common.NotificationCenter.trigger('user:rename');
});
@ -531,7 +531,7 @@ define([
if (!config.isEdit || config.customization && !!config.customization.compactHeader) {
if (config.user.guest && config.canRenameAnonymous)
me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('#slot-btn-user-name'), undefined, 'bottom', 'big' );
me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' );
else {
me.elUserName = $html.find('.btn-current-user');
me.elUserName.removeClass('hidden');
@ -557,7 +557,12 @@ define([
me.labelDocName.val( me.documentCaption );
me.options.wopi && me.labelDocName.attr('maxlength', me.options.wopi.FileNameMaxLength);
me.labelUserName = $('> #title-user-name', $html);
if (config.user.guest && config.canRenameAnonymous)
me.btnUserName = createTitleButton('toolbar__icon icon--inverse btn-user', $html.findById('.slot-btn-user-name'), undefined, 'bottom', 'big' );
else {
me.elUserName = $html.find('.btn-current-user');
me.elUserName.removeClass('hidden');
}
me.setUserName(me.options.userName);
if ( config.canPrint && config.isEdit ) {
@ -727,21 +732,15 @@ define([
},
setUserName: function(name) {
if ( !!this.labelUserName ) {
if ( !!name ) {
this.labelUserName.text(name).show();
} else this.labelUserName.hide();
} else {
this.options.userName = name;
if ( this.btnUserName ) {
this.btnUserName.updateHint(name);
} else if (this.elUserName) {
this.elUserName.tooltip({
title: Common.Utils.String.htmlEncode(name),
placement: 'cursor',
html: true
});
}
this.options.userName = name;
if ( this.btnUserName ) {
this.btnUserName.updateHint(name);
} else if (this.elUserName) {
this.elUserName.tooltip({
title: Common.Utils.String.htmlEncode(name),
placement: 'cursor',
html: true
});
}
return this;
@ -767,15 +766,7 @@ define([
$btnShare.removeClass('disabled').removeAttr('disabled');
}
} else if ( alias == 'rename-user' ) {
if (me.labelUserName) {
if ( lock ) {
me.labelUserName.removeClass('clickable');
me.labelUserName.addClass('disabled');
} else {
me.labelUserName.addClass('clickable');
me.labelUserName.removeClass('disabled');
}
} else if (me.btnUserName) {
if (me.btnUserName) {
me.btnUserName.setDisabled(lock);
}
} else {

64
apps/common/main/resources/less/header.less
View file

@ -194,6 +194,24 @@
overflow: hidden;
}
&:not(:disabled) {
.inner-box-icon, .caption {
opacity: @header-component-normal-icon-opacity;
}
}
&:active, &.active {
.inner-box-icon, .caption {
opacity: @header-component-active-icon-opacity;
}
}
&:hover:not(:disabled) {
.inner-box-icon, .caption {
opacity: @header-component-hover-icon-opacity;
}
}
&.disabled {
opacity: @component-disabled-opacity;
pointer-events: none;
@ -226,6 +244,24 @@
margin: 2px 0 0 2px;
}
&:not(:disabled) {
.icon, .caption {
opacity: @header-component-normal-icon-opacity;
}
}
&:active, &.active {
.icon, .caption {
opacity: @header-component-active-icon-opacity;
}
}
&:hover:not(:disabled) {
.icon, .caption {
opacity: @header-component-hover-icon-opacity;
}
}
&.disabled {
opacity: @component-disabled-opacity;
pointer-events: none;
@ -262,6 +298,18 @@
height:calc(~"28px/1.5");
}
}
&:not(:disabled) .icon {
opacity: @header-component-normal-icon-opacity;
}
&:active, &.active .icon {
opacity: @header-component-active-icon-opacity;
}
&:hover:not(:disabled) .icon {
opacity: @header-component-hover-icon-opacity;
}
}
.cousers-menu {
@ -478,22 +526,6 @@
border: 0 none;
cursor: default;
}
#title-user-name {
white-space: pre;
text-overflow: ellipsis;
overflow: hidden;
text-align: right;
font-size: 11px;
width: 200px;
height: 100%;
padding: 0 12px;
line-height: @height-title;
pointer-events: none;
&.clickable {
cursor: pointer;
pointer-events: auto;
}
}
.lr-separator {
flex-grow: 1;