{% extends "base.html" %}

{% load thumbnail %}

{% block css %}
	<link rel="stylesheet" href="/static/jquery-ui/jquery-ui.min.css" />
{% endblock %}
{% block extra_css %}{% endblock %}

{% block js %}
	<script type="text/javascript" src="/static/base64.js"></script>
	<script type="text/javascript" src="/static/pyformsjs/pyforms.js"></script>
	<script type="text/javascript" src="/static/pyformsjs/pyforms-hub.js"></script>
	<script type="text/javascript" src="/static/jquery-ui/jquery-ui.min.js"></script>
	<script type="text/javascript" src="/static/orquestra.js"></script>
	{% for staticfile in styles_files %}
		<link rel="stylesheet" type="text/css" href="/static/{{staticfile}}">
	{% endfor %}
	{% for staticfile in javascript_files %}
		<script type="text/javascript" src="/static/{{staticfile}}"></script>
	{% endfor %}
{% endblock %}


{% block sidebar %}
	{% if 'left' in active_menus %}
		{% include "sidebar.html" %}
	{% endif %}
{% endblock %}

{% block page_content %}

<div class="ui pointing secondary tabular menu apps-tabs" id='applications-tab-menu' >
	<a class="item active app-tab" data-tab="tab-home"><i class="home icon"></i></a>
</div>

<div id='applications-tab-content'  >
	<div class="ui attached active tab app-tab" id="tab-home" data-tab="tab-home"></div>
</div>

<div class="ui small basic test modal transition scrolling"  id='confirm-tab-close' >
	<div class="ui icon header">
		<i class="power icon"></i>
		Close the tab
	</div>
	<div class="content ui center aligned segment">
		<p>Are you sure you want to close the tab?</p>
	</div>
	<div class="actions">
		<div class="ui red basic cancel inverted button">
			<i class="remove icon"></i>
			No
		</div>
		<div class="ui green ok inverted button">
			<i class="checkmark icon"></i>
			Yes
	  	</div>
	</div>
</div>




<script type="text/javascript">

	$('.ui.tabular .item.app-tab').on('click', function() {
		$('.ui.tabular .item.app-tab').removeClass('active');
		$('.tab.app-tab').removeClass('active');

		var tab = $(this).attr('data-tab');
		$(this).addClass('active');
		$('.tab.app-tab[data-tab="'+tab+'"]').addClass('active');
	});

	{% if running_menu %}
		$(document).ready(function(){run_application('{{ running_menu.fullname }}');});
	{% endif %}

</script>

<div class="ui dimmer" id='loading-label' ><div class="ui loader"></div></div>
<div class='ui modal' id='dialog' ></div>

{% endblock %}