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

48
templates/article_revision.html
View file

@ -3,10 +3,20 @@
</header> </header>
<article> <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> </article>
<footer> <footer>
<p><a id="openEditor" href="?editor=true">Edit</a></p>
<dl> <dl>
<dt>Article ID</dt> <dt>Article ID</dt>
<dd>{{article_id}}</dd> <dd>{{article_id}}</dd>
@ -18,3 +28,39 @@
<dd>{{created}}</dd> <dd>{{created}}</dd>
</dl> </dl>
</footer> </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 { footer {
padding: 16px 0;
background: #f8f8f8; background: #f8f8f8;
color: #444; color: #444;
text-align: center; text-align: center;
@ -99,6 +100,10 @@ footer {
"Droid Sans", "Helvetica Neue", sans-serif; "Droid Sans", "Helvetica Neue", sans-serif;
} }
footer dl {
margin: 0;
}
footer dt, footer dd { footer dt, footer dd {
display: inline; display: inline;
margin: 0; margin: 0;
@ -119,6 +124,29 @@ footer dd:last-child::after {
margin: 0; 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> </style>
</head> </head>
<body> <body>