| {% extends 'projects/edit_layout.html' %}

| {% block page_title %}Edit {{ project.name }}{% endblock %}
| {% set title = 'edit' %}

| {% block project_context_header %}
#project_context-header.d-flex.justify-content-end.position-fixed.bg-white
	ul.d-flex.list-unstyled.py-1.px-2.mb-0.h-auto.justify-content-end(
		class="project-edit-tools disabled")

		li.button-cancel
			a#item_cancel.project-mode-edit.btn.btn-sm.btn-link(
				href="{{url_for('projects.view', project_url=project.url, _external=True)}}",
				title="Cancel changes")
				i.button-cancel-icon.pi-angle-left
				| Go to Project

		li.button-save
			a.btn.btn-sm.btn-outline-success.ml-2.px-3.text-capitalize(
				id="item_save",
				class="project-mode-edit",
				href="#",
				title="Save changes")
				i.pi-check.pr-2.button-save-icon
				| Save Changes
| {% endblock %}

| {% block project_context %}
.container-fluid
	.row
		.col-md-12
			h5.pl-2.mb-0.pt-3 Project Overview

#node-edit-container
	form(
		id="node-edit-form"
		method='POST',
		action="{{url_for('projects.edit', project_url=project.url)}}")

		| {% with errors = errors %}
		| {% if errors %}
		| {% for field in errors %}
		.alert.alert-danger(role='alert')
			strong {{field}}
			| {% for message in errors[field] %}
			| {{message}}|
			| {% endfor %}
		| {% endfor %}
		| {% endif %}
		| {% endwith %}

		| {% for field in form %}

		| {% if field.name == 'csrf_token' %}
		| {{ field }}
		| {% else %}
		| {% if field.type == 'HiddenField' %}
		| {{ field }}
		| {% else %}

		| {% if field.name not in hidden_fields %}

		.form-group(class="{{field.name}}{% if field.errors %} error{% endif %}")
			| {{ field.label }}
			| {% if field.name == 'picture' %}
			| {% if post.picture %}
			img.node-preview-thumbnail(src="{{ post.picture.thumbnail('m', api=api) }}")
			a(href="#", class="file_delete", data-field-name="picture", data-file_id="{{post.picture._id}}") Delete
			| {% endif %}
			| {% endif %}
			| {{ field(class='form-control') }}

			| {% if field.errors %}
			ul.error
				| {% for error in field.errors %}
				li {{ error }}
				| {% endfor %}
			| {% endif %}

		| {% else %}
		| {{ field(class='d-none') }}
		| {% endif %}

		| {% endif %}
		| {% endif %}

		| {% endfor %}

		hr

		ul.d-flex.list-unstyled.py-1.px-2.mb-0.h-auto.justify-content-end(
			class="project-edit-tools disabled")
			li.button-cancel
				a#item_cancel.project-mode-edit.btn.btn-link(
					href="{{url_for('projects.view', project_url=project.url, _external=True)}}",
					title="Cancel changes")
					i.button-cancel-icon.pi-angle-left
					| Go to Project

			li.button-save
				a.btn.btn-sm.btn-outline-success.ml-2.px-3.text-capitalize(
					id="item_save",
					class="project-mode-edit",
					href="#",
					title="Save changes")
					i.pi-check.pr-2.button-save-icon
					| Save Changes

| {% endblock %}

| {% block footer_container %}{% endblock %}

| {% block footer_scripts %}
script(type='text/javascript', src="{{ url_for('static_pillar', filename='assets/js/vendor/jquery.ui.widget.min.js') }}")
script(type='text/javascript', src="{{ url_for('static_pillar', filename='assets/js/vendor/jquery.iframe-transport.min.js') }}")
script(type='text/javascript', src="{{ url_for('static_pillar', filename='assets/js/vendor/jquery.fileupload.min.js') }}")
script(type='text/javascript', src="{{ url_for('static_pillar', filename='assets/js/file_upload.min.js') }}")

script(type="text/javascript").

	// Show edit mode buttons (save, cancel).
	$('.project-mode-edit').displayAs('inline-block');

	ProjectUtils.setProjectAttributes({projectId: "{{project._id}}", isProject: true, nodeId: ''});

	$('.button-save').on('click', function(e){
		e.preventDefault();
		// Disable beforeunolad when submitting a form
		$(window).off('beforeunload');

		$(this).children('a').html('<i class="pi-spin spin"></i> Saving');
		$('#node-edit-form').submit();
	});

	/* Build the markdown preview when typing in textarea */
	$(function() {

		var $contentField = $('.form-group.description textarea'),
				$contentPreview = $('<div class="node-edit-form-md-preview" />').insertAfter($contentField);

		function parseDescriptionContent(content) {

			pillar.api.thenMarkdownToHtml(content)
			.done(function (data) {
				$contentPreview.html(data.content);
			})
			.fail(function (err) {
				toastr.error(xhrErrorResponseMessage(err), 'Parsing failed');
			});
		}

		var options = {
			callback: parseDescriptionContent,
			wait: 750,
			highlight: false,
			allowSubmit: false,
			captureLength: 2
		}

		$contentField.typeWatch(options);

		$('input, textarea').keypress(function () {
			// Unused: save status of the page as 'edited'
			ProjectUtils.setProjectAttributes({isModified: true});
			// Set the beforeunload to warn the user of unsaved changes
			$(window).on('beforeunload', function () {
				return 'You have unsaved changes in your project.';
			});
		});
	});

| {% endblock %}
