datasette-edit-templates/datasette_edit_templates/templates/edit_template.html
{% extends "base.html" %}
{% block title %}Edit template: {{ template }}{% endblock %}
{% block extra_head %}
<script src="{{ urls.static_plugins("datasette_edit_templates", "codemirror-5.57.0.min.js") }}"></script>
<link rel="stylesheet" href="{{ urls.static_plugins("datasette_edit_templates", "codemirror-5.57.0.min.css") }}" />
<script src="{{ urls.static_plugins("datasette_edit_templates", "cm-resize-1.0.1.min.js") }}"></script>
<style>
.CodeMirror { height: auto; min-height: 70px; width: 80%; border: 1px solid #ddd; }
.cm-resize-handle {
background: url("data:image/svg+xml,%3Csvg%20aria-labelledby%3D%22cm-drag-to-resize%22%20role%3D%22img%22%20fill%3D%22%23ccc%22%20stroke%3D%22%23ccc%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20width%3D%2216%22%20height%3D%2216%22%3E%0A%20%20%3Ctitle%20id%3D%22cm-drag-to-resize%22%3EDrag%20to%20resize%3C%2Ftitle%3E%0A%20%20%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M1%202.75A.75.75%200%20011.75%202h12.5a.75.75%200%20110%201.5H1.75A.75.75%200%20011%202.75zm0%205A.75.75%200%20011.75%207h12.5a.75.75%200%20110%201.5H1.75A.75.75%200%20011%207.75zM1.75%2012a.75.75%200%20100%201.5h12.5a.75.75%200%20100-1.5H1.75z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E");
background-repeat: no-repeat;
box-shadow: none;
cursor: ns-resize;
}
</style>
<style>
.CodeMirror {
border: 1px solid #eee;
height: {% if revision %}{{ revision.body.split("\n").__len__() }} {% else %}35{% endif %}vh;
}
.CodeMirror-scroll { max-height: none; }
</style>
{% endblock %}
{% block nav %}
<p class="crumbs">
<a href="{{ urls.instance() }}">Home</a> /
<a href="{{ urls.path("/-/edit-templates") }}">Edit templates</a>
</p>
{% endblock %}
{% block content %}
<h1>Edit template: {{ template }}</h1>
{% if revision %}
<p>Revision from {{ revision.created }}</p>
{% endif %}
{% if not from_db and not create_from_scratch %}<p>Original disk version:</p>{% endif %}
{% if create_from_scratch %}<p>Create a new template</p>{% endif %}
<form class="sql" action="{{ path }}" method="post">
<p><textarea name="body">{{ body }}</textarea></p>
<p>
<input type="hidden" name="csrftoken" value="{{ csrftoken() }}">
<input type="submit" value="{% if revision %}Revert to this revision{% else %}Save changes{% endif %}">
</p>
</form>
{% if revisions %}
<h2>Previous revisions</h2>
<ul>
{% for revision in revisions %}
<li>
<a href="{{ urls.path("/-/edit-templates/" + template + "?revision=") }}{{ revision.id }}">{{ pretty_datetime(revision.created) }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
<script src="{{ urls.static_plugins("datasette_edit_templates", "jinja2.js") }}"></script>
<script>
var htmlInput = document.querySelector('textarea');
var editor = CodeMirror.fromTextArea(htmlInput, {
lineNumbers: true,
mode: {name: "jinja2", htmlMode: true},
lineWrapping: true{% if revision %},
readOnly: true{% endif %}
});
cmResize(editor, {resizableWidth: false});
</script>
{% endblock %}