import { SliderTab } from "../slider"; import SearchInput from "../searchInput"; import Scrollable from "../scrollable_new"; import LazyLoadQueue from "../lazyLoadQueue"; import { findUpClassName } from "../../lib/utils"; import appImManager from "../../lib/appManagers/appImManager"; import appStickersManager from "../../lib/appManagers/appStickersManager"; import PopupStickers from "../popupStickers"; import animationIntersector from "../animationIntersector"; import { RichTextProcessor } from "../../lib/richtextprocessor"; import { wrapSticker } from "../wrappers"; import appSidebarRight, { AppSidebarRight } from "../../lib/appManagers/appSidebarRight"; import { StickerSet, StickerSetCovered, Document } from "../../layer"; export default class AppStickersTab implements SliderTab { private container = document.getElementById('stickers-container') as HTMLDivElement; private contentDiv = this.container.querySelector('.sidebar-content') as HTMLDivElement; private backBtn = this.container.querySelector('.sidebar-close-button') as HTMLButtonElement; //private input = this.container.querySelector('#stickers-search') as HTMLInputElement; private searchInput: SearchInput; private setsDiv = this.contentDiv.firstElementChild as HTMLDivElement; private scrollable: Scrollable; private lazyLoadQueue: LazyLoadQueue; constructor() { this.scrollable = new Scrollable(this.contentDiv, 'STICKERS-SEARCH', undefined, undefined, 2); this.scrollable.setVirtualContainer(this.setsDiv); this.lazyLoadQueue = new LazyLoadQueue(); this.searchInput = new SearchInput('Search Stickers', (value) => { this.search(value); }); this.backBtn.parentElement.append(this.searchInput.container); this.setsDiv.addEventListener('click', (e) => { const sticker = findUpClassName(e.target, 'sticker-set-sticker'); if(sticker) { const docID = sticker.dataset.docID; appImManager.chatInputC.sendMessageWithDocument(docID); return; } const target = findUpClassName(e.target, 'sticker-set'); if(!target) return; const id = target.dataset.stickerSet as string; const access_hash = target.dataset.stickerSet as string; const button = findUpClassName(e.target, 'sticker-set-button') as HTMLElement; if(button) { e.preventDefault(); e.cancelBubble = true; button.setAttribute('disabled', 'true'); appStickersManager.getStickerSet({id, access_hash}).then(full => { appStickersManager.toggleStickerSet(full.set).then(changed => { if(changed) { button.innerText = full.set.installed_date ? 'Added' : 'Add'; button.classList.toggle('gray', !!full.set.installed_date); } }).finally(() => { //button.style.width = set.installed_date ? '68px' : '52px'; button.removeAttribute('disabled'); }); }); } else { appStickersManager.getStickerSet({id, access_hash}).then(full => { new PopupStickers(full.set).show(); }); } }); } public onCloseAfterTimeout() { this.setsDiv.innerHTML = ''; this.searchInput.value = ''; animationIntersector.checkAnimations(undefined, 'STICKERS-SEARCH'); } public renderSet(set: StickerSet.stickerSet) { //console.log('renderSet:', set); const div = document.createElement('div'); div.classList.add('sticker-set'); const header = document.createElement('div'); header.classList.add('sticker-set-header'); const details = document.createElement('div'); details.classList.add('sticker-set-details'); details.innerHTML = `