[it] app.js - GhostyJade/ProgettoJS-API-2019 GitHub Wiki

Questo script gestisce tutta la parte logica del gioco. Si occupa di eseguire fetch di immagini da Unsplash e di domande da Open Trivia DB

Variabili globali

  • data: array che contiene i dati delle domande

  • theCorrectAnswer: variabile che tiene salvata la risposta corretta, data una domanda

  • unsplashApiKey: chiave per l'API di Unsplash (so benissimo che non è una buona pratica salvare le chiavi in pubblico, ma non ho trovato nessuna API che facesse lo stesso servizio al livello di Unsplash)

  • image: immagine che viene visualizzata durante la partita

  • text: paragrafo del testo della domanda

  • btnNextQuestion: pulsante per "avvalersi della facoltà di non rispondere" o per passare alla domanda successiva una volta aver risposto a quella corrente

  • btnCheckQuestion: pulsante per confermare la risposta alla domanda corrente

  • options: riferimento all'oggetto del form usato per le risposte

  • result: riferimento al contenitore per l'esito della risposta (corretta/errata)

  • masterContainer: riferimento al contenitore di tutta la pagina (header e footer esclusi)

  • subContainer: riferimento al contenitore figlio del masterContainer

  • onscreenScore: riferimento al paragrafo per il punteggio durante la partita

  • score: variabile che salva il punteggio del giocatore

  • currentQuestion: valore che indica quante domande sono state fatte fin'ora

  • totalQuestions: valore che indica quante domande l'utente risponde (e quante vengono fetchate da opentriviadb)

  • submitted: valore che indica se l'utente ha risposto o meno alla domanda corrente

Metodi / funzioni

  • shuffle: funzione usata per mescolare un array
  • getQuestions: funzione che si occupa di eseguire la fetch da OpenTriviaDB
  • createRadioElement: funzione che, dati il contenuto (data) e l'indice (index) crea un radio button e lo aggiunge alla lista per le risposte
  • recreateButtons: funzione che aggiunge i due pulsanti ogni volta che il form viene ricreato
  • dispatchQuestion: funzione che si occupa di resettare l'interfaccia e di eseguire il dispatch di una domanda
  • getImage: ottiene l'immagine da Unsplash e la imposta nel relativo elemento html
  • createAlert: crea l'elemento visualizzato quando si sottopone una domanda ("Correct" in verde o "Wrong" in rosso)
  • checkAnswer: verifica se la risposta è corretta o no
  • initButtons: crea le due istanze per i pulsanti "Next" e "Confirm"
  • updateOnScreenScore: aggiorna il testo che indica le risposte correnti
  • elementFactory: crea un oggetto dato il tipo (type), il contenuto (data) e imposta le classi dell'oggetto data una lista (classAttribs)
  • showScores: mostra il punteggio ottenuto a fine partita