From 34c6c5a5c092c5c9eb0899009342e2a52991ea68 Mon Sep 17 00:00:00 2001 From: Eduard Kuzmenko Date: Mon, 10 Feb 2020 23:40:33 +0700 Subject: [PATCH] chat username colored --- src/lib/appManagers/appDialogsManager.ts | 19 +++---------------- src/lib/appManagers/appImManager.ts | 5 +++++ src/lib/appManagers/appPeersManager.ts | 22 ++++++++++++++++++++++ 3 files changed, 30 insertions(+), 16 deletions(-) diff --git a/src/lib/appManagers/appDialogsManager.ts b/src/lib/appManagers/appDialogsManager.ts index 69e5904b..58ccaa07 100644 --- a/src/lib/appManagers/appDialogsManager.ts +++ b/src/lib/appManagers/appDialogsManager.ts @@ -20,9 +20,6 @@ type DialogDom = { listEl: HTMLLIElement }; -const DialogColors = ['#c03d33', '#4fad2d', '#d09306', '#168acd', '#8544d6', '#cd4073', '#2996ad', '#ce671b']; -const DialogColorsMap = [0, 7, 4, 1, 6, 3, 5]; - export class AppDialogsManager { public chatList = document.getElementById('dialogs') as HTMLUListElement; public pinnedDelimiter: HTMLDivElement; @@ -76,17 +73,6 @@ export class AppDialogsManager { }); } - /* - HTML-color IRC-color Description - #c03d33 4 red - #4fad2d 3 green - #d09306 7 yellow - #168acd 10 blue - #8544d6 6 purple - #cd4073 13 pink - #2996ad 11 sea - #ce671b 5 orange - */ public async loadDialogPhoto(div: HTMLDivElement, peerID: number | string, isDialog = false): Promise { let inputPeer: any; let location: any; @@ -102,6 +88,7 @@ export class AppDialogsManager { div.firstChild.remove(); } + div.style.backgroundColor = ''; div.style.fontSize = ''; div.classList.add('tgico-savedmessages'); return true; @@ -113,8 +100,8 @@ export class AppDialogsManager { } let color = ''; - if(typeof(peerID) != 'string') { - color = DialogColors[DialogColorsMap[(peerID < 0 ? -peerID : peerID) % 7]]; + if(typeof(peerID) != 'string' && peerID != this.myID) { + color = appPeersManager.getPeerColorByID(peerID); } div.classList.remove('tgico-savedmessages'); diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index 8452dfe2..4ed72c23 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -356,6 +356,7 @@ export class AppImManager { public contextMenu = document.getElementById('bubble-contextmenu') as HTMLDivElement; private contextMenuPin = this.contextMenu.querySelector('.menu-pin') as HTMLDivElement; + private contextMenuEdit = this.contextMenu.querySelector('.menu-edit') as HTMLDivElement; private contextMenuMsgID: number; public replyElements: { @@ -569,6 +570,8 @@ export class AppImManager { let side = bubble.parentElement.classList.contains('in') ? 'left' : 'right'; + this.contextMenuEdit.style.display = side == 'right' ? '' : 'none'; + this.contextMenu.classList.remove('bottom-left', 'bottom-right'); this.contextMenu.classList.add(side == 'left' ? 'bottom-right' : 'bottom-left'); @@ -1475,6 +1478,7 @@ export class AppImManager { let nameDiv = document.createElement('div'); nameDiv.classList.add('name'); nameDiv.innerHTML = 'Forwarded from ' + title; + nameDiv.style.color = appPeersManager.getPeerColorByID(message.fromID); bubble.append(nameDiv); } } else { @@ -1545,6 +1549,7 @@ export class AppImManager { let nameDiv = document.createElement('div'); nameDiv.classList.add('name'); nameDiv.innerHTML = title; + nameDiv.style.color = appPeersManager.getPeerColorByID(message.fromID); bubble.append(nameDiv); } else if(!message.reply_to_mid) { bubble.classList.add('hide-name'); diff --git a/src/lib/appManagers/appPeersManager.ts b/src/lib/appManagers/appPeersManager.ts index e05f9a71..464b8f60 100644 --- a/src/lib/appManagers/appPeersManager.ts +++ b/src/lib/appManagers/appPeersManager.ts @@ -3,6 +3,22 @@ import appChatsManager from "./appChatsManager"; import { isObject } from "../utils"; import { RichTextProcessor } from "../richtextprocessor"; +// https://github.com/eelcohn/Telegram-API/wiki/Calculating-color-for-a-Telegram-user-on-IRC +/* + HTML-color IRC-color Description + #c03d33 4 red + #4fad2d 3 green + #d09306 7 yellow + #168acd 10 blue + #8544d6 6 purple + #cd4073 13 pink + #2996ad 11 sea + #ce671b 5 orange + */ +const DialogColorsFg = ['#c03d33', '#4fad2d', '#d09306', '#168acd', '#8544d6', '#cd4073', '#2996ad', '#ce671b']; +const DialogColors = ['#e17076', '#7bc862', '#e5ca77', '#65AADD', '#a695e7', '#ee7aae', '#6ec9cb', '#faa774']; +const DialogColorsMap = [0, 7, 4, 1, 6, 3, 5]; + const AppPeersManager = { getPeerPhoto: (peerID: number) => { return peerID > 0 @@ -115,6 +131,12 @@ const AppPeersManager = { }; }, + getPeerColorByID: (peerID: number, pic = true) => { + let idx = DialogColorsMap[(peerID < 0 ? -peerID : peerID) % 7]; + let color = (pic ? DialogColors : DialogColorsFg)[idx]; + return color; + }, + isMegagroup: (peerID: number) => { return (peerID < 0) && appChatsManager.isMegagroup(-peerID); },