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

{% block header %}
	<!--<script type='text/javascript' src="{{ STATIC_URL }}autocomplete/jquery.bgiframe.min.js"></script>
	<script type='text/javascript' src="{{ STATIC_URL }}autocomplete/jquery.ajaxQueue.js"></script>-->

	<script src="{{ STATIC_URL }}itsapp/scripts/photo_modul.js"></script>
	<script>
	$(document).ready(function(data) {
		initPhotoModul("{{gallery.identificator}}","{{photo.id}}");
	});
	</script>
{% endblock %}

{% block content %}
	<h2><a href="{% url gallery_detail gallery.identificator%}">Gallery {{gallery.name}}</a></h2>
	<h3>{{photo.name}}</h3>
	<div class="photo">
		<div class="photo-image">
			{% include "itsapp/photo_navigation.html"%}
			{% if next_photo %}
				<a href="{% url show_photo gallery.identificator next_photo.id%}">
			{% endif %}
			<div id="module_photo_img"> </div>

			<img class ="module_progress" id="photo_progress" src="{{STATIC_URL}}img/ajax-loader.gif"/>

			{% if next_photo %}
				</a>
			{% endif %}
		</div>
		<div class="photo-tags">
			<form class="form" onsubmit="return false">
				Návrhy tagů:</p>
				<img class ="module_progress" id="suggestion_progress" src="{{STATIC_URL}}img/ajax-loader.gif"/>
				<div id="suggestion_list">
				</div>
				Označené tagy:</p>
				<img class ="module_progress" id="tags_progress" src="{{STATIC_URL}}img/ajax-loader.gif"/>	
				<div id="tags_list">
									
				</div>
				<div class="cb"></div>
				<p>
					<label for="add_tag_text">Tag: </label>
					<input  type="text" id="add_tag_text" class="ac_input" />
					<input id="tag_add_button_positive"type="submit" value="add"/>
				</p>
			</form>
		</div>
	</div>
{% endblock %}
