114 lines
3.2 KiB
JavaScript
114 lines
3.2 KiB
JavaScript
function populateServerSelectionList() {
|
|
const servers = credentials.getServers();
|
|
|
|
let nodes = [];
|
|
for (let server of servers) {
|
|
const li = document.createElement("li");
|
|
const endpoint = humanReadableEndpoint(server.endpoint);
|
|
li.innerText = `${server.login_id}@${endpoint} `;
|
|
|
|
const logoutButton = document.createElement("button");
|
|
logoutButton.className = "logout";
|
|
logoutButton.innerText = "Log out";
|
|
logoutButton.addEventListener("click", e => logOut(endpoint, e.currentTarget));
|
|
|
|
li.appendChild(logoutButton);
|
|
nodes.push(li);
|
|
}
|
|
byId("server_selection_list").innerHTML = "";
|
|
byId("server_selection_list").append(...nodes);
|
|
}
|
|
|
|
function populateChannelList() {
|
|
async function addChannelItems(endpoint) {
|
|
const client = createClient(endpoint);
|
|
|
|
const teams = await client.myTeams();
|
|
console.log(teams);
|
|
|
|
for (let team of teams) {
|
|
let nodes = [];
|
|
const channels = await client.myChannels(team.id);
|
|
console.log(channels);
|
|
for (let channel of channels) {
|
|
const li = document.createElement("li");
|
|
const a = document.createElement("a");
|
|
a.href = "javascript:void(0)";
|
|
const titleAndElements = channelNameElements(team, channel);
|
|
if (!titleAndElements) continue;
|
|
a.title = titleAndElements[0];
|
|
a.append(...titleAndElements[1]);
|
|
|
|
a.addEventListener("click", () => switchToChannel(client, team, channel));
|
|
|
|
li.appendChild(a);
|
|
li.dataset["id"] = channel.id;
|
|
nodes.push(li);
|
|
}
|
|
byId("channel_list").append(...nodes);
|
|
}
|
|
}
|
|
|
|
const servers = credentials.getServers();
|
|
|
|
byId("channel_list").innerHTML = "";
|
|
for (let server of servers) {
|
|
addChannelItems(server.endpoint);
|
|
}
|
|
}
|
|
|
|
|
|
function populateChannelContents(contents) {
|
|
byId("channel_contents").innerHTML = "";
|
|
|
|
let nodes = [];
|
|
for (let id of contents.order) {
|
|
const post = contents.posts[id];
|
|
|
|
const isThreadReply = !!post.parent_id;
|
|
|
|
const messageDiv = document.createElement("div");
|
|
messageDiv.className = "message";
|
|
messageDiv.innerText = post.message;
|
|
|
|
const createAt = new Date(post.create_at);
|
|
const createAtDiv = document.createElement("time");
|
|
createAtDiv.className = "create_at";
|
|
createAtDiv.innerText = createAt.toLocaleString("nl-BE");
|
|
createAtDiv.dateTime = createAt.toISOString();
|
|
|
|
const authorDiv = document.createElement("div");
|
|
authorDiv.className = "author";
|
|
authorDiv.innerText = `Auteur: ${post.user_id}`;
|
|
|
|
const postDiv = document.createElement("div");
|
|
postDiv.className = "post";
|
|
postDiv.dataset["id"] = id;
|
|
postDiv.appendChild(authorDiv);
|
|
postDiv.appendChild(createAtDiv);
|
|
postDiv.appendChild(messageDiv);
|
|
|
|
nodes.unshift(postDiv);
|
|
}
|
|
|
|
byId("channel_contents").append(...nodes);
|
|
checkScrolledToBottom();
|
|
}
|
|
|
|
|
|
function updateComposeHeight() {
|
|
byId("compose").style.height = "";
|
|
byId("compose").style.height = (byId("compose").scrollHeight + 1) + "px";
|
|
}
|
|
byId("compose").addEventListener("input", updateComposeHeight);
|
|
|
|
function checkScrolledToBottom() {
|
|
const el = byId("channel_contents_wrapper");
|
|
|
|
const scrolledTo = el.clientHeight + el.scrollTop;
|
|
const scrollHeight = el.scrollHeight
|
|
const atBottom = scrolledTo >= scrollHeight;
|
|
el.className = atBottom ? "" : "not-at-bottom";
|
|
}
|
|
byId("channel_contents_wrapper").addEventListener("scroll", checkScrolledToBottom);
|