2021-06-12 03:51:07 +00:00
{{ template "base.html" . }}
{{ define "extrahead" }}
2021-12-07 05:20:12 +00:00
{{ template "markdown_previews.html" . }}
2021-09-22 19:18:39 +00:00
< script src = "{{ static " js / base64 . js " } } " > < / script >
2022-08-02 02:01:55 +00:00
< script src = "{{ static " js / markdown_upload . js " } } " > < / script >
2021-07-20 01:12:27 +00:00
< style >
#editor {
resize: vertical;
}
2021-09-21 23:13:11 +00:00
2021-09-23 03:35:07 +00:00
#editor.drop {
box-shadow: inset 0px 0px 5px yellow;
}
2021-07-20 01:12:27 +00:00
< / style >
2021-06-12 03:51:07 +00:00
{{ end }}
{{ define "content" }}
2021-07-20 01:12:27 +00:00
< div class = "content-block ph3 ph0-ns" >
2022-09-10 16:29:57 +00:00
{{ if not .CanEditPostTitle }}
< h2 > {{ .PostTitle }}< / h2 >
2021-07-20 02:35:22 +00:00
{{ end }}
2021-07-20 01:12:27 +00:00
< div class = "flex flex-column flex-row-ns" >
2021-09-01 06:15:13 +00:00
< form id = "form" action = "{{ .SubmitUrl }}" method = "post" class = "flex-fair-ns overflow-hidden" >
2021-07-20 01:12:27 +00:00
{{ csrftoken .Session }}
2022-09-10 16:29:57 +00:00
{{ if .CanEditPostTitle }}
< input id = "title" class = "b w-100 mb1" name = "title" type = "text" placeholder = "Post title..." value = "{{ .PostTitle }}" / >
2021-07-20 02:35:22 +00:00
{{ end }}
2021-07-20 01:12:27 +00:00
{{/* TODO: Reintroduce the toolbar in a way that makes sense for Markdown */}}
{{/*
< div class = "toolbar" id = "toolbar" >
< input type = "button" id = "bold" value = "B" / >
< input type = "button" id = "italic" value = "I" / >
< input type = "button" id = "underline" value = "U" / >
< input type = "button" id = "monospace" value = "monospace" / >
< input type = "button" id = "url" value = "url" / >
< input type = "button" id = "img" value = "img" / >
< input type = "button" id = "code" value = "code" / >
< input type = "button" id = "quote_simple" value = "quote (anon)" / >
< input type = "button" id = "quote_member" value = "quote (member)" / >
< input type = "button" id = "spoiler" value = "spoiler" / >
< input type = "button" id = "lalign" value = "Left" / >
< input type = "button" id = "calign" value = "Center" / >
< input type = "button" id = "ralign" value = "Right" / >
< input type = "button" id = "ulist" value = "ul" / >
< input type = "button" id = "olist" value = "ol" / >
< input type = "button" id = "litem" value = "li" / >
< input type = "button" id = "youtube" value = "youtube" / >
< / div >
*/}}
2021-07-30 22:32:19 +00:00
< textarea id = "editor" class = "w-100 h6 minh-6 pa2 mono lh-copy" name = "body" > {{ .EditInitialContents }}< / textarea >
2021-06-12 03:51:07 +00:00
2021-09-23 03:35:07 +00:00
< div class = "flex justify-end items-center mt2" >
< div class = "upload_bar flex-grow-1" >
< div class = "instructions" >
Upload files by dragging & dropping, pasting, or < label class = "pointer link" for = "file_input" > selecting< / label > them.
< / div >
< div class = "progress flex" >
< div class = "progress_text mr3" > < / div >
< div class = "progress_bar flex-grow-1 flex-shrink-1 pa1" > < div class = "" > < / div > < / div >
< / div >
< / div >
2021-09-22 10:59:03 +00:00
< input type = "submit" class = "button ml2 flex-grow-0 flex-shrink-0" name = "submit" value = "{{ .SubmitLabel }}" / >
2021-07-20 01:12:27 +00:00
< / div >
2021-06-13 17:22:55 +00:00
2021-07-20 01:12:27 +00:00
{{ if .IsEditing }}
< span class = "editreason" >
< label for = "editreason" > Edit reason:< / label >
< input name = "editreason" maxlength = "255" type = "text" id = "editreason" / >
< / span >
{{ end }}
2021-07-20 02:35:22 +00:00
{{ with .PostReplyingTo }}
< h4 class = "mt3" > The post you're replying to:< / h4 >
2021-09-01 06:15:13 +00:00
< div class = "mh-6 overflow-y-auto" >
{{ template "forum_post_standalone.html" . }}
< / div >
2021-07-20 02:35:22 +00:00
{{ end }}
2022-09-10 16:29:57 +00:00
{{ if .ShowEduOptions }}
{{/* Hope you have a .Article field! */}}
< div class = "bg--dim br3 pa3 mt3" >
< h4 > Education Options< / h4 >
< div class = "mb2" >
< label for = "slug" > Slug:< / label >
< input name = "slug" maxlength = "255" type = "text" id = "slug" required value = "{{ .Article.Slug }}" / >
< / div >
< div class = "mb2" >
< label for = "type" > Type:< / label >
< select name = "type" id = "type" >
< option value = "article" { { if eq . Article . Type " article " } } selected { { end } } > Article< / option >
< option value = "glossary" { { if eq . Article . Type " glossary " } } selected { { end } } > Glossary Term< / option >
< / select >
< / div >
< div class = "mb2" >
< label for = "description" > Description:< / label >
< div >
< textarea name = "description" id = "slug" required > {{ .Article.Description }}< / textarea >
< / div >
< / div >
< div class = "mb2" >
< label for = "published" > Published:< / label >
< input name = "published" id = "published" type = "checkbox" { { if . Article . Published } } checked { { end } } >
< / div >
< / div >
{{ end }}
2021-07-20 01:12:27 +00:00
< / form >
2022-09-10 16:29:57 +00:00
< div id = "preview-container" class = "post post-preview mathjax flex-fair-ns overflow-auto mv3 mv0-ns ml3-ns pa3 br3 bg--dim {{ .PreviewClass }}" >
2021-09-01 06:15:13 +00:00
< div id = "preview" class = "post-content" > < / div >
2021-06-13 17:22:55 +00:00
< / div >
2021-09-23 03:35:07 +00:00
< input type = "file" multiple name = "file_input" id = "file_input" class = "dn" / > {{/* NOTE(asaf): Placing this outside the form to avoid submitting it to the server by accident */}}
2021-07-20 01:12:27 +00:00
< / div >
2021-06-12 03:51:07 +00:00
< / div >
2021-06-13 17:22:55 +00:00
< script >
2021-09-23 03:35:07 +00:00
const maxFileSize = {{ .MaxFileSize }};
const uploadUrl = {{ .UploadUrl }};
2021-09-21 23:13:11 +00:00
2021-07-20 00:52:50 +00:00
const form = document.querySelector('#form');
2021-07-22 01:48:52 +00:00
const titleField = document.querySelector('#title'); // may be undefined, be careful!
const textField = document.querySelector('#editor');
2021-06-13 17:22:55 +00:00
const preview = document.querySelector('#preview');
2021-12-07 05:20:12 +00:00
// Save content on change, clear on submit
const clearFuncs = [];
2021-07-22 01:48:52 +00:00
if (titleField) {
2021-12-07 05:20:12 +00:00
const { clear: clearTitle } = autosaveContent({
inputEl: titleField,
storageKey: `post-title/${window.location.host}${window.location.pathname}`,
});
clearFuncs.push(clearTitle);
2021-07-22 01:48:52 +00:00
}
2021-12-07 05:20:12 +00:00
const { clear: clearContent } = autosaveContent({
inputEl: textField,
storageKey: `post-content/${window.location.host}${window.location.pathname}`,
});
clearFuncs.push(clearContent);
2021-07-20 00:52:50 +00:00
form.addEventListener('submit', e => {
2021-12-07 05:20:12 +00:00
for (const clear of clearFuncs) {
clear();
}
2021-06-16 04:04:01 +00:00
});
2021-09-21 23:13:11 +00:00
2021-12-07 05:20:12 +00:00
// Do live Markdown previews
2021-12-21 05:13:02 +00:00
let doMarkdown = initLiveMarkdown({ inputEl: textField, previewEl: preview });
2021-12-07 05:20:12 +00:00
2021-09-23 03:35:07 +00:00
/*
/ Asset upload
*/
2022-08-02 02:01:55 +00:00
setupMarkdownUpload(
2022-08-02 02:59:42 +00:00
document.querySelectorAll("#form input[type=submit]"),
2022-08-02 02:01:55 +00:00
document.querySelector('#file_input'),
document.querySelector('.upload_bar'),
textField,
doMarkdown,
maxFileSize,
uploadUrl
);
2021-06-13 17:22:55 +00:00
< / script >
2021-06-12 03:51:07 +00:00
{{ end }}