r4sas/tweb-i2p
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix showing pinned message on handhelds

Browse Source
This commit is contained in:
Eduard Kuzmenko 2020-12-11 18:15:44 +02:00
parent 571eb3a4bd
commit 191725bd3b
4 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/chat/pinnedContainer.ts
View File

@ -6,7 +6,8 @@ import DivAndCaption from "../divAndCaption";
import { ripple } from "../ripple"; import { ripple } from "../ripple";
import ListenerSetter from "../../helpers/listenerSetter"; import ListenerSetter from "../../helpers/listenerSetter";
const classNames: string[] = []; //const classNames: string[] = [];
const classNames: string[] = ['is-pinned-message-shown', 'is-pinned-audio-shown'];
const CLASSNAME_BASE = 'pinned-container'; const CLASSNAME_BASE = 'pinned-container';
const HEIGHT = 52; const HEIGHT = 52;
@ -21,7 +22,7 @@ export default class PinnedContainer {
prev(mid, title, subtitle); prev(mid, title, subtitle);
}; */ }; */
classNames.push(`is-pinned-${className}-shown`); //classNames.push(`is-pinned-${className}-shown`);
divAndCaption.container.classList.add(CLASSNAME_BASE, 'hide'); divAndCaption.container.classList.add(CLASSNAME_BASE, 'hide');
divAndCaption.title.classList.add(CLASSNAME_BASE + '-title'); divAndCaption.title.classList.add(CLASSNAME_BASE + '-title');
@ -61,7 +62,9 @@ export default class PinnedContainer {
this.divAndCaption.container.classList.toggle('is-floating', mediaSizes.isMobile); this.divAndCaption.container.classList.toggle('is-floating', mediaSizes.isMobile);
const scrollTop = mediaSizes.isMobile /* && !appImManager.scrollable.isScrolledDown */ ? this.chat.bubbles.scrollable.scrollTop : undefined; const scrollable = this.chat.bubbles.scrollable;
const scrollTop = mediaSizes.isMobile /* && !appImManager.scrollable.isScrolledDown */ ? scrollable.scrollTop : undefined;
this.divAndCaption.container.classList.toggle('hide', hide); this.divAndCaption.container.classList.toggle('hide', hide);
const className = `is-pinned-${this.className}-shown`; const className = `is-pinned-${this.className}-shown`;
this.topbar.container.classList.toggle(className, !hide); this.topbar.container.classList.toggle(className, !hide);
@ -69,8 +72,8 @@ export default class PinnedContainer {
const active = classNames.filter(className => this.topbar.container.classList.contains(className)); const active = classNames.filter(className => this.topbar.container.classList.contains(className));
const maxActive = hide ? 0 : 1; const maxActive = hide ? 0 : 1;
if(scrollTop !== undefined && active.length <= maxActive) { if(scrollTop !== undefined && active.length <= maxActive/* && !scrollable.isScrolledDown */) {
this.chat.bubbles.scrollable.scrollTop = scrollTop + ((hide ? -1 : 1) * HEIGHT); scrollable.scrollTop = scrollTop + ((hide ? -1 : 1) * HEIGHT);
} }
this.topbar.setUtilsWidth(); this.topbar.setUtilsWidth();

2
src/components/chat/pinnedMessage.ts
View File

@ -11,6 +11,7 @@ import { cancelEvent, findUpClassName, getElementByPoint, handleScrollSideEvent
import Chat from "./chat"; import Chat from "./chat";
import ListenerSetter from "../../helpers/listenerSetter"; import ListenerSetter from "../../helpers/listenerSetter";
import ButtonIcon from "../buttonIcon"; import ButtonIcon from "../buttonIcon";
import { RIGHT_COLUMN_ACTIVE_CLASSNAME } from "../sidebarRight";
class AnimatedSuper { class AnimatedSuper {
static DURATION = 200; static DURATION = 200;
@ -293,6 +294,7 @@ export default class ChatPinnedMessage {
public destroy() { public destroy() {
this.pinnedMessageContainer.divAndCaption.container.remove(); this.pinnedMessageContainer.divAndCaption.container.remove();
this.pinnedMessageContainer.toggle(true);
this.listenerSetter.removeAll(); this.listenerSetter.removeAll();
this.unsetScrollDownListener(false); this.unsetScrollDownListener(false);
} }

5
src/components/chat/topbar.ts
View File

@ -127,7 +127,7 @@ export default class ChatTopbar {
} else { } else {
const message = this.appMessagesManager.getMessage(mid); const message = this.appMessagesManager.getMessage(mid);
this.chat.appImManager.setPeer(message.peerId, mid); this.chat.appImManager.setInnerPeer(message.peerId, mid);
} }
} else { } else {
this.appSidebarRight.toggleSidebar(true); this.appSidebarRight.toggleSidebar(true);
@ -324,8 +324,6 @@ export default class ChatTopbar {
this.avatarElement.update(); this.avatarElement.update();
} }
this.container.classList.remove('is-pinned-shown');
const isBroadcast = this.appPeersManager.isBroadcast(peerId); const isBroadcast = this.appPeersManager.isBroadcast(peerId);
this.btnMute && this.btnMute.classList.toggle('hide', !isBroadcast); this.btnMute && this.btnMute.classList.toggle('hide', !isBroadcast);
@ -338,6 +336,7 @@ export default class ChatTopbar {
const newPinnedMessage = new ChatPinnedMessage(this, this.chat, this.appMessagesManager, this.appPeersManager); const newPinnedMessage = new ChatPinnedMessage(this, this.chat, this.appMessagesManager, this.appPeersManager);
this.pinnedMessage.pinnedMessageContainer.divAndCaption.container.replaceWith(newPinnedMessage.pinnedMessageContainer.divAndCaption.container); this.pinnedMessage.pinnedMessageContainer.divAndCaption.container.replaceWith(newPinnedMessage.pinnedMessageContainer.divAndCaption.container);
this.pinnedMessage.destroy(); this.pinnedMessage.destroy();
//this.pinnedMessage.pinnedMessageContainer.toggle(true);
this.pinnedMessage = newPinnedMessage; this.pinnedMessage = newPinnedMessage;
} }

5
src/scss/partials/_chatTopbar.scss
View File

@ -10,9 +10,10 @@
@include respond-to(handhelds) { @include respond-to(handhelds) {
&.is-pinned-audio-shown, &.is-pinned-message-shown:not(.hide-pinned) { &.is-pinned-audio-shown, &.is-pinned-message-shown:not(.hide-pinned) {
& + .bubbles { margin-bottom: 52px;
/* & + .bubbles {
margin-top: 52px; margin-top: 52px;
} } */
} }
&.is-pinned-message-shown:not(.hide-pinned):not(.is-pinned-audio-shown) { &.is-pinned-message-shown:not(.hide-pinned):not(.is-pinned-audio-shown) {