diff --git a/src/components/wrappers.ts b/src/components/wrappers.ts index 492dfecc..98ff3c51 100644 --- a/src/components/wrappers.ts +++ b/src/components/wrappers.ts @@ -156,7 +156,7 @@ export function wrapVideo(this: any, doc: MTDocument, container: HTMLDivElement, } } -export function wrapDocument(doc: MTDocument, withTime = false): HTMLDivElement { +export function wrapDocument(doc: MTDocument, withTime = false, uploading = false): HTMLDivElement { if(doc.type == 'voice') { return wrapAudio(doc, withTime); } @@ -190,49 +190,44 @@ export function wrapDocument(doc: MTDocument, withTime = false): HTMLDivElement docDiv.innerHTML = `
${ext2}
-
+ ${!uploading ? `
` : ''}
${fileName}
${size}
`; - - let downloadDiv = docDiv.querySelector('.document-download') as HTMLDivElement; - let preloader: ProgressivePreloader; - let promise: CancellablePromise; - - docDiv.addEventListener('click', () => { - if(!promise) { - if(downloadDiv.classList.contains('downloading')) { - return; // means not ready yet - } - - if(!preloader) { - preloader = new ProgressivePreloader(null, true); - } - - appDocsManager.saveDocFile(doc.id).then(res => { - promise = res.promise; + + if(!uploading) { + let downloadDiv = docDiv.querySelector('.document-download') as HTMLDivElement; + let preloader: ProgressivePreloader; + let promise: CancellablePromise; + + docDiv.addEventListener('click', () => { + if(!promise) { + if(downloadDiv.classList.contains('downloading')) { + return; // means not ready yet + } - preloader.attach(downloadDiv, true, promise); + if(!preloader) { + preloader = new ProgressivePreloader(null, true); + } - promise.then(() => { - downloadDiv.classList.remove('downloading'); - downloadDiv.remove(); - }); - }) - - downloadDiv.classList.add('downloading'); - } else { - downloadDiv.classList.remove('downloading'); - promise = null; - } - }); - - /* apiFileManager.getDownloadedFile(Object.assign({}, doc, {_: 'inputDocumentFileLocation'})).then(() => { - downloadDiv.classList.remove('downloading'); - downloadDiv.remove(); - }, () => { - - }); */ + appDocsManager.saveDocFile(doc.id).then(res => { + promise = res.promise; + + preloader.attach(downloadDiv, true, promise); + + promise.then(() => { + downloadDiv.classList.remove('downloading'); + downloadDiv.remove(); + }); + }) + + downloadDiv.classList.add('downloading'); + } else { + downloadDiv.classList.remove('downloading'); + promise = null; + } + }); + } return docDiv; } diff --git a/src/lib/appManagers/appImManager.ts b/src/lib/appManagers/appImManager.ts index 469666d5..2a0de820 100644 --- a/src/lib/appManagers/appImManager.ts +++ b/src/lib/appManagers/appImManager.ts @@ -281,6 +281,12 @@ class ChatInput { this.attachMediaPopUp.mediaContainer.style.height = ''; this.attachMediaPopUp.mediaContainer.classList.remove('is-document'); + if(file.type.indexOf('video/') === 0) { + willAttach = 'document'; + } else if(file.type.indexOf('image/') === -1 && willAttach == 'media') { + willAttach = 'document'; + } + switch(willAttach) { case 'media': { let img = new Image(); @@ -311,7 +317,7 @@ class ChatInput { 'image/gif', 'image/webp', 'image/bmp'].indexOf(file.type) !== -1 ? 'photo' : 'doc' - } as any, false); + } as any, false, true); this.attachMediaPopUp.titleEl.innerText = 'Send File'; @@ -382,6 +388,11 @@ class ChatInput { height: willAttachHeight }); appImManager.scroll.scrollTop = appImManager.scroll.scrollHeight; + + let dialog = appMessagesManager.getDialogByPeerID(appImManager.peerID)[0]; + if(dialog && dialog.top_message) { + appMessagesManager.readHistory(appImManager.peerID, dialog.top_message); // lol + } }); this.btnSend.addEventListener('click', () => { @@ -478,6 +489,11 @@ class ChatInput { appImManager.scroll.scrollTop = appImManager.scroll.scrollHeight; } + + let dialog = appMessagesManager.getDialogByPeerID(appImManager.peerID)[0]; + if(dialog && dialog.top_message) { + appMessagesManager.readHistory(appImManager.peerID, dialog.top_message); // lol + } this.editMsgID = 0; this.replyToMsgID = 0; @@ -646,7 +662,10 @@ export class AppImManager { } = e.detail; this.deleteMessagesByIDs(Object.keys(detail.msgs).map(s => +s)); - this.deleteEmptySideDivs(); + + setTimeout(() => { + this.deleteEmptySideDivs(); + }, 0); }); // Calls when message successfully sent and we have an ID @@ -1780,7 +1799,7 @@ export class AppImManager { case 'audio': case 'document': { - let docDiv = wrapDocument(pending); + let docDiv = wrapDocument(pending, false, true); let icoDiv = docDiv.querySelector('.document-ico'); preloader.attach(icoDiv, false); diff --git a/src/lib/appManagers/appMediaViewer.ts b/src/lib/appManagers/appMediaViewer.ts index fb146905..6050bc64 100644 --- a/src/lib/appManagers/appMediaViewer.ts +++ b/src/lib/appManagers/appMediaViewer.ts @@ -6,6 +6,8 @@ import { RichTextProcessor } from "../richtextprocessor"; import { logger } from "../polyfill"; import ProgressivePreloader from "../../components/preloader"; import { wrapVideo } from "../../components/wrappers"; +import { findUpClassName } from "../utils"; +import appDocsManager from "./appDocsManager"; export class AppMediaViewer { private overlaysDiv = document.querySelector('.overlays') as HTMLDivElement; @@ -81,13 +83,33 @@ export class AppMediaViewer { this.buttons.download.addEventListener('click', () => { let message = appMessagesManager.getMessage(this.currentMessageID); - appPhotosManager.downloadPhoto(message.media.photo.id); + if(message.media.photo) { + appPhotosManager.downloadPhoto(message.media.photo.id); + } else { + let document: any = null; + + if(message.media.webpage) document = message.media.webpage.document; + else document = message.media.document; + + if(document) { + console.log('will save document:', document); + appDocsManager.saveDocFile(document.id); + } + } }); this.onClickBinded = (e: MouseEvent) => { let target = e.target as HTMLElement; - if(target == this.mediaViewerDiv || target.tagName == 'IMG') { + let mover: HTMLDivElement = null; + ['media-viewer-mover', 'media-viewer-buttons', 'media-viewer-author'].find(s => { + try { + mover = findUpClassName(target, s); + if(mover) return true; + } catch(err) {return false;} + }); + + if(/* target == this.mediaViewerDiv */!mover || target.tagName == 'IMG') { this.buttons.close.click(); } }; diff --git a/src/lib/appManagers/appMessagesManager.ts b/src/lib/appManagers/appMessagesManager.ts index 4f3409c1..99a460fb 100644 --- a/src/lib/appManagers/appMessagesManager.ts +++ b/src/lib/appManagers/appMessagesManager.ts @@ -501,7 +501,9 @@ export class AppMessagesManager { apiFileName = 'audio.' + (fileType.split('/')[1] == 'ogg' ? 'ogg' : 'mp3'); actionName = 'sendMessageUploadAudioAction'; } else if(fileType.substr(0, 6) == 'video/') { - attachType = 'video'; + //attachType = 'video'; + //apiFileName = 'video.mp4'; + attachType = 'document'; // last minute fix apiFileName = 'video.mp4'; actionName = 'sendMessageUploadVideoAction'; } else { diff --git a/src/scss/partials/_chat.scss b/src/scss/partials/_chat.scss index d7b6dea3..fedd77fa 100644 --- a/src/scss/partials/_chat.scss +++ b/src/scss/partials/_chat.scss @@ -256,6 +256,7 @@ .reply-content { height: auto; + min-height: 32px; } } @@ -508,7 +509,7 @@ width: 100%; } - .text, .reply-subtitle { + .text/* , .reply-subtitle */ { line-height: 1.2; } @@ -519,6 +520,7 @@ } .reply { + max-width: 300px; margin-bottom: 6px; margin-top: 0; cursor: pointer; @@ -1132,6 +1134,7 @@ height: 32px; display: flex; flex-direction: column; + justify-content: space-between; } &-title { @@ -1140,7 +1143,8 @@ &-title, &-subtitle { font-size: 14px; - line-height: 18px; + //line-height: 18px; + line-height: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; diff --git a/src/scss/partials/_sidebar.scss b/src/scss/partials/_sidebar.scss index 49e8021c..dda0d2fc 100644 --- a/src/scss/partials/_sidebar.scss +++ b/src/scss/partials/_sidebar.scss @@ -162,13 +162,18 @@ } #content-docs { - padding: 3px 15px; + padding: 7px 20px; .document { - padding-left: 5rem; + padding-left: 4rem; padding-right: 1rem; //height: 54px; - height: calc(54px + 1.5rem); + height: calc(50px + 1.5rem); + + &-ico, &-download { + width: 48px; + height: 48px; + } /* & + .document { margin-top: 1.5rem; @@ -191,8 +196,10 @@ > div { display: flex; flex-direction: column; - margin-top: 15px; - padding-bottom: 10px; + margin-top: 20px; + margin-left: 5px; + padding-bottom: 2px; + //padding-bottom: 10px; position: relative; padding-left: 60px; overflow: hidden; @@ -202,7 +209,7 @@ .preview { height: 48px; width: 48px; - border-radius: $border-radius; + border-radius: 5px; overflow: hidden; position: absolute; left: 0; @@ -228,6 +235,16 @@ overflow: hidden; } } + + .title { + font-size: 16px; + margin-top: 3px; + } + + .subtitle { + font-size: 14px; + max-width: 300px; + } } #content-audio { diff --git a/src/scss/style.scss b/src/scss/style.scss index e85e72c5..3ca88f37 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -1382,6 +1382,7 @@ div.scrollable::-webkit-scrollbar-thumb { &.active { position: relative; color: $blue; + font-size: 16px; &:after { content: '';