Objectifs : gérer d'autres données Dans les étapes précédentes, nous avons séparé la partie "algorithmes" et la partie "données". Notre objectif est maintenant de voir comment définir et utiliser d'autres données. On va le faire avec Google Drive qui est accessible à tous.

Point de départ:

Pour ce cours, vous pouvez repartir de la version précédente de l'application ou importer cette version Prenez soin d'enregistrer votre version de travail avec un nouveau nom, par exemple : playlistV8.

Définition du catalogue dans le programme (rappel)

L'accès au catalogue et aux données est défini par 2 variables : datadirectoryURL l'URL du répertoire et JSONCatalog le nom de fichier du catalogue. Ajoutez la variable topImage pour l'image d'entête et la modifier en fonction du catalogue.

Pour lire un autre catalogue, il suffit de modifier ces variables pour qu'elles correspondent à un autre catalogue. Nous en avons préparé deux autres : une playlist musicale et sur le chant des oiseaux. Pour y accéder, il suffit de modifier les 3 variables (et nous verrons plus bas comment définir leur contenu) :

• une playlist musicale :
  
• et un catalogue sur les oiseaux et leur chant :
  

Et voilà!

personnalités	playlist Musique	Oiseaux

Préparer un catalogue et un jeu de données

Les 3 catalogues ont exactement la même structure avec des contenus différents. Vous savez déjà : comment rédiger un catalogue avec

• la liste [...] de dictionnaires {...},{...}, {...}
• 3 paires de (clefs:valeurs) dans chaque dictionnaire, :
  la clef "title" pour le nom du morceau, la clef "audio" pour le son et la clef "image" pour l'image.

et comment vérifier que son format est correct avec des outils comme JSON Editor on line

Nous allons voir maintenant plusieurs solutions pour accéder au catalogue JSON et aux données images et audios.
Dans le premier catalogue, le catalogue, les images et audio sont des fichiers, enregistrés dans un serveur à l'adresse datadirectoryURL. Mais vous n'avez probablement pas de serveur ...!
Donc ça ne va pas marcher pour vous.

On va donc voir deux autres solutions :

• La playlist musicale où toutes les données sont enregistréees sur Google drive (catalogue JSON, images et audios),
• le chant des oiseaux où le catalogue JSON est enregistré sur Google Drive, mais où les images et audios sont lues sur Internet à l'endroit où elles sont (sans avoir à les copier).

L'utilisation de Google Drive, va changer la manière d'écrire l'adresse des images et fichiers audios, car l'accès aux fichiers dans Google Drive se fait avec un identifiant indépendant du répertoire dans lequel vous avez mis ce fichier.

Playlist musicale : Préparer un jeu de données sur Google Drive

Nous allons d'abord voir le cas où le catalogue les images et fichiers audios sont tous sur Google Drive.

Préparation des données pour la playlist musicale

Des fichiers de musique mp3 et la pochette de l'album ont été enregistrés dans un répertoire playlistMusic sur Google Drive (Vous pouvez recopier ce répertoire sur votre propre Drive pour vous exercer, mais vous pouvez aussi réutiliser ces donnés avec leur identifiant, sans les recopier).

Le répertoire et les fichiers qu'il contient doivent être partagés et accessibles en lecture par toute personne disposant du lien.
On configure ces droits d'accès avec clic droit + "partager" puis sur "modifier", dans la case "obtenir le lien".

En complément des images et des bandes son, le répertoire contient un catalogue au format JSON dont la structure est identique au catalogue précédent avec :

• une liste [...] de dictionnaires {...},{...}, {...}
• avec 3 paires de (clefs:valeurs) dans chaque dictionnaire, :
  • la clef "title" pour le nom du morceau,
  • la clef "audio" pour la fin de l'URL du fichier son,
  • et la clef "image" pour la fin de l'URL du fichier image.

Dans le cas de Google Drive l'adresse ou l'URL d'un fichier n'est pas définie dans une arborescence, comme dans un serveur. Google Drive utilise un Id de fichier ou fileId. L'avantage c'est que cet id ne change pas quand on déplace ou renomme le fichier. L'inconvénient c'est qu'on ne manipule pas le fichier par son nom. Ce fileId correspond à la chaine de caractères associée aux clefs audio et image :

