Differential D351 Diff 810 web/static/js/widgets/userstatus.js

Changeset View

Standalone View


				class UserStatusWidget
				{
				/**
				* Configuration:
				* - statusChange: handler function for status change
				*/
				constructor(id, config)
				{
				this.config = config \|\| {}
				this.id = id
				}

				/**
				* Renders user status widget
				*/
				render(presence)
				{
				let userStatusElement = document.getElementById(this.id)
				let icon = '<span class="glyphicon glyphicon-user"></span>'

				userStatusElement.innerHTML = `
				<div class="dropdown">
				<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
				<span class="status-${presence.status}">
				${icon} ${presence.user}
				</span>
				<span class="caret"></span>
				</button>
				<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
				<li><a href="#" class="status-online">${icon} Online</a></li>
				<li><a href="#" class="status-away">${icon} Away</a></li>
				<li><a href="#" class="status-busy">${icon} Busy</a></li>
				</ul>
				</div>
				`

				$('.dropdown-menu > li', userStatusElement).click(e => {
				let status_class = $(e.target).attr('class')
				if (this.config.statusChange && !$('button > span:first', userStatusElement).hasClass(status_class)) {
				this.config.statusChange(status_class.replace(/^status-/, ''))
				}
				})
				}
				}

				export default UserStatusWidget