SPIEGAZIONE CODICE

var counter = 30;

var counterInterval;

var img = Graphics.createImage(`

##### #####

# ##### #

# #

# #

## ##

## ##

## ##

# #### #

# # # #

# # # #

## ##

## ##

`);

var img1 = Graphics.createImage(`

### # ##### ## ####

# # # # # # #

# # ### # # ####

# # # # # # #

### #### ##### # # # #

##### #####

# ##### #

# #

# #

## ##

## ##

## ##

# #### #

# # # #

# # # #

## ##

## ##

`);

Prima Parte :

Nella prima parte abbiamo dichiarato le variabili counter e counterInterval, che useremo per impostare la durata del timer. Inoltre abbiamo creato anche le variabili che contengono le due immagini dei denti, ovvero IMG e IMG1, nelle quali abbiamo inserito le immagini tramite il metodo createImage.

Una delle caratteristiche interessanti delle immagini è che è possibile crearle semplicemente inserendo dei caratteri all’interno delle parentesi. Ciascun carattere rappresenta un pixel del display.

function outOfTime() {

if (counterInterval) return;

E.showMessage("Out of Time", "My Timer");

Bangle.buzz();

Bangle.beep(200, 4000)

.then(() => new Promise(resolve => setTimeout(resolve,200)))

.then(() => Bangle.beep(200, 3000));

setTimeout(outOfTime, 10000);

g.setColor('#' + Math.floor(Math.random()*16777215).toString(16).padStart(6, '0'));

}

Seconda parte :

Seconda Parte : Nella seconda parte abbiamo creato una funzione che viene eseguita quando il timer è uguale a 0. Quando il tempo finisce, viene stampata la scritta "Out Of Time", assieme a una piccola vibrazione. Inoltre abbiamo inserito l'istruzione g.setColor affinché, una volta che il timer riparte, cambiano i colori degli elementi.

function immagine(){

g.drawImage(img1, 90, 20, {scale:2});

}

Terza parte :

Nella terza parte abbiamo creato la funzione immagine, la quale stampa l'immagine del dente lavato(img1) quando il timer sta per finire.

function countDown() {

g.setColor('#012345');

counter--;

// Out of time

if (counter<=0) {

clearInterval(counterInterval);

counterInterval = undefined;

setWatch(startTimer, (process.env.HWVERSION==2) ? BTN1 : BTN2);

outOfTime();

return;

}

g.clear();

g.setFontAlign(0,0); // center font

g.setFont("Vector",80); // vector font, 80px

// draw the current counter value

g.drawImage(img, 90, 20, {scale:2});

g.drawString(counter,120,120);

g.drawLine(50,50,180,50);

g.drawLine(50,51,180,51);

g.drawLine(50,52,180,52);

// optional - this keeps the watch LCD lit up

Bangle.setLCDPower(1);

if(counter<=5){

immagine();

}

}

Quarta Parte :

Nella quarta parte abbiamo creato la funzione countDown, nella quale si decrementa di un valore la variabile che contiene il timer. Inoltre abbiamo impostato un ciclo if che, quando la variabile del timer è uguale < o = a 0 richiama la funzione outOfTime, le istruzioni sotto il ciclo if riguardano il posizionamento degli elementi della applicazione nell'orologio come i numeri del timer, le immagini e la linea orizzontale sotto l'immagine del dente. Alla fine viene creato un ciclo if, il quale esegue la funzione immagine() quando il timer è < o = a 5.

function startTimer(){

counter = 30;

countDown();

if (!counterInterval)

counterInterval = setInterval(countDown, 1000);

}

startTimer();

Ultima Parte :

Nell'ultima parte abbiamo creato la funzione StartTimer(), la quale fa partire tutta l'applicazione, in quanto oltre a impostare il timer richiama la funzione countDown().