feathermost/view/view.js

113 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);