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.
230 lines
7.3 KiB
230 lines
7.3 KiB
import appSidebarRight from "../lib/appManagers/appSidebarRight"; |
|
import Scrollable from "./scrollable_new"; |
|
import appProfileManager from "../lib/appManagers/appProfileManager"; |
|
import { appPeersManager } from "../lib/services"; |
|
import appMessagesManager from "../lib/appManagers/appMessagesManager"; |
|
import appDialogsManager from "../lib/appManagers/appDialogsManager"; |
|
import appChatsManager from "../lib/appManagers/appChatsManager"; |
|
import appUsersManager from "../lib/appManagers/appUsersManager"; |
|
import { $rootScope, findUpTag, findUpClassName, cancelEvent } from "../lib/utils"; |
|
import { putPreloader } from "./misc"; |
|
|
|
class AppSelectPeers { |
|
public container = document.createElement('div'); |
|
private chatList = document.createElement('ul'); |
|
private chatsContainer = document.createElement('div'); |
|
private scrollable: Scrollable; |
|
private selectedScrollable: Scrollable; |
|
|
|
private selectedContainer = document.createElement('div'); |
|
private searchInput = document.createElement('input'); |
|
|
|
private selected: {[peerID: number]: HTMLDivElement} = {}; |
|
|
|
public freezed = false; |
|
|
|
constructor(private appendTo: HTMLDivElement, private onChange: (length: number) => void) { |
|
this.container.classList.add('selector'); |
|
|
|
let topContainer = document.createElement('div'); |
|
topContainer.classList.add('selector-search-container'); |
|
|
|
this.selectedContainer.classList.add('selector-search'); |
|
this.searchInput.placeholder = 'Select chat'; |
|
this.searchInput.type = 'text'; |
|
this.selectedContainer.append(this.searchInput); |
|
topContainer.append(this.selectedContainer); |
|
this.selectedScrollable = new Scrollable(topContainer); |
|
|
|
let delimiter = document.createElement('hr'); |
|
|
|
this.chatsContainer.classList.add('chats-container'); |
|
this.chatsContainer.append(this.chatList); |
|
this.scrollable = new Scrollable(this.chatsContainer); |
|
|
|
// в десктопе - сначала без группы, потом архивные, потом контакты без сообщений |
|
let offsetIndex = 0; |
|
appMessagesManager.getConversations(offsetIndex, 50, 0).then(value => { |
|
let dialogs = value.dialogs; |
|
let myID = $rootScope.myID; |
|
|
|
offsetIndex = dialogs[value.dialogs.length - 1].index || 0; |
|
|
|
if(dialogs[0].peerID != myID) { |
|
dialogs.findAndSplice(d => d.peerID == myID); |
|
dialogs.unshift({ |
|
peerID: myID, |
|
pFlags: {} |
|
} as any); |
|
} |
|
|
|
dialogs.forEach(dialog => { |
|
let peerID = dialog.peerID; |
|
|
|
let {dom} = appDialogsManager.addDialog(dialog, this.chatList, false, false); |
|
dom.containerEl.insertAdjacentHTML('afterbegin', '<div class="checkbox"><label><input type="checkbox"><span></span></label></div>'); |
|
|
|
let subtitle = ''; |
|
if(peerID < 0) { |
|
subtitle = appChatsManager.getChatMembersString(-peerID); |
|
} else if(peerID == myID) { |
|
subtitle = 'chat with yourself'; |
|
} else { |
|
subtitle = appUsersManager.getUserStatusString(peerID); |
|
if(subtitle == 'online') { |
|
subtitle = `<i>${subtitle}</i>`; |
|
} |
|
} |
|
|
|
dom.lastMessageSpan.innerHTML = subtitle; |
|
}); |
|
}); |
|
|
|
this.chatList.addEventListener('click', (e) => { |
|
let target = e.target as HTMLElement; |
|
cancelEvent(e); |
|
|
|
if(this.freezed) return; |
|
|
|
if(target.tagName != 'LI') { |
|
target = findUpTag(target, 'LI'); |
|
} |
|
|
|
if(!target) return; |
|
|
|
let peerID = +target.getAttribute('data-peerID'); |
|
target.classList.toggle('active'); |
|
if(peerID in this.selected) { |
|
this.remove(peerID); |
|
} else { |
|
this.add(peerID); |
|
} |
|
|
|
let checkbox = target.querySelector('input') as HTMLInputElement; |
|
checkbox.checked = !checkbox.checked; |
|
}); |
|
|
|
this.selectedContainer.addEventListener('click', (e) => { |
|
if(this.freezed) return; |
|
let target = e.target as HTMLElement; |
|
target = findUpClassName(target, 'selector-user'); |
|
|
|
if(!target) return; |
|
|
|
let peerID = target.dataset.peerID; |
|
let li = this.chatList.querySelector('[data-peerid="' + peerID + '"]') as HTMLElement; |
|
li.click(); |
|
}); |
|
|
|
this.container.append(topContainer, delimiter, this.chatsContainer); |
|
appendTo.append(this.container); |
|
} |
|
|
|
private add(peerID: number) { |
|
let div = document.createElement('div'); |
|
div.classList.add('selector-user', 'scale-in'); |
|
div.dataset.peerID = '' + peerID; |
|
this.selected[peerID] = div; |
|
|
|
let title = appPeersManager.getPeerTitle(peerID, false, true); |
|
|
|
let avatarDiv = document.createElement('div'); |
|
avatarDiv.classList.add('user-avatar', 'tgico'); |
|
appProfileManager.putPhoto(avatarDiv, peerID); |
|
|
|
div.innerHTML = title; |
|
div.insertAdjacentElement('afterbegin', avatarDiv); |
|
|
|
this.selectedContainer.insertBefore(div, this.searchInput); |
|
this.selectedScrollable.scrollTop = this.selectedScrollable.scrollHeight; |
|
this.onChange(Object.keys(this.selected).length); |
|
} |
|
|
|
private remove(peerID: number) { |
|
let div = this.selected[peerID]; |
|
div.classList.remove('scale-in'); |
|
void div.offsetWidth; |
|
div.classList.add('scale-out'); |
|
div.addEventListener('animationend', () => { |
|
delete this.selected[peerID]; |
|
div.remove(); |
|
this.onChange(Object.keys(this.selected).length); |
|
}, {once: true}); |
|
} |
|
|
|
public getSelected() { |
|
return Object.keys(this.selected).map(p => +p); |
|
} |
|
} |
|
|
|
class AppForward { |
|
private container = document.getElementById('forward-container') as HTMLDivElement; |
|
private closeBtn = this.container.querySelector('.sidebar-close-button') as HTMLButtonElement; |
|
private sendBtn = this.container.querySelector('.btn-circle') as HTMLButtonElement; |
|
|
|
private selector: AppSelectPeers; |
|
private msgIDs: number[] = []; |
|
|
|
constructor() { |
|
this.closeBtn.addEventListener('click', () => { |
|
this.cleanup(); |
|
this.container.classList.remove('active'); |
|
appSidebarRight.onSidebarScroll(); |
|
}); |
|
|
|
this.sendBtn.addEventListener('click', () => { |
|
let peerIDs = this.selector.getSelected(); |
|
|
|
if(this.msgIDs.length && peerIDs.length) { |
|
this.sendBtn.classList.remove('tgico-send'); |
|
this.sendBtn.disabled = true; |
|
putPreloader(this.sendBtn); |
|
this.selector.freezed = true; |
|
|
|
let s = () => { |
|
let promises = peerIDs.splice(0, 3).map(peerID => { |
|
return appMessagesManager.forwardMessages(peerID, this.msgIDs); |
|
}); |
|
|
|
Promise.all(promises).then(() => { |
|
if(peerIDs.length) { |
|
return s(); |
|
} else { |
|
this.closeBtn.click(); |
|
} |
|
}); |
|
}; |
|
|
|
s(); |
|
} |
|
}); |
|
} |
|
|
|
public cleanup() { |
|
if(this.selector) { |
|
this.selector.container.remove(); |
|
this.selector = null; |
|
} |
|
} |
|
|
|
public init(ids: number[]) { |
|
this.cleanup(); |
|
this.msgIDs = ids; |
|
|
|
appSidebarRight.toggleSidebar(true); |
|
this.container.classList.add('active'); |
|
this.sendBtn.innerHTML = ''; |
|
this.sendBtn.classList.add('tgico-send'); |
|
this.sendBtn.disabled = false; |
|
|
|
this.selector = new AppSelectPeers(this.container, (length) => { |
|
if(length) { |
|
this.sendBtn.classList.add('is-visible'); |
|
} else { |
|
this.sendBtn.classList.remove('is-visible'); |
|
} |
|
}); |
|
} |
|
} |
|
|
|
export default new AppForward(); |