Browse Source

fixes

master
morethanwords 3 years ago
parent
commit
1462b7c32c
  1. 6
      .env
  2. 17
      src/components/chat/bubbles.ts
  3. 24
      src/components/chat/input.ts
  4. 19
      src/components/inputField.ts
  5. 1
      src/lang.ts
  6. 20
      src/lib/appManagers/appMessagesManager.ts
  7. 2
      src/lib/langPack.ts
  8. 1
      src/scss/partials/_chatBubble.scss

6
.env

@ -1,5 +1,5 @@
API_ID=1025907 API_ID=1025907
API_HASH=452b0359b988148995f22ff0f4229750 API_HASH=452b0359b988148995f22ff0f4229750
VERSION=0.9.0 VERSION=0.9.1
VERSION_FULL=0.9.0 (13) VERSION_FULL=0.9.1 (14)
BUILD=13 BUILD=14

17
src/components/chat/bubbles.ts

@ -78,6 +78,7 @@ import AppMediaViewer from "../appMediaViewer";
import SetTransition from "../singleTransition"; import SetTransition from "../singleTransition";
import handleHorizontalSwipe from "../../helpers/dom/handleHorizontalSwipe"; import handleHorizontalSwipe from "../../helpers/dom/handleHorizontalSwipe";
import { cancelContextMenuOpening } from "../misc"; import { cancelContextMenuOpening } from "../misc";
import findUpAttribute from "../../helpers/dom/findUpAttribute";
const USE_MEDIA_TAILS = false; const USE_MEDIA_TAILS = false;
const IGNORE_ACTIONS: Set<Message.messageService['action']['_']> = new Set([ const IGNORE_ACTIONS: Set<Message.messageService['action']['_']> = new Set([
@ -980,8 +981,8 @@ export default class ChatBubbles {
return; return;
} }
const nameDiv = findUpClassName(target, 'peer-title') || findUpClassName(target, 'name') || findUpTag(target, 'AVATAR-ELEMENT'); const nameDiv = findUpClassName(target, 'peer-title') || findUpClassName(target, 'name') || findUpTag(target, 'AVATAR-ELEMENT') || findUpAttribute(target, 'data-saved-from');
if(nameDiv) { if(nameDiv && nameDiv !== bubble) {
target = nameDiv || target; target = nameDiv || target;
const peerId = (target.dataset.peerId || target.getAttribute('peer')); const peerId = (target.dataset.peerId || target.getAttribute('peer'));
const savedFrom = target.dataset.savedFrom; const savedFrom = target.dataset.savedFrom;
@ -1517,7 +1518,7 @@ export default class ChatBubbles {
bubble = this.bubbles[Math.max(...mids)]; bubble = this.bubbles[Math.max(...mids)];
} }
const promise = this.scrollToBubbleEnd(bubble, true) || Promise.resolve(); const promise = this.scrollToBubbleEnd(bubble) || Promise.resolve();
if(isPaddingNeeded) { if(isPaddingNeeded) {
promise.then(() => { // it will be called only once even if was set multiple times (that won't happen) promise.then(() => { // it will be called only once even if was set multiple times (that won't happen)
if(middleware() && isPaddingNeeded) { if(middleware() && isPaddingNeeded) {
@ -1547,8 +1548,7 @@ export default class ChatBubbles {
element: HTMLElement, element: HTMLElement,
position: ScrollLogicalPosition, position: ScrollLogicalPosition,
forceDirection?: FocusDirection, forceDirection?: FocusDirection,
forceDuration?: number, forceDuration?: number
isNewMessage?: boolean
) { ) {
// * 4 = .25rem // * 4 = .25rem
const bubble = findUpClassName(element, 'bubble'); const bubble = findUpClassName(element, 'bubble');
@ -1562,6 +1562,7 @@ export default class ChatBubbles {
} }
} }
const isChangingHeight = this.chat.input.messageInput.classList.contains('is-changing-height') || this.chat.container.classList.contains('is-toggling-helper');
return this.scrollable.scrollIntoViewNew( return this.scrollable.scrollIntoViewNew(
element, element,
position, position,
@ -1570,7 +1571,7 @@ export default class ChatBubbles {
forceDirection, forceDirection,
forceDuration, forceDuration,
'y', 'y',
isNewMessage ? ({rect}) => { isChangingHeight ? ({rect}) => {
// return rect.height; // return rect.height;
let height = windowSize.windowH; let height = windowSize.windowH;
@ -1586,7 +1587,7 @@ export default class ChatBubbles {
); );
} }
public scrollToBubbleEnd(bubble = this.getLastBubble(), isNewMessage?: boolean) { public scrollToBubbleEnd(bubble = this.getLastBubble()) {
/* if(DEBUG) { /* if(DEBUG) {
this.log('scrollToNewLastBubble: will scroll into view:', bubble); this.log('scrollToNewLastBubble: will scroll into view:', bubble);
} */ } */
@ -1594,7 +1595,7 @@ export default class ChatBubbles {
if(bubble) { if(bubble) {
this.scrollingToBubble = bubble; this.scrollingToBubble = bubble;
const middleware = this.getMiddleware(); const middleware = this.getMiddleware();
return this.scrollToBubble(bubble, 'end', undefined, undefined, isNewMessage).then(() => { return this.scrollToBubble(bubble, 'end', undefined, undefined).then(() => {
if(!middleware()) return; if(!middleware()) return;
this.scrollingToBubble = undefined; this.scrollingToBubble = undefined;
}); });

24
src/components/chat/input.ts

@ -787,6 +787,16 @@ export default class ChatInput {
if(!draft) { if(!draft) {
if(force) { // this situation can only happen when sending message with clearDraft if(force) { // this situation can only happen when sending message with clearDraft
/* const height = this.chatInput.getBoundingClientRect().height;
const willChangeHeight = 78 - height;
this.willChangeHeight = willChangeHeight; */
if(this.chat.container.classList.contains('is-helper-active')) {
this.t();
}
this.messageInputField.inputFake.textContent = '';
this.messageInputField.onFakeInput(false);
((this.chat.bubbles.messagesQueuePromise || Promise.resolve()) as Promise<any>).then(() => { ((this.chat.bubbles.messagesQueuePromise || Promise.resolve()) as Promise<any>).then(() => {
fastRaf(() => { fastRaf(() => {
this.onMessageSent(); this.onMessageSent();
@ -2009,9 +2019,17 @@ export default class ChatInput {
if(this.chat.container.classList.contains('is-helper-active')) { if(this.chat.container.classList.contains('is-helper-active')) {
appNavigationController.removeByType('input-helper'); appNavigationController.removeByType('input-helper');
this.chat.container.classList.remove('is-helper-active'); this.chat.container.classList.remove('is-helper-active');
this.t();
} }
} }
private t() {
const className = 'is-toggling-helper';
SetTransition(this.chat.container, className, true, 150, () => {
this.chat.container.classList.remove(className);
});
}
public setInputValue(value: string, clear = true, focus = true) { public setInputValue(value: string, clear = true, focus = true) {
if(!value) value = ''; if(!value) value = '';
@ -2055,7 +2073,11 @@ export default class ChatInput {
replyParent.insertBefore(newReply, replyParent.lastElementChild); replyParent.insertBefore(newReply, replyParent.lastElementChild);
} }
this.chat.container.classList.add('is-helper-active'); if(!this.chat.container.classList.contains('is-helper-active')) {
this.chat.container.classList.add('is-helper-active');
this.t();
}
/* const scroll = appImManager.scrollable; /* const scroll = appImManager.scrollable;
if(scroll.isScrolledDown && !scroll.scrollLocked && !appImManager.messagesQueuePromise && !appImManager.setPeerPromise) { if(scroll.isScrolledDown && !scroll.scrollLocked && !appImManager.messagesQueuePromise && !appImManager.setPeerPromise) {
scroll.scrollTo(scroll.scrollHeight, 'top', true, true, 200); scroll.scrollTo(scroll.scrollHeight, 'top', true, true, 200);

19
src/components/inputField.ts

@ -11,6 +11,7 @@ import isInputEmpty from "../helpers/dom/isInputEmpty";
import selectElementContents from "../helpers/dom/selectElementContents"; import selectElementContents from "../helpers/dom/selectElementContents";
import { i18n, LangPackKey, _i18n } from "../lib/langPack"; import { i18n, LangPackKey, _i18n } from "../lib/langPack";
import RichTextProcessor from "../lib/richtextprocessor"; import RichTextProcessor from "../lib/richtextprocessor";
import SetTransition from "./singleTransition";
let init = () => { let init = () => {
document.addEventListener('paste', (e) => { document.addEventListener('paste', (e) => {
@ -236,22 +237,34 @@ class InputField {
} }
} }
public onFakeInput() { public onFakeInput(setHeight = true) {
const {scrollHeight: newHeight/* , clientHeight */} = this.inputFake; const {scrollHeight: newHeight/* , clientHeight */} = this.inputFake;
/* if(this.wasInputFakeClientHeight && this.wasInputFakeClientHeight !== clientHeight) { /* if(this.wasInputFakeClientHeight && this.wasInputFakeClientHeight !== clientHeight) {
this.input.classList.add('no-scrollbar'); // ! в сафари может вообще не появиться скролл после анимации, так как ему нужен полный reflow блока с overflow. this.input.classList.add('no-scrollbar'); // ! в сафари может вообще не появиться скролл после анимации, так как ему нужен полный reflow блока с overflow.
this.showScrollDebounced(); this.showScrollDebounced();
} */ } */
const TRANSITION_DURATION_FACTOR = 50;
const currentHeight = +this.input.style.height.replace('px', ''); const currentHeight = +this.input.style.height.replace('px', '');
if(currentHeight === newHeight) {
return;
}
const TRANSITION_DURATION_FACTOR = 50;
const transitionDuration = Math.round( const transitionDuration = Math.round(
TRANSITION_DURATION_FACTOR * Math.log(Math.abs(newHeight - currentHeight)), TRANSITION_DURATION_FACTOR * Math.log(Math.abs(newHeight - currentHeight)),
); );
// this.wasInputFakeClientHeight = clientHeight; // this.wasInputFakeClientHeight = clientHeight;
this.input.style.transitionDuration = `${transitionDuration}ms`; this.input.style.transitionDuration = `${transitionDuration}ms`;
this.input.style.height = newHeight ? newHeight + 'px' : '';
if(setHeight) {
this.input.style.height = newHeight ? newHeight + 'px' : '';
}
const className = 'is-changing-height';
SetTransition(this.input, className, true, transitionDuration, () => {
this.input.classList.remove(className);
});
} }
get value() { get value() {

1
src/lang.ts

@ -615,6 +615,7 @@ const lang = {
"Chat.Service.Channel.RemovedPhoto": "Channel photo removed", "Chat.Service.Channel.RemovedPhoto": "Channel photo removed",
"Chat.Service.Channel.UpdatedVideo": "Channel video updated", "Chat.Service.Channel.UpdatedVideo": "Channel video updated",
"Chat.Service.BotPermissionAllowed": "You allowed this bot to message you when you logged in on %@", "Chat.Service.BotPermissionAllowed": "You allowed this bot to message you when you logged in on %@",
"Chat.Service.Group.UpdatedPinnedMessage": "%@ pinned \"%@\"",
"Chat.Service.VoiceChatFinished": "%1$@ ended the voice chat (%2$@)", "Chat.Service.VoiceChatFinished": "%1$@ ended the voice chat (%2$@)",
"Chat.Service.VoiceChatFinishedYou": "You ended the voice chat (%@)", "Chat.Service.VoiceChatFinishedYou": "You ended the voice chat (%@)",
//"Chat.Service.VoiceChatScheduled": "%1$@ scheduled a [voice chat](open) for %2$@", //"Chat.Service.VoiceChatScheduled": "%1$@ scheduled a [voice chat](open) for %2$@",

20
src/lib/appManagers/appMessagesManager.ts

@ -2976,7 +2976,25 @@ export class AppMessagesManager {
break; break;
} }
case 'messageActionPinMessage': case 'messageActionPinMessage': {
const pinnedMessage = this.getMessageByPeer(message.peerId, message.reply_to_mid);
args = [
getNameDivHTML(message.fromId, plain),
];
if(pinnedMessage.deleted || true) {
langPackKey = 'ActionPinnedNoText';
} else {
const a = document.createElement('a');
a.dataset.savedFrom = pinnedMessage.peerId + '_' + pinnedMessage.mid;
a.append(this.wrapMessageForReply(pinnedMessage, undefined, undefined, plain as any));
args.push(a);
}
break;
}
case 'messageActionContactSignUp': case 'messageActionContactSignUp':
case 'messageActionChatReturn': case 'messageActionChatReturn':
case 'messageActionChatLeave': case 'messageActionChatLeave':

2
src/lib/langPack.ts

@ -33,7 +33,7 @@ export const langPack: {[actionType: string]: LangPackKey} = {
"messageActionChatLeaveYou": "YouLeft", "messageActionChatLeaveYou": "YouLeft",
"messageActionChatDeleteUser": "ActionKickUser", "messageActionChatDeleteUser": "ActionKickUser",
"messageActionChatJoinedByLink": "ActionInviteUser", "messageActionChatJoinedByLink": "ActionInviteUser",
"messageActionPinMessage": "ActionPinnedNoText", "messageActionPinMessage": "Chat.Service.Group.UpdatedPinnedMessage",
"messageActionContactSignUp": "Chat.Service.PeerJoinedTelegram", "messageActionContactSignUp": "Chat.Service.PeerJoinedTelegram",
"messageActionChannelCreate": "ActionCreateChannel", "messageActionChannelCreate": "ActionCreateChannel",
"messageActionChannelEditTitle": "Chat.Service.Channel.UpdatedTitle", "messageActionChannelEditTitle": "Chat.Service.Channel.UpdatedTitle",

1
src/scss/partials/_chatBubble.scss

@ -1963,6 +1963,7 @@ $bubble-beside-button-width: 38px;
.peer-title { .peer-title {
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
cursor: pointer;
} }
} }

Loading…
Cancel
Save