channel views & groups online & fix message images
This commit is contained in:
Eduard Kuzmenko
parent
b9b3fe6a76
commit
52db4564b7
@ -222,9 +222,9 @@ export class LazyLoadQueue {
|
||||
}
|
||||
|
||||
export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement, message: any, justLoader = true, preloader?: ProgressivePreloader, controls = true) {
|
||||
//if(!container.firstElementChild || container.firstElementChild.tagName != 'IMG') {
|
||||
if(!container.firstElementChild || container.firstElementChild.tagName != 'IMG') {
|
||||
let size = appPhotosManager.setAttachmentSize(doc, container);
|
||||
//}
|
||||
}
|
||||
|
||||
let peerID = this.peerID ? this.peerID : this.currentMessageID;
|
||||
|
||||
@ -240,7 +240,7 @@ export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement,
|
||||
//return Promise.resolve();
|
||||
|
||||
if(!preloader) {
|
||||
preloader = new ProgressivePreloader(container, true);
|
||||
preloader = new ProgressivePreloader(container, false);
|
||||
}
|
||||
|
||||
let loadVideo = () => {
|
||||
@ -283,11 +283,14 @@ export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement,
|
||||
video.append(source);
|
||||
container.append(video);
|
||||
|
||||
//container.style.width = '';
|
||||
//container.style.height = '';
|
||||
|
||||
preloader.detach();
|
||||
});
|
||||
};
|
||||
|
||||
if(doc.type == 'gif') {
|
||||
if(doc.type == 'gif' || true) { // extra fix
|
||||
return this.peerID ? this.loadMediaQueuePush(loadVideo) : loadVideo();
|
||||
} else { // if video
|
||||
let load = () => appPhotosManager.preloadPhoto(doc).then((blob) => {
|
||||
@ -301,7 +304,10 @@ export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement,
|
||||
/* image.style.height = doc.h + 'px';
|
||||
image.style.width = doc.w + 'px'; */
|
||||
|
||||
|
||||
/* if(justLoader) { // extra fix
|
||||
justLoader = false;
|
||||
controls = false;
|
||||
} */
|
||||
|
||||
if(!justLoader) {
|
||||
return loadVideo();
|
||||
@ -555,10 +561,10 @@ export function wrapPhoto(this: AppImManager, photo: any, message: any, containe
|
||||
|
||||
preloader.detach();
|
||||
|
||||
image.style.width = '';
|
||||
image.style.height = '';
|
||||
container.style.width = '';
|
||||
container.style.height = '';
|
||||
//image.style.width = '';
|
||||
//image.style.height = '';
|
||||
//container.style.width = '';
|
||||
//container.style.height = '';
|
||||
});
|
||||
|
||||
console.log('wrapPhoto', load, container, image);
|
||||
|
||||
@ -101,7 +101,7 @@ export class AppDialogsManager {
|
||||
div.classList.remove('tgico-savedmessages');
|
||||
div.style.fontSize = '';
|
||||
|
||||
let abbrSplitted = (typeof(peerID) != 'string' ? appPeersManager.getPeerTitle(peerID) : peerID).split(' ');
|
||||
let abbrSplitted = (typeof(peerID) != 'string' ? appPeersManager.getPeerTitle(peerID, true) : peerID).split(' ');
|
||||
let abbr = (abbrSplitted.length == 2 ?
|
||||
abbrSplitted[0][0] + abbrSplitted[1][0] :
|
||||
abbrSplitted[0][0]).toUpperCase();
|
||||
@ -413,7 +413,7 @@ export class AppDialogsManager {
|
||||
//console.log('trying to load photo for:', title);
|
||||
this.loadDialogPhoto(avatarDiv, dialog.peerID, true);
|
||||
|
||||
titleSpan.innerText = title;
|
||||
titleSpan.innerHTML = title;
|
||||
//p.classList.add('')
|
||||
|
||||
let span = document.createElement('span');
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import apiManager from '../mtproto/apiManager';
|
||||
import { $rootScope, isElementInViewport, numberWithCommas, findUpClassName } from "../utils";
|
||||
import { $rootScope, isElementInViewport, numberWithCommas, findUpClassName, formatNumber } from "../utils";
|
||||
import appUsersManager from "./appUsersManager";
|
||||
import appMessagesManager from "./appMessagesManager";
|
||||
import appPeersManager from "./appPeersManager";
|
||||
@ -138,8 +138,8 @@ class ChatInput {
|
||||
if(this.lastUrl != url) return;
|
||||
console.log(webpage);
|
||||
|
||||
appImManager.replyElements.titleEl.innerText = webpage.site_name || webpage.title || '';
|
||||
appImManager.replyElements.subtitleEl.innerText = webpage.description || webpage.url || '';
|
||||
appImManager.replyElements.titleEl.innerHTML = RichTextProcessor.wrapEmojiText(webpage.site_name || webpage.title || '');
|
||||
appImManager.replyElements.subtitleEl.innerHTML = RichTextProcessor.wrapEmojiText(webpage.description || webpage.url || '');
|
||||
appImManager.replyElements.container.classList.add('active');
|
||||
appImManager.replyToMsgID = 0;
|
||||
appImManager.noWebPage = false;
|
||||
@ -195,9 +195,7 @@ class ChatInput {
|
||||
// console.log('messageInput paste', text);
|
||||
let entities = RichTextProcessor.parseEntities(text);
|
||||
|
||||
text = RichTextProcessor.wrapRichText(text, {
|
||||
entities: entities.filter(e => e._ == 'messageEntityEmoji')
|
||||
});
|
||||
text = RichTextProcessor.wrapEmojiText(text);
|
||||
|
||||
// console.log('messageInput paste after', text);
|
||||
|
||||
@ -340,6 +338,7 @@ export class AppImManager {
|
||||
|
||||
public loadMediaQueue: Array<() => Promise<void>> = [];
|
||||
private loadMediaQueuePromise: Promise<void[]> = null;
|
||||
private loadingMedia = 0;
|
||||
|
||||
public scroll: HTMLDivElement = null;
|
||||
public scrollPosition: ScrollPosition = null;
|
||||
@ -445,7 +444,7 @@ export class AppImManager {
|
||||
this.log('setting pinned message', message);
|
||||
this.pinnedMessageContainer.setAttribute('data-mid', mid);
|
||||
this.pinnedMessageContainer.style.display = '';
|
||||
this.pinnedMessageContent.innerHTML = RichTextProcessor.wrapPlainText(message.message);
|
||||
this.pinnedMessageContent.innerHTML = RichTextProcessor.wrapEmojiText(message.message);
|
||||
}
|
||||
});
|
||||
|
||||
@ -482,7 +481,9 @@ export class AppImManager {
|
||||
bubble = findUpClassName(e.target, 'bubble');
|
||||
} catch(err) {}
|
||||
|
||||
if(target.tagName == 'VIDEO' && bubble && bubble.classList.contains('round')) {
|
||||
if(!bubble) return;
|
||||
|
||||
if(target.tagName == 'VIDEO' && bubble.classList.contains('round')) {
|
||||
let video = target as HTMLVideoElement;
|
||||
video.currentTime = 0;
|
||||
if(video.paused) {
|
||||
@ -506,13 +507,17 @@ export class AppImManager {
|
||||
|
||||
appMediaViewer.openMedia(message, true);
|
||||
} else if(target.tagName == 'DIV') {
|
||||
if(bubble) {
|
||||
if(bubble.classList.contains('is-reply')/* || bubble.classList.contains('forwarded') */) {
|
||||
let isReplyClick = false;
|
||||
|
||||
try {
|
||||
isReplyClick = !!findUpClassName(e.target, 'box');
|
||||
} catch(err) {}
|
||||
|
||||
if(isReplyClick && bubble.classList.contains('is-reply')/* || bubble.classList.contains('forwarded') */) {
|
||||
let originalMessageID = +bubble.getAttribute('data-original-mid');
|
||||
this.setPeer(this.peerID, originalMessageID);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//console.log('chatInner click', e);
|
||||
});
|
||||
@ -614,7 +619,7 @@ export class AppImManager {
|
||||
|
||||
if(this.peerID > 0) {
|
||||
let title = appPeersManager.getPeerTitle(this.peerID);
|
||||
this.popupDeleteMessage.deleteBothBtn.innerText = 'DELETE FOR ME AND ' + title.split(' ')[0];
|
||||
this.popupDeleteMessage.deleteBothBtn.innerHTML = 'DELETE FOR ME AND ' + title;
|
||||
} else {
|
||||
this.popupDeleteMessage.deleteBothBtn.innerText = 'DELETE FOR ALL';
|
||||
}
|
||||
@ -625,9 +630,9 @@ export class AppImManager {
|
||||
|
||||
this.contextMenu.querySelector('.menu-reply').addEventListener('click', () => {
|
||||
let message = appMessagesManager.getMessage(this.contextMenuMsgID);
|
||||
let title = appPeersManager.getPeerTitle(message.fromID).split(' ')[0];
|
||||
this.replyElements.titleEl.innerText = title;
|
||||
this.replyElements.subtitleEl.innerText = message.message || '';
|
||||
let title = appPeersManager.getPeerTitle(message.fromID);
|
||||
this.replyElements.titleEl.innerHTML = title;
|
||||
this.replyElements.subtitleEl.innerHTML = message.message ? RichTextProcessor.wrapEmojiText(message.message) : '';
|
||||
this.replyElements.container.classList.add('active');
|
||||
this.replyToMsgID = this.contextMenuMsgID;
|
||||
});
|
||||
@ -701,7 +706,7 @@ export class AppImManager {
|
||||
this.loadMediaQueueProcess();
|
||||
}
|
||||
|
||||
public async loadMediaQueueProcess(): Promise<void[]> {
|
||||
public async loadMediaQueueProcessOld(): Promise<void[]> {
|
||||
if(this.loadMediaQueuePromise /* || 1 == 1 */) return this.loadMediaQueuePromise;
|
||||
|
||||
let woo = this.loadMediaQueue.splice(-5, 5).reverse().map(f => f());
|
||||
@ -709,6 +714,16 @@ export class AppImManager {
|
||||
if(woo.length) {
|
||||
this.log('Will load more media:', woo.length);
|
||||
|
||||
woo.forEach(async(promise) => {
|
||||
try {
|
||||
await promise;
|
||||
} catch(err) {
|
||||
this.log.error('loadMediaQueue error:', err);
|
||||
}
|
||||
|
||||
this.loadingMedia--;
|
||||
});
|
||||
|
||||
try {
|
||||
this.loadMediaQueuePromise = Promise.all(woo);
|
||||
await this.loadMediaQueuePromise;
|
||||
@ -723,6 +738,26 @@ export class AppImManager {
|
||||
return this.loadMediaQueuePromise;
|
||||
}
|
||||
|
||||
public async loadMediaQueueProcess(): Promise<void[]> {
|
||||
if(this.loadingMedia >= 5) return;
|
||||
|
||||
let item = this.loadMediaQueue.pop();
|
||||
if(item) {
|
||||
this.loadingMedia++;
|
||||
|
||||
let promise = item();
|
||||
try {
|
||||
await promise;
|
||||
} catch(err) {
|
||||
this.log.error('loadMediaQueue error:', err);
|
||||
}
|
||||
|
||||
this.loadingMedia--;
|
||||
}
|
||||
|
||||
if(this.loadMediaQueue.length) return this.loadMediaQueueProcess();
|
||||
}
|
||||
|
||||
public updateStatus() {
|
||||
if(!this.myID) return Promise.resolve();
|
||||
|
||||
@ -771,7 +806,7 @@ export class AppImManager {
|
||||
}
|
||||
|
||||
// load more history
|
||||
if(!this.getHistoryPromise && !this.getHistoryTimeout /* && false */) {
|
||||
if(!this.getHistoryPromise && !this.getHistoryTimeout && !testScroll) {
|
||||
this.getHistoryTimeout = setTimeout(() => { // must be
|
||||
let history = Object.keys(this.bubbles).map(id => +id).sort();
|
||||
|
||||
@ -853,18 +888,32 @@ export class AppImManager {
|
||||
let isChannel = appPeersManager.isChannel(this.peerID) && !appPeersManager.isMegagroup(this.peerID);
|
||||
|
||||
this.log('setPeerStatus', chat);
|
||||
// will redirect if wrong
|
||||
appProfileManager.getChatFull(chat.id).then((res: any) => {
|
||||
this.log('chatInfo res:', res);
|
||||
|
||||
if(res.pinned_msg_id) { // request pinned message
|
||||
this.pinnedMsgID = res.pinned_msg_id;
|
||||
appMessagesManager.wrapSingleMessage(res.pinned_msg_id);
|
||||
Promise.all([
|
||||
appPeersManager.isMegagroup(this.peerID) ? apiManager.invokeApi('messages.getOnlines', {
|
||||
peer: appPeersManager.getInputPeerByID(this.peerID)
|
||||
}) as Promise<any> : Promise.resolve(),
|
||||
// will redirect if wrong
|
||||
appProfileManager.getChatFull(chat.id)
|
||||
]).then(results => {
|
||||
let [chatOnlines, chatInfo] = results;
|
||||
|
||||
let onlines = chatOnlines ? chatOnlines.onlines : 1;
|
||||
|
||||
this.log('chatInfo res:', chatInfo);
|
||||
|
||||
if(chatInfo.pinned_msg_id) { // request pinned message
|
||||
this.pinnedMsgID = chatInfo.pinned_msg_id;
|
||||
appMessagesManager.wrapSingleMessage(chatInfo.pinned_msg_id);
|
||||
}
|
||||
|
||||
let participants_count = res.participants_count || res.participants.participants.length;
|
||||
let participants_count = chatInfo.participants_count || chatInfo.participants.participants.length;
|
||||
let subtitle = numberWithCommas(participants_count) + ' ' + (isChannel ? 'subscribers' : 'members');
|
||||
|
||||
if(onlines > 1) {
|
||||
subtitle += ', ' + numberWithCommas(onlines) + ' online';
|
||||
}
|
||||
|
||||
this.subtitleEl.innerText = appSidebarRight.profileElements.subtitle.innerText = subtitle;
|
||||
});
|
||||
} else if(!appUsersManager.isBot(this.peerID)) { // user
|
||||
@ -1012,7 +1061,7 @@ export class AppImManager {
|
||||
|
||||
this.setPeerStatus();
|
||||
|
||||
this.titleEl.innerText = appSidebarRight.profileElements.name.innerText = dom.titleSpan.innerText;
|
||||
this.titleEl.innerHTML = appSidebarRight.profileElements.name.innerHTML = dom.titleSpan.innerHTML;
|
||||
|
||||
this.topbar.style.display = '';
|
||||
appSidebarRight.toggleSidebar(true);
|
||||
@ -1028,6 +1077,8 @@ export class AppImManager {
|
||||
|
||||
if(lastMsgID != dialog.top_message) {
|
||||
this.bubbles[lastMsgID].scrollIntoView();
|
||||
} else {
|
||||
this.scroll.scrollTop = this.scroll.scrollHeight;
|
||||
}
|
||||
} else if(dialog.top_message) { // add last message, bc in getHistory will load < max_id
|
||||
this.renderMessage(appMessagesManager.getMessage(dialog.top_message));
|
||||
@ -1127,24 +1178,29 @@ export class AppImManager {
|
||||
|
||||
//messageDiv.innerText = message.message;
|
||||
|
||||
// bubble
|
||||
let bubble = document.createElement('div');
|
||||
bubble.classList.add('bubble');
|
||||
|
||||
this.bubbles[+message.mid] = bubble;
|
||||
|
||||
// time section
|
||||
|
||||
let date = new Date(message.date * 1000);
|
||||
let time = ('0' + date.getHours()).slice(-2) +
|
||||
':' + ('0' + date.getMinutes()).slice(-2);
|
||||
|
||||
if(message.views) {
|
||||
bubble.classList.add('channel-post');
|
||||
time = formatNumber(message.views, 1) + ' <i class="tgico-channelviews"></i> ' + time;
|
||||
}
|
||||
|
||||
let timeSpan = document.createElement('span');
|
||||
timeSpan.classList.add('time');
|
||||
|
||||
let timeInner = document.createElement('div');
|
||||
timeInner.classList.add('inner', 'tgico');
|
||||
timeInner.innerText = time;
|
||||
|
||||
// bubble
|
||||
let bubble = document.createElement('div');
|
||||
bubble.classList.add('bubble');
|
||||
|
||||
this.bubbles[+message.mid] = bubble;
|
||||
timeInner.innerHTML = time;
|
||||
|
||||
let richText = RichTextProcessor.wrapRichText(message.message, {
|
||||
entities: message.totalEntities
|
||||
@ -1182,6 +1238,7 @@ export class AppImManager {
|
||||
timeSpan.appendChild(timeInner);
|
||||
messageDiv.append(timeSpan);
|
||||
bubble.prepend(messageDiv);
|
||||
//bubble.prepend(timeSpan, messageDiv); // that's bad
|
||||
|
||||
if(our) {
|
||||
if(message.pFlags.unread) this.unreadOut.push(message.mid);
|
||||
@ -1287,8 +1344,10 @@ export class AppImManager {
|
||||
doc = webpage.document;
|
||||
|
||||
if(doc.type == 'gif' || doc.type == 'video') {
|
||||
//if(doc.size <= 20e6) {
|
||||
bubble.classList.add('video');
|
||||
wrapVideo.call(this, doc, preview, message);
|
||||
//}
|
||||
} else {
|
||||
doc = null;
|
||||
}
|
||||
@ -1307,7 +1366,7 @@ export class AppImManager {
|
||||
|
||||
nameEl.setAttribute('target', '_blank');
|
||||
nameEl.href = webpage.url || '#';
|
||||
nameEl.innerText = webpage.site_name || '';
|
||||
nameEl.innerHTML = webpage.site_name ? RichTextProcessor.wrapEmojiText(webpage.site_name) : '';
|
||||
|
||||
if(webpage.description) {
|
||||
textDiv.innerHTML = RichTextProcessor.wrapRichText(webpage.description);
|
||||
@ -1318,7 +1377,8 @@ export class AppImManager {
|
||||
quote.append(nameEl, titleDiv, textDiv);
|
||||
box.append(quote);
|
||||
|
||||
bubble.prepend(box);
|
||||
//bubble.prepend(box);
|
||||
bubble.prepend(timeSpan, box);
|
||||
|
||||
//this.log('night running', bubble.scrollHeight);
|
||||
|
||||
@ -1361,7 +1421,7 @@ export class AppImManager {
|
||||
this.loadMediaQueuePush(load);
|
||||
|
||||
break;
|
||||
} else if(doc.mime_type == 'video/mp4') {
|
||||
} else if(doc.mime_type == 'video/mp4' && doc.size <= 20e6) {
|
||||
this.log('never get free 2', doc);
|
||||
|
||||
if(doc.type == 'round') {
|
||||
@ -1414,7 +1474,7 @@ export class AppImManager {
|
||||
if(!bubble.classList.contains('sticker')) {
|
||||
let nameDiv = document.createElement('div');
|
||||
nameDiv.classList.add('name');
|
||||
nameDiv.innerText = 'Forwarded from ' + title;
|
||||
nameDiv.innerHTML = 'Forwarded from ' + title;
|
||||
bubble.append(nameDiv);
|
||||
}
|
||||
} else {
|
||||
@ -1455,7 +1515,7 @@ export class AppImManager {
|
||||
}
|
||||
}
|
||||
|
||||
nameEl.innerText = originalPeerTitle;
|
||||
nameEl.innerHTML = originalPeerTitle;
|
||||
textDiv.innerHTML = originalText;
|
||||
|
||||
quote.append(nameEl, textDiv);
|
||||
@ -1484,7 +1544,7 @@ export class AppImManager {
|
||||
if(!bubble.classList.contains('sticker') && (peerID < 0 && peerID != message.fromID)) {
|
||||
let nameDiv = document.createElement('div');
|
||||
nameDiv.classList.add('name');
|
||||
nameDiv.innerText = title;
|
||||
nameDiv.innerHTML = title;
|
||||
bubble.append(nameDiv);
|
||||
} else if(!message.reply_to_mid) {
|
||||
bubble.classList.add('hide-name');
|
||||
@ -1615,6 +1675,12 @@ export class AppImManager {
|
||||
20 :
|
||||
(this.chatInner.parentElement.parentElement.scrollHeight) / 30 * 1.25 | 0;
|
||||
|
||||
if(testScroll) {
|
||||
loadCount = 1;
|
||||
//if(Object.keys(this.bubbles).length > 0)
|
||||
return Promise.resolve(true);
|
||||
}
|
||||
|
||||
console.time('render getHistory');
|
||||
console.time('render history total');
|
||||
|
||||
|
||||
@ -133,7 +133,7 @@ export class AppMediaViewer {
|
||||
|
||||
public openMedia(message: any, reverse = false) {
|
||||
this.log('openMedia doc:', message);
|
||||
let media = message.media.photo || message.media.document || message.media.webpage.photo || message.media.webpage.document;
|
||||
let media = message.media.photo || message.media.document || message.media.webpage.document || message.media.webpage.photo;
|
||||
|
||||
let isVideo = media.mime_type == 'video/mp4';
|
||||
|
||||
@ -153,7 +153,7 @@ export class AppMediaViewer {
|
||||
this.author.date.innerText = dateStr;
|
||||
|
||||
let name = appPeersManager.getPeerTitle(message.fromID);
|
||||
this.author.nameEl.innerText = name;
|
||||
this.author.nameEl.innerHTML = name;
|
||||
|
||||
if(message.message) {
|
||||
this.content.caption.innerHTML = RichTextProcessor.wrapRichText(message.message, {
|
||||
@ -175,8 +175,16 @@ export class AppMediaViewer {
|
||||
|
||||
this.log('will wrap video');
|
||||
|
||||
appPhotosManager.setAttachmentSize(media, container, appPhotosManager.windowW, appPhotosManager.windowH);
|
||||
wrapVideo.call(this, media, container, message, false, this.preloader).then(() => {
|
||||
if(this.currentMessageID != message.mid) {
|
||||
this.log.warn('media viewer changed video');
|
||||
return;
|
||||
}
|
||||
|
||||
container.classList.remove('loading');
|
||||
container.style.width = '';
|
||||
container.style.height = '';
|
||||
});
|
||||
} else {
|
||||
let size = appPhotosManager.setAttachmentSize(media.id, container, appPhotosManager.windowW, appPhotosManager.windowH);
|
||||
@ -206,6 +214,8 @@ export class AppMediaViewer {
|
||||
container.style.height = '';
|
||||
|
||||
this.preloader.detach();
|
||||
}).catch(err => {
|
||||
this.log.error(err);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import appUsersManager from "./appUsersManager";
|
||||
import appChatsManager from "./appChatsManager";
|
||||
import { isObject } from "../utils";
|
||||
import { RichTextProcessor } from "../richtextprocessor";
|
||||
|
||||
const AppPeersManager = {
|
||||
getPeerPhoto: (peerID: number) => {
|
||||
@ -20,7 +21,7 @@ const AppPeersManager = {
|
||||
return false;
|
||||
},
|
||||
|
||||
getPeerTitle: (peerID: number | any) => {
|
||||
getPeerTitle: (peerID: number | any, plainText = false) => {
|
||||
let peer: any = {};
|
||||
if(!isObject(peerID)) {
|
||||
peer = AppPeersManager.getPeer(peerID);
|
||||
@ -37,7 +38,7 @@ const AppPeersManager = {
|
||||
title = peer.title;
|
||||
}
|
||||
|
||||
return title;
|
||||
return plainText ? title : RichTextProcessor.wrapEmojiText(title);
|
||||
},
|
||||
|
||||
getOutputPeer: (peerID: number) => {
|
||||
|
||||
@ -159,7 +159,7 @@ export class AppPhotosManager {
|
||||
}
|
||||
}
|
||||
|
||||
public setAttachmentSize(photoID: any, div: HTMLDivElement, w = 380, h = 380, isSticker = false) {
|
||||
public setAttachmentSize(photoID: any, div: HTMLDivElement, boxWidth = 380, boxHeight = 380, isSticker = false) {
|
||||
let photo: /* MTDocument | MTPhoto */any = null;
|
||||
|
||||
if(typeof(photoID) === 'string') {
|
||||
@ -169,7 +169,7 @@ export class AppPhotosManager {
|
||||
photo = photoID;
|
||||
}
|
||||
|
||||
let photoSize = this.choosePhotoSize(photo, w, h);
|
||||
let photoSize = this.choosePhotoSize(photo, boxWidth, boxHeight);
|
||||
//console.log('setAttachmentSize', photo, photo.sizes[0].bytes, div);
|
||||
|
||||
let sizes = photo.sizes || photo.thumbs;
|
||||
@ -177,16 +177,14 @@ export class AppPhotosManager {
|
||||
this.setAttachmentPreview(sizes[0].bytes, div, isSticker);
|
||||
}
|
||||
|
||||
if(photo._ == 'document' /* && photo.type != 'video' */ && photo.type != 'gif') {
|
||||
div.style.width = (photo.w || 512) + 'px';
|
||||
div.style.height = (photo.h || 512) + 'px';
|
||||
|
||||
/* if(div.lastElementChild) {
|
||||
div.lastElementChild.width
|
||||
} */
|
||||
if(photo._ == 'document' /* && photo.type != 'video' *//* && photo.type != 'gif' */) {
|
||||
let {w, h} = calcImageInBox(photo.w || 512, photo.h || 512, boxWidth, boxHeight);
|
||||
div.style.width = w + 'px';
|
||||
div.style.height = h + 'px';
|
||||
} else {
|
||||
div.style.width = (photoSize.w || 100) + 'px';
|
||||
div.style.height = (photoSize.h || 100) + 'px';
|
||||
let {w, h} = calcImageInBox(photoSize.w || 100, photoSize.h || 100, boxWidth, boxHeight);
|
||||
div.style.width = w + 'px';
|
||||
div.style.height = h + 'px';
|
||||
}
|
||||
|
||||
return photoSize;
|
||||
|
||||
@ -718,6 +718,12 @@ function wrapPlainText(text, options = {}) {
|
||||
text.push(raw);
|
||||
return text.join('');
|
||||
}
|
||||
function wrapEmojiText(text) {
|
||||
if(!text) return '';
|
||||
|
||||
let entities = parseEntities(text).filter(e => e._ == 'messageEntityEmoji');
|
||||
return wrapRichText(text, {entities});
|
||||
}
|
||||
function wrapUrl (url, unsafe) {
|
||||
if (!url.match(/^https?:\/\//i)) {
|
||||
url = 'http://' + url
|
||||
@ -773,6 +779,7 @@ let RichTextProcessor = {
|
||||
wrapPlainText: wrapPlainText,
|
||||
wrapDraftText: wrapDraftText,
|
||||
wrapUrl: wrapUrl,
|
||||
wrapEmojiText: wrapEmojiText,
|
||||
parseEntities: parseEntities,
|
||||
parseMarkdown: parseMarkdown,
|
||||
parseEmojis: parseEmojis,
|
||||
|
||||
@ -472,6 +472,18 @@ export function formatBytes(bytes, decimals = 2) {
|
||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
|
||||
}
|
||||
|
||||
export function formatNumber(bytes, decimals = 2) {
|
||||
if(bytes === 0) return '0';
|
||||
|
||||
const k = 1000;
|
||||
const dm = decimals < 0 ? 0 : decimals;
|
||||
const sizes = ['', 'K', 'M', 'B', 'T'];
|
||||
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
|
||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + sizes[i];
|
||||
}
|
||||
|
||||
export function deepEqual(x, y) {
|
||||
const ok = Object.keys, tx = typeof x, ty = typeof y;
|
||||
return x && y && tx === 'object' && tx === ty ? (
|
||||
|
||||
@ -13,6 +13,10 @@
|
||||
|
||||
#im-title {
|
||||
cursor: pointer;
|
||||
|
||||
span.emoji {
|
||||
vertical-align: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
/* .chat-background, #chat-closed {
|
||||
@ -196,6 +200,8 @@
|
||||
.attachment {
|
||||
padding-top: .5rem;
|
||||
padding-bottom: 1.5rem;
|
||||
max-width: fit-content!important;
|
||||
max-height: fit-content!important;
|
||||
|
||||
span.emoji {
|
||||
height: auto;
|
||||
@ -300,21 +306,23 @@
|
||||
}
|
||||
|
||||
img, video {
|
||||
object-fit: contain;
|
||||
/* object-fit: cover; */
|
||||
/* object-fit: contain; */
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&.video {
|
||||
.attachment {
|
||||
//&.video {
|
||||
//.attachment {
|
||||
//max-height: fit-content;
|
||||
|
||||
img {
|
||||
/* width: 100%; */
|
||||
/* height: 100%; */
|
||||
}
|
||||
}
|
||||
}
|
||||
/*img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}*/
|
||||
//}
|
||||
//}
|
||||
|
||||
&.round.video {
|
||||
.attachment {
|
||||
@ -454,6 +462,13 @@
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
font-size: .75rem;
|
||||
display: flex;
|
||||
|
||||
i {
|
||||
font-size: 1.15rem;
|
||||
margin-right: .4rem;
|
||||
margin-left: .1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -562,6 +577,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.bubble.channel-post .time {
|
||||
width: 5rem;
|
||||
}
|
||||
|
||||
.bubble {
|
||||
background-color: #ffffff;
|
||||
border-radius: 6px 12px 12px 6px;
|
||||
@ -693,6 +712,47 @@
|
||||
flex: 0 0 auto; /* Forces side columns to stay same width */
|
||||
position: relative;
|
||||
|
||||
#input-message {
|
||||
background: none;
|
||||
border: none;
|
||||
width: 100%;
|
||||
padding: .5rem .5rem;
|
||||
font-size: .95rem;
|
||||
/* height: 100%; */
|
||||
max-height: 30rem;
|
||||
overflow-y: none;
|
||||
resize: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
[contenteditable=true]:empty:before {
|
||||
content: attr(data-placeholder);
|
||||
color: #9e9e9e;
|
||||
display: block; /* For Firefox By Ariel Flesler */
|
||||
}
|
||||
|
||||
.btn-circle {
|
||||
flex: 0 0 auto;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
height: 3.25rem;
|
||||
width: 3.25rem;
|
||||
color: #9e9e9e;
|
||||
background-color: #fff;
|
||||
align-self: flex-end;
|
||||
|
||||
&.tgico-send {
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
|
||||
.os-scrollbar-handle {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
.input-message {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -788,47 +848,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
#input-message {
|
||||
background: none;
|
||||
border: none;
|
||||
width: 100%;
|
||||
padding: .5rem .5rem;
|
||||
font-size: .95rem;
|
||||
/* height: 100%; */
|
||||
max-height: 30rem;
|
||||
overflow-y: none;
|
||||
resize: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
[contenteditable=true]:empty:before {
|
||||
content: attr(data-placeholder);
|
||||
color: #9e9e9e;
|
||||
display: block; /* For Firefox By Ariel Flesler */
|
||||
}
|
||||
|
||||
.btn-circle {
|
||||
flex: 0 0 auto;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
height: 3.25rem;
|
||||
width: 3.25rem;
|
||||
color: #9e9e9e;
|
||||
background-color: #fff;
|
||||
align-self: flex-end;
|
||||
|
||||
&.tgico-send {
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
|
||||
.os-scrollbar-handle {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
.pinned-message, .reply {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
@ -876,6 +895,13 @@
|
||||
white-space: nowrap;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
.emoji {
|
||||
font-size: 16px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
|
||||
/* #chat-closed {
|
||||
|
||||
@ -132,6 +132,12 @@
|
||||
|
||||
.user-title {
|
||||
max-width: 80%;
|
||||
|
||||
.emoji {
|
||||
vertical-align: top;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.user-last-message {
|
||||
|
||||
@ -36,6 +36,11 @@
|
||||
font-size: 23px;
|
||||
font-weight: 500;
|
||||
margin: 3px 0;
|
||||
|
||||
span.emoji {
|
||||
vertical-align: inherit;
|
||||
min-width: min-content;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-subtitle {
|
||||
|
||||
@ -925,8 +925,10 @@ $width: 100px;
|
||||
|
||||
.emoji {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* width: 100%;
|
||||
height: 100%; */
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
vertical-align: middle;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user