From 49f1dd7b57814699ac963fb2e7265548784c610a Mon Sep 17 00:00:00 2001 From: morethanwords Date: Mon, 28 Sep 2020 04:08:38 +0300 Subject: [PATCH] Avatar fixes: Emoji in profile name Background color and fade-in remove after image mount --- src/lib/appManagers/appChatsManager.ts | 7 ++----- src/lib/appManagers/appImManager.ts | 4 ++-- src/lib/appManagers/appStateManager.ts | 14 +++++++++++--- src/lib/appManagers/appUsersManager.ts | 12 +++++------- src/lib/utils.ts | 23 +++++++++++++++++++++++ 5 files changed, 43 insertions(+), 17 deletions(-) diff --git a/src/lib/appManagers/appChatsManager.ts b/src/lib/appManagers/appChatsManager.ts index 34466edc..57642122 100644 --- a/src/lib/appManagers/appChatsManager.ts +++ b/src/lib/appManagers/appChatsManager.ts @@ -1,4 +1,4 @@ -import { $rootScope, isObject, safeReplaceObject, copy, numberWithCommas } from "../utils"; +import { $rootScope, isObject, safeReplaceObject, copy, numberWithCommas, getAbbreviation } from "../utils"; import { RichTextProcessor } from "../richtextprocessor"; import appUsersManager from "./appUsersManager"; import apiManager from '../mtproto/mtprotoworker'; @@ -95,10 +95,7 @@ export class AppChatsManager { let oldChat = this.chats[apiChat.id]; - let titleWords = searchIndexManager.cleanSearchText(apiChat.title || '', false).split(' '); - let firstWord = titleWords.shift(); - let lastWord = titleWords.pop(); - apiChat.initials = firstWord.charAt(0) + (lastWord ? lastWord.charAt(0) : ''); + apiChat.initials = getAbbreviation(apiChat.title); if(apiChat.pFlags === undefined) { apiChat.pFlags = {}; diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index db3212b5..0cbcfbbf 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -2292,8 +2292,8 @@ export class AppImManager { let avatarElem = new AvatarElement(); avatarElem.classList.add('user-avatar'); - if(!message.fromID && message.fwd_from && message.fwd_from.from_name) { - avatarElem.setAttribute('peer-title', message.fwd_from.from_name); + if(!message.fwdFromID && message.fwd_from && message.fwd_from.from_name) { + avatarElem.setAttribute('peer-title', /* '🔥 FF 🔥' */message.fwd_from.from_name); } avatarElem.setAttribute('peer', '' + (((message.fwd_from && this.peerID == this.myID) || isForwardFromChannel ? message.fwdFromID : message.fromID) || 0)); diff --git a/src/lib/appManagers/appStateManager.ts b/src/lib/appManagers/appStateManager.ts index d9b2e323..831bafb0 100644 --- a/src/lib/appManagers/appStateManager.ts +++ b/src/lib/appManagers/appStateManager.ts @@ -5,7 +5,7 @@ import appPeersManager from './appPeersManager'; import appChatsManager from './appChatsManager'; import appUsersManager from './appUsersManager'; import apiUpdatesManager from './apiUpdatesManager'; -import { copy } from '../utils'; +import { $rootScope, copy } from '../utils'; import { logger } from '../logger'; import type { AppStickersManager } from './appStickersManager'; import { App } from '../mtproto/mtproto_config'; @@ -41,12 +41,16 @@ export class AppStateManager { constructor() { this.loadSavedState(); + + $rootScope.$on('user_auth', (e) => { + apiUpdatesManager.attach(null); + }); } public loadSavedState() { if(this.loaded) return this.loaded; return this.loaded = new Promise((resolve) => { - AppStorage.get('state').then((state) => { + AppStorage.get<[State, {id: number}]>('state', 'user_auth').then(([state, auth]) => { const time = Date.now(); if(state) { if(state?.version != STATE_VERSION) { @@ -128,7 +132,9 @@ export class AppStateManager { }); } - apiUpdatesManager.attach(updates ?? null); + if(auth?.id) { + apiUpdatesManager.attach(updates ?? null); + } resolve(state); }).catch(resolve).finally(() => { @@ -224,6 +230,8 @@ export class AppStateManager { } } +//console.trace('appStateManager include'); + const appStateManager = new AppStateManager(); // @ts-ignore if(process.env.NODE_ENV != 'production') { diff --git a/src/lib/appManagers/appUsersManager.ts b/src/lib/appManagers/appUsersManager.ts index 049e17a0..4d2a9790 100644 --- a/src/lib/appManagers/appUsersManager.ts +++ b/src/lib/appManagers/appUsersManager.ts @@ -1,4 +1,4 @@ -import { safeReplaceObject, isObject, tsNow, copy, $rootScope } from "../utils"; +import { safeReplaceObject, isObject, tsNow, copy, $rootScope, getAbbreviation } from "../utils"; import { RichTextProcessor } from "../richtextprocessor"; import appChatsManager from "./appChatsManager"; //import apiManager from '../mtproto/apiManager'; @@ -237,9 +237,10 @@ export class AppUsersManager { apiUser.rPhone = '+' + formatPhoneNumber(apiUser.phone).formatted; } + const fullName = apiUser.first_name + ' ' + (apiUser.last_name || ''); if(apiUser.first_name) { apiUser.rFirstName = RichTextProcessor.wrapRichText(apiUser.first_name, {noLinks: true, noLinebreaks: true}) - apiUser.rFullName = apiUser.last_name ? RichTextProcessor.wrapRichText(apiUser.first_name + ' ' + (apiUser.last_name || ''), {noLinks: true, noLinebreaks: true}) : apiUser.rFirstName; + apiUser.rFullName = apiUser.last_name ? RichTextProcessor.wrapRichText(fullName, {noLinks: true, noLinebreaks: true}) : apiUser.rFirstName; } else { apiUser.rFirstName = RichTextProcessor.wrapRichText(apiUser.last_name, {noLinks: true, noLinebreaks: true}) || apiUser.rPhone || 'user_first_name_deleted'; apiUser.rFullName = RichTextProcessor.wrapRichText(apiUser.last_name, {noLinks: true, noLinebreaks: true}) || apiUser.rPhone || 'user_name_deleted'; @@ -250,12 +251,9 @@ export class AppUsersManager { this.usernames[searchUsername] = userID; } - apiUser.sortName = apiUser.pFlags.deleted ? '' : searchIndexManager.cleanSearchText(apiUser.first_name + ' ' + (apiUser.last_name || ''), false); + apiUser.sortName = apiUser.pFlags.deleted ? '' : searchIndexManager.cleanSearchText(fullName, false); - var nameWords = apiUser.sortName.split(' '); - var firstWord = nameWords.shift(); - var lastWord = nameWords.pop(); - apiUser.initials = firstWord.charAt(0) + (lastWord ? lastWord.charAt(0) : ''); + apiUser.initials = getAbbreviation(fullName); if(apiUser.status) { if(apiUser.status.expires) { diff --git a/src/lib/utils.ts b/src/lib/utils.ts index 22240b1e..6dc387d2 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -10,6 +10,7 @@ import type { AppMessagesManager, Dialog, MyDialogFilter } from "./appManagers/a */ import type { DownloadOptions } from "./mtproto/apiFileManager"; +import { RichTextProcessor } from "./richtextprocessor"; var _logTimer = Date.now(); export function dT () { @@ -329,6 +330,28 @@ export function tsNow(seconds?: boolean) { return seconds ? Math.floor(t / 1000) : t; } +const el = document.createElement('span'); +export function getAbbreviation(str: string) { + const wrapped = RichTextProcessor.wrapEmojiText(str); + el.innerHTML = wrapped; + + const childNodes = el.childNodes; + let first = '', last = ''; + + const firstNode = childNodes[0]; + if('length' in firstNode) first = (firstNode as any).textContent.charAt(0).toUpperCase(); + else first = (firstNode as HTMLElement).outerHTML; + + if(str.indexOf(' ') !== -1) { + const lastNode = childNodes[childNodes.length - 1]; + if(lastNode == firstNode) last = lastNode.textContent.split(' ').pop().charAt(0).toUpperCase(); + else if('length' in lastNode) last = (lastNode as any).textContent.charAt(0).toUpperCase(); + else last = (lastNode as HTMLElement).outerHTML; + } + + return first + last; +} + export function safeReplaceObject(wasObject: any, newObject: any) { for(var key in wasObject) { if(!newObject.hasOwnProperty(key) && key.charAt(0) != '$') {