[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.01,0:00:04.57,Default,,0000,0000,0000,,Il grosso delle interazioni che GRITS ha con Canvas avviene attraverso il rendering delle immagini
Dialogue: 0,0:00:04.59,0:00:08.95,Default,,0000,0000,0000,,nel canvas stesso. Per poter disegnare un'immagine nel canvas, dobbiamo prima caricarla.
Dialogue: 0,0:00:09.05,0:00:13.20,Default,,0000,0000,0000,,Per caricare un immagine abbiam bisogno di creare un nuovo oggetto immagine, che
Dialogue: 0,0:00:13.22,0:00:17.66,Default,,0000,0000,0000,,in Javascript comprende 3 passaggi: numero 1, bisogna dichiarare
Dialogue: 0,0:00:17.67,0:00:22.90,Default,,0000,0000,0000,,l'oggetto immagine, numero 2, bisogna definire la sua funzione onload e poi, numero 3,
Dialogue: 0,0:00:22.92,0:00:27.27,Default,,0000,0000,0000,,dobbiamo configurare l'attributo 'image.source'. E' bene notare che nel momento in cui
Dialogue: 0,0:00:27.28,0:00:31.64,Default,,0000,0000,0000,,si assegna un valore alla proprieta' source, Javascript lancera'
Dialogue: 0,0:00:31.65,0:00:35.98,Default,,0000,0000,0000,,la funzione onload. Per questo motivo dobbiamo prima specificare la funzione di callback,
Dialogue: 0,0:00:35.99,0:00:40.33,Default,,0000,0000,0000,,prima di preparare l'attributo source, altrimenti l'immagine carichera' i dati
Dialogue: 0,0:00:40.34,0:00:42.46,Default,,0000,0000,0000,,e non avra' un callback per riceverli.
Dialogue: 0,0:00:42.47,0:00:47.03,Default,,0000,0000,0000,,Diamo ora un'occhiata a questo codice: ecco la URL dell'immagine che vorremmo
Dialogue: 0,0:00:47.03,0:00:50.71,Default,,0000,0000,0000,,che tu caricassi. Vorremmo che tu creassi un nuovo oggetto immagine, seguendo
Dialogue: 0,0:00:50.71,0:00:54.51,Default,,0000,0000,0000,,i passaggi summenzionati e configurassi la funzione onload e la proprieta' source
Dialogue: 0,0:00:54.51,0:00:58.07,Default,,0000,0000,0000,,dell'immagine descritta nel codice. Assicurati che alla funzione onload sia
Dialogue: 0,0:00:58.07,0:01:01.69,Default,,0000,0000,0000,,assegnata questa onImageLoad quaggiu', che in effetti stampera' un bel
Dialogue: 0,0:01:01.69,0:01:04.77,Default,,0000,0000,0000,,messaggino nel log della console, informandoti del fatto che le cose son state caricate
Dialogue: 0,0:01:04.78,0:01:08.31,Default,,0000,0000,0000,,a dovere. Se non ti rendi conto se l'immagine sia stata o meno caricata,
Dialogue: 0,0:01:08.31,0:01:12.77,Default,,0000,0000,0000,,non dimenticarti di controllare gli Strumenti per Sviluppatori di Chrome nella scheda "rete", che mostrera'
Dialogue: 0,0:01:12.78,0:01:15.99,Default,,0000,0000,0000,,se l'immagine sia stata o meno caricata e quanto ci ha messo.