105 lines
3.8 KiB
HTML
105 lines
3.8 KiB
HTML
{{define "title"}}{{if .IsNew}}New Post{{else}}Edit Post{{end}} — Admin{{end}}
|
|
|
|
{{define "content"}}
|
|
<div class="admin-wrap">
|
|
<div class="admin-header">
|
|
<h1>{{if .IsNew}}New Post{{else}}Edit: {{if .Post}}{{.Post.Title}}{{end}}{{end}}</h1>
|
|
<div class="admin-actions">
|
|
<a href="/admin" class="btn btn-outline">Back to Dashboard</a>
|
|
</div>
|
|
</div>
|
|
|
|
{{if .Error}}
|
|
<p class="form-error">{{.Error}}</p>
|
|
{{end}}
|
|
|
|
<form method="POST" action="{{if .IsNew}}/admin/new{{else}}/admin/edit/{{if .Post}}{{.Post.Slug}}{{end}}{{end}}" class="editor-form" id="post-form">
|
|
{{if .IsNew}}
|
|
<div class="form-row">
|
|
<label for="slug">Slug (filename, no .md)</label>
|
|
<input type="text" id="slug" name="slug" placeholder="my-post-slug" pattern="[a-z0-9\-_]+" required>
|
|
</div>
|
|
{{end}}
|
|
|
|
<div class="editor-toolbar">
|
|
<input type="file" id="img-file" accept="image/*" style="display:none">
|
|
<button type="button" id="upload-btn" class="btn btn-sm btn-outline">Insert Image</button>
|
|
<span id="upload-status" class="upload-status"></span>
|
|
</div>
|
|
|
|
<div class="editor-layout">
|
|
<div class="editor-pane">
|
|
<label for="content">Markdown</label>
|
|
<textarea id="content" name="content" class="editor-textarea" spellcheck="false">{{.Raw}}</textarea>
|
|
</div>
|
|
<div class="preview-pane">
|
|
<div class="preview-label">Preview <button type="button" id="preview-btn" class="btn btn-sm">Refresh</button></div>
|
|
<div id="preview-output" class="preview-output prose"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="editor-footer">
|
|
<button type="submit" class="btn">Save</button>
|
|
<a href="/admin" class="btn btn-outline">Cancel</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<script>
|
|
(function() {
|
|
var previewBtn = document.getElementById('preview-btn');
|
|
var uploadBtn = document.getElementById('upload-btn');
|
|
var imgFile = document.getElementById('img-file');
|
|
var textarea = document.getElementById('content');
|
|
var output = document.getElementById('preview-output');
|
|
var uploadStatus = document.getElementById('upload-status');
|
|
|
|
// --- Preview ---
|
|
function refreshPreview() {
|
|
var fd = new FormData();
|
|
fd.append('content', textarea.value);
|
|
fetch('/admin/preview', { method: 'POST', body: fd })
|
|
.then(function(r) { return r.text(); })
|
|
.then(function(html) { output.innerHTML = html; })
|
|
.catch(function() { output.innerHTML = '<p class="form-error">Preview failed.</p>'; });
|
|
}
|
|
|
|
previewBtn.addEventListener('click', refreshPreview);
|
|
if (textarea.value.trim()) { refreshPreview(); }
|
|
|
|
// --- Image upload ---
|
|
uploadBtn.addEventListener('click', function() { imgFile.click(); });
|
|
|
|
imgFile.addEventListener('change', function() {
|
|
if (!this.files.length) return;
|
|
var file = this.files[0];
|
|
var fd = new FormData();
|
|
fd.append('image', file);
|
|
|
|
uploadStatus.textContent = 'Uploading…';
|
|
uploadBtn.disabled = true;
|
|
|
|
fetch('/admin/upload', { method: 'POST', body: fd })
|
|
.then(function(r) { return r.json(); })
|
|
.then(function(data) {
|
|
if (data.error) {
|
|
uploadStatus.textContent = 'Error: ' + data.error;
|
|
return;
|
|
}
|
|
// Insert markdown at cursor position
|
|
var pos = textarea.selectionStart;
|
|
var before = textarea.value.substring(0, pos);
|
|
var after = textarea.value.substring(textarea.selectionEnd);
|
|
textarea.value = before + data.markdown + after;
|
|
textarea.selectionStart = textarea.selectionEnd = pos + data.markdown.length;
|
|
textarea.focus();
|
|
uploadStatus.textContent = 'Inserted: ' + data.url;
|
|
setTimeout(function() { uploadStatus.textContent = ''; }, 3000);
|
|
})
|
|
.catch(function() { uploadStatus.textContent = 'Upload failed.'; })
|
|
.finally(function() { uploadBtn.disabled = false; imgFile.value = ''; });
|
|
});
|
|
})();
|
|
</script>
|
|
{{end}}
|