collaboration.on(EVENT_TYPE.USER_CHANGED, function (users, added, removed) {
    var collaboUserElement = document.getElementById('collabo-user-list');
    collaboUserElement.innerHTML = '';
    users.forEach((user) => {
        var userHTML = `<div id="collabo-user-${user.id}" class="collabo-user ${user.self ? 'collabo-self' : ''}">
            <span class="collabo-color" style="background-color: ${user.color}"></span>
            <span class="collabo-name">${user.name}</span>
        </div>`;
        collaboUserElement.insertAdjacentHTML('beforeend', userHTML);
    });
});