"title": "Coffee At Midnight",
"audio": "1aKd2Wd9iKV1LLSg7UzM5p2OwIaVaLFrg",
"image": "1UPIzY4LRcKvgyfNrnHla4PGggIbvMINC"

L'adresse complète du fichier sera : https://drive.google.com/uc?export=viewd&id= suivi du fileId.

Pour construire cette adresse dans le programme, on va mettre la 1° partie dans la variable dataDirectoryURL et le fileId dans la clef image ou la clef audio du catalogue. Comme avant, l'assemblage des deux est déjà fait dans le programme, il n'y a rien à changer :
l'assemblage des deux parties est déjà fait avec les blocs :

Récupérer le fileId d'un fichier sur Google Drive :

Pour récupérer le fileId de chaque fichier, dans le Drive, cliquez droit sur le fichier, puis cliquez sur "obtenir le lien" et "copier le lien", par exemple :
"https://drive.google.com/file/d/1UPIzY4LRcKvgyfNrnHla4PGggIbvMINC/view?usp=sharing"

Le FileId se trouve dans la partie médiane entre /file/d/ et /view
ici : 1UPIzY4LRcKvgyfNrnHla4PGggIbvMINC

Nota : quand vous récupérez le lien, Vérifiez que le fichier est partagé par tous les utilisateurs disposant du lien.

Ecrire le catalogue

Pour chaque élément du catalogue vous devez récupérer le fileId des fichiers audio et image et les mettre comme valeurs associées aux clefs image et audio.

"title": "Coffee At Midnight",
"audio": "1aKd2Wd9iKV1LLSg7UzM5p2OwIaVaLFrg",
"image": "1UPIzY4LRcKvgyfNrnHla4PGggIbvMINC"

A la fin, n'oubliez surtout pas de vérifier votre fichier JSON (par exemple avec JSON Editor on line).

Renseigner les variables JSONCatalog et dataDirectoryURL

Dans le programme, mettez

• le fileId du catalogue lui même dans la variable JSONCatalog,
• https://drive.google.com/uc?export=viewd&id= dans la variable dataDirectoryURL,
• et le fileId de l'image à afficher en haut de l'écran dans la variable topImage.

Chants d'oiseaux : utiliser les données à la source

Ecriture du catalogue (chants d'oiseaux)

Au lieu d'utiliser des images et des sons copiés dans le drive, il est possible de lire directement les données là où elles sont sur Internet, sans avoir à les copier. C'est ce que l'on va faire pour les images et les sons dans le catalogue du chant des oiseaux.

Pour l'alouette Lulu

• L'image est à l'adresse http://www.web-ornitho.com/images/alouettelulu.jpg
• et le chant à l'adresse http://www.web-ornitho.com/chants/alouette.lulu.wav

Ce qui nous donne :

{
"image":"http://www.web-ornitho.com/images/alouettelulu.jpg",
"title":"Alouette Lulu",
"audio":"http://www.web-ornitho.com/chants/alouette.lulu.wav"
}

Au passage, vous remarquerez au passage que dans les adresses http, les blancs sont remplacés par %20 ou par +, ce qui correspond à l'encodage URI abordé dans les notions générales du cours. Les espaces et d'atres caractères comme / - si on les avait laissés - auraient été traités comme des séparateurs dans l'adresse Internet.

Mise à jour des variables JSONCatalog et dataDirectoryURL

Par rapport aux deux exemples précédents, le catalogue, les images et les sons ne sont pas au même endroit. On ne peut donc pas définir dataDirectoryURL comme préfixe commun à l'adresse de toutes les données. on va donc :

• mettre une chaine vide dans la variable dataDirectoryURL,
• mettre le nom complet dans la variable JSONCatalog avec son fileId,
• et faire de même que pour la variable topImage avec son fileId.

Comme l'adresse des images et des sons du catalogue sont aussi des adreesses complètes, il n'y a pas non plus de préfixe à ajouter

Résultat / synthèse

Cette version du programme se distingue seulement des deux autres par le changement de 3 variables.