Add name and description editor.
This commit is contained in:
parent
9f45f0851a
commit
2c5617207a
1 changed files with 67 additions and 3 deletions
|
@ -3,7 +3,7 @@
|
|||
<head>
|
||||
{% import "header.html" as header %}
|
||||
{% import "tag_object.html" as tag_object %}
|
||||
{% if specific is none %}
|
||||
{% if specific_tag is none %}
|
||||
<title>Tags</title>
|
||||
{% else %}
|
||||
<title>Tag {{specific_tag.name}}</title>
|
||||
|
@ -42,6 +42,12 @@ body
|
|||
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
#description_text
|
||||
{
|
||||
font-family: initial;
|
||||
padding: 8px;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
#editor_area
|
||||
{
|
||||
display: flex;
|
||||
|
@ -73,8 +79,23 @@ body
|
|||
<div id="content_body">
|
||||
<div id="left">
|
||||
{% if specific_tag is not none %}
|
||||
<h1>{{specific_tag.name}}</h1>
|
||||
<p>{{specific_tag.description}}</p>
|
||||
<h2>
|
||||
<span
|
||||
id="name_text"
|
||||
data-editor-id="name"
|
||||
data-editor-placeholder="name"
|
||||
>
|
||||
{{-specific_tag.name-}}
|
||||
</span>
|
||||
</h2>
|
||||
<pre
|
||||
id="description_text"
|
||||
data-editor-id="description"
|
||||
data-editor-placeholder="description"
|
||||
{% if specific_tag.description == "" %}class="hidden"{% endif -%}
|
||||
>
|
||||
{{-specific_tag.description-}}
|
||||
</pre>
|
||||
{% endif %}
|
||||
<ul>
|
||||
{% for tag in tags %}
|
||||
|
@ -182,5 +203,48 @@ function receive_callback(responses)
|
|||
create_message_bubble(message_area, message_positivity, message_text, 8000);
|
||||
}
|
||||
}
|
||||
|
||||
{% if specific_tag is not none %}
|
||||
function on_open(editor, edit_element_map)
|
||||
{
|
||||
editor.open();
|
||||
edit_element_map["name"].focus();
|
||||
}
|
||||
|
||||
function on_save(editor, edit_element_map, display_element_map)
|
||||
{
|
||||
var name_display = display_element_map["name"];
|
||||
var name_editor = edit_element_map["name"];
|
||||
var description_editor = edit_element_map["description"];
|
||||
|
||||
editor.show_spinner();
|
||||
function callback(response)
|
||||
{
|
||||
console.log(response);
|
||||
editor.hide_spinner();
|
||||
if (response["_status"] == 200)
|
||||
{
|
||||
var new_name = response["name"];
|
||||
var new_description = response["description"];
|
||||
document.title = "Tag " + new_name;
|
||||
window.history.replaceState(null, null, "/tag/" + new_name);
|
||||
name_editor.value = new_name;
|
||||
description_editor.value = new_description;
|
||||
editor.save();
|
||||
}
|
||||
}
|
||||
|
||||
var url = "/tag/" + name_display.innerText + "/edit";
|
||||
var data = new FormData();
|
||||
data.append("name", name_editor.value);
|
||||
data.append("description", description_editor.value);
|
||||
post(url, data, callback);
|
||||
}
|
||||
on_cancel = undefined;
|
||||
|
||||
var name_text = document.getElementById("name_text");
|
||||
var description_text = document.getElementById("description_text");
|
||||
var editor = new Editor([name_text, description_text], on_open, on_save, on_cancel);
|
||||
{% endif %}
|
||||
</script>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue