Avatar defaults and colors

This commit is contained in:
Josh Perez 2021-08-05 20:17:05 -04:00 committed by GitHub
parent a001882d58
commit 12d2b1bf7c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
140 changed files with 4212 additions and 1084 deletions

122
ts/types/Avatar.ts Normal file
View file

@ -0,0 +1,122 @@
// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import { AvatarColorType } from './Colors';
import { strictAssert } from '../util/assert';
export const PersonalAvatarIcons = [
'abstract_01',
'abstract_02',
'abstract_03',
'cat',
'dog',
'fox',
'tucan',
'pig',
'dinosour',
'sloth',
'incognito',
'ghost',
] as const;
export const GroupAvatarIcons = [
'balloon',
'book',
'briefcase',
'celebration',
'drink',
'football',
'heart',
'house',
'melon',
'soccerball',
'sunset',
'surfboard',
] as const;
type GroupAvatarIconType = typeof GroupAvatarIcons[number];
type PersonalAvatarIconType = typeof PersonalAvatarIcons[number];
export type AvatarIconType = GroupAvatarIconType | PersonalAvatarIconType;
export type AvatarDataType = {
id: number | string;
buffer?: ArrayBuffer;
color?: AvatarColorType;
icon?: AvatarIconType;
imagePath?: string;
text?: string;
};
export type DeleteAvatarFromDiskActionType = (
avatarData: AvatarDataType,
conversationId?: string
) => unknown;
export type ReplaceAvatarActionType = (
curr: AvatarDataType,
prev?: AvatarDataType,
conversationId?: string
) => unknown;
export type SaveAvatarToDiskActionType = (
avatarData: AvatarDataType,
conversationId?: string
) => unknown;
const groupIconColors = [
'A180',
'A120',
'A110',
'A170',
'A100',
'A210',
'A100',
'A180',
'A120',
'A110',
'A130',
'A210',
];
const personalIconColors = [
'A130',
'A120',
'A170',
'A190',
'A140',
'A190',
'A120',
'A160',
'A130',
'A180',
'A210',
'A100',
];
strictAssert(
groupIconColors.length === GroupAvatarIcons.length &&
personalIconColors.length === PersonalAvatarIcons.length,
'colors.length !== icons.length'
);
const groupDefaultAvatars = GroupAvatarIcons.map((icon, index) => ({
id: index,
color: groupIconColors[index],
icon,
}));
const personalDefaultAvatars = PersonalAvatarIcons.map((icon, index) => ({
id: index,
color: personalIconColors[index],
icon,
}));
export function getDefaultAvatars(isGroup?: boolean): Array<AvatarDataType> {
if (isGroup) {
return groupDefaultAvatars;
}
return personalDefaultAvatars;
}

View file

@ -1,21 +1,94 @@
// Copyright 2020-2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
export const AvatarColors = [
'crimson',
'vermilion',
'burlap',
'forest',
'wintergreen',
'teal',
'blue',
'indigo',
'violet',
'plum',
'taupe',
'steel',
'ultramarine',
] as const;
export const AvatarColorMap = new Map([
[
'A100',
{
bg: '#e3e3fe',
fg: '#3838f5',
},
],
[
'A110',
{
bg: '#dde7fc',
fg: '#1251d3',
},
],
[
'A120',
{
bg: '#d8e8f0',
fg: '#086da0',
},
],
[
'A130',
{
bg: '#cde4cd',
fg: '#067906',
},
],
[
'A140',
{
bg: '#eae0fd',
fg: '#661aff',
},
],
[
'A150',
{
bg: '#f5e3fe',
fg: '#9f00f0',
},
],
[
'A160',
{
bg: '#f6d8ec',
fg: '#b8057c',
},
],
[
'A170',
{
bg: '#f5d7d7',
fg: '#be0404',
},
],
[
'A180',
{
bg: '#fef5d0',
fg: '#836b01',
},
],
[
'A190',
{
bg: '#eae6d5',
fg: '#7d6f40',
},
],
[
'A200',
{
bg: '#d2d2dc',
fg: '#4f4f6d',
},
],
[
'A210',
{
bg: '#d7d7d9',
fg: '#5c5c5c',
},
],
]);
export const AvatarColors = Array.from(AvatarColorMap.keys());
export const ConversationColors = [
'ultramarine',
@ -90,6 +163,7 @@ export type CustomColorType = {
};
export type AvatarColorType = typeof AvatarColors[number];
export type ConversationColorType =
| typeof ConversationColors[number]
| 'custom';