|
|
|
@ -1,26 +1,20 @@
@@ -1,26 +1,20 @@
|
|
|
|
|
import { SliderTab } from "../../slider"; |
|
|
|
|
import { SliderSuperTab } from "../../slider"; |
|
|
|
|
import InputSearch from "../../inputSearch"; |
|
|
|
|
import Scrollable from "../../scrollable"; |
|
|
|
|
import animationIntersector from "../../animationIntersector"; |
|
|
|
|
import appSidebarRight, { AppSidebarRight } from ".."; |
|
|
|
|
import appSidebarRight from ".."; |
|
|
|
|
import appUsersManager from "../../../lib/appManagers/appUsersManager"; |
|
|
|
|
import appInlineBotsManager, { AppInlineBotsManager } from "../../../lib/appManagers/appInlineBotsManager"; |
|
|
|
|
import GifsMasonry from "../../gifsMasonry"; |
|
|
|
|
import { findUpClassName } from "../../../helpers/dom"; |
|
|
|
|
import { findUpClassName, attachClickEvent } from "../../../helpers/dom"; |
|
|
|
|
import appImManager from "../../../lib/appManagers/appImManager"; |
|
|
|
|
import type { MyDocument } from "../../../lib/appManagers/appDocsManager"; |
|
|
|
|
import mediaSizes from "../../../helpers/mediaSizes"; |
|
|
|
|
|
|
|
|
|
const ANIMATIONGROUP = 'GIFS-SEARCH'; |
|
|
|
|
|
|
|
|
|
export default class AppGifsTab implements SliderTab { |
|
|
|
|
private container = document.getElementById('search-gifs-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;
|
|
|
|
|
export default class AppGifsTab extends SliderSuperTab { |
|
|
|
|
private inputSearch: InputSearch; |
|
|
|
|
private gifsDiv = this.contentDiv.firstElementChild as HTMLDivElement; |
|
|
|
|
private scrollable: Scrollable; |
|
|
|
|
private gifsDiv: HTMLDivElement; |
|
|
|
|
|
|
|
|
|
private nextOffset = ''; |
|
|
|
|
private loadedAll = false; |
|
|
|
@ -30,22 +24,27 @@ export default class AppGifsTab implements SliderTab {
@@ -30,22 +24,27 @@ export default class AppGifsTab implements SliderTab {
|
|
|
|
|
|
|
|
|
|
private searchPromise: ReturnType<AppInlineBotsManager['getInlineResults']>; |
|
|
|
|
|
|
|
|
|
constructor() { |
|
|
|
|
this.scrollable = new Scrollable(this.contentDiv, ANIMATIONGROUP); |
|
|
|
|
|
|
|
|
|
this.masonry = new GifsMasonry(this.gifsDiv, ANIMATIONGROUP, this.scrollable); |
|
|
|
|
protected init() { |
|
|
|
|
this.container.id = 'search-gifs-container'; |
|
|
|
|
|
|
|
|
|
this.inputSearch = new InputSearch('Search GIFs', (value) => { |
|
|
|
|
this.reset(); |
|
|
|
|
this.search(value); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
this.gifsDiv.addEventListener('click', this.onGifsClick); |
|
|
|
|
this.title.replaceWith(this.inputSearch.container); |
|
|
|
|
|
|
|
|
|
this.gifsDiv = document.createElement('div'); |
|
|
|
|
this.gifsDiv.classList.add('gifs-masonry'); |
|
|
|
|
attachClickEvent(this.gifsDiv, this.onGifsClick, {listenerSetter: this.listenerSetter}); |
|
|
|
|
|
|
|
|
|
this.scrollable.append(this.gifsDiv); |
|
|
|
|
|
|
|
|
|
this.backBtn.parentElement.append(this.inputSearch.container); |
|
|
|
|
this.masonry = new GifsMasonry(this.gifsDiv, ANIMATIONGROUP, this.scrollable); |
|
|
|
|
//this.backBtn.parentElement.append(this.inputSearch.container);
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
onGifsClick = (e: MouseEvent) => { |
|
|
|
|
private onGifsClick = (e: MouseEvent | TouchEvent) => { |
|
|
|
|
const target = findUpClassName(e.target, 'gif'); |
|
|
|
|
if(!target) return; |
|
|
|
|
|
|
|
|
@ -66,8 +65,9 @@ export default class AppGifsTab implements SliderTab {
@@ -66,8 +65,9 @@ export default class AppGifsTab implements SliderTab {
|
|
|
|
|
public onCloseAfterTimeout() { |
|
|
|
|
this.reset(); |
|
|
|
|
this.gifsDiv.innerHTML = ''; |
|
|
|
|
this.inputSearch.value = ''; |
|
|
|
|
animationIntersector.checkAnimations(undefined, ANIMATIONGROUP); |
|
|
|
|
this.inputSearch.remove(); |
|
|
|
|
return super.onCloseAfterTimeout(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
private reset() { |
|
|
|
@ -77,13 +77,9 @@ export default class AppGifsTab implements SliderTab {
@@ -77,13 +77,9 @@ export default class AppGifsTab implements SliderTab {
|
|
|
|
|
this.masonry.lazyLoadQueue.clear(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
public init() { |
|
|
|
|
appSidebarRight.selectTab(AppSidebarRight.SLIDERITEMSIDS.gifs); |
|
|
|
|
|
|
|
|
|
protected onOpen() { |
|
|
|
|
appSidebarRight.toggleSidebar(true).then(() => { |
|
|
|
|
//this.renderFeatured();
|
|
|
|
|
this.search('', true); |
|
|
|
|
this.reset(); |
|
|
|
|
|
|
|
|
|
this.scrollable.onScrolledBottom = () => { |
|
|
|
|
this.search(this.inputSearch.value, false); |
|
|
|
@ -125,7 +121,8 @@ export default class AppGifsTab implements SliderTab {
@@ -125,7 +121,8 @@ export default class AppGifsTab implements SliderTab {
|
|
|
|
|
this.scrollable.onScroll(); |
|
|
|
|
} catch(err) { |
|
|
|
|
this.searchPromise = null; |
|
|
|
|
throw new Error(JSON.stringify(err)); |
|
|
|
|
console.error('gifs loading error:', err); |
|
|
|
|
throw err; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |