diff --git a/truthinquiry/static/css/admin_ui.css b/truthinquiry/static/css/admin_ui.css index c1b5e9a..db69d63 100644 --- a/truthinquiry/static/css/admin_ui.css +++ b/truthinquiry/static/css/admin_ui.css @@ -33,6 +33,11 @@ body { margin: var(--body-margin); } +button, input { + font-family: "Roboto Mono", sans-serif; + font-size: 1em; +} + header { align-content: center; align-items: center; @@ -94,7 +99,6 @@ svg { } .short_color_transition:hover { - transition-property: background-color, color; transition-duration: 0.25s; transition-timing-function: linear; } diff --git a/truthinquiry/static/css/admin_ui_login.css b/truthinquiry/static/css/admin_ui_login.css index 5f17c34..1bd1fd0 100644 --- a/truthinquiry/static/css/admin_ui_login.css +++ b/truthinquiry/static/css/admin_ui_login.css @@ -6,7 +6,6 @@ form { } input { - font-family: "Roboto Mono", sans-serif; font-size: 1em; margin: 1em; padding: 0.25em; diff --git a/truthinquiry/static/css/admin_ui_npc.css b/truthinquiry/static/css/admin_ui_npc.css new file mode 100644 index 0000000..b20e796 --- /dev/null +++ b/truthinquiry/static/css/admin_ui_npc.css @@ -0,0 +1,75 @@ +button { + display: flex; +} + +button, input { + background-color: transparent; + border-color: var(--admin-white-color); + border-style: solid; + border-width: 0.125em; + color: var(--admin-white-color); + margin: 1em; + padding: 0.25em; +} + +input[type="text"] { + width: 20em; +} + +.action_buttons, .answer_groups { + align-content: center; + display: flex; + flex-wrap: wrap; + justify-content: center; +} + +.action_button { + align-items: center; + border-radius: 1em; + cursor: pointer; + display: flex; + flex-direction: row; + justify-content: center; + padding: 0.25em; +} + +.action_button:hover { + background-color: var(--admin-white-color); + color: var(--admin-grey-color); +} + +.action_button:hover > .action_icon { + fill: var(--admin-grey-color); +} + +.action_icon { + height: 2em; + transition-property: fill; + width: 2em; +} + +.character_image { + width: 15em; +} + +.character_image, #npc_name { + margin-left: auto; + margin-right: auto; +} + +.character_image, #npc_name { + display: block; +} + +.info_item { + font-size: 1.25em; +} + +.info_item, .section_title { + text-align: center; +} + +.section_title { + font-size: 1.5em; + margin: 1em; +} diff --git a/truthinquiry/static/images/no_photography_white.svg b/truthinquiry/static/images/no_photography_white.svg new file mode 100644 index 0000000..86cb855 --- /dev/null +++ b/truthinquiry/static/images/no_photography_white.svg @@ -0,0 +1 @@ + diff --git a/truthinquiry/static/js/admin.js b/truthinquiry/static/js/admin.js index faeb6dc..e452a1f 100644 --- a/truthinquiry/static/js/admin.js +++ b/truthinquiry/static/js/admin.js @@ -87,33 +87,3 @@ function saveFormQuestions(){ makeAPIRequest("admin/setQuestions", {"questions": data, "lang": "FR"}, {"content": "json"}) } - -//functions for npc.html - -function saveFormNpc(){ - let data = {} - - data["id"] = npc.querySelector("#npc_id").value; - data["name"] = npc.querySelector("#npc_name").value; - - let allAnswersJson = []; - data["allAnswers"] = allAnswersJson; - - for(let answerTypeNode of npc.querySelectorAll(".answerType")){ - let answersJson = []; - let answerTypeJson = {"answers": answersJson}; - allAnswersJson.push(answerTypeJson); - - for(let answerNode of answerTypeNode.querySelectorAll("input")){ - answersJson.push({"text": answerNode.value}) - } - } - - makeAPIRequest("admin/setNpc", {"npc": data, "lang": "FR"}, {"content": "json"}) -} - -async function deleteNpc(){ - let npc_id = npc.querySelector("#npc_id").value; - await makeAPIRequest("admin/deleteNpc", {"npc_id": npc_id, "lang": "FR"}, {"content": "json"}); - document.location = "/admin"; -} \ No newline at end of file diff --git a/truthinquiry/static/js/admin_npc.js b/truthinquiry/static/js/admin_npc.js new file mode 100644 index 0000000..0b345d0 --- /dev/null +++ b/truthinquiry/static/js/admin_npc.js @@ -0,0 +1,33 @@ +function createOrUpdateNpc() { + const data = {}; + data["id"] = document.querySelector("#npc_id").value; + data["name"] = document.querySelector("#npc_name").value; + + const allAnswersJson = []; + data["allAnswers"] = allAnswersJson; + + for (let answerTypeNode of document.querySelector(".answer_groups").children) { + const answersJson = []; + const answerTypeJson = {"answers": answersJson}; + allAnswersJson.push(answerTypeJson); + + answerTypeNode.querySelectorAll("input").forEach(answerNode => { + answersJson.push({"text": answerNode.value}); + }); + } + + makeAPIRequest("admin/setNpc", {"npc": data, "lang": "FR"}, {"content": "json"}).then(() => { + alert("Opération effectuée avec succès"); + }); +} + +async function deleteNpc() { + if (!confirm("Voulez-vous vraiment supprimer ce personnage ?")) { + return; + } + + const npcId = document.querySelector("#npc_id").value; + await makeAPIRequest("admin/deleteNpc", {"npc_id": npcId, "lang": "FR"}, {"content": "json"}); + alert("Opération effectuée avec succès"); + document.location = "/admin"; +} diff --git a/truthinquiry/templates/admin/npc.html b/truthinquiry/templates/admin/npc.html index 13bd483..1742f65 100644 --- a/truthinquiry/templates/admin/npc.html +++ b/truthinquiry/templates/admin/npc.html @@ -1,36 +1,82 @@ - NPC + Truth Inquiry - {{'Gestion' if npc.get('id') else 'Ajout'}} d'un personnage - - + + + + + + + + + + - go Back
- -
-
- Npc name: - - - -
- -
-

Answers:

- {%for answer_type in npc.get("answers") or []%} -
- {%for answer in answer_type%} - - {%endfor%} -
- {%endfor%} -
+
+ Accueil + Gestion des questions + Gestion des lieux + Gestion des réactions + Déconnexion +
+

Truth Inquiry - Interface d'administration

+

{{'Gestion' if npc.get('id') else 'Ajout'}} d'un personnage

+

Cliquez sur les champs pour éditer les informations. Dans les réponses aux questions lors de l'interrogation, utilisez « {NPC} » pour faire référence au nom d'un personnage et « {SALLE} » pour faire référence au nom d'une salle.

+
+

Informations sur le personnage

+ +

Nom du personnage

+ +

Image du personnage

+ {{'Image du personnage' + (' ' + npc.get('name') if npc.get('name') else '')}}
- - - +
+

Réponses aux questions lors de l'interrogation

+
+ {%for answer_type in npc.get("answers") or []%} +
+ {%for answer in answer_type%} + + {%endfor%} +
+ {%endfor%} +
+
+
+ {% if npc.get('id'): %} + + + {% else: %} + + {% endif %} +
+ + +