diff --git a/src/components/audio.ts b/src/components/audio.ts index 85b7dd5d..0141d219 100644 --- a/src/components/audio.ts +++ b/src/components/audio.ts @@ -26,7 +26,7 @@ import { joinElementsWith } from "../lib/langPack"; import { MiddleEllipsisElement } from "./middleEllipsis"; import htmlToSpan from "../helpers/dom/htmlToSpan"; import { formatFullSentTime } from "../helpers/date"; -import { formatBytes } from "../helpers/number"; +import { clamp, formatBytes } from "../helpers/number"; import throttleWithRaf from "../helpers/schedulers/throttleWithRaf"; rootScope.addEventListener('messages_media_read', ({mids, peerId}) => { @@ -90,7 +90,12 @@ function wrapVoiceMessage(audioEl: AudioElement) { const barMargin = 2; //mediaSizes.isMobile ? 2 : 1; const barHeightMin = 4; //mediaSizes.isMobile ? 3 : 2; const barHeightMax = mediaSizes.isMobile ? 16 : 23; - const availW = 150; //mediaSizes.isMobile ? 152 : 190; + // const availW = 150; //mediaSizes.isMobile ? 152 : 190; + + const minW = mediaSizes.isMobile ? 152 : 190; + const maxW = mediaSizes.isMobile ? 190 : 256; + const duration = doc.duration; + const availW = clamp(duration / 60 * maxW, minW, maxW); // mediaSizes.isMobile ? 152 : 224; const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); svg.classList.add('audio-waveform'); diff --git a/src/components/chat/bubbles.ts b/src/components/chat/bubbles.ts index 36d80b4a..d7e26980 100644 --- a/src/components/chat/bubbles.ts +++ b/src/components/chat/bubbles.ts @@ -2479,6 +2479,13 @@ export default class ChatBubbles { bubbleContainer.prepend(messageDiv); //bubble.prepend(timeSpan, messageDiv); // that's bad + if(message.views && !message.fwd_from?.saved_from_msg_id && this.chat.type !== 'pinned') { + const forward = document.createElement('div'); + forward.classList.add('bubble-beside-button', 'forward', 'tgico-forward_filled'); + bubbleContainer.prepend(forward); + bubble.classList.add('with-beside-button'); + } + if(message.views && !message.pFlags.is_outgoing && this.viewsObserver) { this.viewsObserver.observe(bubble); } diff --git a/src/components/chat/messageRender.ts b/src/components/chat/messageRender.ts index 170a60ea..020ed1dd 100644 --- a/src/components/chat/messageRender.ts +++ b/src/components/chat/messageRender.ts @@ -28,13 +28,6 @@ export namespace MessageRender { bubble.classList.add('channel-post'); time = '' + formatNumber(message.views, 1) + ' ' + (postAuthor ? RichTextProcessor.wrapEmojiText(postAuthor) + ', ' : '') + time; - - if(!message.fwd_from?.saved_from_msg_id && chat.type !== 'pinned') { - const forward = document.createElement('div'); - forward.classList.add('bubble-beside-button', 'forward', 'tgico-forward_filled'); - bubbleContainer.append(forward); - bubble.classList.add('with-beside-button'); - } } if(message.edit_date && chat.type !== 'scheduled' && !message.pFlags.edit_hide) { diff --git a/src/scss/partials/_chatBubble.scss b/src/scss/partials/_chatBubble.scss index eee21ce0..ca61aec7 100644 --- a/src/scss/partials/_chatBubble.scss +++ b/src/scss/partials/_chatBubble.scss @@ -1183,6 +1183,12 @@ $bubble-beside-button-width: 38px; } } + .message.voice-message { + .document-message { + max-width: fit-content; + } + } + .message.audio-message, .message.voice-message { padding: 8px !important;