{% extends "photos/base-wide.html" %}
{% load photo_tags %}

{% load i18n %}

{% block title %}{% blocktrans %}Manual Upload Form{% endblocktrans %}{% endblock %}
{% block extra_head %}
    {{ block.super }}
	<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/photos.css">
	<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}swfupload/swfupload.visual.css">
{% endblock %}

{% block body %}

	<div class="t">

        <div class="photos-nav">
            {% photo_set_nav request.user photo_set %}
        </div>

        <h1>{% trans "Upload photos" %}</h1>
        {% if image_slot_left > 0 %}
        <p>{% blocktrans with slots=image_slot_left %}
            Image slots left: {{ slots }}
        {% endblocktrans %}</p> 
        <div id="swf-progress-wrap">
            <div id="swf-progress-init"></div>
            <div id="swf-progress"></div>
            <div id="swf-msg-mask"><div>{% trans "Select photos to upload" %}</div></div>
            <div id="swf-object-mask"></div>
        </div>
        {% else %}
            <h2>{% trans "Sorry but you have uploaded the max number (50) of images available for this photo set" %}
        {% endif %}
    </div>

{% endblock %}

{% block extra_body %}
{{ block.super }}
<script src="{{ STATIC_URL }}swfupload/swfupload.js" type="text/javascript"></script>
<script src="{{ STATIC_URL }}swfupload/swfupload.cookies.js" type="text/javascript"></script>
<script src="{{ STATIC_URL }}swfupload/swfupload.handlers.js" type="text/javascript"></script>
<script src="{{ STATIC_URL }}swfupload/swfupload.swfobject.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">

	for(var i=0; i<10; i++){ // bg image via js
		$('#swf-progress-init').append('<div class="even"></div>');
		$('#swf-progress-init').append('<div class="odd"></div>');
	}

	var swfupload;

	window.onload = function() {
		swfupload = new SWFUpload({
		debug: false,
		
		upload_url: "{% url photos_batch_add photoset_id %}",
		flash_url: "{{ LOCAL_STATIC_URL }}swfupload/swfupload.swf",
		post_params: {
			"title" : "", 
			"caption" : "", 
			"is_public" : true,
			"safetylevel" : "1", 
			"tags" : "", 
			"action" : "upload",
			"photoset_id" : "{{ photoset_id }}",
			"csrfmiddlewaretoken": "{{ csrf_token }}"
		},

		// File upload settings
		file_size_limit : "20480",	// 20 MB
		file_types : "*.jpg;*.jpeg;*.gif;*.png;*.tif;*.tiff;*.JPG;*.JPEG;",
		file_types_description : "Photos",
		file_post_name: "image",
        file_upload_limit: "{{ image_slot_left }}",
		
		// Button settings (opens file-browse dialogue)
		button_placeholder_id: "swf-object-mask",
		button_width: $('#swf-progress-wrap').width(),
		button_height: $('#swf-progress-wrap').height(),
		button_cursor: SWFUpload.CURSOR.HAND,
		button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,

		// Event handlers
		swfupload_loaded_handler : swfUploadLoaded,
		swfupload_pre_load_handler : swfUploadPreLoad,
		swfupload_load_failed_handler : swfUploadLoadFailed,
		upload_complete_handler : uploadComplete,
		file_queued_handler : fileQueued,
		file_queue_error_handler : fileQueueError,
		file_dialog_complete_handler : fileDialogComplete,
		upload_start_handler : uploadStart,
		upload_progress_handler : uploadProgress,
		upload_error_handler : uploadError,
		upload_success_handler : uploadSuccess,

		custom_settings : {
			progressTarget : "swf-progress",
			cancelButtonId : "btnCancel1",
			redirect: get_redirect_url()
		},

		// SWFObject settings
		minimum_flash_version : "9.0.28",
		debug: false

		});
	};

	get_redirect_url = function(){
		var photoset_id = {{ photoset_id }};
		if(photoset_id) return "/photos/batch-edit/{{ photoset_id }}";
		else return "/photos/batch-edit/";
	};

</script>
{% endblock %}
