imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Revert "Member avatars without canvas" (#10057

Browse source 
* Revert "Apply more general fix for base avatar regressions (#10045)"

This reverts commit 371a3c0d36.

* Revert "Fix layout and visual regressions around default avatars (#10031)"

This reverts commit 0d1fce37b2.

* Revert "Member avatars without canvas (#9990)"

This reverts commit a8aa4de4b4.

* Update snapshots
This commit is contained in:
Michael Telatynski 2023-02-02 10:22:19 +00:00 • committed by GitHub
parent 43e7870d92
commit 21c3967010
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
27 changed files with 352 additions and 823 deletions
Download patch file Download diff file Expand all files Collapse all files

40
src/editor/parts.ts
View file

@ -1,5 +1,6 @@
/*
Copyright 2019, 2023 The Matrix.org Foundation C.I.C.
Copyright 2019 New Vector Ltd
Copyright 2019 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -300,9 +301,9 @@ export abstract class PillPart extends BasePart implements IPillPart {
}
// helper method for subclasses
protected setAvatarVars(node: HTMLElement, avatarBackground: string, initialLetter: string | undefined): void {
// const avatarBackground = `url('${avatarUrl}')`;
const avatarLetter = `'${initialLetter || ""}'`;
protected setAvatarVars(node: HTMLElement, avatarUrl: string, initialLetter: string): void {
const avatarBackground = `url('${avatarUrl}')`;
const avatarLetter = `'${initialLetter}'`;
// check if the value is changing,
// otherwise the avatars flicker on every keystroke while updating.
if (node.style.getPropertyValue("--avatar-background") !== avatarBackground) {
@ -418,15 +419,13 @@ class RoomPillPart extends PillPart {
}
protected setAvatar(node: HTMLElement): void {
const avatarUrl = Avatar.avatarUrlForRoom(this.room, 16, 16, "crop");
if (avatarUrl) {
this.setAvatarVars(node, `url('${avatarUrl}')`, "");
return;
let initialLetter = "";
let avatarUrl = Avatar.avatarUrlForRoom(this.room, 16, 16, "crop");
if (!avatarUrl) {
initialLetter = Avatar.getInitialLetter(this.room?.name || this.resourceId);
avatarUrl = Avatar.defaultAvatarUrlForString(this.room?.roomId ?? this.resourceId);
}
const initialLetter = Avatar.getInitialLetter(this.room?.name || this.resourceId);
const color = Avatar.getColorForString(this.room?.roomId ?? this.resourceId);
this.setAvatarVars(node, color, initialLetter);
this.setAvatarVars(node, avatarUrl, initialLetter);
}
public get type(): IPillPart["type"] {
@ -472,17 +471,14 @@ class UserPillPart extends PillPart {
if (!this.member) {
return;
}
const avatar = Avatar.getMemberAvatar(this.member, 16, 16, "crop");
if (avatar) {
this.setAvatarVars(node, `url('${avatar}')`, "");
return;
}
const name = this.member.name || this.member.userId;
const initialLetter = Avatar.getInitialLetter(name);
const color = Avatar.getColorForString(this.member.userId);
this.setAvatarVars(node, color, initialLetter);
const defaultAvatarUrl = Avatar.defaultAvatarUrlForString(this.member.userId);
const avatarUrl = Avatar.avatarUrlForMember(this.member, 16, 16, "crop");
let initialLetter = "";
if (avatarUrl === defaultAvatarUrl) {
initialLetter = Avatar.getInitialLetter(name);
}
this.setAvatarVars(node, avatarUrl, initialLetter);
}
protected onClick = (): void => {