From d13d4860f3d5b51d659379aa8a38742bfe49bf37 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tuomas=20Klav=C3=A9r?= Date: Mon, 20 Nov 2023 02:04:12 +0200 Subject: Questions now shows up. DB -> JSON -> JS -> DOM --- app.py | 1 + db_actions.py | 10 ++++++++ get_questions.py | 18 ++++++++++++++ question.py | 10 ++++---- static/create.js | 63 +++++++++++++++++++++++++++++++++++++++++++++++++ static/index.html | 1 + static/kyselma.css | 28 ++++++++++++++++++++++ static/menu.js | 10 ++++++++ templates/create.html | 4 ++++ templates/question.html | 22 +++++++++++------ 10 files changed, 156 insertions(+), 11 deletions(-) create mode 100644 get_questions.py create mode 100644 static/create.js create mode 100644 static/kyselma.css diff --git a/app.py b/app.py index b5f381c..f08b7d8 100644 --- a/app.py +++ b/app.py @@ -11,3 +11,4 @@ import routes import nick import quiz import question +import get_questions diff --git a/db_actions.py b/db_actions.py index fca9ab0..b604870 100644 --- a/db_actions.py +++ b/db_actions.py @@ -76,3 +76,13 @@ def answer_new(user_id, question_id, answer): "created":int(time()) } ) db.session.commit() + +def get_questions(quiz_id): + sql = "SELECT q.id, q.question, q.neg_answer, q.pos_answer, a.answer \ + FROM questionaires quiz \ + JOIN questions q ON q.id = ANY(quiz.questionset) \ + JOIN answers a ON a.user_id = quiz.creator_id \ + WHERE a.question_id = q.id AND quiz.id = (:quiz_id);" + return db.session.execute( text(sql), { "quiz_id":quiz_id } ).fetchall() + + \ No newline at end of file diff --git a/get_questions.py b/get_questions.py new file mode 100644 index 0000000..496b99a --- /dev/null +++ b/get_questions.py @@ -0,0 +1,18 @@ +from app import app +from flask import render_template, session, request, redirect, jsonify +import db_actions as D + + +@app.route("/get_questions",methods=["GET"]) +def get_questions_by_id(): + if "quiz_id" not in session.keys(): + return "KUOLETTAVA: Sessiota / kyselmä id:tä ei ole" + + results = D.get_questions(session['quiz_id']) + r={} + names=['i','q','n','p','a'] + for i in range(len(results)): + r[i]={} + for j in range(len(results[i])): + r[i][names[j]]=results[i][j] + return (jsonify(r)) diff --git a/question.py b/question.py index e7494bc..96673c2 100644 --- a/question.py +++ b/question.py @@ -4,9 +4,13 @@ import db_actions as D def validate_answer(ans): + if len(ans)<1: + return False return True def validate_question(question): + if len(question)<2: + return False return True @app.route("/new_question",methods=["POST"]) @@ -18,9 +22,9 @@ def new_question(): if not validate_question(question): msg = "Kysymys on virheellinen" elif not validate_answer(neg_ans): - msg = "Vasen selite virheellinen" + msg = "Vasen selite on virheellinen" elif not validate_answer(pos_ans): - msg = "Oikea selite virheellinen" + msg = "Oikea selite on virheellinen" elif "id" not in session.keys(): msg = "Tarvitaan nimimerkki" elif "quiz_id" not in session.keys(): @@ -34,5 +38,3 @@ def new_question(): return redirect("/#create") session["alert"]="Kysymystä ei luotu: "+msg return redirect("/#create") - - diff --git a/static/create.js b/static/create.js new file mode 100644 index 0000000..6c25659 --- /dev/null +++ b/static/create.js @@ -0,0 +1,63 @@ +var questions = {} + +createQuestionDiv = ( question ) => { + const questionDiv = document.createElement('div') + questionDiv.className = 'kysQuestion' + + const qDiv = document.createElement('div') + qDiv.appendChild( document.createTextNode( question.q ) ) + qDiv.className = 'kysText' + questionDiv.appendChild( qDiv ) + + const npDiv = document.createElement('div') + npDiv.className = 'kysScale' + + const nDiv = document.createElement('div') + nDiv.appendChild( document.createTextNode( question.n ) ) + nDiv.className = 'kysNegative' + npDiv.appendChild( nDiv ) + + const sDiv = document.createElement('div') + sDiv.className = 'kysScaleSpacer' + npDiv.appendChild( sDiv ) + + const pDiv = document.createElement('div') + pDiv.appendChild( document.createTextNode( question.p ) ) + pDiv.className = 'kysPositive' + npDiv.appendChild( pDiv ) + + questionDiv.appendChild( npDiv ) + + const aDiv = document.createElement('input') + aDiv.appendChild( document.createTextNode( question.a ) ) + aDiv.className = 'kysAnswer' + aDiv.type = 'range' + aDiv.min = 0 + aDiv.max = 999 + aDiv.disabled = true + aDiv.value = question.a + questionDiv.appendChild( aDiv ) + + return questionDiv +} + +createQuestions = () => { + const questionsDiv = document.getElementById('questions') + questionsDiv.className = 'kysQuestions' + Object.keys(questions).forEach(k => { + questionsDiv.appendChild( createQuestionDiv( questions[k] ) ) + }) +} + +loadQuestions = async() => { + await fetch( 'get_questions' ) + .then( response => response.json() ) + .then( json => questions = json ) + .catch( error => { + alert("dkd") + } ) + + createQuestions() +} + +loadQuestions() diff --git a/static/index.html b/static/index.html index d726587..6c7917b 100644 --- a/static/index.html +++ b/static/index.html @@ -7,6 +7,7 @@ + diff --git a/static/kyselma.css b/static/kyselma.css new file mode 100644 index 0000000..a7a60db --- /dev/null +++ b/static/kyselma.css @@ -0,0 +1,28 @@ + +.kysQuestion { + display: flex; + flex-direction: column; + max-width: 25em; +} +.kysText { + align-self: center; +} +.kysScale { + display: flex; +} +.kysScaleSpacer { + flex-grow: 1; +} +.kysNegative input { + width: 100%; +} +.kysPositive input { + width: 100%; +} +.kysCreateText input { + width: 100%; + resize: horizontal; +} +.kysCreateText { + width: 100%; +} diff --git a/static/menu.js b/static/menu.js index ee8f977..5256ef2 100644 --- a/static/menu.js +++ b/static/menu.js @@ -145,6 +145,16 @@ hashToPage = async () => { pageElement.loaded = false; window.location.assign( pageElement.innerHTML.slice( 11 ) ); } + + // https://plnkr.co/edit/MMegiu by Allen Kim + Array.from(pageElement.querySelectorAll("script")).forEach(oldScript => { + const newScript = document.createElement("script"); + Array.from(oldScript.attributes).forEach(attr => + newScript.setAttribute(attr.name, attr.value)); + newScript.appendChild(document.createTextNode(oldScript.innerHTML)); + oldScript.parentNode.replaceChild(newScript, oldScript); + }); + document.getElementById(`${currentPage}_menuEntry`) .className = 'menuItem' document.getElementById(`${p}_menuEntry`) diff --git a/templates/create.html b/templates/create.html index 0ba8164..fe2aa24 100644 --- a/templates/create.html +++ b/templates/create.html @@ -1,5 +1,9 @@ +
{{ nick }}
{{ alert }}

create

+ +
+ Lisää kysymys diff --git a/templates/question.html b/templates/question.html index 90d3abc..6d0dca1 100644 --- a/templates/question.html +++ b/templates/question.html @@ -1,9 +1,17 @@ -
{{ alert }}
+
{{ alert }}
-Kysymys:
- : valinnat : -
-
- +
+
Kysymys:
+
+
Valinnat:
+
+
+
+
+
+ + + +
-- cgit v1.2.3