Telegram Web K with changes to work inside I2P
https://web.telegram.i2p/
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
3.6 KiB
107 lines
3.6 KiB
/* |
|
* https://github.com/morethanwords/tweb |
|
* Copyright (C) 2019-2021 Eduard Kuzmenko |
|
* https://github.com/morethanwords/tweb/blob/master/LICENSE |
|
*/ |
|
|
|
import appSidebarLeft, {SettingSection} from '..'; |
|
import {InputFile} from '../../../layer'; |
|
import InputField from '../../inputField'; |
|
import {SliderSuperTab} from '../../slider'; |
|
import AvatarEdit from '../../avatarEdit'; |
|
import AppAddMembersTab from './addMembers'; |
|
import {_i18n} from '../../../lib/langPack'; |
|
import ButtonCorner from '../../buttonCorner'; |
|
import appImManager from '../../../lib/appManagers/appImManager'; |
|
|
|
export default class AppNewChannelTab extends SliderSuperTab { |
|
private uploadAvatar: () => Promise<InputFile> = null; |
|
|
|
private channelNameInputField: InputField; |
|
private channelDescriptionInputField: InputField; |
|
private nextBtn: HTMLButtonElement; |
|
private avatarEdit: AvatarEdit; |
|
|
|
protected init() { |
|
this.container.classList.add('new-channel-container'); |
|
this.setTitle('NewChannel'); |
|
|
|
this.avatarEdit = new AvatarEdit((_upload) => { |
|
this.uploadAvatar = _upload; |
|
}); |
|
|
|
const section = new SettingSection({ |
|
caption: 'Channel.DescriptionHolderDescrpiton' |
|
}); |
|
|
|
const inputWrapper = document.createElement('div'); |
|
inputWrapper.classList.add('input-wrapper'); |
|
|
|
this.channelNameInputField = new InputField({ |
|
label: 'EnterChannelName', |
|
maxLength: 128 |
|
}); |
|
|
|
this.channelDescriptionInputField = new InputField({ |
|
label: 'DescriptionOptionalPlaceholder', |
|
maxLength: 255 |
|
}); |
|
|
|
inputWrapper.append(this.channelNameInputField.container, this.channelDescriptionInputField.container); |
|
|
|
const onLengthChange = () => { |
|
this.nextBtn.classList.toggle('is-visible', !!this.channelNameInputField.value.length && |
|
!this.channelNameInputField.input.classList.contains('error') && |
|
!this.channelDescriptionInputField.input.classList.contains('error')); |
|
}; |
|
|
|
this.channelNameInputField.input.addEventListener('input', onLengthChange); |
|
this.channelDescriptionInputField.input.addEventListener('input', onLengthChange); |
|
|
|
this.nextBtn = ButtonCorner({icon: 'arrow_next'}); |
|
|
|
attachClickEvent(this.nextBtn, () => { |
|
const title = this.channelNameInputField.value; |
|
const about = this.channelDescriptionInputField.value; |
|
|
|
this.nextBtn.disabled = true; |
|
this.managers.appChatsManager.createChannel({ |
|
title, |
|
about, |
|
broadcast: true |
|
}).then((channelId) => { |
|
if(this.uploadAvatar) { |
|
this.uploadAvatar().then((inputFile) => { |
|
this.managers.appChatsManager.editPhoto(channelId, inputFile); |
|
}); |
|
} |
|
|
|
appImManager.setInnerPeer({peerId: channelId.toPeerId(true)}); |
|
|
|
appSidebarLeft.removeTabFromHistory(this); |
|
this.slider.createTab(AppAddMembersTab).open({ |
|
type: 'channel', |
|
skippable: true, |
|
title: 'GroupAddMembers', |
|
placeholder: 'SendMessageTo', |
|
takeOut: (peerIds) => { |
|
return this.managers.appChatsManager.inviteToChannel(channelId, peerIds); |
|
} |
|
}); |
|
}); |
|
}, {listenerSetter: this.listenerSetter}); |
|
|
|
this.content.append(this.nextBtn); |
|
section.content.append(this.avatarEdit.container, inputWrapper); |
|
this.scrollable.append(section.container); |
|
} |
|
|
|
public onCloseAfterTimeout() { |
|
this.avatarEdit.clear(); |
|
this.uploadAvatar = null; |
|
this.channelNameInputField.value = ''; |
|
this.channelDescriptionInputField.value = ''; |
|
this.nextBtn.disabled = false; |
|
return super.onCloseAfterTimeout(); |
|
} |
|
}
|
|
|