{% extends "../base.html" %}

{% block title %}{{ _("Conferences") }}{% end block %}

{% block body %}
	<div class="page-header">
		<h3>{{ _("Conferences") }}</h3>
	</div>

	{% for conf in conferences %}
		<div class="well well-sm">
			<div class="btn-group pull-right">
				<a class="btn btn-default" href="/call/{{ conf.sip_id }}">
					<span class="glyphicon glyphicon-earphone"></span> {{ conf.sip_id }}
				</a>
				<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
					<span class="caret"></span>
					<span class="sr-only">{{ _("Toggle Dropdown") }}</span>
				</button>
				<ul class="dropdown-menu" role="menu">
					<li role="presentation" class="dropdown-header">{{ _("Invite participant") }}</li>
					{% for p in [p for p in conf.invitees if not current_user == p] %}
						<li>
							<a href="/conferences/{{ conf.sip_id }}/invite/{{ p.sip_id }}">
								<img src="{{ p.gravatar_icon(13) }}" alt="{{ p.name }}"> {{ p.name }}
							</a>
						</li>
					{% end %}
				</ul>
			</div>

			<h4>
				{{ _("IPFire Conference Room %s") % conf.no }}
			</h4>

			{% if conf.participants %}
				<hr>

				<ul class="list-unstyled">
					{% for p in conf.participants %}
						<li>
							{% if p.caller_account %}
								<img src="{{ p.caller_account.gravatar_icon(32) }}" alt="{{ p.caller_account.name }}" class="img-thumbnail">
								<a href="/phonebook/{{ p.caller_account.uid }}">{{ p.caller_account.name }}</a>
							{% else %}
								{{ p.caller }}
							{% end %}
							{{ _("joined %s") % locale.format_date(p.time, relative=True) }}
						</li>
					{% end %}
				</ul>
			{% end %}
		</div>
	{% end %}
{% end block %}