mimouchat/cli/ui.js

/**
 * @param {SlackChan|SlackGroup} chan
 * @return {Element}
**/
function createChanListItem(chan) {
    var dom = document.createElement("li");
    dom.id = chan.id;
    dom.className = R.klass.chatList.entry;
    dom.textContent = chan.name;
    return dom;
}

/**
 * @param {SlackIms} ims
 * @return {Element}
**/
function createImsListItem(ims) {
    var dom = document.createElement("li");
    dom.id = ims.id;
    dom.className = R.klass.chatList.entry;
    dom.textContent = ims.user.name;
    return dom;
}

function onContextUpdated() {
    var chanListFram = document.createDocumentFragment();

    var sortedChans = SLACK.context.self ? Object.keys(SLACK.context.self.channels) : [];
    sortedChans.sort(function(a, b) {
        if (a[0] !== b[0]) {
            return a[0] - b[0];
        }
        return (SLACK.context.channels[a] || SLACK.context.groups[a]).name.localeCompare((SLACK.context.channels[b] || SLACK.context.groups[b]).name);
    });
    sortedChans.forEach(function(chanId) {
        var chan = SLACK.context.channels[chanId] || SLACK.context.groups[chanId]
            ,chanListItem = createChanListItem(chan);
        if (chanListItem) {
            chanListFram.appendChild(chanListItem);
        }
    });
    var sortedUsers = SLACK.context.users ? Object.keys(SLACK.context.users) : [];
    sortedUsers.sort(function(a, b) {
        return SLACK.context.users[a].name.localeCompare(SLACK.context.users[b].name);
    });
    sortedUsers.forEach(function(userId) {
        var ims = SLACK.context.users[userId].ims
            ,imsListItem = createImsListItem(ims);

        if (imsListItem) {
            chanListFram.appendChild(imsListItem);
        }
    });
    document.getElementById(R.id.chanList).textContent = "";
    document.getElementById(R.id.chanList).appendChild(chanListFram);
}

function onRoomSelected() {
    var name = SELECTED_ROOM.name || (SELECTED_ROOM.user ? SELECTED_ROOM.user.name : undefined);
    if (!name) {
        var members = [];
        for (var i in SELECTED_ROOM.members) {
            members.push(SELECTED_ROOM.members[i].name);
        }
        name = members.join(", ");
    }
    document.getElementById(R.id.currentRoom.title).textContent = name;
}

function onRoomUpdated() {
    console.log("Updated room", SLACK.history[SELECTED_ROOM.id]);
}

function onChanClick(e) {
    while (e.target !== e.currentTarget && e.target) {
        if (e.target.classList.contains(R.klass.chatList.entry)) {
            var room = (SLACK.context.channels[e.target.id] ||
                SLACK.context.ims[e.target.id] ||
                SLACK.context.groups[e.target.id]);

            if (room && room !== SELECTED_ROOM) {
                selectRoom(room);
            }
            return;
        }
        e.target = e.target.parentElement;
    }
}

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById(R.id.chatList).addEventListener("click", onChanClick);

    startPolling();
});