DjalimSimaila/SAE-A2-TruthInquiry
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #113 from ThomasRubini/admin_html

Browse Source
This commit is contained in:
Thomas Rubini 2023-03-20 16:37:30 +01:00 committed by GitHub
commit c69edc3248
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 257 additions and 198 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
truthinquiry/static/css/admin_ui.css Normal file
View File

@ -0,0 +1,26 @@
#places>section {
border: thin solid red;
padding: 5px;
margin-top: 20px;
}
#section>input{
width: 100%;
}
.questionTypeTag{
border: thin solid red;
margin-top: 20px;
}
.questionTypeTag input{
width: 100%;
}
.questionType{
border: thin solid red;
margin-top: 20px;
}
.question input{
width: 100%;
margin: 10px;
}

94
truthinquiry/static/js/admin.js Normal file
View File

@ -0,0 +1,94 @@
//functions for places.html
function addNewInputPlaces(){
let newPlace = places.lastElementChild.cloneNode(true);
newPlace.id = "";
newPlace.querySelector("input").value = "";
places.appendChild(newPlace);
}
function deletePlace(buttonNode){
let placeNode = buttonNode.parentNode;
placeNode.parentNode.removeChild(placeNode);
}
function saveForm(){
let data = [];
for(let section of places.querySelectorAll("section")){
let place = {};
place["id"] = section.id
place["name"] = section.querySelector("input").value
data.push(place);
}
makeAPIRequest("admin/setPlaces", {"places": data, "lang": "FR"}, {"content": "json"})
}
//functions for traits.html
function addNewInputTraits(){
let newTrait = traits.lastElementChild.cloneNode(true);
newTrait.id = "";
newTrait.querySelector(".name_input").value = "";
newTrait.querySelector(".desc_input").value = "";
traits.appendChild(newTrait);
}
function deleteTrait(buttonNode){
let traitNode = buttonNode.parentNode;
traitNode.parentNode.removeChild(traitNode);
}
function saveFormTraits(){
let data = [];
for(let section of traits.querySelectorAll("section")){
let trait = {};
trait["id"] = section.id
trait["name"] = section.querySelector(".name_input").value
trait["desc"] = section.querySelector(".desc_input").value
data.push(trait);
}
makeAPIRequest("admin/setTraits", {"traits": data, "lang": "FR"}, {"content": "json"})
}
//functions for questions.html
function addEntry(button){
let questionTypeContent = button.parentNode.querySelector(".questionTypeContent");
let newQuestion = questionTypeContent.querySelector(".question").cloneNode(true);
newQuestion.id = "";
newQuestion.querySelector("input").value = "";
questionTypeContent.appendChild(newQuestion);
}
function deleteEntry(buttonNode){
let placeNode = buttonNode.parentNode;
placeNode.parentNode.removeChild(placeNode);
}
function saveFormQuestions(){
let data = [];
for(let questionTypeNode of allQuestions.querySelectorAll(".questionType")){
let questionsJson = [];
let questionTypeJson = {"questions": questionsJson};
data.push(questionTypeJson);
for(let questionNode of questionTypeNode.querySelectorAll("input")){
questionsJson.push({"text": questionNode.value})
}
}
makeAPIRequest("admin/setQuestions", {"questions": data, "lang": "FR"}, {"content": "json"})
}
function changeLang(){
}

39
truthinquiry/templates/admin/index.html
View File

@ -1,14 +1,25 @@
<a href="/admin/questions"> Questions </a> <!DOCTYPE html>
<br> <html lang="fr">
<a href="/admin/places"> Places </a> <head>
<br> <title>Admin Page</title>
<a href="/admin/traits"> Traits </a> <meta charset="UTF-8">
<section> <link rel="stylesheet" href="admin_ui.css">
<p> NPC list :</p> <script src="/static/js/admin.js"></script>
{%for npc in npcs%} </head>
<a href="/admin/npc/{{npc['id']}}"> {{npc['name']}} </a> <body>
<br> <a href="/admin/questions"> Questions </a>
{%endfor%} <br>
<br> <a href="/admin/places"> Places </a>
<a href="/admin/npc/new"> Nouveau NPC </a> <br>
</section> <a href="/admin/traits"> Traits </a>
<section>
<p> NPC list :</p>
{%for npc in npcs%}
<a href="/admin/npc/{{npc['id']}}"> {{npc['name']}} </a>
<br>
{%endfor%}
<br>
<a href="/admin/npc/new"> Nouveau NPC </a>
</section>
</body>
</html>

