Skip to content

Commit

Permalink
Avatar now open account related options
Browse files Browse the repository at this point in the history
  • Loading branch information
@karlprieb
karlprieb committed Feb 22, 2018
1 parent ba8c8d8 commit 88bea8d
Show file tree
Hide file tree
Showing 2 changed files with 99 additions and 73 deletions.
4 changes: 4 additions & 0 deletions packages/rocketchat-theme/client/imports/components/sidebar/sidebar-header.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,10 @@
width: var(--sidebar-account-thumb-size);
height: var(--sidebar-account-thumb-size);
margin: 0 10px;

& .avatar {
cursor: pointer;
}
}

&-status-bullet {
Expand Down
168 changes: 95 additions & 73 deletions packages/rocketchat-ui-sidenav/client/sidebarHeader.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,10 +153,10 @@ const toolbarButtons = (user) => {
{
name: t('Options'),
icon: 'menu',
condition: () => !(Meteor.userId() == null && RocketChat.settings.get('Accounts_AllowAnonymousRead')),
action: () => {
condition: () => AccountBox.getItems().length || RocketChat.authz.hasAtLeastOnePermission(['view-statistics', 'view-room-administration', 'view-user-administration', 'view-privileged-setting' ]),
action: (e) => {
let adminOption;
if (RocketChat.authz.hasAtLeastOnePermission(['view-statistics', 'view-room-administration', 'view-user-administration', 'view-privileged-setting' ]) || (RocketChat.AdminBox.getOptions().length > 0)) {
if (RocketChat.authz.hasAtLeastOnePermission(['view-statistics', 'view-room-administration', 'view-user-administration', 'view-privileged-setting' ])) {
adminOption = {
icon: 'customize',
name: t('Administration'),
Expand All @@ -171,44 +171,11 @@ const toolbarButtons = (user) => {
};
}

const sidebarHeader = document.querySelector('.sidebar__header');
const sidebarHeaderPadding = parseInt(getComputedStyle(sidebarHeader)['padding-left'].replace('px', '')) * 2;
const sidebarHeaderMargin = parseInt(getComputedStyle(sidebarHeader)['margin-left'].replace('px', '')) * 2;

const config = {
popoverClass: 'sidebar-header',
columns: [
{
groups: [
{
title: t('User'),
items: [
{
icon: 'circle',
name: t('Online'),
modifier: 'online',
action: () => setStatus('online')
},
{
icon: 'circle',
name: t('Away'),
modifier: 'away',
action: () => setStatus('away')
},
{
icon: 'circle',
name: t('Busy'),
modifier: 'busy',
action: () => setStatus('busy')
},
{
icon: 'circle',
name: t('Invisible'),
modifier: 'offline',
action: () => setStatus('offline')
}
]
},
{
items: AccountBox.getItems().map(item => {
let action;
Expand Down Expand Up @@ -237,47 +204,19 @@ const toolbarButtons = (user) => {
sideNav: item.sideNav,
action
};
}).concat([
adminOption,
{
icon: 'user',
name: t('My_Account'),
type: 'open',
id: 'account',
action: () => {
SideNav.setFlex('accountFlex');
SideNav.openFlex();
FlowRouter.go('account');
popover.close();
}
},
{
icon: 'sign-out',
name: t('Logout'),
type: 'open',
id: 'logout',
action: () => {
Meteor.logout(() => {
RocketChat.callbacks.run('afterLogoutCleanUp', user);
Meteor.call('logoutCleanUp', user);
FlowRouter.go('home');
popover.close();
});
}
}
])
}).concat([adminOption])
}
]
}
],
position: {
top: sidebarHeader.offsetHeight
},
customCSSProperties: {
width: `${ sidebarHeader.offsetWidth - sidebarHeaderPadding + sidebarHeaderMargin }px`,
left: isRtl() ? 'auto' : getComputedStyle(sidebarHeader)['padding-left'],
right: isRtl() ? getComputedStyle(sidebarHeader)['padding-left'] : 'auto'
}
mousePosition: () => ({
x: e.currentTarget.getBoundingClientRect().left,
y: e.currentTarget.getBoundingClientRect().bottom + 50
}),
customCSSProperties: () => ({
top: `${ e.currentTarget.getBoundingClientRect().bottom + 10 }px`,
left: `${ e.currentTarget.getBoundingClientRect().left - 10 }px`
})
};

popover.open(config);
Expand Down Expand Up @@ -313,5 +252,88 @@ Template.sidebarHeader.events({
e.currentTarget.blur();
}
return this.action && this.action.apply(this, [e]);
},
'click .sidebar__header .avatar'(e) {
if (!(Meteor.userId() == null && RocketChat.settings.get('Accounts_AllowAnonymousRead'))) {
const user = Meteor.user();
const config = {
popoverClass: 'sidebar-header',
columns: [
{
groups: [
{
title: t('User'),
items: [
{
icon: 'circle',
name: t('Online'),
modifier: 'online',
action: () => setStatus('online')
},
{
icon: 'circle',
name: t('Away'),
modifier: 'away',
action: () => setStatus('away')
},
{
icon: 'circle',
name: t('Busy'),
modifier: 'busy',
action: () => setStatus('busy')
},
{
icon: 'circle',
name: t('Invisible'),
modifier: 'offline',
action: () => setStatus('offline')
}
]
},
{
items: [
{
icon: 'user',
name: t('My_Account'),
type: 'open',
id: 'account',
action: () => {
SideNav.setFlex('accountFlex');
SideNav.openFlex();
FlowRouter.go('account');
popover.close();
}
},
{
icon: 'sign-out',
name: t('Logout'),
type: 'open',
id: 'logout',
action: () => {
Meteor.logout(() => {
RocketChat.callbacks.run('afterLogoutCleanUp', user);
Meteor.call('logoutCleanUp', user);
FlowRouter.go('home');
popover.close();
});
}
}
]
}
]
}
],
mousePosition: () => ({
x: e.currentTarget.getBoundingClientRect().left,
y: e.currentTarget.getBoundingClientRect().bottom + 50
}),
customCSSProperties: () => ({
top: `${ e.currentTarget.getBoundingClientRect().bottom + 10 }px`,
left: `${ e.currentTarget.getBoundingClientRect().left - 10 }px`
})
};

popover.open(config);
}
}
});

0 comments on commit 88bea8d

Please sign in to comment.