{% extends main.twig %}

{% block content %}
<nav class="panel">
	<form method="POST">
	<input type="hidden" name="galene_subaction" value="new_room">
		<div class="panel-heading columns mx-0 p-0 my-2">
			<div class="column my-auto">{{ __("Rooms",'manager-for-galene-videoconference') }}</div>
				<div class="column field is-grouped is-grouped-right is-align-self-center py-0">
					<p class="control">
						<input type="hidden" name="galene_subaction" value="new_room" >
						<button type="submit" name="galene_action"
								title="{{{ __("Create a new room based on this template",'manager-for-galene-videoconference') }}}"
								value="admin_screen_roomedit" class="button is-primary is-outlined">
							<figure class="image is-16x16 mr-2">
							  <img src="{% echo esc_url(GALMGR_PLUGIN_URL . '/assets/magic-wand-outline.svg') %}">
							</figure>
							  {{ __("New room",'manager-for-galene-videoconference') }}
						</button>
					</p>
					<p class="control">
					  <div class="control">
						<div class="select">
						  <select name="new_room_preset" id="new_room_preset"  >
							<option value="conference"  >{{ __("Conference",'manager-for-galene-videoconference') }}</option>
							<option value="presentation"  >{{ __("Seminar",'manager-for-galene-videoconference') }}</option>
							<option value="closed_group"  >{{ __("Closed group",'manager-for-galene-videoconference') }}</option>
						  </select>
						</div>		  
					  </div>
					</p>
				</div>
		</div>
	</form>


  {% foreach($d['rooms'] as $room): %}
  <label class="panel-block is-block" >
	<div class="columns">
		<div class="column is-narrow">	
			<a class="image-button" title="{{{ __("Edit this room",'manager-for-galene-videoconference') }}}"
					href="{% echo esc_url(Galmgr_util::add_arg([ 'galene_action' => 'admin_screen_roomedit', 'galene_room' => $room->id ])) %}"  >
				<figure class="image is-24x24 mx-2">
				  <img src="{% echo esc_url(GALMGR_PLUGIN_URL . '/assets/edit-outline.svg') %}">
				</figure>
			</a>
		</div>
		<div class="column is-cursor-default">
			<div class="is-inline-block">
				<a class="is-underlined" title="{{{ __("Edit this room",'manager-for-galene-videoconference') }}}"
				href="{% echo esc_url(Galmgr_util::add_arg([ 'galene_action' => 'admin_screen_roomedit', 'galene_room' => $room->id ])) %}"  >
					{{ $room->displayName }}
				</a>
			</div>
			<div class="is-inline-block vertical-centered ml-4">	
				<a class="image-button is-info modal-button js-modal-trigger"  
						title="{{{ __("Display short info including links and code",'manager-for-galene-videoconference') }}}"
						data-target="modal-{{{ $room->id }}}" aria-haspopup="true">
					<figure class="image is-24x24 mx-2">
					  <img  src="{% echo esc_url(GALMGR_PLUGIN_URL . '/assets/info-circle.svg') %}">
					</figure>
				</a>
			</div>
		</div>
		<div class="column is-narrow" title="{{{ __("Permanently delete this room",'manager-for-galene-videoconference') }}}">	
			<a  onclick="return confirm('{{ __("Do you really want to delete this room? All data are lost.",'manager-for-galene-videoconference') }}');" class="image-button" href="{% echo esc_url(Galmgr_util::add_arg([ 'galene_action' => 'admin_room_delete', 'galene_room' => $room->id ])) %}"  >
				<figure class="image is-24x24 mx-2">
				  <img src="{% echo esc_url(GALMGR_PLUGIN_URL . '/assets/trash-outline.svg') %}">
				</figure>
			</a>
		</div>
  
  </div>
</label>  

	<div id="modal-{{{ $room->id }}}" class="modal xis-large-modal">
	  <div class="modal-background"></div>
	  <div class="modal-card">
		<header class="modal-card-head">
		  <p class="modal-card-title">{{ __("Shortinfo/Links",'manager-for-galene-videoconference') }}</p>
		  <button class="delete" aria-label="close"></button>
		</header>
		<section class="modal-card-body"  >	
			<div class="field">
			{% if($room->needs_code): %}
			  <label class="label">{{ __("Code",'manager-for-galene-videoconference') }}</label>
			  <div class="field is-grouped">
				  <div class="control">
					{{ $room->room_accesscode }}
				  </div>
				  <div class="control">
					<button onclick="copyText('{% echo esc_url($room->room_accesscode) %}'); return false;">{{ __("Copy code",'manager-for-galene-videoconference') }}</button>
				  </div>
			  </div>
			</div> 
			{% endif; %}
			<div class="field">
			  <label class="label">{{ __("Link for listener",'manager-for-galene-videoconference') }}</label>
			  <div class="field is-grouped">
				  <div class="control">
					<a href="{% echo esc_url( $room->{'urls'}['recipient']) %}" target="_blank">{{ $room->{'urls'}['recipient'] }}</a>
				  </div>
				  <div class="control">
					<button onclick="copyText('{% echo esc_url($room->{'urls'}['recipient']) %}'); return false;">{{ __("Copy link",'manager-for-galene-videoconference') }}</button>
				  </div>
			  </div>
			</div> 
			
			<div class="field">
			  <label class="label">{{ __("Link for presenter",'manager-for-galene-videoconference') }}</label>
			  <div class="field is-grouped">
				  <div class="control">
					<a href="{% echo esc_url($room->{'urls'}['presenter']) %}" target="_blank">{{ $room->{'urls'}['presenter'] }}</a>
				  </div>
				  <div class="control">
					<button onclick="copyText('{% echo esc_url($room->{'urls'}['presenter']) %}'); return false;">{{ __("Copy link",'manager-for-galene-videoconference') }}</button>
				  </div>
			  </div>
			</div> 
			
			<div class="field">
			  <label class="label">{{ __("Link for operator",'manager-for-galene-videoconference') }}</label>
			  <div class="field is-grouped">
				  <div class="control">
					<a href="{% echo esc_url($room->{'urls'}['admin']) %}" target="_blank">{{ $room->{'urls'}['admin'] }}</a>
				  </div>
				  <div class="control">
					<button onclick="copyText('{% echo esc_url($room->{'urls'}['admin']) %}'); return false;">{{ __("Copy link",'manager-for-galene-videoconference') }}</button>
				  </div>
			  </div>
			</div> 
		</section>
	  </div>
	</div>


  {% endforeach; %}
  
</nav>

{% endblock %}