Gravitazione Universale

by Francesco Bondi

HTML

<h1 id="head">
  Seleziona la modalità di gioco
</h1>
<br>
<div id="pulsanti">
  <button type="genera" onclick="generaTestoQuiz()" style="background-color:#f44336;width:190px;height:50px">QUIZ</button>
	<button type="genera" onclick="generaTestoProblema()" style="background-color:#008CBA;width:190px;height:50px">PROBLEMA</button> <br>
</div>

<h1 id="problema" style="visibility:hidden;margin-bottom:10px;">
Problema
</h1>

<div id="testoProblema"> </div>
<br>
<div id="pulsantiProblema" style="visibility:hidden;margin-bottom:10px;">
<button type="genera" onclick="generaTestoProblema()" style="background-color:#cccc00;width:190px;height:30px">Genera testo</button>
<button type="genera" onclick="mostraSoluzione()" style="background-color:#cccc00;width:190px;height:30px">Soluzione</button> <br>
<button type="genera" onclick="tornaInizio()" style="background-color:#f44336;width:190px;height:50px">Torna al Menù principale
</button>
</div>

<div id="soluzione" style="visibility:hidden;margin-bottom:10px;">La velocità orbitale è <span id="sol"></span> m/s  &#8594 <span id="sol2"></span> m/s<br>
<button type="genera" onclick="procedimento()" style="background-color:#008CBA;width:190px;height:40px">
Mostra procedimento
</button>
</div>


<div id="procedimento" style="visibility:hidden;margin-bottom:10px;"> </div>

<h1 id="quiz2" style="visibility:hidden;margin-bottom:10px;">
Quiz
</h1>


<div id="quiz" style="visibility:hidden;margin-bottom:10px;">
<div id="testoDomanda"> </div>
<br>
<input type="radio" name="risposte" value="r1" onclick="controllo(numeroDomanda)"/><span id="risposta1"></span><br>
<input type="radio" name="risposte" value="r1" onclick="controllo(numeroDomanda)"/><span id="risposta2"></span><br>
<input type="radio" name="risposte" value="r1" onclick="controllo(numeroDomanda)"/><span id="risposta3"></span><br>
<input type="radio" name="risposte" value="r1" onclick="controllo(numeroDomanda)"/><span id="risposta4"></span><br>
<br>
<input type="button"...

CSS

#progressBar {
width: 100%;
background-color: white;
}


#barra {
	width: 0%;
  height: 30px;
  background-color: #4CAF50;
  text-align: center; /* To center it horizontally (if you want) */
  line-height: 30px; /* To center it vertically */
  color: white;
}








.button {
  display: inline-block;
  padding: 10px 20px;
  font-size: 20px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
	background-color: #4CAF50;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

.button:hover {background-color: #3e8e41}

.button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

JavaScript

/******************************************************************************
*																																							*
*												Made by	Francesco Bondi																*
*												Progetto Gravitazione Universale											*
*												Latest Version: 16/07/19															*
*																																							*
*																																							*
******************************************************************************/
 
 
 var i;
 var domande = [{  //Lista domande e risposte
       "Domanda": "Quale e' la differenza fondamentale fra il sistema tolemaico e il sistema copernicano?",
       "Risposta1": "Il sistema tolemaico e' geocentrico mentre quello copernicano e' eliocentrico.",
       "Risposta2": "Il sistema tolemaico e' eliocentrico, mentre il sistema copernicano e' geocentrico.",
       "Risposta3": "Il sistema copernicano prevede che la Terra si muova, il sistema tolemaico no.",
       "Risposta4": "Il sistema tolemaico prevede che il Sole si muova, il sistema copernicano no."
     },
     {
       "Domanda": "Quale delle seguenti è una delle leggi di Keplero?",
       "Risposta1": "Le orbite dei pianeti sono ellissi e il Sole occupa il centro",
       "Risposta2": "Durante un'orbita, la velocità di ogni pianeta rimane costante",
       "Risposta3": "I quadrati dei periodi di rivoluzione dei pianeti sono proporzionali ai cubi dei semiassi maggiori delle loro orbite",
       "Risposta4": "I cubi dei periodi di rivoluzione dei piante sono proporzionali ai quadrati dei semiassi maggiori delle loro orbite"
     },
     {
       "Domanda": "Callisto e Io sono due Lune di Giove. La distanza di Callisto dal centro di Giove e' circa 4.5 volte quella di Io. Quale relazione esiste tra il periodo orbitale di Callisto (Tc) e quello di Io (Ti)?",
       "Risposta1": "Tc = 2.7 Ti",
       "Risposta2": "Tc = 4.5 Ti",
       "Risposta3": "Tc = 9.5 Ti",
       "Risposta4": "Tc = 21 Ti"
     },
		 {
		 "Domanda": "La forza di attrazione che due...