tweb/src/components/sidebarLeft/tabs/addMembers.ts

88 lines
2.5 KiB
TypeScript

/*
* https://github.com/morethanwords/tweb
* Copyright (C) 2019-2021 Eduard Kuzmenko
* https://github.com/morethanwords/tweb/blob/master/LICENSE
*/
import { SliderSuperTab } from "../../slider";
import AppSelectPeers from "../../appSelectPeers";
import { putPreloader, setButtonLoader } from "../../misc";
import { LangPackKey, _i18n } from "../../../lib/langPack";
import ButtonCorner from "../../buttonCorner";
export default class AppAddMembersTab extends SliderSuperTab {
private nextBtn: HTMLButtonElement;
private selector: AppSelectPeers;
private peerType: 'channel' | 'chat' | 'privacy';
private takeOut: (peerIds: PeerId[]) => Promise<any> | false | void;
private skippable: boolean;
protected init() {
this.nextBtn = ButtonCorner({icon: 'arrow_next'});
this.content.append(this.nextBtn);
this.scrollable.container.remove();
this.nextBtn.addEventListener('click', () => {
const peerIds = this.selector.getSelected().map(sel => sel.toPeerId());
if(this.skippable) {
this.takeOut(peerIds);
this.close();
} else {
const promise = this.takeOut(peerIds);
if(promise instanceof Promise) {
this.attachToPromise(promise);
} else if(promise === undefined) {
this.close();
}
}
});
}
public attachToPromise(promise: Promise<any>) {
const removeLoader = setButtonLoader(this.nextBtn, 'arrow_next');
promise.then(() => {
this.close();
}, () => {
removeLoader();
});
}
public open(options: {
title: LangPackKey,
placeholder: LangPackKey,
type: AppAddMembersTab['peerType'],
takeOut?: AppAddMembersTab['takeOut'],
skippable: boolean,
selectedPeerIds?: PeerId[]
}) {
const ret = super.open();
this.setTitle(options.title);
this.peerType = options.type;
this.takeOut = options.takeOut;
this.skippable = options.skippable;
this.selector = new AppSelectPeers({
appendTo: this.content,
onChange: this.skippable ? null : (length) => {
this.nextBtn.classList.toggle('is-visible', !!length);
},
peerType: ['contacts'],
placeholder: options.placeholder
});
if(options.selectedPeerIds) {
this.selector.addInitial(options.selectedPeerIds);
}
this.nextBtn.classList.add('tgico-arrow_next');
this.nextBtn.innerHTML = '';
this.nextBtn.disabled = false;
this.nextBtn.classList.toggle('is-visible', this.skippable);
return ret;
}
}