Issue
Spending my evenings hobby coding a topography quiz for my daughter. Leveraging the web and Stack Overflow resources, I got an API running on https://ac1976.pythonanywhere.com/api/wereld Hit it and the server will respond with a JSON object comprised of a random country / capital combination, together with a list of 'wrong' answers for the capital. The wrong answers are based on distance to the (correct) capital and are also randomized. So Tokyo won't show up as an answer for the capital of Belgium, but Paris and London may.
On topic: now building a flask app that fetches a response from the aforementioned API, and creates a multiple choice quiz game asking for the capital of the random country, and giving the user 4 multiple choice options.
My main route to do all of this works, and looks like this:
@app.route('/api/continent/', methods=['GET', 'POST'])
def quiz():
if request.method == "GET":
quiz = Game('wereld')
country = quiz.country
answers = quiz.answers
session['capital'] = quiz.capital
return render_template('quiz.html', a1=answers[0], a2=answers[1], a3=answers[2], a4=answers[3], country=country)
else:
answer = request.form['subject']
if answer == session.get('capital'):
return render_template('antwoord.html', answer="Jaaaaa...")
else:
return render_template('antwoord.html', answer="Neee..")
So on hitting the route initially, the server initializes the class Game, which is essentially a wrapper to catch the response from the API and parcel the response with methods for each of the data points we need: country, answers, and capital. These quiz items are stored in similarly named variables country, answers and capital. Country (in the form of a question) and answers (as 4 separate buttons) are used in the HTML template file, presented on hitting the route.
If the user presses one of the four buttons, the second part of the route logic figures out whether the answer was right, or wrong, and sends back a new html view telling the user the answer was right....or wrong.
Okay. All makes sense, right?
Here's my question. How do I autodirect, after say 1 second, back to the 'top of the if loop' so that the code auto refetches a new response from the API, to play another round? I tried to put a simple "While True:" on top of the if / else loop, which works my original terminal version of this quiz...but Flask is not having it. I understand why (it needs a 'GET') but....how to cause a new one?
thanks for your thoughts / guidance / pointing me in the right direction
Arie
Solution
How about a meta refresh tag within the header of the HTML page.
After the defined time has expired, you will be redirected to the specified URL.
It would then look something like this.
<meta http-equiv="refresh" content="1; url={{url_for('quiz', _external=True)}}" />
If you want to use JavaScript, a variant with a timeout would also be possible.
const uri = {{url_for('quiz') | tojson}};
setTimeout(() => window.location.replace(uri), 1000);
Answered By - Detlef
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.