Implement "View Avatar" in user context menu
This commit is contained in:
parent
af5a134081
commit
2046bdf03a
|
@ -179,6 +179,8 @@
|
|||
</form>
|
||||
</div>
|
||||
<!-- /ko -->
|
||||
<img class="avatar-view" data-bind="visible: avatarView, attr: { src: avatarView },
|
||||
click: function () { avatarView(null) }"></img>
|
||||
<!-- ko with: userContextMenu -->
|
||||
<ul class="context-menu" data-bind="if: target,
|
||||
style: { left: posX() + 'px',
|
||||
|
@ -216,7 +218,8 @@
|
|||
</li>
|
||||
<!-- /ko -->
|
||||
|
||||
<li data-bind="css: { disabled: !canChangeAvatar() }, visible: texture">
|
||||
<li data-bind="css: { disabled: !canChangeAvatar() }, visible: texture,
|
||||
click: viewAvatar">
|
||||
View Avatar
|
||||
</li>
|
||||
<!-- ko if: $data === $root.thisUser() -->
|
||||
|
|
|
@ -189,6 +189,7 @@ class GlobalBindings {
|
|||
this.log = ko.observableArray()
|
||||
this.thisUser = ko.observable()
|
||||
this.root = ko.observable()
|
||||
this.avatarView = ko.observable()
|
||||
this.messageBox = ko.observable('')
|
||||
this.toolbarHorizontal = ko.observable(!this.settings.toolbarVertical)
|
||||
this.selected = ko.observable()
|
||||
|
@ -410,6 +411,9 @@ class GlobalBindings {
|
|||
this.requestDeaf(ui)
|
||||
}
|
||||
}
|
||||
ui.viewAvatar = () => {
|
||||
this.avatarView(ui.texture())
|
||||
}
|
||||
Object.entries(simpleProperties).forEach(key => {
|
||||
ui[key[1]] = ko.observable(user[key[0]])
|
||||
})
|
||||
|
|
|
@ -253,6 +253,17 @@ html, body {
|
|||
}
|
||||
}
|
||||
}
|
||||
.avatar-view {
|
||||
position: absolute;
|
||||
z-index: 200;
|
||||
max-width: 90%;
|
||||
max-height: 90%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
}
|
||||
.toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
Loading…
Reference in a new issue