From 3d8bb543989fc7be969cb001fb05412b54058652 Mon Sep 17 00:00:00 2001 From: Alexander Zinchuk Date: Fri, 5 Nov 2021 21:57:14 +0300 Subject: [PATCH] Audio Player: Add track navigation and volume controls (#1526) --- src/assets/fonts/icomoon.woff | Bin 36176 -> 37216 bytes src/assets/fonts/icomoon.woff2 | Bin 16828 -> 17164 bytes src/components/left/main/Chat.scss | 6 +- src/components/left/main/Chat.tsx | 2 +- .../left/settings/SettingsGeneral.tsx | 4 +- .../left/settings/SettingsNotifications.tsx | 6 +- src/components/middle/AudioPlayer.scss | 54 ++- src/components/middle/AudioPlayer.tsx | 82 +++- src/components/middle/MiddleHeader.scss | 1 - src/components/middle/message/RoundVideo.tsx | 2 +- .../middle/message/_message-content.scss | 2 +- src/components/ui/Button.tsx | 6 +- src/components/ui/RangeSlider.scss | 8 + src/components/ui/RangeSlider.tsx | 28 +- src/config.ts | 2 + src/global/cache.ts | 8 + src/global/initial.ts | 5 +- src/global/types.ts | 8 +- src/hooks/useAudioPlayer.ts | 35 +- src/hooks/useMessageMediaMetadata.ts | 4 +- src/modules/actions/ui/messages.ts | 21 +- src/styles/Telegram T.json | 424 ++++++++++++------ src/styles/icons.scss | 20 +- src/util/mediaSession.ts | 22 +- src/util/safePlay.ts | 2 +- 25 files changed, 545 insertions(+), 207 deletions(-) mode change 100755 => 100644 src/assets/fonts/icomoon.woff diff --git a/src/assets/fonts/icomoon.woff b/src/assets/fonts/icomoon.woff old mode 100755 new mode 100644 index 1c87e0b48404b941d15b2b0b0865980b3e0799dd..bb69558732bb239c729b663988891511a4701b64 GIT binary patch delta 1350 zcmcgrTSydP6h7zQnO%3huFmebUY6FWUBbMqdzlqX6U(ARdvNt3vR%Bb=%%EmK`{Fe zB3hb=pap?ZFFQR1zVuKplFtPZgcSAGYcGXRteqLPi!XslKYa7gIsbRgKi|ih*Z0_` zhfJJkYipndhQ86~$Y{71H7Tq8LohiEYr?-#57OYLP#7B2|lupkH} zf~SC%htE2&2kmB#+Jqk{^b`b7Rkhk(Rqf$*Z+P7r)2-juz@7i#jrylK5{(JXNIi|x z&anJ7Dz$9Cc?a|En&D`rucm@5P)h`*u1+~jOLrXY;(7A8@_J+AM5SSNc)qRmuA*B_ zf2xjG#~*K8k#g(4LMErrCVY7G`P<&USUs)a>{@(UWQBB^z5_xCKfO-FlGRSLO@tN>@s_LVlhZ; z50K9R#RBO$m1#h+BMb~}9w7YT*!9qi)Wj49h7KN}8Z!`T5C-OWew(ih q+$=x=28O$a&5ba6vP_RTW9#OS9ucO^4ShU}Y~WyN-8`@V5F-F?>_{>I diff --git a/src/assets/fonts/icomoon.woff2 b/src/assets/fonts/icomoon.woff2 index c8420c5c52aa2341fdfb6d60a1b365931fbcc5aa..ba8dab847a36c66ffeb8c7c5e311fed8294d39aa 100644 GIT binary patch literal 17164 zcmV(_K-9l?Pew8T0RR9107DD_4FCWD0G8wc079?;0RR9100000000000000000000 z0000#Mn+Uk92y=5U;u(%5eN!`lqiAJK?{N!00A}vBm;sZ1Rw>28wZO48~SubMum+7 zfKc%4h$`CBh@xtg&;Gw9&@l!Nb}X&>L7{_~?63tIkDBa~b?ZkOB&ePD$&Pi3UzYL} z6b-*$O}NPjNoLz0NH_o8UG6gG1rkUgkdUwv5JFgU;c9QC#!Bx-ce*TmLP0v@xyCy(n*wKt~|Y)CJ>-> zG10N2$7s0iZYzzm42*;ZI#B_RosN)%d;R76gYfqBNf5M^9D zg)kka0@!&%i7g&OT_ono4=Ni32!&<8UK=5{JddFf zks=ZVbm#T8{rGGC_hO;T>Z`Z4UP~1fH$Vd9B$B)l4H5=fzyP#V8_Iv~^!(%TnBd!??73IMGuN@oK*Jay zLW~S}P;CN?bGZm3&Wjfg38B=K{ zZL-mMo&gv!k&J_7(-taCMQn6CNS*-tA%Zs1v++Oq>G{GzREe6rVTU+9dmXL9`aF zWlz??LO+V^D%RigM6Y}{8`zHAhAE;@B0vbLG=Ng1p)`YHu%J&A80U5>NnZF4ou)6( z?YtNOXmc4rOK@THAyV4T2+>GX(BPCMeq3s^(V}D;g6nCt(n`rMwJ+0^eA3i9rh)$d z3L}>hZKa|F)Y9@PCA2`3cI*?aZ{WB@-^}440gP7*C1yxkv`w^4TcT2Ehk_$Qyo{9z z^!lR=8YEv9hI7L*|f)a)Yt)1vbBME z_GFaq7iei-jdBX4-Bv={buKKU9a**BmX~cxE!<5^iXttPa0dcScmKX`;*S3Hr*c7{ zk2{gW!aFe!2zMlr$gBvii2_K(8j`^!b+NQhMdal_$0R^uF_83YkHMl;_Tk zTi)W`O!wz|v$=J{c7H|dWjon4s$(rc8%q~b=MXiR4wpL0-GX9o4J3j(C0A7C08a!z zzg*MNfvqn;^vc0==zh4rPT^HJfkdA#U zyCI>Em>FyELz}rjv2rTzJdoOJQZ#un4H+A! zvw|)AO*%grZHjt@xBA^DpsdYbzgix*pEjnb8-t=$!V{B~1Zs&A)=*Q_sqjsVRugUk z?hb97N_U|ST4@^+E)0f*7?Y*yj1O0G3B1;1Mb|drdd-*Z4!rNdPr5!9E;cHn;SLV< zqL=-;PY?6u!BJHylLIhiEOJJ%!T@#RA$^`K?s%WY*Zb!+Q*ZN^=GjB-Kl)6=Cy^|Y z%u}xPJT2FlE=U)omN)V&&SSty4S!`Q$*MJ{QLMsVNg&KGEGEEJ9Id$`n8URlRw)XY zI99Ke=vRwWH5sg`1e#&+Q8Y3*4U#@IsMbOzFXhjD66+qz)suM+3*S~20updR%iBoQpuE1U<%frmg5y@dNXI^Gn>zhoY?nS9N!hVgL#Dk6>Ph`Rq>?`PiIuD03O z!-Zli>Fnco-5sl`moDGy)_eLDAY3H>5=Ne2f0QE0f;^85lETi5Ac`Rn3&aH?$KVyq zvgV2_$8kQ9FO*X1^gy|L_K(vjwqa>MCC7plQJ$S&weJHA2Pa3K2*i)hVpKw|*J-s; z`LMM4(04WBYhD^o)CvPcY^y-oL{T!2?2u5kh~<%X-sZK zXx4w0;A(rdR;)zUxM*Jbjt1lkXP67GhU0n#3CQQ$E@hUk0-^j#kw8G!c?=rvqB?8H zN_f⁡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 = ({

{renderText(getChatTitle(lang, chat, privateChatUser))}

{chat.isVerified && } - {isMuted && } + {isMuted && } {chat.lastMessage && ( = ({ diff --git a/src/components/left/settings/SettingsNotifications.tsx b/src/components/left/settings/SettingsNotifications.tsx index 17ae4fc45..20052e79d 100644 --- a/src/components/left/settings/SettingsNotifications.tsx +++ b/src/components/left/settings/SettingsNotifications.tsx @@ -124,10 +124,8 @@ const SettingsNotifications: FC = ({ { updateWebNotificationSettings({ notificationSoundVolume: volume }); diff --git a/src/components/middle/AudioPlayer.scss b/src/components/middle/AudioPlayer.scss index 36d6ed0e5..dbbff6320 100644 --- a/src/components/middle/AudioPlayer.scss +++ b/src/components/middle/AudioPlayer.scss @@ -13,7 +13,7 @@ margin: .125rem; } - > .toggle-play { + > .player-button { --color-text-secondary: var(--color-primary); --color-text-secondary-rgb: var(--color-primary-shade-rgb); --color-primary-shade: var(--color-green); @@ -24,7 +24,7 @@ margin-left: 1.5rem; } - .toggle-play { + .player-button { &.smaller { width: 3rem; height: 3rem; @@ -60,6 +60,55 @@ } } + .volume-button { + position: relative; + overflow: visible; + + .volume-slider-spacer { + position: absolute; + transform: translateY(100%); + bottom: 0; + height: 1rem; + width: 8rem; + cursor: default; + visibility: hidden; + } + + &:hover .volume-slider-spacer, .volume-slider-spacer:hover { + visibility: visible; + } + + .volume-slider { + opacity: 0; + visibility: hidden; + + position: absolute; + background: var(--color-background); + bottom: -1rem; + transform: translateY(100%); + transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out; + width: 8rem; + padding: 0.75rem; + border-radius: 0.5rem; + cursor: default; + box-shadow: 0 1px 2px var(--color-default-shadow); + + .RangeSlider { + margin-bottom: 0; + input[type=range] { + margin-bottom: 0; + } + } + } + + &:hover .volume-slider, + .volume-slider:hover, + .volume-slider-spacer:hover + .volume-slider { + opacity: 1; + visibility: visible; + } + } + &-content { display: flex; justify-content: center; @@ -69,7 +118,6 @@ position: relative; overflow: hidden; cursor: pointer; - max-width: 15rem; border-radius: var(--border-radius-messages-small); &:hover { diff --git a/src/components/middle/AudioPlayer.tsx b/src/components/middle/AudioPlayer.tsx index 087c8d5f5..362dae9d5 100644 --- a/src/components/middle/AudioPlayer.tsx +++ b/src/components/middle/AudioPlayer.tsx @@ -1,4 +1,4 @@ -import React, { FC, useCallback } from '../../lib/teact/teact'; +import React, { FC, useCallback, useMemo } from '../../lib/teact/teact'; import { withGlobal } from '../../lib/teact/teactn'; import { AudioOrigin } from '../../types'; @@ -7,7 +7,7 @@ import { ApiAudio, ApiChat, ApiMessage, ApiUser, } from '../../api/types'; -import { IS_SINGLE_COLUMN_LAYOUT } from '../../util/environment'; +import { IS_IOS, IS_SINGLE_COLUMN_LAYOUT } from '../../util/environment'; import * as mediaLoader from '../../util/mediaLoader'; import { getMediaDuration, getMessageContent, getMessageMediaHash, getSenderTitle, @@ -24,6 +24,7 @@ import { clearMediaSession } from '../../util/mediaSession'; import RippleEffect from '../ui/RippleEffect'; import Button from '../ui/Button'; +import RangeSlider from '../ui/RangeSlider'; import './AudioPlayer.scss'; @@ -37,12 +38,22 @@ type OwnProps = { type StateProps = { sender?: ApiChat | ApiUser; chat?: ApiChat; + volume: number; }; -type DispatchProps = Pick; +type DispatchProps = Pick; const AudioPlayer: FC = ({ - message, origin = AudioOrigin.Inline, className, noUi, sender, focusMessage, closeAudioPlayer, chat, + message, + origin = AudioOrigin.Inline, + className, + noUi, + sender, + chat, + volume, + setAudioPlayerVolume, + focusMessage, + closeAudioPlayer, }) => { const lang = useLang(); const { audio, voice } = getMessageContent(message); @@ -50,7 +61,10 @@ const AudioPlayer: FC = ({ const senderName = sender ? getSenderTitle(lang, sender) : undefined; const mediaData = mediaLoader.getFromMemory(getMessageMediaHash(message, 'inline')!) as (string | undefined); const mediaMetadata = useMessageMediaMetadata(message, sender, chat); - const { playPause, stop, isPlaying } = useAudioPlayer( + + const { + playPause, stop, isPlaying, requestNextTrack, requestPreviousTrack, isFirst, isLast, setVolume, + } = useAudioPlayer( makeTrackId(message), getMediaDuration(message)!, isVoice ? 'voice' : 'audio', @@ -78,6 +92,18 @@ const AudioPlayer: FC = ({ stop(); }, [closeAudioPlayer, isPlaying, playPause, stop]); + const handleVolumeChange = useCallback((value: number) => { + setAudioPlayerVolume({ volume: value / 100 }); + setVolume(value / 100); + }, [setAudioPlayerVolume, setVolume]); + + const volumeIcon = useMemo(() => { + if (volume === 0) return 'icon-muted'; + if (volume < 0.3) return 'icon-volume-1'; + if (volume < 0.6) return 'icon-volume-2'; + return 'icon-volume-3'; + }, [volume]); + if (noUi) { return undefined; } @@ -89,19 +115,59 @@ const AudioPlayer: FC = ({ ripple={!IS_SINGLE_COLUMN_LAYOUT} color="translucent" size="smaller" - className={buildClassName('toggle-play', isPlaying ? 'pause' : 'play')} + className="player-button" + disabled={isFirst} + onClick={requestPreviousTrack} + ariaLabel="Previous track" + > + + + +
{audio ? renderAudio(audio) : renderVoice(lang('AttachAudio'), senderName)}
+ {!IS_IOS && ( + + )}
); diff --git a/src/components/middle/message/_message-content.scss b/src/components/middle/message/_message-content.scss index b338473a9..2ac98840c 100644 --- a/src/components/middle/message/_message-content.scss +++ b/src/components/middle/message/_message-content.scss @@ -516,7 +516,7 @@ user-select: none; } - .message-media-duration .icon-muted-chat { + .message-media-duration .icon-muted { vertical-align: -.1875rem; margin-left: .375rem; font-size: 1.0625rem; diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx index 0b2a4c62c..b9cb58193 100644 --- a/src/components/ui/Button.tsx +++ b/src/components/ui/Button.tsx @@ -32,6 +32,7 @@ export type OwnProps = { faded?: boolean; tabIndex?: number; isRtl?: boolean; + withClickPropagation?: boolean; onClick?: (e: ReactMouseEvent) => void; onContextMenu?: (e: ReactMouseEvent) => void; onMouseDown?: (e: ReactMouseEvent) => void; @@ -70,6 +71,7 @@ const Button: FC = ({ faded, tabIndex, isRtl, + withClickPropagation, }) => { // eslint-disable-next-line no-null/no-null let elementRef = useRef(null); @@ -108,11 +110,11 @@ const Button: FC = ({ }, [disabled, onClick]); const handleMouseDown = useCallback((e: ReactMouseEvent) => { - e.preventDefault(); + if (!withClickPropagation) e.preventDefault(); if (!disabled && onMouseDown) { onMouseDown(e); } - }, [onMouseDown, disabled]); + }, [onMouseDown, disabled, withClickPropagation]); if (href) { return ( diff --git a/src/components/ui/RangeSlider.scss b/src/components/ui/RangeSlider.scss index 270c94c5c..af1d8a56b 100644 --- a/src/components/ui/RangeSlider.scss +++ b/src/components/ui/RangeSlider.scss @@ -100,6 +100,14 @@ &::-moz-slider-thumb { -moz-appearance: none; } + + &::-webkit-slider-runnable-track { + cursor: pointer; + } + + &::-moz-range-track, &::-moz-range-progress { + cursor: pointer; + } } // Apply custom styles diff --git a/src/components/ui/RangeSlider.tsx b/src/components/ui/RangeSlider.tsx index 7d851919b..65397ede2 100644 --- a/src/components/ui/RangeSlider.tsx +++ b/src/components/ui/RangeSlider.tsx @@ -10,7 +10,9 @@ import './RangeSlider.scss'; type OwnProps = { options?: string[]; - range?: { min: number; max: number; step?: number }; + min?: number; + max?: number; + step?: number; label?: string; value: number; disabled?: boolean; @@ -19,7 +21,9 @@ type OwnProps = { const RangeSlider: FC = ({ options, - range, + min = 0, + max = options ? options.length - 1 : 100, + step = 1, label, value, disabled, @@ -38,29 +42,19 @@ const RangeSlider: FC = ({ const trackWidth = useMemo(() => { if (options) { return (value / (options.length - 1)) * 100; - } else if (range) { - const possibleValuesLength = (range.max - range.min) / (range.step || 1); - return ((value - range.min) / possibleValuesLength) * 100; + } else { + const possibleValuesLength = (max - min) / step; + return ((value - min) / possibleValuesLength) * 100; } return 0; - }, [value, options, range]); - - const [min, max, step] = useMemo(() => { - if (options) { - return [0, options.length - 1, 1]; - } else if (range) { - return [range.min, range.max, range.step || 1]; - } - - return [0, 0, 0]; - }, [range, options]); + }, [options, value, max, min, step]); return (
{label && (
{label} - {range && ( + {!options && ( {value} )}
diff --git a/src/config.ts b/src/config.ts index 75b1a85f4..6116c8921 100644 --- a/src/config.ts +++ b/src/config.ts @@ -60,6 +60,8 @@ export const PROFILE_SENSITIVE_AREA = 500; export const TOP_CHAT_MESSAGES_PRELOAD_LIMIT = 20; export const ALL_CHATS_PRELOAD_DISABLED = false; +export const DEFAULT_VOLUME = 1; + export const ANIMATION_LEVEL_MIN = 0; export const ANIMATION_LEVEL_MED = 1; export const ANIMATION_LEVEL_MAX = 2; diff --git a/src/global/cache.ts b/src/global/cache.ts index bc618317b..33006c6dd 100644 --- a/src/global/cache.ts +++ b/src/global/cache.ts @@ -13,6 +13,7 @@ import { GLOBAL_STATE_CACHE_CHAT_LIST_LIMIT, MIN_SCREEN_WIDTH_FOR_STATIC_RIGHT_COLUMN, GLOBAL_STATE_CACHE_USER_LIST_LIMIT, + DEFAULT_VOLUME, } from '../config'; import { IS_SINGLE_COLUMN_LAYOUT } from '../util/environment'; import { ANIMATION_END_EVENT, ANIMATION_START_EVENT } from '../hooks/useHeavyAnimationCheck'; @@ -132,6 +133,10 @@ function readCache(initialState: GlobalState): GlobalState { if (!cached.serviceNotifications) { cached.serviceNotifications = []; } + + if (cached.audioPlayer.volume === undefined) { + cached.audioPlayer.volume = DEFAULT_VOLUME; + } } const newState = { @@ -178,6 +183,9 @@ function updateCache() { 'leftColumnWidth', 'serviceNotifications', ]), + audioPlayer: { + volume: global.audioPlayer.volume, + }, isChatInfoShown: reduceShowChatInfo(global), users: reduceUsers(global), chats: reduceChats(global), diff --git a/src/global/initial.ts b/src/global/initial.ts index 75d51468b..e6f56a162 100644 --- a/src/global/initial.ts +++ b/src/global/initial.ts @@ -3,6 +3,7 @@ import { NewChatMembersProgress } from '../types'; import { ANIMATION_LEVEL_DEFAULT, DARK_THEME_PATTERN_COLOR, DEFAULT_MESSAGE_TEXT_SIZE_PX, DEFAULT_PATTERN_COLOR, + DEFAULT_VOLUME, IOS_DEFAULT_MESSAGE_TEXT_SIZE_PX, MACOS_DEFAULT_MESSAGE_TEXT_SIZE_PX, } from '../config'; import { IS_IOS, IS_MAC_OS } from '../util/environment'; @@ -110,7 +111,9 @@ export const INITIAL_STATE: GlobalState = { mediaViewer: {}, - audioPlayer: {}, + audioPlayer: { + volume: DEFAULT_VOLUME, + }, forwardMessages: {}, diff --git a/src/global/types.ts b/src/global/types.ts index 2934bf110..160c52f75 100644 --- a/src/global/types.ts +++ b/src/global/types.ts @@ -328,6 +328,7 @@ export type GlobalState = { messageId?: number; threadId?: number; origin?: AudioOrigin; + volume: number; }; topPeers: { @@ -523,9 +524,10 @@ export type ActionTypes = ( 'clickInlineButton' | 'sendBotCommand' | 'loadTopInlineBots' | 'queryInlineBot' | 'sendInlineBotResult' | 'resetInlineBot' | 'restartBot' | 'startBot' | // misc - 'openMediaViewer' | 'closeMediaViewer' | 'openAudioPlayer' | 'closeAudioPlayer' | 'openPollModal' | 'closePollModal' | - 'loadWebPagePreview' | 'clearWebPagePreview' | 'loadWallpapers' | 'uploadWallpaper' | 'setDeviceToken' | - 'deleteDeviceToken' | 'checkVersionNotification' | 'createServiceNotification' | + 'openMediaViewer' | 'closeMediaViewer' | 'openAudioPlayer' | 'setAudioPlayerVolume' | 'closeAudioPlayer' | + 'openPollModal' | 'closePollModal' | 'loadWebPagePreview' | 'clearWebPagePreview' | + 'loadWallpapers' | 'uploadWallpaper' | 'setDeviceToken' | 'deleteDeviceToken' | + 'checkVersionNotification' | 'createServiceNotification' | // payment 'openPaymentModal' | 'closePaymentModal' | 'addPaymentError' | 'validateRequestedInfo' | 'setPaymentStep' | 'sendPaymentForm' | 'getPaymentForm' | 'getReceipt' | diff --git a/src/hooks/useAudioPlayer.ts b/src/hooks/useAudioPlayer.ts index 473a30f83..f80ebb2f8 100644 --- a/src/hooks/useAudioPlayer.ts +++ b/src/hooks/useAudioPlayer.ts @@ -1,7 +1,7 @@ import { useCallback, useEffect, useRef, useState, } from '../lib/teact/teact'; -import { getDispatch } from '../lib/teact/teactn'; +import { getDispatch, getGlobal } from '../lib/teact/teactn'; import { AudioOrigin } from '../types'; @@ -48,12 +48,21 @@ export default ( useOnChange(() => { controllerRef.current = register(trackId, trackType, origin, (eventName, e) => { switch (eventName) { - case 'onPlay': + case 'onPlay': { + const { setVolume, proxy } = controllerRef.current!; setIsPlaying(true); registerMediaSession(metadata, makeMediaHandlers(controllerRef)); setPlaybackState('playing'); + setVolume(getGlobal().audioPlayer.volume); + + setPositionState({ + duration: proxy.duration || 0, + playbackRate: proxy.playbackRate, + position: proxy.currentTime, + }); break; + } case 'onPause': setIsPlaying(false); setPlaybackState('paused'); @@ -62,11 +71,6 @@ export default ( const { proxy } = controllerRef.current!; const duration = proxy.duration && Number.isFinite(proxy.duration) ? proxy.duration : originalDuration; if (!noProgressUpdates) setPlayProgress(proxy.currentTime / duration); - setPositionState({ - duration: proxy.duration, - playbackRate: proxy.playbackRate, - position: proxy.currentTime, - }); break; } case 'onEnded': { @@ -95,7 +99,18 @@ export default ( }, [metadata, isPlaying]); const { - play, pause, setCurrentTime, proxy, destroy, setVolume, setCurrentOrigin, stop, + play, + pause, + setCurrentTime, + proxy, + destroy, + setVolume, + setCurrentOrigin, + stop, + isFirst, + isLast, + requestNextTrack, + requestPreviousTrack, } = controllerRef.current!; const duration = proxy.duration && Number.isFinite(proxy.duration) ? proxy.duration : originalDuration; @@ -160,6 +175,10 @@ export default ( setVolume, audioProxy: proxy, duration, + requestNextTrack, + requestPreviousTrack, + isFirst: isFirst(), + isLast: isLast(), }; }; diff --git a/src/hooks/useMessageMediaMetadata.ts b/src/hooks/useMessageMediaMetadata.ts index c7fc3aea2..56da73263 100644 --- a/src/hooks/useMessageMediaMetadata.ts +++ b/src/hooks/useMessageMediaMetadata.ts @@ -32,7 +32,9 @@ export default (message: ApiMessage, sender?: ApiUser | ApiChat, chat?: ApiChat) const hash = (audio && audioCoverHash) || (voice && avatarHash); const media = useMedia(hash); - const size = getCoverSize(audio, voice, media); + const size = useMemo(() => { + return getCoverSize(audio, voice, media); + }, [audio, media, voice]); const { result: url } = useAsync(() => makeGoodArtwork(media, size), [media, size], telegramLogoPath); return useMemo(() => { return buildMediaMetadata({ diff --git a/src/modules/actions/ui/messages.ts b/src/modules/actions/ui/messages.ts index 83549e6b3..b85263138 100644 --- a/src/modules/actions/ui/messages.ts +++ b/src/modules/actions/ui/messages.ts @@ -170,7 +170,7 @@ addReducer('closeMediaViewer', (global) => { addReducer('openAudioPlayer', (global, actions, payload) => { const { - chatId, threadId, messageId, origin, + chatId, threadId, messageId, origin, volume, } = payload!; return { @@ -180,6 +180,21 @@ addReducer('openAudioPlayer', (global, actions, payload) => { threadId, messageId, origin, + volume: volume || global.audioPlayer.volume, + }, + }; +}); + +addReducer('setAudioPlayerVolume', (global, actions, payload) => { + const { + volume, + } = payload!; + + return { + ...global, + audioPlayer: { + ...global.audioPlayer, + volume, }, }; }); @@ -187,7 +202,9 @@ addReducer('openAudioPlayer', (global, actions, payload) => { addReducer('closeAudioPlayer', (global) => { return { ...global, - audioPlayer: {}, + audioPlayer: { + volume: global.audioPlayer.volume, // Preserve only volume for the next play + }, }; }); diff --git a/src/styles/Telegram T.json b/src/styles/Telegram T.json index cc0bc7ed8..6f5928831 100644 --- a/src/styles/Telegram T.json +++ b/src/styles/Telegram T.json @@ -2,9 +2,165 @@ "metadata": { "name": "Telegram T", "lastOpened": 0, - "created": 1628131266337 + "created": 1635725227633 }, "iconSets": [ + { + "selection": [ + { + "order": 673, + "id": 5, + "name": "loop", + "prevSize": 32, + "code": 59777, + "tempChar": "" + }, + { + "order": 672, + "id": 4, + "name": "skip-next", + "prevSize": 32, + "code": 59778, + "tempChar": "" + }, + { + "order": 671, + "id": 3, + "name": "skip-previous", + "prevSize": 32, + "code": 59779, + "tempChar": "" + }, + { + "order": 674, + "id": 2, + "name": "volume-1", + "prevSize": 32, + "code": 59780, + "tempChar": "" + }, + { + "order": 669, + "id": 1, + "name": "volume-2", + "prevSize": 32, + "code": 59781, + "tempChar": "" + }, + { + "order": 668, + "id": 0, + "name": "volume-3", + "prevSize": 32, + "code": 59782, + "tempChar": "" + } + ], + "id": 3, + "metadata": { + "name": "Audio", + "importSize": { + "width": 24, + "height": 24 + } + }, + "height": 1024, + "prevSize": 32, + "icons": [ + { + "id": 5, + "paths": [ + "M298.667 298.667h426.667v128l170.667-170.667-170.667-170.667v128h-512v256h85.333v-170.667zM725.333 725.333h-426.667v-128l-170.667 170.667 170.667 170.667v-128h512v-256h-85.333v170.667z" + ], + "attrs": [ + {} + ], + "isMulticolor": false, + "isMulticolor2": false, + "grid": 24, + "tags": [ + "loop" + ] + }, + { + "id": 4, + "paths": [ + "M256 768l362.667-256-362.667-256v512zM682.667 256v512h85.333v-512h-85.333z" + ], + "attrs": [ + {} + ], + "isMulticolor": false, + "isMulticolor2": false, + "grid": 24, + "tags": [ + "skip-next" + ] + }, + { + "id": 3, + "paths": [ + "M256 256h85.333v512h-85.333zM405.333 512l362.667 256v-512z" + ], + "attrs": [ + {} + ], + "isMulticolor": false, + "isMulticolor2": false, + "grid": 24, + "tags": [ + "skip-previous" + ] + }, + { + "id": 2, + "paths": [ + "M558.623 229.209c5.383 8.831 8.569 19.512 8.569 30.938 0 0.001-0 0.001-0 0.002l0-0v509.201c0 33.212-26.923 60.135-60.135 60.135-11.426-0.001-22.108-3.187-31.206-8.72l0.266 0.15-160.939-96.567c-29.352-17.832-48.66-49.631-48.66-85.94 0-0.001 0-0.002 0-0.003l-0 0v-247.32c0.002-36.309 19.309-68.108 48.217-85.692l0.443-0.251 160.939-96.565c28.48-17.087 65.419-7.853 82.505 20.627v0.004zM146.653 334.345c33.212 0 60.135 26.923 60.135 60.135v240.54c0 33.212-26.923 60.135-60.135 60.135s-60.135-26.923-60.135-60.135v-240.54c0-33.212 26.923-60.135 60.135-60.135zM554.336 623.967c-0.012 0-0.026 0-0.040 0-8.404 0-16.011-3.412-21.512-8.926l-0.001-0.001c-11.909-11.909-11.909-187.531 0-199.44 11.911-11.911 31.219-11.911 43.107 0 26.637 26.636 41.295 62.059 41.295 99.697 0 37.688-14.657 73.084-41.293 99.72-5.509 5.529-13.131 8.949-21.551 8.949-0.002 0-0.003-0-0.005-0l0 0z" + ], + "attrs": [ + {} + ], + "grid": 24, + "tags": [ + "volume-1" + ], + "isMulticolor": false, + "isMulticolor2": false + }, + { + "id": 1, + "paths": [ + "M558.623 229.209c5.383 8.831 8.569 19.512 8.569 30.938 0 0.001-0 0.001-0 0.002l0-0v509.201c0 33.212-26.923 60.135-60.135 60.135-11.426-0.001-22.108-3.187-31.206-8.72l0.266 0.15-160.939-96.567c-29.352-17.832-48.66-49.631-48.66-85.94 0-0.001 0-0.002 0-0.003l-0 0v-247.32c0.002-36.309 19.309-68.108 48.217-85.692l0.443-0.251 160.939-96.565c28.48-17.087 65.419-7.853 82.505 20.627v0.004zM146.653 334.345c33.212 0 60.135 26.923 60.135 60.135v240.54c0 33.212-26.923 60.135-60.135 60.135s-60.135-26.923-60.135-60.135v-240.54c0-33.212 26.923-60.135 60.135-60.135zM554.336 623.967c-0.012 0-0.026 0-0.040 0-8.404 0-16.011-3.412-21.512-8.926l-0.001-0.001c-11.909-11.909-11.909-187.531 0-199.44 11.911-11.911 31.219-11.911 43.107 0 26.637 26.636 41.295 62.059 41.295 99.697 0 37.688-14.657 73.084-41.293 99.72-5.509 5.529-13.131 8.949-21.551 8.949-0.002 0-0.003-0-0.005-0l0 0zM647.088 707.369c-0.007 0-0.015 0-0.024 0-9.352 0-17.819-3.794-23.944-9.926l-0-0c-13.221-13.245-13.221-34.696 0-47.941 74.168-74.14 74.139-194.815 0-268.96-13.247-13.245-13.247-34.695 0-47.94 13.221-13.247 34.695-13.247 47.941 0 100.605 100.607 100.605 264.259 0.024 364.812-6.663 6.637-15.315 9.956-23.997 9.956z" + ], + "attrs": [ + {} + ], + "grid": 24, + "tags": [ + "volume-2" + ], + "isMulticolor": false, + "isMulticolor2": false + }, + { + "id": 0, + "paths": [ + "M558.623 229.209c5.383 8.831 8.569 19.512 8.569 30.938 0 0.001-0 0.001-0 0.002l0-0v509.201c0 33.212-26.923 60.135-60.135 60.135-11.426-0.001-22.108-3.187-31.206-8.72l0.266 0.15-160.939-96.567c-29.352-17.832-48.66-49.631-48.66-85.94 0-0.001 0-0.002 0-0.003l-0 0v-247.32c0.002-36.309 19.309-68.108 48.217-85.692l0.443-0.251 160.939-96.565c28.48-17.087 65.419-7.853 82.505 20.627v0.004zM146.653 334.345c33.212 0 60.135 26.923 60.135 60.135v240.54c0 33.212-26.923 60.135-60.135 60.135s-60.135-26.923-60.135-60.135v-240.54c0-33.212 26.923-60.135 60.135-60.135zM554.336 623.967c-0.012 0-0.026 0-0.040 0-8.404 0-16.011-3.412-21.512-8.926l-0.001-0.001c-11.909-11.909-11.909-187.531 0-199.44 11.911-11.911 31.219-11.911 43.107 0 26.637 26.636 41.295 62.059 41.295 99.697 0 37.688-14.657 73.084-41.293 99.72-5.509 5.529-13.131 8.949-21.551 8.949-0.002 0-0.003-0-0.005-0l0 0zM647.088 707.369c-0.007 0-0.015 0-0.024 0-9.352 0-17.819-3.794-23.944-9.926l-0-0c-13.221-13.245-13.221-34.696 0-47.941 74.168-74.14 74.139-194.815 0-268.96-13.247-13.245-13.247-34.695 0-47.94 13.221-13.247 34.695-13.247 47.941 0 100.605 100.607 100.605 264.259 0.024 364.812-6.663 6.637-15.315 9.956-23.997 9.956zM760.675 802.089c-8.716 0-17.431-3.344-24.115-10-13.341-13.339-13.341-34.941 0-48.283 61.275-61.275 95.013-142.712 95.013-229.413s-33.769-168.164-95.067-229.439c-13.317-13.34-13.317-34.943 0-48.283 13.368-13.34 34.967-13.34 48.307 0 74.187 74.187 115.039 172.789 115.039 277.721 0 104.933-40.821 203.533-115.013 277.667-6.166 6.195-14.699 10.028-24.128 10.028-0.013 0-0.026-0-0.038-0l0.002 0v0.001z" + ], + "attrs": [ + {} + ], + "grid": 24, + "tags": [ + "volume-3" + ], + "isMulticolor": false, + "isMulticolor2": false + } + ], + "invisible": false, + "colorThemes": [] + }, { "selection": [ { @@ -13,7 +169,7 @@ "name": "bot-commands-filled", "prevSize": 32, "code": 59775, - "tempChar": "" + "tempChar": "" }, { "order": 664, @@ -21,7 +177,7 @@ "name": "reply-filled", "prevSize": 32, "code": 59776, - "tempChar": "" + "tempChar": "" }, { "order": 656, @@ -29,7 +185,7 @@ "name": "bug", "prevSize": 32, "code": 59774, - "tempChar": "" + "tempChar": "" }, { "order": 619, @@ -37,7 +193,7 @@ "name": "data", "prevSize": 32, "code": 59773, - "tempChar": "" + "tempChar": "" }, { "order": 622, @@ -45,7 +201,7 @@ "name": "darkmode", "prevSize": 32, "code": 59769, - "tempChar": "" + "tempChar": "" }, { "order": 623, @@ -53,7 +209,7 @@ "name": "animations", "prevSize": 32, "code": 59770, - "tempChar": "" + "tempChar": "" }, { "order": 626, @@ -61,7 +217,7 @@ "name": "enter", "prevSize": 32, "code": 59771, - "tempChar": "" + "tempChar": "" }, { "order": 627, @@ -69,7 +225,7 @@ "name": "fontsize", "prevSize": 32, "code": 59772, - "tempChar": "" + "tempChar": "" }, { "order": 630, @@ -77,7 +233,7 @@ "name": "permissions", "prevSize": 32, "code": 59766, - "tempChar": "" + "tempChar": "" }, { "order": 631, @@ -85,7 +241,7 @@ "name": "card", "prevSize": 32, "code": 59767, - "tempChar": "" + "tempChar": "" }, { "order": 634, @@ -93,7 +249,7 @@ "name": "truck", "prevSize": 32, "code": 59768, - "tempChar": "" + "tempChar": "" }, { "order": 663, @@ -101,7 +257,7 @@ "name": "share-filled", "prevSize": 32, "code": 59738, - "tempChar": "" + "tempChar": "" }, { "order": 638, @@ -109,7 +265,7 @@ "name": "bold", "prevSize": 32, "code": 59745, - "tempChar": "" + "tempChar": "" }, { "order": 639, @@ -117,7 +273,7 @@ "name": "bot-command", "prevSize": 32, "code": 59746, - "tempChar": "" + "tempChar": "" }, { "order": 642, @@ -125,7 +281,7 @@ "name": "calendar-filter", "prevSize": 32, "code": 59747, - "tempChar": "" + "tempChar": "" }, { "order": 643, @@ -133,7 +289,7 @@ "name": "comments", "prevSize": 32, "code": 59748, - "tempChar": "" + "tempChar": "" }, { "order": 645, @@ -141,7 +297,7 @@ "name": "comments-sticker", "prevSize": 32, "code": 59749, - "tempChar": "" + "tempChar": "" }, { "order": 646, @@ -149,7 +305,7 @@ "name": "arrow-down", "prevSize": 32, "code": 59750, - "tempChar": "" + "tempChar": "" }, { "order": 647, @@ -157,7 +313,7 @@ "name": "email", "prevSize": 32, "code": 59751, - "tempChar": "" + "tempChar": "" }, { "order": 648, @@ -165,7 +321,7 @@ "name": "italic", "prevSize": 32, "code": 59752, - "tempChar": "" + "tempChar": "" }, { "order": 620, @@ -173,7 +329,7 @@ "name": "link", "prevSize": 32, "code": 59753, - "tempChar": "" + "tempChar": "" }, { "order": 621, @@ -181,7 +337,7 @@ "name": "mention", "prevSize": 32, "code": 59754, - "tempChar": "" + "tempChar": "" }, { "order": 624, @@ -189,7 +345,7 @@ "name": "monospace", "prevSize": 32, "code": 59755, - "tempChar": "" + "tempChar": "" }, { "order": 625, @@ -197,7 +353,7 @@ "name": "next", "prevSize": 32, "code": 59756, - "tempChar": "" + "tempChar": "" }, { "order": 628, @@ -205,7 +361,7 @@ "name": "password-off", "prevSize": 32, "code": 59757, - "tempChar": "" + "tempChar": "" }, { "order": 629, @@ -213,7 +369,7 @@ "name": "pin-list", "prevSize": 32, "code": 59758, - "tempChar": "" + "tempChar": "" }, { "order": 632, @@ -221,7 +377,7 @@ "name": "previous", "prevSize": 32, "code": 59759, - "tempChar": "" + "tempChar": "" }, { "order": 633, @@ -229,7 +385,7 @@ "name": "replace", "prevSize": 32, "code": 59760, - "tempChar": "" + "tempChar": "" }, { "order": 636, @@ -237,7 +393,7 @@ "name": "schedule", "prevSize": 32, "code": 59761, - "tempChar": "" + "tempChar": "" }, { "order": 637, @@ -245,7 +401,7 @@ "name": "strikethrough", "prevSize": 32, "code": 59762, - "tempChar": "" + "tempChar": "" }, { "order": 640, @@ -253,7 +409,7 @@ "name": "underlined", "prevSize": 32, "code": 59763, - "tempChar": "" + "tempChar": "" }, { "order": 641, @@ -261,7 +417,7 @@ "name": "zoom-in", "prevSize": 32, "code": 59764, - "tempChar": "" + "tempChar": "" }, { "order": 649, @@ -269,7 +425,7 @@ "name": "zoom-out", "prevSize": 32, "code": 59765, - "tempChar": "" + "tempChar": "" } ], "id": 2, @@ -2211,7 +2367,7 @@ ], "grid": 24, "tags": [ - "muted-chat" + "muted" ], "isMulticolor": false, "isMulticolor2": false, @@ -2335,7 +2491,7 @@ "name": "select", "prevSize": 32, "code": 59744, - "tempChar": "" + "tempChar": "" }, { "order": 480, @@ -2343,7 +2499,7 @@ "name": "folder", "prevSize": 32, "code": 59667, - "tempChar": "" + "tempChar": "" }, { "order": 481, @@ -2351,7 +2507,7 @@ "name": "bots", "prevSize": 32, "code": 59669, - "tempChar": "" + "tempChar": "" }, { "order": 482, @@ -2359,7 +2515,7 @@ "name": "calendar", "prevSize": 32, "code": 59670, - "tempChar": "" + "tempChar": "" }, { "order": 483, @@ -2367,7 +2523,7 @@ "name": "cloud-download", "prevSize": 32, "code": 59671, - "tempChar": "" + "tempChar": "" }, { "order": 484, @@ -2375,7 +2531,7 @@ "name": "colorize", "prevSize": 32, "code": 59672, - "tempChar": "" + "tempChar": "" }, { "order": 651, @@ -2383,7 +2539,7 @@ "name": "forward", "prevSize": 32, "code": 59687, - "tempChar": "" + "tempChar": "" }, { "order": 650, @@ -2391,7 +2547,7 @@ "name": "reply", "prevSize": 32, "code": 59719, - "tempChar": "" + "tempChar": "" }, { "order": 487, @@ -2399,7 +2555,7 @@ "name": "help", "prevSize": 32, "code": 59690, - "tempChar": "" + "tempChar": "" }, { "order": 488, @@ -2407,7 +2563,7 @@ "name": "info", "prevSize": 32, "code": 59691, - "tempChar": "" + "tempChar": "" }, { "order": 489, @@ -2415,7 +2571,7 @@ "name": "info-filled", "prevSize": 32, "code": 59675, - "tempChar": "" + "tempChar": "" }, { "order": 490, @@ -2423,7 +2579,7 @@ "name": "delete-filled", "prevSize": 32, "code": 59676, - "tempChar": "" + "tempChar": "" }, { "order": 491, @@ -2431,7 +2587,7 @@ "name": "delete", "prevSize": 32, "code": 59677, - "tempChar": "" + "tempChar": "" }, { "order": 492, @@ -2439,7 +2595,7 @@ "name": "edit", "prevSize": 32, "code": 59683, - "tempChar": "" + "tempChar": "" }, { "order": 493, @@ -2447,7 +2603,7 @@ "name": "new-chat-filled", "prevSize": 32, "code": 59705, - "tempChar": "" + "tempChar": "" }, { "order": 494, @@ -2455,7 +2611,7 @@ "name": "send", "prevSize": 32, "code": 59722, - "tempChar": "" + "tempChar": "" }, { "order": 495, @@ -2463,7 +2619,7 @@ "name": "send-outline", "prevSize": 32, "code": 59723, - "tempChar": "" + "tempChar": "" }, { "order": 496, @@ -2471,7 +2627,7 @@ "name": "add-user-filled", "prevSize": 32, "code": 59652, - "tempChar": "" + "tempChar": "" }, { "order": 497, @@ -2479,7 +2635,7 @@ "name": "add-user", "prevSize": 32, "code": 59653, - "tempChar": "" + "tempChar": "" }, { "order": 498, @@ -2487,7 +2643,7 @@ "name": "delete-user", "prevSize": 32, "code": 59678, - "tempChar": "" + "tempChar": "" }, { "order": 499, @@ -2495,7 +2651,7 @@ "name": "microphone", "prevSize": 32, "code": 59701, - "tempChar": "" + "tempChar": "" }, { "order": 500, @@ -2503,7 +2659,7 @@ "name": "microphone-alt", "prevSize": 32, "code": 59707, - "tempChar": "" + "tempChar": "" }, { "order": 501, @@ -2511,7 +2667,7 @@ "name": "poll", "prevSize": 32, "code": 59704, - "tempChar": "" + "tempChar": "" }, { "order": 502, @@ -2519,7 +2675,7 @@ "name": "revote", "prevSize": 32, "code": 59706, - "tempChar": "" + "tempChar": "" }, { "order": 503, @@ -2527,7 +2683,7 @@ "name": "photo", "prevSize": 32, "code": 59712, - "tempChar": "" + "tempChar": "" }, { "order": 504, @@ -2535,7 +2691,7 @@ "name": "document", "prevSize": 32, "code": 59679, - "tempChar": "" + "tempChar": "" }, { "order": 505, @@ -2543,7 +2699,7 @@ "name": "camera", "prevSize": 32, "code": 59662, - "tempChar": "" + "tempChar": "" }, { "order": 506, @@ -2551,7 +2707,7 @@ "name": "camera-add", "prevSize": 32, "code": 59663, - "tempChar": "" + "tempChar": "" }, { "order": 507, @@ -2559,7 +2715,7 @@ "name": "logout", "prevSize": 32, "code": 59698, - "tempChar": "" + "tempChar": "" }, { "order": 508, @@ -2567,7 +2723,7 @@ "name": "saved-messages", "prevSize": 32, "code": 59720, - "tempChar": "" + "tempChar": "" }, { "order": 509, @@ -2575,7 +2731,7 @@ "name": "settings", "prevSize": 32, "code": 59726, - "tempChar": "" + "tempChar": "" }, { "order": 652, @@ -2583,7 +2739,7 @@ "name": "phone", "prevSize": 32, "code": 59711, - "tempChar": "" + "tempChar": "" }, { "order": 653, @@ -2591,7 +2747,7 @@ "name": "attach", "prevSize": 32, "code": 59657, - "tempChar": "" + "tempChar": "" }, { "order": 512, @@ -2599,7 +2755,7 @@ "name": "copy", "prevSize": 32, "code": 59674, - "tempChar": "" + "tempChar": "" }, { "order": 513, @@ -2607,7 +2763,7 @@ "name": "channel", "prevSize": 32, "code": 59665, - "tempChar": "" + "tempChar": "" }, { "order": 514, @@ -2615,7 +2771,7 @@ "name": "group", "prevSize": 32, "code": 59689, - "tempChar": "" + "tempChar": "" }, { "order": 515, @@ -2623,7 +2779,7 @@ "name": "user", "prevSize": 32, "code": 59737, - "tempChar": "" + "tempChar": "" }, { "order": 516, @@ -2631,7 +2787,7 @@ "name": "non-contacts", "prevSize": 32, "code": 59688, - "tempChar": "" + "tempChar": "" }, { "order": 517, @@ -2639,7 +2795,7 @@ "name": "active-sessions", "prevSize": 32, "code": 59650, - "tempChar": "" + "tempChar": "" }, { "order": 518, @@ -2647,7 +2803,7 @@ "name": "admin", "prevSize": 32, "code": 59654, - "tempChar": "" + "tempChar": "" }, { "order": 519, @@ -2655,7 +2811,7 @@ "name": "download", "prevSize": 32, "code": 59681, - "tempChar": "" + "tempChar": "" }, { "order": 520, @@ -2663,7 +2819,7 @@ "name": "location", "prevSize": 32, "code": 59696, - "tempChar": "" + "tempChar": "" }, { "order": 521, @@ -2671,7 +2827,7 @@ "name": "stop", "prevSize": 32, "code": 59730, - "tempChar": "" + "tempChar": "" }, { "order": 523, @@ -2679,7 +2835,7 @@ "name": "archive", "prevSize": 32, "code": 59656, - "tempChar": "" + "tempChar": "" }, { "order": 524, @@ -2687,7 +2843,7 @@ "name": "unarchive", "prevSize": 32, "code": 59731, - "tempChar": "" + "tempChar": "" }, { "order": 525, @@ -2695,7 +2851,7 @@ "name": "readchats", "prevSize": 32, "code": 59699, - "tempChar": "" + "tempChar": "" }, { "order": 526, @@ -2703,7 +2859,7 @@ "name": "unread", "prevSize": 32, "code": 59735, - "tempChar": "" + "tempChar": "" }, { "order": 654, @@ -2711,7 +2867,7 @@ "name": "message", "prevSize": 32, "code": 59700, - "tempChar": "" + "tempChar": "" }, { "order": 659, @@ -2719,7 +2875,7 @@ "name": "lock", "prevSize": 32, "code": 59697, - "tempChar": "" + "tempChar": "" }, { "order": 529, @@ -2727,7 +2883,7 @@ "name": "unlock", "prevSize": 32, "code": 59732, - "tempChar": "" + "tempChar": "" }, { "order": 530, @@ -2735,7 +2891,7 @@ "name": "mute", "prevSize": 32, "code": 59703, - "tempChar": "" + "tempChar": "" }, { "order": 531, @@ -2743,7 +2899,7 @@ "name": "unmute", "prevSize": 32, "code": 59733, - "tempChar": "" + "tempChar": "" }, { "order": 532, @@ -2751,7 +2907,7 @@ "name": "pin", "prevSize": 32, "code": 59713, - "tempChar": "" + "tempChar": "" }, { "order": 533, @@ -2759,7 +2915,7 @@ "name": "unpin", "prevSize": 32, "code": 59734, - "tempChar": "" + "tempChar": "" }, { "order": 534, @@ -2767,7 +2923,7 @@ "name": "smallscreen", "prevSize": 32, "code": 59742, - "tempChar": "" + "tempChar": "" }, { "order": 535, @@ -2775,7 +2931,7 @@ "name": "fullscreen", "prevSize": 32, "code": 59743, - "tempChar": "" + "tempChar": "" }, { "order": 536, @@ -2783,7 +2939,7 @@ "name": "large-pause", "prevSize": 32, "code": 59694, - "tempChar": "" + "tempChar": "" }, { "order": 537, @@ -2791,7 +2947,7 @@ "name": "large-play", "prevSize": 32, "code": 59695, - "tempChar": "" + "tempChar": "" }, { "order": 538, @@ -2799,7 +2955,7 @@ "name": "pause", "prevSize": 32, "code": 59709, - "tempChar": "" + "tempChar": "" }, { "order": 539, @@ -2807,7 +2963,7 @@ "name": "play", "prevSize": 32, "code": 59715, - "tempChar": "" + "tempChar": "" }, { "order": 540, @@ -2815,7 +2971,7 @@ "name": "channelviews", "prevSize": 32, "code": 59666, - "tempChar": "" + "tempChar": "" }, { "order": 541, @@ -2823,7 +2979,7 @@ "name": "message-succeeded", "prevSize": 32, "code": 59648, - "tempChar": "" + "tempChar": "" }, { "order": 657, @@ -2831,7 +2987,7 @@ "name": "message-read", "prevSize": 32, "code": 59649, - "tempChar": "" + "tempChar": "" }, { "order": 543, @@ -2839,7 +2995,7 @@ "name": "message-pending", "prevSize": 32, "code": 59724, - "tempChar": "" + "tempChar": "" }, { "order": 544, @@ -2847,7 +3003,7 @@ "name": "message-failed", "prevSize": 32, "code": 59725, - "tempChar": "" + "tempChar": "" }, { "order": 545, @@ -2855,7 +3011,7 @@ "name": "favorite", "prevSize": 32, "code": 59710, - "tempChar": "" + "tempChar": "" }, { "order": 546, @@ -2863,7 +3019,7 @@ "name": "keyboard", "prevSize": 32, "code": 59716, - "tempChar": "" + "tempChar": "" }, { "order": 547, @@ -2871,7 +3027,7 @@ "name": "delete-left", "prevSize": 32, "code": 59717, - "tempChar": "" + "tempChar": "" }, { "order": 548, @@ -2879,7 +3035,7 @@ "name": "recent", "prevSize": 32, "code": 59718, - "tempChar": "" + "tempChar": "" }, { "order": 549, @@ -2887,7 +3043,7 @@ "name": "gifs", "prevSize": 32, "code": 59727, - "tempChar": "" + "tempChar": "" }, { "order": 550, @@ -2895,7 +3051,7 @@ "name": "stickers", "prevSize": 32, "code": 59739, - "tempChar": "" + "tempChar": "" }, { "order": 551, @@ -2903,7 +3059,7 @@ "name": "smile", "prevSize": 32, "code": 59728, - "tempChar": "" + "tempChar": "" }, { "order": 552, @@ -2911,7 +3067,7 @@ "name": "animals", "prevSize": 32, "code": 59655, - "tempChar": "" + "tempChar": "" }, { "order": 553, @@ -2919,7 +3075,7 @@ "name": "eats", "prevSize": 32, "code": 59682, - "tempChar": "" + "tempChar": "" }, { "order": 554, @@ -2927,7 +3083,7 @@ "name": "sport", "prevSize": 32, "code": 59729, - "tempChar": "" + "tempChar": "" }, { "order": 555, @@ -2935,7 +3091,7 @@ "name": "car", "prevSize": 32, "code": 59664, - "tempChar": "" + "tempChar": "" }, { "order": 556, @@ -2943,7 +3099,7 @@ "name": "lamp", "prevSize": 32, "code": 59692, - "tempChar": "" + "tempChar": "" }, { "order": 557, @@ -2951,7 +3107,7 @@ "name": "language", "prevSize": 32, "code": 59693, - "tempChar": "" + "tempChar": "" }, { "order": 558, @@ -2959,7 +3115,7 @@ "name": "flag", "prevSize": 32, "code": 59686, - "tempChar": "" + "tempChar": "" }, { "order": 559, @@ -2967,7 +3123,7 @@ "name": "more", "prevSize": 32, "code": 59702, - "tempChar": "" + "tempChar": "" }, { "order": 560, @@ -2975,7 +3131,7 @@ "name": "search", "prevSize": 32, "code": 59721, - "tempChar": "" + "tempChar": "" }, { "order": 561, @@ -2983,7 +3139,7 @@ "name": "remove", "prevSize": 32, "code": 59740, - "tempChar": "" + "tempChar": "" }, { "order": 562, @@ -2991,7 +3147,7 @@ "name": "add", "prevSize": 32, "code": 59651, - "tempChar": "" + "tempChar": "" }, { "order": 563, @@ -2999,7 +3155,7 @@ "name": "check", "prevSize": 32, "code": 59668, - "tempChar": "" + "tempChar": "" }, { "order": 564, @@ -3007,7 +3163,7 @@ "name": "close", "prevSize": 32, "code": 59673, - "tempChar": "" + "tempChar": "" }, { "order": 610, @@ -3015,7 +3171,7 @@ "name": "arrow-left", "prevSize": 32, "code": 59661, - "tempChar": "" + "tempChar": "" }, { "order": 566, @@ -3023,7 +3179,7 @@ "name": "arrow-right", "prevSize": 32, "code": 59708, - "tempChar": "" + "tempChar": "" }, { "order": 567, @@ -3031,7 +3187,7 @@ "name": "down", "prevSize": 32, "code": 59680, - "tempChar": "" + "tempChar": "" }, { "order": 568, @@ -3039,7 +3195,7 @@ "name": "up", "prevSize": 32, "code": 59736, - "tempChar": "" + "tempChar": "" }, { "order": 569, @@ -3047,7 +3203,7 @@ "name": "eye-closed", "prevSize": 32, "code": 59685, - "tempChar": "" + "tempChar": "" }, { "order": 570, @@ -3055,15 +3211,15 @@ "name": "eye", "prevSize": 32, "code": 59684, - "tempChar": "" + "tempChar": "" }, { - "order": 571, + "order": 675, "id": 4, - "name": "muted-chat", + "name": "muted", "prevSize": 32, "code": 59741, - "tempChar": "" + "tempChar": "" }, { "order": 572, @@ -3071,7 +3227,7 @@ "name": "avatar-archived-chats", "prevSize": 32, "code": 59658, - "tempChar": "" + "tempChar": "" }, { "order": 573, @@ -3079,7 +3235,7 @@ "name": "avatar-deleted-account", "prevSize": 32, "code": 59659, - "tempChar": "" + "tempChar": "" }, { "order": 574, @@ -3087,7 +3243,7 @@ "name": "avatar-saved-messages", "prevSize": 32, "code": 59660, - "tempChar": "" + "tempChar": "" }, { "order": 575, @@ -3095,7 +3251,7 @@ "name": "pinned-chat", "prevSize": 32, "code": 59714, - "tempChar": "" + "tempChar": "" } ], "prevSize": 32, @@ -3143,4 +3299,4 @@ "showLiga": false }, "uid": -1 -} \ No newline at end of file +} diff --git a/src/styles/icons.scss b/src/styles/icons.scss index 8b217394b..e442748c6 100644 --- a/src/styles/icons.scss +++ b/src/styles/icons.scss @@ -32,6 +32,24 @@ } } +.icon-loop:before { + content: "\e981"; +} +.icon-skip-next:before { + content: "\e982"; +} +.icon-skip-previous:before { + content: "\e983"; +} +.icon-volume-1:before { + content: "\e984"; +} +.icon-volume-2:before { + content: "\e985"; +} +.icon-volume-3:before { + content: "\e986"; +} .icon-bot-commands-filled:before { content: "\e97f"; } @@ -404,7 +422,7 @@ .icon-eye:before { content: "\e924"; } -.icon-muted-chat:before { +.icon-muted:before { content: "\e95d"; } .icon-avatar-archived-chats:before { diff --git a/src/util/mediaSession.ts b/src/util/mediaSession.ts index c074910a7..f9d30e983 100644 --- a/src/util/mediaSession.ts +++ b/src/util/mediaSession.ts @@ -48,7 +48,7 @@ export function updateMetadata(metadata?: MediaMetadata) { const { mediaSession } = window.navigator; if (mediaSession) { // eslint-disable-next-line no-null/no-null - mediaSession.metadata = metadata !== undefined ? metadata : null; + mediaSession.metadata = metadata ?? null; } } @@ -73,7 +73,7 @@ export function clearMediaSession() { mediaSession.metadata = null; setMediaSessionHandlers(DEFAULT_HANDLERS); if (mediaSession.playbackState) mediaSession.playbackState = 'none'; - if (mediaSession.setPositionState) mediaSession.setPositionState(undefined); + mediaSession.setPositionState?.(); } } @@ -85,29 +85,23 @@ export function setPlaybackState(state: 'none' | 'paused' | 'playing' = 'none') } export function setPositionState(state?: MediaPositionState) { - if (!state || !state.position || !state.duration) return; + if (!state || state.position === undefined || state.duration === undefined) return; + state.position = Math.min(state.position, state.duration); + const { mediaSession } = window.navigator; - if (mediaSession && mediaSession.setPositionState) { - mediaSession.setPositionState(state); - } + mediaSession?.setPositionState?.(state); } export function setMicrophoneActive(active: boolean) { const { mediaSession } = window.navigator; // @ts-ignore typings not updated yet - if (mediaSession && mediaSession.setMicrophoneActive) { - // @ts-ignore - mediaSession.setMicrophoneActive(active); - } + mediaSession?.setMicrophoneActive?.(active); } export function setCameraActive(active: boolean) { const { mediaSession } = window.navigator; // @ts-ignore typings not updated yet - if (mediaSession && mediaSession.setCameraActive) { - // @ts-ignore - mediaSession.setCameraActive(active); - } + mediaSession?.setCameraActive?.(active); } export function buildMediaMetadata({ diff --git a/src/util/safePlay.ts b/src/util/safePlay.ts index 15619bedc..37d898c3a 100644 --- a/src/util/safePlay.ts +++ b/src/util/safePlay.ts @@ -4,7 +4,7 @@ export default (mediaEl: HTMLMediaElement) => { mediaEl.play().catch((err) => { if (DEBUG) { // eslint-disable-next-line no-console - console.warn(err); + console.warn(err, mediaEl); } }); };