<style>

	#file-status {
		margin-top: 1em;
		margin-bottom: 0;
	}

</style>

{button class="btn btn-danger mb-1" data_toggle="modal" data_target="#newrequest" accesskey="N" icon="helpdesk" label="New Request"}

<div class="modal fade" id="newrequest" tabindex="-1" role="dialog" aria-labelledby="newrequest" aria-hidden="true">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">{trans("New Request")}</h4>
				{button class="close" data_dismiss="modal" icon="cancel"}
			</div>
			<div class="modal-body">
				<form method="post" action="?m=helpdesk" name="helpdesk" enctype="multipart/form-data">
					{if $queues|size == 1}
						<input type="hidden" name="helpdesk[queue]" value="{$queues[0].id}">
					{else}
					<div class="form-group">
						<label for="queue" class="font-weight-bold">{trans("Queue:")}</label>
						<select name="helpdesk[queue]" id="queue" {userpaneltip class="form-control" text="Select queue" trigger="queue"}>
							{foreach $queues as $queue}
								<option value="{$queue.id}"{if $helpdesk.queue == $queue.id} selected{/if}>{$queue.name}</option>
							{/foreach}
						</select>
					</div>
					{/if}
					<div class="form-group">
						<label for="subject" class="font-weight-bold">{trans("Subject:")}</label>
						<input type="text" name="helpdesk[subject]" id="subject" value="{$helpdesk.subject}"
								maxlength="{ConfigHelper::getConfig('rt.subject_max_length', 50)}"
								{userpaneltip class="form-control" text="Enter request subject" trigger="subject"} placeholder="{trans("Enter request subject")}" required />
					</div>

					<div class="form-group">
						<label for="body" class="font-weight-bold">{trans("Body:")}</label>
						<textarea name="helpdesk[body]" id="body" {userpaneltip class="form-control" text="Enter request contents" trigger="body"} placeholder="{trans("Enter request contents")}" rows="5" cols="40" required>{$helpdesk.body}</textarea>
					</div>

					<div class="form-group">
						<label for="attachments" class="font-weight-bold">{trans("Attachments:")}</label>
						<input type="file" name="files[]" id="attachments" {userpaneltip class="form-control-file" text="Enter path to file or click 'Browse' button" trigger="files"} multiple />
						<input type="hidden" id="post_max_size" value="{$post_max_size.bytes}">
						<input type="hidden" id="upload_max_filesize" value="{$upload_max_filesize.bytes}">
						<div id="file-status" class="alert alert-danger"{if !isset($error.files)} style="display: none;"{/if}>
							{if isset($error.files)}
								{$error.files}
							{/if}
						</div>
						<small class="form-text">
							{t a=$post_max_size.text}Maximum total file size: $a{/t}
						</small>
						<small class="form-text">
							{t a=$upload_max_filesize.text}Maximum single file size: $a{/t}
						</small>
					</div>

				</form>
			</div>
			<div class="modal-footer">
				{button type="submit" class="btn btn-danger submit-button" formnovalidate=true accesskey="S" icon="message" label="<!helpdesk>Submit"}
				{button class="btn btn-secondary" data_dismiss="modal" icon="close" label="Close"}
				<input type="hidden" name="wyslane" value="1">
			</div>
		</div>
	</div>
</div>
<script>

	$(function() {
		{if $error}
		$('#newrequest').modal('show');
		{/if}

		function check_file_sizes() {
			var attachments = $('#attachments').get(0);
			$('#file-status').hide().text();
			if (attachments.files.length) {
				var error = '';
				var post_max_size = parseInt($('#post_max_size').val());
				var upload_max_filesize = parseInt($('#upload_max_filesize').val());
				var total_size = 0;
				$.each(attachments.files, function (index, file) {
					if (upload_max_filesize && file.size > upload_max_filesize) {
						error = '{trans("One from files is too large!")}';
					}
					total_size += file.size;
				});
				if (post_max_size && total_size > post_max_size) {
					error = '{trans("Total file size is too large!")}';
				}
				if (error.length) {
					$('#file-status').text(error).show();
					return false;
				}
			}
			return true;
		}

		$('#attachments').change(function() {
			check_file_sizes();
		});

		$('#newrequest .submit-button').click(function() {
			if ($(this).is("[disabled]")) {
				return false;
			}
			$(this).attr('disabled', 'disabled');
			if (check_file_sizes()) {
				document.helpdesk.submit();
			} else {
				$(this).removeAttr('disabled');
			}
		});
	});

</script>
