5 - Programmazione JavaScript


 

indice Testo variabile

Ciascuna pagina del racconto è, come abbiamo visto, una funzione nel linguaggio JavaScript; ciò significa che si possono usare le istruzioni del linguaggio stesso per variare dinamicamente, ossia durante la lettura, il contenuto della pagina stessa (è anche da qui che viene la 'd' di "Idra").

Ad esempio, supponiamo che la variabile v.carb contenga un valore numerico che indica il carburante rimasto; lo si può mostrare in questo modo:

function Riserva() {
  titolo("In riserva")
  testo("Nel serbatoio sono rimasti solo ")
  testo(v.carb)
  testo(" kg di cherosene!")
  continua(Volo3)
}
Il numero effettivamente mostrato dipenderà naturalmente dal contenuto della variabile v.carb, che a sua volta potrà essere conseguenza di precedenti azioni (ad esempio l'aver fatto rifornimento o meno):


In riserva

Nel serbatoio sono rimasti solo 23 kg di cherosene!

Una comoda abbreviazione è consentita dal fatto che la funzione testo() accetta più argomenti (stringhe o valori) separati da virgole; lo stesso effetto sopra illustrato si può quindi ottenere più comodamente così:

function Riserva() {
  titolo("In riserva")
  testo("Nel serbatoio sono rimasti solo ", v.carb, " kg di cherosene!")
  continua(Volo3)
}

indice Testo condizionale

L'istruzione if esegue o meno un gruppo di istruzioni, a seconda che la condizione indicata sia vera o falsa; per esempio:
testo("Un ponticello di corda")
if (v.oro) {
  testo(", che non ha l'aria di reggere il peso dei sacchi colmi di pepite,")
}
testo(" attraversa il profondo crepaccio.")
In questo caso la condizione, che va racchiusa tra parentesi, è la variabile v.oro: se essa vale 1 (vera) le istruzioni fra parentesi graffe verranno eseguite, se invece vale 0 (falsa) non verranno eseguite. Se quindi v.oro è a zero, si leggerà:


Un ponticello di corda attraversa il profondo crepaccio.
 

Nel caso invece che l'avventuriero abbia trovato l'oro, e quindi la variabile v.oro contenga 1 (o comunque un valore diverso da zero), la pagina mostrerà:


Un ponticello di corda, che non ha l'aria di reggere il peso dei sacchi colmi di pepite, attraversa il profondo crepaccio.
 
 

indice Alternative

Aggiungendo else si possono mettere una o più istruzioni da eseguire nel caso che la condizione sia falsa, ad esempio così:
testo("La cassetta di sicurezza si direbbe ")
if (v.cassetta) {
  testo("aperta.")
} else {
  testo("chiusa.")
}
Ovviamente una sola delle due possibilità si potrà verificare, a seconda del valore contenuto nella variabile v.cassetta; si possono mettere anche più alternative:
testo("Il vigile, esaminati i documenti, dice:<br>")
if (v.veloc > 90) {
  testo("- Le devo ritirare la patente.")
} else if (v.veloc > 50) {
  testo("- Fanno 173.200, concilia?")
} else {
  testo("- Vada pure, ma badi che la tengo d'occhio.")
}
Anche in questo caso, una sola delle istruzioni alternative verrà eseguita; se ad esempio la variabile v.veloc contiene 63, nella pagine apparirà:


Il vigile, esaminati i documenti, dice:
- Fanno 173.200, concilia?
 

Le parentesi graffe non sarebbero strettamente obbligatorie nel caso di una singola istruzione (come in questi esempi), ma consigliamo di metterle ugualmente per evitare errori; il tutto può anche stare su una singola riga, benché l'uso di righe separate faciliti la lettura.

Notiamo infine che le alternative con if ed else si potrebbero usare anche per le scelte, in modo da mostrarle o meno a seconda del valore di una variabile:

if (v.paracadute) {
  scelta("Ti butti", Pag28)
} else {
  scelta("Tenti un atterraggio di fortuna", Pag46)
}
Tuttavia è in questo caso inutile ricorrere a JavaScript; basta infatti usare il meccanismo predefinito descritto nel capitolo 3, in questo modo:
scelta(v.paracadute, "Ti butti", Pag28)
scelta(! v.paracadute, "Tenti un atterraggio di fortuna", Pag46)
L'istruzione if è comunque utile nel caso che si impieghino i rinvii nel testo, con l'apposita funzione rinvio(), anziché le scelte separate con la funzione scelta() (vedi capitolo 3). La si può inoltre usare anche per far apparire diverse immagini a seconda del valore contenuto in una variabile.
 

indice Istruzioni nelle scelte

Finora abbiamo indicato semplicemente il nome di una pagina a cui andare quando il lettore fa clic su una scelta, come la funzione Pag77() in questo esempio:
scelta("Entri nel cunicolo", Pag77)
Si possono mettere, al posto del nome della pagina, una o più istruzioni JavaScript da eseguire, ossia a tutti gli effetti un pezzo di programma collegato a quella specifica scelta:
scelta("Entri nel cunicolo", "v.cunic = 1; vai(Pag77)")
Vi sono in questo caso due istruzioni, separate da un punto e virgola, che verranno eseguite l'una dopo l'altra:
v.cunic = 1   //cambia il valore della variabile v.cunic
vai(Pag77)    //va alla pagina descritta dalla funzione Pag77()
In questo caso, avendo aperte le virgolette, non si può scrivere semplicemente il nome della pagina desiderata, cioè Pag77, ma occorre usare esplicitamente l'apposita funzione vai(), altrimenti il meccanismo non potrà funzioanre..

Le istruzioni incorporate nelle scelte vengono eseguite quando il lettore fa clic sulla scelta stessa, cioè nel passaggio tra una pagina e l'altra: esse non possono quindi scrivere nella pagina, ad esempio con la funzione testo(): ciò non avrebbe senso, in quanto la pagina vecchia è già stata completata e quella nuova non esiste ancora.
 

indice Aggiornare una pagina

A volte un'azione non comporta automaticamente un cambio di pagina, ma fa variare quanto viene presentato nella pagina corrente, come in questo caso:
scelta(! v.accesa, "Accendi la luce", "v.accesa = 1; aggiorna()")
scelta(v.accesa, "Spegni la luce", "v.accesa = 0; aggiorna()")
scelta("Entri nel laboratorio", Lab)
Se la variabile v.accesa contiene zero, verranno mostrate la prima e la terza scelta ma non la seconda:


Facendo clic sulla prima scelta, cioè "Accendi la luce", verranno eseguite le due istruzioni:

v.accesa = 1
aggiorna()
La prima cambia il valore contenuto nella variabile v.accesa, la seconda fa presentare nuovamente la stessa pagina; essendo però cambiate le condizioni, in questo caso appunto il valore di v.accesa, le scelte mostrate saranno diverse:


In pratica la funzione aggiorna() è come vai(), con l'unica differenza che non va a un'altra pagina ma presenta nuovamente il contenuto della pagina corrente, adeguandolo ai nuovi valori delle variabili; la si deve usare in tutti i casi in cui qualcosa venga cambiato come effetto del clic su una scelta o su un rinvio.
 

indice Problemi con la riesecuzione

Quando una pagina viene riscritta per effetto della funzione aggiorna, è importante ricordare che la funzione della pagina viene nuovamente eseguita; ciò può comportare degli inconvenienti, come in questo caso:
function Anello() {
  titolo("Scoperta")
  testo("Complimenti, hai trovato il quarto dei 7 anelli perduti!")
  v.punti += 20; // guadagna 20 punti --- attenzione! ---
  ...
}
In questo caso c'è un potenziale errore nell'istruzione:
v.punti += 20  //(v.punti = v.punti + 20)
Se infatti una delle scelte contenesse l'istruzione aggiorna(), alla variabile v.punti verrebbe aggiunto 20 ogni volta che la pagina fosse riscritta, il che non è ovviamente il comportamento desiderato. A questo problema ci sono varie soluzioni, la più semplice delle quali consiste nell'assegnare i punti nella scelta che porta a questa pagina, così:
scelta("Decidi di aprire il piccolo scrigno", "v.punti += 20; vai(Anello)")
In questo caso la pagina Anello() non contiene alcuna istruzione che aumenta i punti, quindi può essere rieseguita senza problemi. Una tecnica più complessa, utile in altre situazioni, è quella di usare una variabile per evitare di rieseguire delle istruzioni:
if (! v.trovatoAnello) {
  v.punti += 20
  v.trovatoAnello = 1
}
Le istruzioni tra parentesi graffe verranno eseguite una sola volta, indipendentemente dal numero di riscritture della pagina, perché alla prima esecuzione la variabile v.trovatoAnello viene impostata a 1 e impedisce (per mezzo della if) una successiva riesecuzione delle stesse istruzioni.
 

indice Casualità e dado

Per fare una scelta casuale si deve usare esclusivamente l'apposita funzione dado(), evitando la funzione Math.random() di JavaScript: essa causerebbe infatti diversi problemi, non ultimo il fatto che una situazione salvata... potrebbe essere diversa quando la si riprende! La funzione dado() consente di estrarre un numero intero compreso tra 1 e 6 (inclusi) oppure, indicando un numero, tra 1 e il numero dato:
v.prob = dado(100)  //numero compreso tra 1 e 100
Ad esempio, ecco un possibile sistema per scegliere tra due pagine con uguale probabilità:
testo("Anche se non sei sicuro di farcela, prendi la rincorsa e salti.")
continua(dado() > 3, AltraSponda, Annega)
Il lettore vedrà in ogni caso sempre la stessa pagina:


Anche se non sei sicuro di farcela, prendi la rincorsa e salti.

Se però il numero estratto dalla funzione dado() sarà maggiore di 3 (cioè 4, 5 o 6) un clic su "Continua" porterà alla pagina AltraSponda(), mentre in caso contrario (1, 2 o 3) porterà alla pagina Annega(). La probabilità di raggiungere l'una o l'altra pagina sarà quindi in questo caso del 50%.

Una curiosità: il dado, o più tecnicamente lo stato del generatore di numeri pseudocasuali, viene salvato insieme al gioco: non funziona quindi il trucco di salvare e riprendere per vedere "se stavolta andrà meglio".

 



 «--  Precedente 1 2 3 4 5 6 7 A B Indice Successivo  --»