room.html

{% extends "base.html" %}

{% block content %}

<h2>{{ room.name }}</h2>

{% if form.errors %}
<div class="w3-panel w3-pale-red w3-leftbar w3-border-red">
	<p>There was an issue storing the room settings, see details on form below</p>
</div>
{% elif updated %}
<div class="w3-panel w3-pale-green w3-leftbar w3-border-green">
	<p>Room updated successfully</p>
</div>
{% endif %}

{% if modapi_details.password %}
<div class="w3-card-4">
	<div class="w3-container w3-hochschulblau">
		<h2>Room Password</h2>
	</div>
	<form id="passwordreset-modform" action="?" method="post" class="w3-container">
		<p>This room is password protected.</p>
		{% csrf_token %}
		<p><input class="w3-input w3-green" type="submit" name="resetpassword" value="Remove password" /></p>
	</form>
</div>
<br/>
{% endif %}

<div class="w3-card-4">
	<div class="w3-container w3-hochschulblau">
		<h2>Room Occupants</h2>
	</div>
	<ul class="w3-ul w3-border">
		{% if modapi_details.occupants %}
		{% for occupant in modapi_details.occupants %}
		<li class="w3-bar">
			{% if occupant.role == "moderator" %}
			<img src="/static/icons/star.svg" class="w3-bar-item" style="width:55px">
			{% else %}
			<img src="/static/icons/person.svg" class="w3-bar-item" style="width:55px">
			{% endif %}
			<div class="w3-bar-item"><span>{{ occupant.nick }}</span></div>
			<div class="w3-bar-item w3-right w3-right-align">
				<form id="roomoccupant-modform-{{ forloop.counter }}" action="?" method="post">{% csrf_token %}<input type="hidden" name="{% if occupant.role == "moderator" %}revoke{% else %}grant{% endif %}" value="{{ occupant.nick }}" /></form>
				<span><a href="#" onclick='document.getElementById("roomoccupant-modform-{{ forloop.counter }}").submit();' style='color:red;'>{% if occupant.role == "moderator" %}revoke{% else %}grant{% endif %} moderator permissions</a></span>
			</div>
		</li>
		{% endfor %}
		{% else %}
		<li>Room seems to be empty</li>
		{% endif %}
	</ul>
</div>
<br/>

{% if recordings %}
<div class="w3-card-4">
	<div class="w3-container w3-hochschulblau">
		<h2>Recordings</h2>
	</div>
	<ul class="w3-ul w3-border">
		{% for video in recordings %}
		<li class="w3-bar">
			{% if video.masterfile %}<a href="/video/{{ video.key }}">{% endif %}
			{% if video.thumbnail %}
			<img src="{{ MEDIA_URL }}{{ video.thumbnail }}?key={{ video.key }}&timestamp={{ video.updated_at|date:'U' }}" class="w3-bar-item" style="width:128px" />
			{% else %}
			<img src="/static/icons/video.svg" class="w3-bar-item" style="width:128px;padding-left:30px;padding-right:30px;" />