From 28b6653e65846e7f563e67cd2fcc89f9613f5427 Mon Sep 17 00:00:00 2001 From: morethanwords Date: Sun, 11 Oct 2020 16:14:58 +0300 Subject: [PATCH] Fix scroll interrupting by message render Fix is-selected render message Hide chat input for deleted account --- src/components/scrollable.ts | 9 +++++---- src/lib/appManagers/appImManager.ts | 21 +++++++++++++++++++-- src/scss/partials/_chat.scss | 6 +++--- 3 files changed, 27 insertions(+), 9 deletions(-) diff --git a/src/components/scrollable.ts b/src/components/scrollable.ts index 216f5f16..3d80c6e1 100644 --- a/src/components/scrollable.ts +++ b/src/components/scrollable.ts @@ -1,3 +1,4 @@ +import { CancellablePromise, deferredPromise } from "../helpers/cancellablePromise"; import { isTouchSupported } from "../helpers/touchSupport"; import { logger, LogLevels } from "../lib/logger"; import smoothscroll, { SCROLL_TIME, SmoothScrollToOptions } from '../vendor/smoothscroll'; @@ -55,6 +56,7 @@ export class ScrollableBase { public getScrollValue: () => number; public scrollLocked = 0; + public scrollLockedPromise: CancellablePromise = Promise.resolve(); constructor(public el: HTMLElement, logPrefix = '', public appendTo = el, public container: HTMLElement = document.createElement('div')) { this.container.classList.add('scrollable'); @@ -103,13 +105,13 @@ export class ScrollableBase { } if(this.scrollLocked) clearTimeout(this.scrollLocked); - /* else { + else { this.scrollLockedPromise = deferredPromise(); - } */ + } this.scrollLocked = window.setTimeout(() => { this.scrollLocked = 0; - //this.scrollLockedPromise.resolve(); + this.scrollLockedPromise.resolve(); //this.onScroll(); this.container.dispatchEvent(new CustomEvent('scroll')); }, scrollTime); @@ -156,7 +158,6 @@ export default class Scrollable extends ScrollableBase { /* private onScrolledTopFired = false; private onScrolledBottomFired = false; */ - //public scrollLockedPromise: CancellablePromise = Promise.resolve(); public isVisible = false; private reorderTimeout: number; diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index 259fed93..2179380a 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -334,6 +334,10 @@ export class AppImManager { }); } + /* const promise = (this.scrollable.scrollLocked && this.scrollable.scrollLockedPromise) || Promise.resolve(); + promise.then(() => { + + }); */ this.needUpdate.forEachReverse((obj, idx) => { if(obj.replyMid == mid) { let {mid, replyMid} = this.needUpdate.splice(idx, 1)[0]; @@ -1268,7 +1272,10 @@ export class AppImManager { const hasRights = isChannel && appChatsManager.hasRights(-peerID, 'send'); this.chatInner.classList.toggle('has-rights', hasRights); - this.chatInput.style.display = !isChannel || hasRights ? '' : 'none'; + const canWrite = (!isChannel || hasRights) && (peerID < 0 || !appUsersManager.getUser(peerID).pFlags.deleted); + this.chatInput.style.display = canWrite ? '' : 'none'; + + this.chatInner.classList.toggle('is-chat-input-hidden', !canWrite); this.topbar.classList.remove('is-pinned-shown'); this.topbar.style.display = ''; @@ -1498,6 +1505,12 @@ export class AppImManager { this.messagesQueue.length = 0; const promises = queue.reduce((acc, {promises}) => acc.concat(promises), []); + + // * это нужно для того, чтобы если захочет подгрузить reply или какое-либо сообщение, то скролл не прервался + if(this.scrollable.scrollLocked) { + promises.push(this.scrollable.scrollLockedPromise); + } + //this.log('promises to call', promises, queue); Promise.all(promises).then(() => { if(this.chatInner != chatInner) { @@ -1566,7 +1579,11 @@ export class AppImManager { bubble.appendChild(bubbleContainer); this.bubbles[+message.mid] = bubble; } else { - bubble.className = 'bubble'; + const save = ['is-selected']; + const wasClassNames = bubble.className.split(' '); + const classNames = ['bubble'].concat(save.filter(c => wasClassNames.includes(c))); + bubble.className = classNames.join(' '); + bubbleContainer = bubble.firstElementChild as HTMLDivElement; bubbleContainer.innerHTML = ''; bubbleContainer.style.marginBottom = ''; diff --git a/src/scss/partials/_chat.scss b/src/scss/partials/_chat.scss index a9db1931..60f58889 100644 --- a/src/scss/partials/_chat.scss +++ b/src/scss/partials/_chat.scss @@ -1088,10 +1088,10 @@ max-width: calc(100% - var(--message-beside-button-margin)) !important; } } + } - &:not(.has-rights) { - padding-bottom: 55px; - } + &.is-chat-input-hidden { + padding-bottom: 55px; } &:not(.is-channel), &.is-chat {