{% extends 'html/main.html' %}


{% block header_scripts %}
	<link rel="stylesheet" type="text/css" href="/static/codemirror.min.css">
	<style>
		.CodeMirror { height: 75vh; margin-top: 5px; border: 1px solid black }
	</style>
	<script src="/static/codemirror_md.min.js"></script>
{% endblock %}


{% block content %}
	<header>
		<div class="pwic_ph1"><a href="/{{pwic.project|urlencode}}/{{pwic.page|urlencode}}">{{pwic.emojis.finger_left}} {% trans %}Edit the page{% endtrans %}</a></div>
	</header>

	<article>
		<h1>[{{pwic.page|escape}}] {{pwic.title|escape}}</h1>

		{% if not pwic.manager and (pwic.protection or not pwic.editor) %}
			<p class="pwic_error">{{pwic.emojis.padlock}} {% trans %}You are not authorized to edit the page.{% endtrans %}</p>
		{% else %}
			<form id="edit_form" action="/api/page/edit" method="post">
				<p><strong><span class="pwic_red">*</span> {% trans %}Title:{% endtrans %}</strong> <input id="edit_title" class="pwic_fill" type="text" value="{{pwic.title|escape}}"></p>

				<p><strong>{% trans %}Tags:{% endtrans %}</strong> <input id="edit_tags" class="pwic_fill" type="text" value="{{pwic.tags|escape}}" title="{% trans %}No hash and separated by a space{% endtrans %}" spellcheck="false"></p>

				<div id="edit_toolbar">
					<div>
						<input type="button" value="{{pwic.emojis.glasses}}" title="{% trans %}Preview{% endtrans %}" onclick="edit_preview_md('{{pwic.page|urlencode}}')" data-shortcut="Ctrl-E">
						<input type="button" value="{{pwic.emojis.round_arrow_left}}" title="{% trans %}Undo{% endtrans %}" onclick="edit_undo(true)" data-shortcut="Ctrl-Z">
						<input type="button" value="{{pwic.emojis.round_arrow_right}}" title="{% trans %}Redo{% endtrans %}" onclick="edit_undo(false)" data-shortcut="Ctrl-Y">
					</div>
					<div>
						<input type="button" value="B" title="** {% trans %}Bold{% endtrans %} **" style="font-weight: bold" onclick="edit_decorate('**', '**')" data-shortcut="Ctrl-B">
						<input type="button" value="I" title="* {% trans %}Italic{% endtrans %} *" style="font-style: italic" onclick="edit_decorate('*', '*')" data-shortcut="Ctrl-I">
						<input type="button" value="U" title="-- {% trans %}Underline{% endtrans %} --" style="text-decoration: underline" onclick="edit_decorate('--', '--')" data-shortcut="Ctrl-U">
						<input type="button" value="S" title="~~ {% trans %}Strikethrough{% endtrans %} ~~" style="text-decoration: line-through" onclick="edit_decorate('~~', '~~')">
						<input type="button" value="^2" title="<sup> {% trans %}Superscript{% endtrans %} </sup>" onclick="edit_decorate('<sup>', '</sup>')">
						<input type="button" value="_2" title="<sub> {% trans %}Subscript{% endtrans %} </sub>" onclick="edit_decorate('<sub>', '</sub>')">
						<input type="button" value="{{pwic.emojis.chains}}" title="[{% trans %}Link{% endtrans %}](url)" onclick="edit_link()" data-shortcut="Ctrl-K">
					</div>
					<div>
						<input type="button" value="abCD" title="{% trans %}Upper/Lower case{% endtrans %}" onclick="edit_switch_case()" data-shortcut="Shift-F3">
						<input type="button" value="{{pwic.emojis.double}}" title="{% trans %}No double spaces{% endtrans %}" onclick="edit_double_spaces()">
						<input type="button" value="{{pwic.emojis.right}}" title="{% trans %}Shift to the right{% endtrans %}" onclick="edit_prepend('    ')">
						<input type="button" value="{{pwic.emojis.left}}" title="{% trans %}Shift to the left{% endtrans %}" onclick="edit_left_line()">
						<input type="button" value="{{pwic.emojis.noblank}}" title="{% trans %}No blank line{% endtrans %}" onclick="edit_no_blank_line()">
						<input type="button" value="{{pwic.emojis.oneline}}" title="{% trans %}As single line{% endtrans %}" onclick="edit_single_line()">
					</div>
					<div>
						<input type="button" value="H1" title="# {% trans %}Title{% endtrans %} 1" onclick="edit_prepend('# ')" data-shortcut="Shift-Ctrl-F1">
						<input type="button" value="H2" title="## {% trans %}Title{% endtrans %} 2" onclick="edit_prepend('## ')" data-shortcut="Shift-Ctrl-F2">
						<input type="button" value="H3" title="### {% trans %}Title{% endtrans %} 3" onclick="edit_prepend('### ')" data-shortcut="Shift-Ctrl-F3">
						<input type="button" value="H4" title="#### {% trans %}Title{% endtrans %} 4" onclick="edit_prepend('#### ')" data-shortcut="Shift-Ctrl-F4">
						<input type="button" value="H5" title="##### {% trans %}Title{% endtrans %} 5" onclick="edit_prepend('##### ')" data-shortcut="Shift-Ctrl-F5">
						<input type="button" value="H6" title="###### {% trans %}Title{% endtrans %} 6" onclick="edit_prepend('###### ')" data-shortcut="Shift-Ctrl-F6">
						<input type="button" value="{% trans %}Footnote{% endtrans %}" title="[^1] {% trans %}Footnote{% endtrans %}" onclick="edit_footnote()">
						<input type="button" value="[{% trans %}Annotation{% endtrans %}]" title="&lt;!-- {% trans %}Annotation{% endtrans %} --&gt;" onclick="edit_decorate('&lt;!-- ', ' --&gt;')">
					</div>
					<div>
						<input type="button" value="{% trans %}Line{% endtrans %}" title="{% trans %}Horizontal line{% endtrans %}" onclick="edit_decorate('\n---\n\n', '')">
						<input id="edit_toolbar_table" type="button" value="Table" title="{% trans %}Table{% endtrans %} | {% trans %}Table{% endtrans %}" onclick="edit_table()">
						<input type="button" value="{% trans %}AutoTable{% endtrans %}" title="{% trans %}Paste as target table{% endtrans %}" onclick="edit_table_import()">
						<input type="button" value="- {% trans %}List{% endtrans %}" title="- {% trans %}Bulleted list{% endtrans %}" onclick="edit_prepend('- ')" data-shortcut="Ctrl-L">
						<input type="button" value="1. {% trans %}List{% endtrans %}" title="1. {% trans %}Numbered list{% endtrans %}" onclick="edit_prepend_nlist()">
						<input type="button" value="- [X] {% trans %}Tasks{% endtrans %}" onclick="edit_prepend('- [ ] ')">
						<input type="button" value="> {% trans %}Quote{% endtrans %}" onclick="edit_prepend('> ')">
						<input type="button" value=">! {% trans %}Spoiler{% endtrans %}" onclick="edit_prepend('>! ')">
						<input type="button" value="`{% trans %}Keyword{% endtrans %}`" title="`{% trans %}Monospaced keyword{% endtrans %}`" onclick="edit_decorate('`', '`')" data-shortcut="Ctrl-'">
						<input type="button" value="{% trans %}Code{% endtrans %}" title="```{% trans %}Code{% endtrans %}```" onclick="edit_decorate('```\n', '\n```')">
						{% if pwic.env.emojis %}
							<input type="button" value="{{pwic.emojis.bang}}" title="{% trans %}Emojis{% endtrans %}" onclick="$('#edit_emojis').toggleClass('pwic_hidden');md_editor.focus()">
						{% endif %}
						{% if pwic.env.remote_url %}
							<input type="button" value="{{pwic.emojis.recycle}}" title="{% trans %}Fetch a remote web page{% endtrans %}" onclick="edit_convert_remote_document()">
						{% endif %}
						{% if not pwic.env.no_dictation %}
							<input id="edit_toolbar_dictate" type="button" value="{{pwic.emojis.microphone}}" title="{% trans %}Dictate{% endtrans %}">
						{% endif %}
					</div>
				</div>

				{% if pwic.env.emojis %}
					<div id="edit_emojis" class="pwic_hidden">
						{% set list = pwic.emojis_toolbar.split(' ') %}
						{% for e in list %}
							{% if e|is_hex %}
								{% if e[-4:] == 'fe0f' %}
									{% set e = '&#x' + e[:-4]|upper + ';&#xFE0F;' %}
								{% else %}
									{% set e = '&#x' + e|upper + ';' %}
								{% endif %}
								<span title="{% trans %}Insert{% endtrans %}" onclick="edit_decorate_end('{{e|escape}} ')">{{e}}</span>
							{% endif %}
						{% endfor %}
					</div>
				{% endif %}

				<textarea id="edit_markdown">{{pwic.markdown|escape}}</textarea>

				{% if (not pwic.env.document_size_max) or (pwic.env.document_size_max.value|int > 0) %}
					<h2>{% trans %}Documents{% endtrans %}</h2>
					<div id="edit_files_drop" ondrop="edit_drop(event)" ondragover="edit_dragover(event)" ondragleave="edit_dragleave(event)">
						<input type="button" value="{{pwic.emojis.refresh}}" title="{% trans %}Refresh{% endtrans %}" onclick="edit_refresh_documents()">
						<input class="pwic_mobile" type="button" value="{{pwic.emojis.inbox}}" title="{% trans %}Upload a new document{% endtrans %}" onclick="edit_upload_document()" style="margin-left: 15px">
						<br>
						{% trans %}Drop the files here{% endtrans %}
						{% if pwic.env.document_size_max %}
							({% trans %}max:{% endtrans %} {{pwic.env.document_size_max.value|size2str|escape}})
						{% endif %}

						{% trans %}and save immediately{% endtrans %}
					</div>
					<table id="edit_files_list" class="pwic_break">
						<tr>
							<th>{% trans %}Action{% endtrans %}</th>
							<th>{% trans %}File name{% endtrans %}</th>
							<th class="pwic_desktop" title="{% trans %}For the latest saved revision only{% endtrans %}">{% trans %}Used{% endtrans %}</th>
							<th>{% trans %}Size{% endtrans %}</th>
							<th class="pwic_desktop">{% trans %}Format{% endtrans %}</th>
							<th class="pwic_desktop">{% trans %}Author{% endtrans %}</th>
							<th>{% trans %}Date{% endtrans %}</th>
							<th class="pwic_desktop">{% trans %}Time{% endtrans %}</th>
							<th>{% trans %}File{% endtrans %}</th>
						</tr>
					</table>
				{% endif %}

				<h2>{% trans %}Attributes{% endtrans %}</h2>
				<p><strong><span class="pwic_red">*</span> {% trans %}Reason for the modification:{% endtrans %}</strong> <input id="edit_comment" class="pwic_fill" type="text" placeholder="{{pwic.comment|escape}}"></p>
				<p><strong>{% trans %}Milestone:{% endtrans %}</strong> <input id="edit_milestone" class="pwic_fill" type="text" value="{{pwic.milestone|escape}}" title="{% trans %}Free text to report the expected readiness of the page{% endtrans %}"></p>
				<p>
					<input id="edit_draft" type="checkbox" {% if pwic.draft %}checked="checked"{% endif %} onclick="$('#edit_final').prop('checked', false)"> <label for="edit_draft">{% trans %}Draft{% endtrans %}</label>
					<br><input id="edit_final" type="checkbox" onclick="$('#edit_draft').prop('checked', false)"> <label for="edit_final">{% trans %}Final version{% endtrans %}</label>
					<br><input id="edit_header" type="checkbox" {% if pwic.header %}checked="checked"{% endif %} {% if not pwic.manager %}disabled="disabled"{% endif %}> <label for="edit_header">{% trans %}Header line *{% endtrans %}</label>
					<br><input id="edit_protection" type="checkbox" {% if pwic.protection %}checked="checked"{% endif %} {% if not pwic.manager %}disabled="disabled"{% endif %}> <label for="edit_protection">{% trans %}Protected page *{% endtrans %}</label>
				</p>
				<p>
					<input id="edit_submit" type="button" value="{{pwic.emojis.save}} {% trans %}Save the modifications{% endtrans %}" onclick="edit_submit_form()">
					<input id="edit_preview" type="button" value="{{pwic.emojis.glasses}} {% trans %}Preview{% endtrans %}" onclick="edit_preview_md('{{pwic.page|urlencode}}')">
				</p>
			</form>

			{% include 'js/page-edit.js' %}
		{% endif %}
	</article>
{% endblock %}