46
truthinquiry/templates/admin/npc.html
View File

@ -1,19 +1,29 @@
<a href="/admin"> go Back </a> <br> <!DOCTYPE html>
<html lang="fr">
<section> <head>
<span>Npc name: </span> <input value="{{ npc.get('name') or ''}}"> <title>NPC</title>
<img href="{{npc.get('img')}}"> <meta charset="UTF-8">
</section> <link rel="stylesheet" href="admin_ui.css">
<script src="/static/js/admin.js"></script>
<section> </head>
<p>Answers:</p> <body>
{%for answer_type in npc.get("answers") or []%} <a href="/admin"> go Back </a> <br>
<section>
{%for answer in answer_type%}
<input value="{{answer}}">
{%endfor%}
</section>
{%endfor%}
</section>
<section>
<span>Npc name: </span>
<input value="{{ npc.get('name') or ''}}">
<img href="{{npc.get('img')}}">
</section>
<section>
<p>Answers:</p>
{%for answer_type in npc.get("answers") or []%}
<section>
{%for answer in answer_type%}
<input value="{{answer}}">
{%endfor%}
</section>
{%endfor%}
</section>
</body>
</html>

73
truthinquiry/templates/admin/places.html
View File

@ -1,53 +1,26 @@
<a href="/admin"> go Back </a> <br> <!DOCTYPE html>
<html lang="fr">
<head>
<title>Places</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="admin_ui.css">
<script src="/static/js/admin.js"></script>
<script src="/static/js/api.js"></script>
</head>
<body>
<a href="/admin"> go Back </a> <br>
<style> <section id="places">
section section{ {%for place in places%}
border: thin solid red; <section id="{{place['id']}}">
padding: 5px; <input value="{{place['name']}}">
margin-top: 20px; <button onclick="deletePlace(this)">Delete place</button>
} </section>
section section input{ {%endfor%}
width: 100%; </section>
} <button onclick="addNewInputPlaces()">Add new</button>
</style> <button onclick="saveFormPlaces()">Save changes</button>
</body>
<section id="places"> </html>
{%for place in places%}
<section id="{{place['id']}}">
<input value="{{place['name']}}">
<button onclick="deletePlace(this)">Delete place</button>
</section>
{%endfor%}
</section>
<button onclick="addNewInput()">Add new</button>
<button onclick="saveForm()">Save changes</button>
<script src="/static/js/api.js"></script>
<script>
function addNewInput(){
let newPlace = places.lastElementChild.cloneNode(true);
newPlace.id = "";
newPlace.querySelector("input").value = "";
places.appendChild(newPlace);
}
function deletePlace(buttonNode){
let placeNode = buttonNode.parentNode;
placeNode.parentNode.removeChild(placeNode);
}
function saveForm(){
let data = [];
for(let section of places.querySelectorAll("section")){
let place = {};
place["id"] = section.id
place["name"] = section.querySelector("input").value
data.push(place);
}
makeAPIRequest("admin/setPlaces", {"places": data, "lang": "FR"}, {"content": "json"})
}
</script>

105
truthinquiry/templates/admin/questions.html
View File

