serv/surwiki
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Start implementing editor

Browse source
This commit is contained in:
Magnus Hoff 2017-09-02 15:32:59 +02:00
parent 405b203bc7
commit 2177cd7504
3 changed files with 79 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/site.rs
View file

@ -106,7 +106,8 @@ impl Resource for ArticleResource {
created: &'a chrono::DateTime<Local>,
title: &'a str,
body: String,
raw: &'a str,
rendered: String,
}
self.head().map(move |head|
@ -118,7 +119,8 @@ impl Resource for ArticleResource {
revision: self.data.revision,
created: &Local.from_utc_datetime(&self.data.created),
title: &self.data.title,
body: render_markdown(&self.data.body),
raw: &self.data.body,
rendered: render_markdown(&self.data.body),
}
}.to_string())
).boxed()

48
templates/article_revision.html
View file

@ -3,10 +3,20 @@
</header>
<article>
{{{body}}}
<div class="rendered">
{{{rendered}}}
</div>
<div class="editor">
<form action="" method="POST">
<input type=hidden name=revision value="{{revision}}">
<textarea name=body>{{raw}}</textarea>
<button type=submit>Save</button>
</form>
</div>
</article>
<footer>
<p><a id="openEditor" href="?editor=true">Edit</a></p>
<dl>
<dt>Article ID</dt>
<dd>{{article_id}}</dd>
@ -18,3 +28,39 @@
<dd>{{created}}</dd>
</dl>
</footer>
<script>
function openEditor() {
const rendered = document.querySelector(".rendered");
const editor = document.querySelector(".editor");
rendered.style.display = "none";
editor.style.display = "block";
const textarea = editor.querySelector("textarea");
textarea.style.height = (textarea.scrollHeight + 60) + "px";
const form = editor.querySelector("form");
form.addEventListener("submit", async function (ev) {
ev.preventDefault();
ev.stopPropagation();
const response = await fetch(
form.getAttribute("action"),
{
method: 'PUT',
body: new FormData(form),
}
);
});
}
document
.getElementById("openEditor")
.addEventListener("click", function (ev) {
ev.preventDefault();
ev.stopPropagation();
openEditor();
})
</script>

28
templates/layout.html
View file

@ -90,6 +90,7 @@ article {
footer {
padding: 16px 0;
background: #f8f8f8;
color: #444;
text-align: center;
@ -99,6 +100,10 @@ footer {
"Droid Sans", "Helvetica Neue", sans-serif;
}
footer dl {
margin: 0;
}
footer dt, footer dd {
display: inline;
margin: 0;
@ -119,6 +124,29 @@ footer dd:last-child::after {
margin: 0;
}
textarea {
border: none;
background: none;
margin: 0;
padding: 0;
font-family: "SF Mono", "Monaco",
"Inconsolata", "Fira Mono",
"Droid Sans Mono", "Source Code Pro",
monospace;
width: 100%;
height: 1000px;
}
.editor {
display: none;
}
button[type="submit"] {
position: fixed;
right: 20px;
bottom: 20px;
}
</style>
</head>
<body>