Best program practices for a multi-quiz game screen managment?

Somb

Hello guys, I'm new to web development and need to program quiz with sound,images and a lot of interactivity, and I just found that p5.js is the perfect solution for me.

My problem is that I have like more than 10 questions with different kind of inputs (each of them with their own rules and some with the same rules) and an introduction screen. And I really confused how can I organize this, how is the best way to keep my code clean, because the tutorials that I followed the usually do the examples in a single file, and I think that if I program something like this at the draw function ( if question == 1 { question, answers, Rules rules rules rules rules } if question == 2 {question, answers different rules rules } ) it will be an huge mess.

So, I need some solution for multiple-screens, but that share some global variables.

I think that should be the same for a game with multiple levels, where you keep some "rules" of the world and just change the stages/levels/screens/enemies.

Edit: Ps: The user should be able to back to any previous question already answered and modify the current answer.

Sorry about my english, i hope that it si not confuse.

Thanks !

GoToLoop

https://forum.Processing.org/two/discussions/tagged/quiz

Chrisir

Yes, for the screens use a var int state=0; which can be 0,1,2,3 e.g.

e.g. introductory, help, askQuestion, checkAnswer, quizIsOver or so.....

You can even declare those states (give them names) as

final int introductory =0;
final int help=1;
final int askQuestion=1;    
final int checkAnswer=1;        

Additionally use an array for questions and one for answers

String[] questions={"what...?","...?",".....?"};

And an index to mark where you are: int index=0;

increment index when going to next question

quark

I am not familiar with p5.js but I have done something similar in JAVA mode. The basic idea is to separate the display engine from the question data

Basically there would be a text or Json file that describes all the features of the question, inputs, images, sounds, etc. The data format would be down to you but it is best that you create a detailed specification first.

The display engine would be responsible for loading and parsing the question data file. You don't have to implement all the possible features from the data file you can build that up gradually.

This is not a trivial task but gives you a solution that you can reuse.

blindfish

As quark says - you'll want to find a way to store question configuration in an external file format. Assuming you're doing a lot of this in the DOM (i.e. with HTML elements) I would find the exclusive choice of p5 odd: it would probably be far easier using jQuery and available jQuery plugins; perhaps using p5js if you need to interact with a canvas element.

Anyway - assuming you wish to persevere with p5 the splitting a project into multiple files thread might be useful.

I also found this general tutorial on how to build a quiz engine

Somb

Thank you for the answers guys !

I will create a json file to store the questions, and create a question object where i read the file and create a canvas for each question, so i just display the right canvas at the right time. I dont know if it will work yet, but if does i will post here

Again, thank you !