@ -1,78 +1,41 @@
<a href="/admin"> go Back </a> <br> <!DOCTYPE html>
<html lang="fr">
<head>
<title>Admin Page</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="admin_ui.css">
<script src="/static/js/admin.js"></script>
<script src="/static/js/api.js"></script>
</head>
<body>>
<a href="/admin"> go Back </a> <br>
<select id="langs" onchange="changeLang()"> <select id="langs" onchange="changeLang()">
{%for lang in langs%} {%for lang in langs%}
<option value="{{lang}}">{{lang}}</option> <option value="{{lang}}">{{lang}}</option>
{%endfor%} {%endfor%}
</select> </select>
<section id="allQuestions"> <section id="allQuestions">
{%for questionType in questions%} {%for questionType in questions%}
<div class="questionType"> <div class="questionType">
<section class="questionTypeContent"> <section class="questionTypeContent">
{%for question in questionType["questions"]%} {%for question in questionType["questions"]%}
<section class="question"> <section class="question">
<input value="{{question['text']}}"> <input value="{{question['text']}}">
<button onclick="deleteEntry(this)">Delete question</button> <button onclick="deleteEntry(this)">Delete question</button>
</section> </section>
{%endfor%}
</section>
<button onclick="addEntry(this)">Add new</button>
</div>
{%endfor%} {%endfor%}
</section> </section>
<button onclick="addEntry(this)">Add new</button>
</div>
{%endfor%}
</section>
<br> <br>
<button onclick="saveForm()"> Save changes </button> <button onclick="saveFormQuestions()"> Save changes </button>
</body>
<style> </html>
.questionType{
border: thin solid red;
margin-top: 20px;
}
.question input{
width: 100%;
margin: 10px;
}
</style>
<script src="/static/js/api.js"></script>
<script>
function addEntry(button){
let questionTypeContent = button.parentNode.querySelector(".questionTypeContent");
let newQuestion = questionTypeContent.querySelector(".question").cloneNode(true);
newQuestion.id = "";
newQuestion.querySelector("input").value = "";
questionTypeContent.appendChild(newQuestion);
}
function deleteEntry(buttonNode){
let placeNode = buttonNode.parentNode;
placeNode.parentNode.removeChild(placeNode);
}
function saveForm(){
let data = [];
for(let questionTypeNode of allQuestions.querySelectorAll(".questionType")){
let questionsJson = [];
let questionTypeJson = {"questions": questionsJson};
data.push(questionTypeJson);
for(let questionNode of questionTypeNode.querySelectorAll("input")){
questionsJson.push({"text": questionNode.value})
}
}
makeAPIRequest("admin/setQuestions", {"questions": data, "lang": "FR"}, {"content": "json"})
}
function changeLang(){
}
</script>

72
truthinquiry/templates/admin/traits.html
View File

@ -1,47 +1,29 @@
<a href="/admin"> go Back </a> <br> <!DOCTYPE html>
<html lang="fr">
<head>
<title>Traits</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="admin_ui.css">
<script src="/static/js/api.js"></script>
<script src="/static/js/admin.js"></script>
</head>
<body>
<a href="/admin"> go Back </a> <br>
<section id="traits"> <section id="traits">
{%for trait in traits%} {%for trait in traits%}
<section id="{{trait['id']}}"> <section id="{{trait['id']}}">
<p> Name: </p> <p> Name: </p>
<input class="name_input" value="{{trait['name']}}"> <input class="name_input" value="{{trait['name']}}">
<p> Description: </p> <p> Description: </p>
<input class="desc_input" value="{{trait['desc']}}"> <input class="desc_input" value="{{trait['desc']}}">
<button onclick="deleteTrait(this)">Delete trait</button> <button onclick="deleteTrait(this)">Delete trait</button>
</section> </section>
{%endfor%} {%endfor%}
</section> </section>
<button onclick="addNewInput()">Add new</button> <button onclick="addNewInputTraits()">Add new</button>
<button onclick="saveForm()">Save changes</button> <button onclick="saveFormTraits()">Save changes</button>
<p>Images are viewable in the npc views</p> <p>Images are viewable in the npc views</p>
</body>
<script src="/static/js/api.js"></script> </html>
<script>
function addNewInput(){
let newTrait = traits.lastElementChild.cloneNode(true);
newTrait.id = "";
newTrait.querySelector(".name_input").value = "";
newTrait.querySelector(".desc_input").value = "";
traits.appendChild(newTrait);
}
function deleteTrait(buttonNode){
let traitNode = buttonNode.parentNode;
traitNode.parentNode.removeChild(traitNode);
}
function saveForm(){
let data = [];
for(let section of traits.querySelectorAll("section")){
let trait = {};
trait["id"] = section.id
trait["name"] = section.querySelector(".name_input").value
trait["desc"] = section.querySelector(".desc_input").value
data.push(trait);
}
makeAPIRequest("admin/setTraits", {"traits": data, "lang": "FR"}, {"content": "json"})
}
</script>