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

Send stickers, gifs, polls, media, document rights

master
morethanwords 4 years ago
parent
4e3964ec8b
commit
37a1eaa37d
13 changed files with 274 additions and 132 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 97
      src/components/chat/input.ts
  2. 69
      src/components/emoticonsDropdown/index.ts
  3. 12
      src/components/emoticonsDropdown/tabs/emoji.ts
  4. 40
      src/components/emoticonsDropdown/tabs/stickers.ts
  5. 2
      src/components/horizontalMenu.ts
  6. 4
      src/components/popupCreatePoll.ts
  7. 52
      src/index.hbs
  8. 14
      src/lib/appManagers/appChatsManager.ts
  9. 4
      src/lib/rootScope.ts
  10. 2
      src/scss/partials/_chat.scss
  11. 26
      src/scss/partials/_emojiDropdown.scss
  12. 75
      src/scss/partials/_slider.scss
  13. 7
      src/scss/style.scss

97
src/components/chat/input.ts
Unescape View File

@ -1,5 +1,6 @@
import Recorder from '../../../public/recorder.min'; import Recorder from '../../../public/recorder.min';
import { isTouchSupported } from "../../helpers/touchSupport"; import { isTouchSupported } from "../../helpers/touchSupport";
import appChatsManager from '../../lib/appManagers/appChatsManager';
import appDocsManager from "../../lib/appManagers/appDocsManager"; import appDocsManager from "../../lib/appManagers/appDocsManager";
import appImManager from "../../lib/appManagers/appImManager"; import appImManager from "../../lib/appManagers/appImManager";
import appMessagesManager from "../../lib/appManagers/appMessagesManager"; import appMessagesManager from "../../lib/appManagers/appMessagesManager";
@ -8,15 +9,19 @@ import apiManager from "../../lib/mtproto/mtprotoworker";
//import Recorder from '../opus-recorder/dist/recorder.min'; //import Recorder from '../opus-recorder/dist/recorder.min';
import opusDecodeController from "../../lib/opusDecodeController"; import opusDecodeController from "../../lib/opusDecodeController";
import { RichTextProcessor } from "../../lib/richtextprocessor"; import { RichTextProcessor } from "../../lib/richtextprocessor";
import $rootScope from '../../lib/rootScope';
import { calcImageInBox, cancelEvent, getRichValue } from "../../lib/utils"; import { calcImageInBox, cancelEvent, getRichValue } from "../../lib/utils";
import ButtonMenu, { ButtonMenuItemOptions } from '../buttonMenu';
import emoticonsDropdown from "../emoticonsDropdown"; import emoticonsDropdown from "../emoticonsDropdown";
import { Layouter, RectPart } from "../groupedLayout"; import { Layouter, RectPart } from "../groupedLayout";
import PopupCreatePoll from "../popupCreatePoll"; import PopupCreatePoll from "../popupCreatePoll";
import { ripple } from '../ripple';
import Scrollable from "../scrollable"; import Scrollable from "../scrollable";
import { toast } from "../toast"; import { toast } from "../toast";
import { wrapDocument, wrapReply } from "../wrappers"; import { wrapDocument, wrapReply } from "../wrappers";
const RECORD_MIN_TIME = 500; const RECORD_MIN_TIME = 500;
const POSTING_MEDIA_NOT_ALLOWED = 'Posting media content isn\'t allowed in this group.';
export class ChatInput { export class ChatInput {
public pageEl = document.getElementById('page-chats') as HTMLDivElement; public pageEl = document.getElementById('page-chats') as HTMLDivElement;
@ -32,12 +37,8 @@ export class ChatInput {
private inputContainer = this.btnSend.parentElement.parentElement as HTMLDivElement; private inputContainer = this.btnSend.parentElement.parentElement as HTMLDivElement;
private chatInput = this.inputContainer.parentElement as HTMLDivElement; private chatInput = this.inputContainer.parentElement as HTMLDivElement;
public attachMenu: { public attachMenu: HTMLButtonElement;
container?: HTMLButtonElement, private attachMenuButtons: (ButtonMenuItemOptions & {verify: (peerID: number) => boolean})[];
media?: HTMLDivElement,
document?: HTMLDivElement,
poll?: HTMLDivElement
} = {};
public attachMediaPopUp: { public attachMediaPopUp: {
container?: HTMLDivElement, container?: HTMLDivElement,
@ -71,10 +72,49 @@ export class ChatInput {
private scrollDiff = 0; private scrollDiff = 0;
constructor() { constructor() {
this.attachMenu.container = document.getElementById('attach-file') as HTMLButtonElement; this.attachMenu = document.getElementById('attach-file') as HTMLButtonElement;
this.attachMenu.media = this.attachMenu.container.querySelector('.menu-media') as HTMLDivElement;
this.attachMenu.document = this.attachMenu.container.querySelector('.menu-document') as HTMLDivElement; this.attachMenuButtons = [{
this.attachMenu.poll = this.attachMenu.container.querySelector('.menu-poll') as HTMLDivElement; icon: 'photo',
text: 'Photo or Video',
onClick: () => {
this.fileInput.setAttribute('accept', 'image/*, video/*');
willAttach.type = 'media';
this.fileInput.click();
},
verify: (peerID: number) => peerID > 0 || appChatsManager.hasRights(peerID, 'send', 'send_media')
}, {
icon: 'document',
text: 'Document',
onClick: () => {
this.fileInput.removeAttribute('accept');
willAttach.type = 'document';
this.fileInput.click();
},
verify: (peerID: number) => peerID > 0 || appChatsManager.hasRights(peerID, 'send', 'send_media')
}, {
icon: 'poll',
text: 'Poll',
onClick: () => {
new PopupCreatePoll().show();
},
verify: (peerID: number) => peerID < 0 && appChatsManager.hasRights(peerID, 'send', 'send_polls')
}];
/* this.attachMenu.addEventListener('mousedown', (e) => {
const hidden = this.attachMenu.querySelectorAll('.hide');
if(hidden.length == this.attachMenuButtons.length) {
toast(POSTING_MEDIA_NOT_ALLOWED);
cancelEvent(e);
return false;
}
}, {passive: false, capture: true}); */
const attachBtnMenu = ButtonMenu(this.attachMenuButtons);
attachBtnMenu.classList.add('top-left');
this.attachMenu.append(attachBtnMenu);
ripple(this.attachMenu);
this.attachMediaPopUp.container = this.pageEl.querySelector('.popup-send-photo') as HTMLDivElement; this.attachMediaPopUp.container = this.pageEl.querySelector('.popup-send-photo') as HTMLDivElement;
this.attachMediaPopUp.titleEl = this.attachMediaPopUp.container.querySelector('.popup-title') as HTMLDivElement; this.attachMediaPopUp.titleEl = this.attachMediaPopUp.container.querySelector('.popup-title') as HTMLDivElement;
@ -103,6 +143,19 @@ export class ChatInput {
this.updateSendBtn(); this.updateSendBtn();
$rootScope.$on('peer_changed', (e) => {
const peerID = e.detail;
const visible = this.attachMenuButtons.filter(button => {
const good = button.verify(peerID);
button.element.classList.toggle('hide', !good);
return good;
});
this.attachMenu.toggleAttribute('disabled', !visible.length);
this.updateSendBtn();
});
this.messageInput.addEventListener('keydown', (e: KeyboardEvent) => { this.messageInput.addEventListener('keydown', (e: KeyboardEvent) => {
if(e.key == 'Enter' && !isTouchSupported) { if(e.key == 'Enter' && !isTouchSupported) {
/* if(e.ctrlKey || e.metaKey) { /* if(e.ctrlKey || e.metaKey) {
@ -429,24 +482,9 @@ export class ChatInput {
attachFiles(Array.from(files)); attachFiles(Array.from(files));
}, false); }, false);
this.attachMenu.media.addEventListener('click', () => {
this.fileInput.setAttribute('accept', 'image/*, video/*');
willAttach.type = 'media';
this.fileInput.click();
});
this.attachMenu.document.addEventListener('click', () => {
this.fileInput.removeAttribute('accept');
willAttach.type = 'document';
this.fileInput.click();
});
this.attachMenu.poll.addEventListener('click', () => {
new PopupCreatePoll().show();
});
document.addEventListener('paste', (event) => { document.addEventListener('paste', (event) => {
if(!appImManager.peerID || this.attachMediaPopUp.container.classList.contains('active')) { const peerID = $rootScope.selectedPeerID;
if(!peerID || this.attachMediaPopUp.container.classList.contains('active') || (peerID < 0 && !appChatsManager.hasRights(peerID, 'send', 'send_media'))) {
return; return;
} }
@ -529,6 +567,11 @@ export class ChatInput {
this.sendMessage(); this.sendMessage();
} }
} else { } else {
if($rootScope.selectedPeerID < 0 && !appChatsManager.hasRights($rootScope.selectedPeerID, 'send', 'send_media')) {
toast(POSTING_MEDIA_NOT_ALLOWED);
return;
}
this.chatInput.classList.add('is-locked'); this.chatInput.classList.add('is-locked');
this.recorder.start().then(() => { this.recorder.start().then(() => {
this.recordCanceled = false; this.recordCanceled = false;

69
src/components/emoticonsDropdown/index.ts
Unescape View File

@ -1,16 +1,18 @@
import LazyLoadQueue, { LazyLoadQueueIntersector } from "../lazyLoadQueue"; import { isTouchSupported } from "../../helpers/touchSupport";
import GifsTab from "./tabs/gifs"; import appChatsManager from "../../lib/appManagers/appChatsManager";
import appImManager from "../../lib/appManagers/appImManager";
import { MOUNT_CLASS_TO } from "../../lib/mtproto/mtproto_config";
import $rootScope from "../../lib/rootScope";
import { findUpClassName, findUpTag, whichChild } from "../../lib/utils"; import { findUpClassName, findUpTag, whichChild } from "../../lib/utils";
import { horizontalMenu } from "../horizontalMenu";
import animationIntersector from "../animationIntersector"; import animationIntersector from "../animationIntersector";
import appSidebarRight from "../sidebarRight"; import { horizontalMenu } from "../horizontalMenu";
import appImManager from "../../lib/appManagers/appImManager"; import LazyLoadQueue, { LazyLoadQueueIntersector } from "../lazyLoadQueue";
import Scrollable, { ScrollableX } from "../scrollable"; import Scrollable, { ScrollableX } from "../scrollable";
import appSidebarRight from "../sidebarRight";
import StickyIntersector from "../stickyIntersector";
import EmojiTab from "./tabs/emoji"; import EmojiTab from "./tabs/emoji";
import GifsTab from "./tabs/gifs";
import StickersTab from "./tabs/stickers"; import StickersTab from "./tabs/stickers";
import StickyIntersector from "../stickyIntersector";
import { MOUNT_CLASS_TO } from "../../lib/mtproto/mtproto_config";
import { isTouchSupported } from "../../helpers/touchSupport";
export const EMOTICONSSTICKERGROUP = 'emoticons-dropdown'; export const EMOTICONSSTICKERGROUP = 'emoticons-dropdown';
@ -53,6 +55,8 @@ export class EmoticonsDropdown {
onOpenAfter: [] onOpenAfter: []
}; };
private selectTab: ReturnType<typeof horizontalMenu>;
constructor() { constructor() {
this.element = document.getElementById('emoji-dropdown') as HTMLDivElement; this.element = document.getElementById('emoji-dropdown') as HTMLDivElement;
@ -113,13 +117,7 @@ export class EmoticonsDropdown {
this.container = this.element.querySelector('.emoji-container .tabs-container') as HTMLDivElement; this.container = this.element.querySelector('.emoji-container .tabs-container') as HTMLDivElement;
this.tabsEl = this.element.querySelector('.emoji-tabs') as HTMLUListElement; this.tabsEl = this.element.querySelector('.emoji-tabs') as HTMLUListElement;
horizontalMenu(this.tabsEl, this.container, (id) => { this.selectTab = horizontalMenu(this.tabsEl, this.container, this.onSelectTabClick, () => {
animationIntersector.checkAnimations(true, EMOTICONSSTICKERGROUP);
this.tabID = id;
this.searchButton.classList.toggle('hide', this.tabID == 0);
this.deleteBtn.classList.toggle('hide', this.tabID != 0);
}, () => {
const tab = this.tabs[this.tabID]; const tab = this.tabs[this.tabID];
if(tab.init) { if(tab.init) {
tab.init(); tab.init();
@ -156,10 +154,45 @@ export class EmoticonsDropdown {
//appSidebarRight.stickersTab.init(); //appSidebarRight.stickersTab.init();
}); });
(this.tabsEl.firstElementChild.children[1] as HTMLLIElement).click(); // set emoji tab (this.tabsEl.children[1] as HTMLLIElement).click(); // set emoji tab
this.tabs[0].init(); // onTransitionEnd не вызовется, т.к. это первая открытая вкладка this.tabs[0].init(); // onTransitionEnd не вызовется, т.к. это первая открытая вкладка
$rootScope.$on('peer_changed', this.checkRights);
this.checkRights();
}
private onSelectTabClick = (id: number) => {
if(this.tabID == id) {
return;
} }
animationIntersector.checkAnimations(true, EMOTICONSSTICKERGROUP);
this.tabID = id;
this.searchButton.classList.toggle('hide', this.tabID == 0);
this.deleteBtn.classList.toggle('hide', this.tabID != 0);
};
public checkRights = () => {
const peerID = $rootScope.selectedPeerID;
const children = this.tabsEl.children;
const tabsElements = Array.from(children) as HTMLElement[];
const canSendStickers = peerID > 0 || appChatsManager.hasRights(peerID, 'send', 'send_stickers');
tabsElements[2].toggleAttribute('disabled', !canSendStickers);
const canSendGifs = peerID > 0 || appChatsManager.hasRights(peerID, 'send', 'send_gifs');
tabsElements[3].toggleAttribute('disabled', !canSendGifs);
const active = this.tabsEl.querySelector('.active');
if(active && whichChild(active) != 1 && (!canSendStickers || !canSendGifs)) {
this.selectTab(0);
this.onSelectTabClick(0);
active.classList.remove('active');
children[1].classList.add('active');
}
};
public toggle = async(enable?: boolean) => { public toggle = async(enable?: boolean) => {
//if(!this.element) return; //if(!this.element) return;
const willBeActive = (!!this.element.style.display && enable === undefined) || enable; const willBeActive = (!!this.element.style.display && enable === undefined) || enable;
@ -241,7 +274,7 @@ export class EmoticonsDropdown {
//animationIntersector.checkAnimations(false, EMOTICONSSTICKERGROUP); //animationIntersector.checkAnimations(false, EMOTICONSSTICKERGROUP);
}; };
public static menuOnClick = (menu: HTMLUListElement, scroll: Scrollable, menuScroll?: ScrollableX) => { public static menuOnClick = (menu: HTMLElement, scroll: Scrollable, menuScroll?: ScrollableX) => {
let prevId = 0; let prevId = 0;
let jumpedTo = -1; let jumpedTo = -1;
@ -284,7 +317,7 @@ export class EmoticonsDropdown {
menu.addEventListener('click', (e) => { menu.addEventListener('click', (e) => {
let target = e.target as HTMLElement; let target = e.target as HTMLElement;
target = findUpTag(target, 'LI'); target = findUpClassName(target, 'menu-horizontal-div-item');
if(!target) { if(!target) {
return; return;

12
src/components/emoticonsDropdown/tabs/emoji.ts
Unescape View File

@ -1,10 +1,10 @@
import { EmoticonsTab, EmoticonsDropdown } from ".."; import { EmoticonsDropdown, EmoticonsTab } from "..";
import Scrollable from "../../scrollable"; import appImManager from "../../../lib/appManagers/appImManager";
import Config from "../../../lib/config";
import { putPreloader } from "../../misc";
import appStateManager from "../../../lib/appManagers/appStateManager"; import appStateManager from "../../../lib/appManagers/appStateManager";
import Config from "../../../lib/config";
import { RichTextProcessor } from "../../../lib/richtextprocessor"; import { RichTextProcessor } from "../../../lib/richtextprocessor";
import appImManager from "../../../lib/appManagers/appImManager"; import { putPreloader } from "../../misc";
import Scrollable from "../../scrollable";
import StickyIntersector from "../../stickyIntersector"; import StickyIntersector from "../../stickyIntersector";
export default class EmojiTab implements EmoticonsTab { export default class EmojiTab implements EmoticonsTab {
@ -80,7 +80,7 @@ export default class EmojiTab implements EmoticonsTab {
} }
//console.timeEnd('emojiParse'); //console.timeEnd('emojiParse');
const menu = this.content.previousElementSibling.firstElementChild as HTMLUListElement; const menu = this.content.previousElementSibling as HTMLElement;
const emojiScroll = this.scroll = new Scrollable(this.content, 'EMOJI', null); const emojiScroll = this.scroll = new Scrollable(this.content, 'EMOJI', null);
//emojiScroll.setVirtualContainer(emojiScroll.container); //emojiScroll.setVirtualContainer(emojiScroll.container);

40
src/components/emoticonsDropdown/tabs/stickers.ts
Unescape View File

@ -1,20 +1,20 @@
import emoticonsDropdown, { EmoticonsTab, EMOTICONSSTICKERGROUP, EmoticonsDropdown } from ".."; import emoticonsDropdown, { EmoticonsDropdown, EMOTICONSSTICKERGROUP, EmoticonsTab } from "..";
import { readBlobAsText } from "../../../helpers/blob";
import mediaSizes from "../../../helpers/mediaSizes";
import { StickerSet } from "../../../layer"; import { StickerSet } from "../../../layer";
import Scrollable, { ScrollableX } from "../../scrollable"; import appDocsManager, { MyDocument } from "../../../lib/appManagers/appDocsManager";
import { wrapSticker } from "../../wrappers";
import appStickersManager from "../../../lib/appManagers/appStickersManager";
import appDownloadManager from "../../../lib/appManagers/appDownloadManager"; import appDownloadManager from "../../../lib/appManagers/appDownloadManager";
import { readBlobAsText } from "../../../helpers/blob"; import appStickersManager from "../../../lib/appManagers/appStickersManager";
import lottieLoader from "../../../lib/lottieLoader"; import lottieLoader from "../../../lib/lottieLoader";
import { renderImageFromUrl, putPreloader } from "../../misc"; import apiManager from "../../../lib/mtproto/mtprotoworker";
import { RichTextProcessor } from "../../../lib/richtextprocessor"; import { RichTextProcessor } from "../../../lib/richtextprocessor";
import $rootScope from "../../../lib/rootScope"; import $rootScope from "../../../lib/rootScope";
import apiManager from "../../../lib/mtproto/mtprotoworker";
import StickyIntersector from "../../stickyIntersector";
import appDocsManager, {MyDocument} from "../../../lib/appManagers/appDocsManager";
import animationIntersector from "../../animationIntersector"; import animationIntersector from "../../animationIntersector";
import { LazyLoadQueueRepeat } from "../../lazyLoadQueue"; import { LazyLoadQueueRepeat } from "../../lazyLoadQueue";
import mediaSizes from "../../../helpers/mediaSizes"; import { putPreloader, renderImageFromUrl } from "../../misc";
import Scrollable, { ScrollableX } from "../../scrollable";
import StickyIntersector from "../../stickyIntersector";
import { wrapSticker } from "../../wrappers";
export default class StickersTab implements EmoticonsTab { export default class StickersTab implements EmoticonsTab {
public content: HTMLElement; public content: HTMLElement;
@ -29,7 +29,7 @@ export default class StickersTab implements EmoticonsTab {
private scroll: Scrollable; private scroll: Scrollable;
private menu: HTMLUListElement; private menu: HTMLElement;
private mounted = false; private mounted = false;
@ -110,18 +110,18 @@ export default class StickersTab implements EmoticonsTab {
const categoryDiv = document.createElement('div'); const categoryDiv = document.createElement('div');
categoryDiv.classList.add('sticker-category'); categoryDiv.classList.add('sticker-category');
const li = document.createElement('li'); const button = document.createElement('button');
li.classList.add('btn-icon'); button.classList.add('btn-icon', 'menu-horizontal-div-item');
this.stickerSets[set.id] = { this.stickerSets[set.id] = {
stickers: categoryDiv, stickers: categoryDiv,
tab: li tab: button
}; };
if(prepend) { if(prepend) {
this.menu.insertBefore(li, this.menu.firstElementChild.nextSibling); this.menu.insertBefore(button, this.menu.firstElementChild.nextSibling);
} else { } else {
this.menu.append(li); this.menu.append(button);
} }
//stickersScroll.append(categoryDiv); //stickersScroll.append(categoryDiv);
@ -142,7 +142,7 @@ export default class StickersTab implements EmoticonsTab {
//.then(JSON.parse) //.then(JSON.parse)
.then(json => { .then(json => {
lottieLoader.loadAnimationWorker({ lottieLoader.loadAnimationWorker({
container: li, container: button,
loop: true, loop: true,
autoplay: false, autoplay: false,
animationData: json, animationData: json,
@ -155,14 +155,14 @@ export default class StickersTab implements EmoticonsTab {
const image = new Image(); const image = new Image();
promise.then(blob => { promise.then(blob => {
renderImageFromUrl(image, URL.createObjectURL(blob), () => { renderImageFromUrl(image, URL.createObjectURL(blob), () => {
li.append(image); button.append(image);
}); });
}); });
} }
} else if(stickerSet.documents[0]._ != 'documentEmpty') { // as thumb will be used first sticker } else if(stickerSet.documents[0]._ != 'documentEmpty') { // as thumb will be used first sticker
wrapSticker({ wrapSticker({
doc: stickerSet.documents[0], doc: stickerSet.documents[0],
div: li as any, div: button as any,
group: EMOTICONSSTICKERGROUP group: EMOTICONSSTICKERGROUP
}); // kostil }); // kostil
} }
@ -230,7 +230,7 @@ export default class StickersTab implements EmoticonsTab {
this.recentDiv.classList.add('sticker-category'); this.recentDiv.classList.add('sticker-category');
let menuWrapper = this.content.previousElementSibling as HTMLDivElement; let menuWrapper = this.content.previousElementSibling as HTMLDivElement;
this.menu = menuWrapper.firstElementChild.firstElementChild as HTMLUListElement; this.menu = menuWrapper.firstElementChild as HTMLUListElement;
let menuScroll = new ScrollableX(menuWrapper); let menuScroll = new ScrollableX(menuWrapper);

2
src/components/horizontalMenu.ts
Unescape View File

@ -116,7 +116,7 @@ export function horizontalMenu(tabs: HTMLElement, content: HTMLElement, onClick?
if(tabs) { if(tabs) {
const useStripe = !tabs.classList.contains('no-stripe'); const useStripe = !tabs.classList.contains('no-stripe');
const tagName = 'LI';//tabs.firstElementChild.tagName; const tagName = tabs.classList.contains('menu-horizontal-div') ? 'BUTTON' : 'LI';//tabs.firstElementChild.tagName;
tabs.addEventListener('click', function(e) { tabs.addEventListener('click', function(e) {
let target = e.target as HTMLElement; let target = e.target as HTMLElement;

4
src/components/popupCreatePoll.ts
Unescape View File

@ -179,7 +179,9 @@ export default class PopupCreatePoll extends PopupElement {
}; };
//poll.id = randomIDS; //poll.id = randomIDS;
const inputMediaPoll = appPollsManager.getInputMediaPoll(poll, this.correctAnswers, this.quizSolutionInput ? this.quizSolutionInput.value : undefined); const inputMediaPoll = appPollsManager.getInputMediaPoll(poll, this.correctAnswers, this.quizSolutionInput.value || undefined);
//console.log('Will try to create poll:', inputMediaPoll);
appMessagesManager.sendOther($rootScope.selectedPeerID, inputMediaPoll); appMessagesManager.sendOther($rootScope.selectedPeerID, inputMediaPoll);
}; };

52
src/index.hbs
Unescape View File

@ -513,13 +513,7 @@
<div class="input-message-container"> <div class="input-message-container">
<div id="input-message" contenteditable="true" data-placeholder="Message"></div> <div id="input-message" contenteditable="true" data-placeholder="Message"></div>
</div> </div>
<button class="btn-icon rp tgico-attach btn-menu-toggle" id="attach-file"> <button class="btn-icon tgico-attach btn-menu-toggle" id="attach-file"></button>
<div class="btn-menu top-left">
<div class="btn-menu-item menu-media tgico-photo rp">Photo or Video</div>
<div class="btn-menu-item menu-document tgico-document rp">Document</div>
<div class="btn-menu-item menu-poll tgico-poll rp">Poll</div>
</div>
</button>
<div class="record-time"></div> <div class="record-time"></div>
<input type="file" id="input-file" style="display: none;" multiple /> <input type="file" id="input-file" style="display: none;" multiple />
</div> </div>
@ -537,27 +531,23 @@
<div class="emoji-container"> <div class="emoji-container">
<div class="tabs-container"> <div class="tabs-container">
<div class="emoji-padding"> <div class="emoji-padding">
<nav class="menu-horizontal"> <nav class="menu-horizontal-div no-stripe">
<ul> <button class="menu-horizontal-div-item active btn-icon tgico-recent rp"></button>
<li class="active btn-icon tgico-recent rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-smile rp"></button>
<li class="btn-icon tgico-smile rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-animals rp"></button>
<li class="btn-icon tgico-animals rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-eats rp"></button>
<li class="btn-icon tgico-eats rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-car rp"></button>
<li class="btn-icon tgico-car rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-sport rp"></button>
<li class="btn-icon tgico-sport rp"></li> <button class="menu-horizontal-div-item btn-icon tgico-lamp rp"></button>
<li class="btn-icon tgico-lamp rp"></li> <!-- <button class="menu-horizontal-div-item btn-icon tgico-info rp"></button> -->
<!-- <li class="btn-icon tgico-info rp"></li> --> <button class="menu-horizontal-div-item btn-icon tgico-flag rp"></button>
<li class="btn-icon tgico-flag rp"></li>
</ul>
</nav> </nav>
<div class="emoticons-content" id="content-emoji"></div> <div class="emoticons-content" id="content-emoji"></div>
</div> </div>
<div class="stickers-padding"> <div class="stickers-padding">
<div class="menu-wrapper"> <div class="menu-wrapper">
<nav class="menu-horizontal"> <nav class="menu-horizontal-div no-stripe justify-start">
<ul class="justify-start"> <button class="menu-horizontal-div-item btn-icon tgico-recent active"></button>
<li class="btn-icon tgico-recent active"></li>
</ul>
</nav> </nav>
</div> </div>
<div class="emoticons-content" id="content-stickers"></div> <div class="emoticons-content" id="content-stickers"></div>
@ -569,15 +559,13 @@
</div> </div>
</div> </div>
</div> </div>
<nav class="emoji-tabs menu-horizontal no-stripe"> <div class="emoji-tabs menu-horizontal-div no-stripe">
<ul> <button class="menu-horizontal-div-item emoji-tabs-search justify-self-start btn-icon tgico-search rp" data-tab="-1"></button>
<li class="emoji-tabs-search justify-self-start btn-icon tgico-search rp" data-tab="-1"></li> <button class="menu-horizontal-div-item emoji-tabs-emoji btn-icon tgico-smile rp" data-tab="0"></button>
<li class="emoji-tabs-emoji btn-icon tgico-smile rp" data-tab="0"></li> <button class="menu-horizontal-div-item emoji-tabs-stickers btn-icon tgico-stickers rp" data-tab="1"></button>
<li class="emoji-tabs-stickers btn-icon tgico-stickers rp" data-tab="1"></li> <button class="menu-horizontal-div-item emoji-tabs-gifs btn-icon tgico-gifs rp" data-tab="2"></button>
<li class="emoji-tabs-gifs btn-icon tgico-gifs rp" data-tab="2"></li> <button class="menu-horizontal-div-item emoji-tabs-delete justify-self-end btn-icon tgico-deleteleft rp" data-tab="-1"></button>
<li class="emoji-tabs-delete justify-self-end btn-icon tgico-deleteleft rp" data-tab="-1"></li> </div>
</ul>
</nav>
</div> </div>
</div> </div>
</div> </div>

14
src/lib/appManagers/appChatsManager.ts
Unescape View File

@ -1,4 +1,4 @@
import { InputChannel, InputChatPhoto, InputPeer, Updates } from "../../layer"; import { ChatBannedRights, InputChannel, InputChatPhoto, InputPeer, Updates } from "../../layer";
import apiManager from '../mtproto/mtprotoworker'; import apiManager from '../mtproto/mtprotoworker';
import { RichTextProcessor } from "../richtextprocessor"; import { RichTextProcessor } from "../richtextprocessor";
import $rootScope from "../rootScope"; import $rootScope from "../rootScope";
@ -151,7 +151,7 @@ export class AppChatsManager {
return this.chats[id] || {_: 'chatEmpty', id: id, deleted: true, access_hash: this.channelAccess[id]}; return this.chats[id] || {_: 'chatEmpty', id: id, deleted: true, access_hash: this.channelAccess[id]};
} }
public hasRights(id: number, action: ChatRights) { public hasRights(id: number, action: ChatRights, flag?: keyof ChatBannedRights['pFlags']) {
const chat = this.getChat(id); const chat = this.getChat(id);
if(chat._ == 'chatEmpty') return false; if(chat._ == 'chatEmpty') return false;
@ -171,12 +171,16 @@ export class AppChatsManager {
switch(action) { switch(action) {
// good // good
case 'send': { case 'send': {
if(chat._ == 'channel' && if(flag && myFlags[flag]) {
!chat.pFlags.megagroup &&
!myFlags.post_messages) {
return false; return false;
} }
if(chat._ == 'channel') {
if((!chat.pFlags.megagroup && !myFlags.post_messages)) {
return false;
}
}
break; break;
} }

4
src/lib/rootScope.ts
Unescape View File

@ -1,13 +1,14 @@
import type { StickerSet } from "../layer"; import type { StickerSet } from "../layer";
import type { MyDocument } from "./appManagers/appDocsManager"; import type { MyDocument } from "./appManagers/appDocsManager";
import type { Poll, PollResults } from "./appManagers/appPollsManager";
import type { AppMessagesManager, Dialog, MyDialogFilter } from "./appManagers/appMessagesManager"; import type { AppMessagesManager, Dialog, MyDialogFilter } from "./appManagers/appMessagesManager";
import type { Poll, PollResults } from "./appManagers/appPollsManager";
import { MOUNT_CLASS_TO } from "./mtproto/mtproto_config"; import { MOUNT_CLASS_TO } from "./mtproto/mtproto_config";
type BroadcastEvents = { type BroadcastEvents = {
'user_update': number, 'user_update': number,
'user_auth': {dcID?: number, id: number}, 'user_auth': {dcID?: number, id: number},
'peer_changed': number, 'peer_changed': number,
'peer_pinned_message': number,
'filter_delete': MyDialogFilter, 'filter_delete': MyDialogFilter,
'filter_update': MyDialogFilter, 'filter_update': MyDialogFilter,
@ -48,7 +49,6 @@ type BroadcastEvents = {
//'contacts_update': any, //'contacts_update': any,
'avatar_update': number, 'avatar_update': number,
'chat_full_update': number, 'chat_full_update': number,
'peer_pinned_message': number,
'poll_update': {poll: Poll, results: PollResults}, 'poll_update': {poll: Poll, results: PollResults},
'chat_update': number, 'chat_update': number,
'stateSynchronized': void, 'stateSynchronized': void,

2
src/scss/partials/_chat.scss
Unescape View File

@ -342,7 +342,7 @@
} }
.btn-icon { .btn-icon {
transition: .2s color, background-color .2s; transition: .2s color, background-color .2s, .2s opacity;
} }
#btn-record-cancel, #btn-send { #btn-record-cancel, #btn-send {

26
src/scss/partials/_emojiDropdown.scss
Unescape View File

@ -34,7 +34,7 @@
margin-left: -.5rem; margin-left: -.5rem;
} */ } */
> .menu-horizontal { > .menu-horizontal-div {
//font-weight: 500; //font-weight: 500;
margin-top: 2px; margin-top: 2px;
border: none; border: none;
@ -52,9 +52,7 @@
} }
.emoji-tabs { .emoji-tabs {
ul {
justify-content: center; justify-content: center;
}
&-search { &-search {
position: absolute; position: absolute;
@ -113,7 +111,7 @@
.emoji-padding.active { .emoji-padding.active {
@include respond-to(handhelds) { @include respond-to(handhelds) {
.menu-horizontal li { .menu-horizontal-div .menu-horizontal-div-item {
flex: unset; flex: unset;
padding: 0; padding: 0;
} }
@ -143,7 +141,7 @@
} }
.emoji-padding, .stickers-padding { .emoji-padding, .stickers-padding {
.menu-horizontal { .menu-horizontal-div {
height: 48px; height: 48px;
border-bottom: none; border-bottom: none;
padding: 2px; padding: 2px;
@ -151,7 +149,7 @@
box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, 0.21); box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, 0.21);
z-index: 4; z-index: 4;
li { .menu-horizontal-div-item {
margin: 0; margin: 0;
} }
} }
@ -249,24 +247,18 @@
} }
} }
.menu-horizontal {
li {
border-radius: 50%;
}
}
#content-stickers { #content-stickers {
.scrollable { .scrollable {
padding: 0px 5px 0; padding: 0px 5px 0;
} }
} }
.menu-horizontal { .menu-horizontal-div {
width: 100%; width: 100%;
height: 48px; height: 48px;
box-shadow: 0px -2px 5px -1px rgba(0, 0, 0, .21); box-shadow: 0px -2px 5px -1px rgba(0, 0, 0, .21);
li { .menu-horizontal-div-item {
font-size: 1.5rem; font-size: 1.5rem;
margin: 0 12px; margin: 0 12px;
width: 48px; width: 48px;
@ -285,10 +277,10 @@
box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, .21); box-shadow: 0px 1px 5px -1px rgba(0, 0, 0, .21);
} }
.menu-horizontal { .menu-horizontal-div {
box-shadow: none; box-shadow: none;
& li { .menu-horizontal-div-item {
height: 48px; height: 48px;
width: 48px; width: 48px;
padding: 0; padding: 0;
@ -305,7 +297,7 @@
//border-top: 1px solid $lightgrey; //border-top: 1px solid $lightgrey;
} }
li { .menu-horizontal-div-item {
/* width: calc(100% / 7); */ /* width: calc(100% / 7); */
flex: 0 0 auto; flex: 0 0 auto;

75
src/scss/partials/_slider.scss
Unescape View File

@ -1,5 +1,80 @@
$slider-time: .25s; $slider-time: .25s;
.menu-horizontal-div {
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
position: relative;
z-index: 2;
flex-direction: row;
color: $color-gray;
border-bottom: 1px solid $lightgrey;
position: relative;
&-item {
display: inline-block;
padding: .75rem 1rem;
cursor: pointer;
text-align: center;
flex: 1 1 auto;
//flex: 0 0 auto;
//overflow: hidden;
user-select: none;
// font-size: 1rem;
font-size: 14px;
font-weight: 500;
position: relative;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
html.no-touch & {
background-color: transparent;
transition: background-color .15s ease-in-out;
&:hover {
background-color: var(--color-gray-hover);
}
}
> span {
position: relative;
display: inline-flex;
align-items: center;
}
&.active {
color: $color-blue;
i {
opacity: 1;
}
}
}
i {
position: absolute;
bottom: calc(-.625rem - 2px);
left: 0;
opacity: 0;
background-color: $color-blue;
height: .1875rem;
width: 100%;
border-radius: .1875rem .1875rem 0 0;
pointer-events: none;
padding-right: .5rem;
margin-left: -.25rem;
box-sizing: content-box;
transform-origin: left;
z-index: 1;
&.animate {
transition: transform $slider-time;
}
}
}
.menu-horizontal { .menu-horizontal {
color: $color-gray; color: $color-gray;
border-bottom: 1px solid $lightgrey; border-bottom: 1px solid $lightgrey;

7
src/scss/style.scss
Unescape View File

@ -302,7 +302,7 @@ input, textarea {
font-size: 1.5rem; font-size: 1.5rem;
line-height: 1.5rem; line-height: 1.5rem;
border-radius: 50%; border-radius: 50%;
transition: background-color .15s ease-in-out; transition: background-color .15s ease-in-out, opacity .15s ease-in-out;
color: $color-gray; color: $color-gray;
cursor: pointer; cursor: pointer;
background-color: transparent; background-color: transparent;
@ -323,6 +323,11 @@ input, textarea {
html.no-touch &:hover { html.no-touch &:hover {
background-color: var(--color-gray-hover); background-color: var(--color-gray-hover);
} }
&:disabled {
pointer-events: none !important;
opacity: .25;
}
} }
.btn-icon:disabled { .btn-icon:disabled {

Write Preview
Loading…
Cancel
Save