Web Avancé EPU 2013-2014

De $1

Introduction

Dans ce cours vous allez voir différents aspects de la programmation web :

  • JavaScript un peu plus compliqué que d'habitude, utilisation de frameworks MVC, etc.
  • Web services
  • Micro serveur
  • Accès au web de données
  • Autres ?

Le sujet tournera autours du développement d'un logiciel d'écoute de chansons multipiste à l'aide de l'API HTML5 Web Audio. D'autres APIs HTML5 seront mises à contribution comme l'API du canvas pour le dessin et l'animation, la persistence, XhR pour le download/upload de fichiers, etc.

Voici une image préliminaire d'un prototype (ne faites pas attention à l'interface graphique) fonctionnel:

 multi1.jpg

multi2.jpg

 Le but n'est pas que vous réalisiez exactement ce prototype, le but est que l'on vous aide à développer votre propre version, en ajoutént de nombreuses améliorations:

  • Ergonomie meilleure, interface plus belle,
  • Monitorer le download et le décodage des pistes dans une barre de progression,
  • Modèle de donné plus complet (titres des chansons complet, biographie de l'artiste, histoire de la chanson, nom des musiciens, etc),
  • Possibilité d'uploader de nouvelles chansons,
  • Possibilité de règler par piste le volume individuel, la stéréo, de pouvoir mettre une piste en solo (muter toutes les autres)
  • Possibilité d'intégrer des effets audio (reverbération, echo, égaliseur, etc.)
  • Zoom avant/arrière sur les échantillons (donc il faudra dessiner les échantillons et non pas juste afficher une image prédéfinie, on trouve des exemples de code sur le net)
  • Synchroniser des animations sur la musique (utilisation d'un analyseur de fréquence, il y en a un en standard dans HTML5/WebAudio)
  • Etc....

Je sais qu'un des élèves est malentendant, il pourra se concentrer sur les aspects "non audio" de l'application. Par exemple regarder comment faire la partie "dessin des pistes", "download/upload", "animation", "web de données" etc.

Nous allons découper le travail que vous allez faire en séances de TP et à chaque fois nous vous fourniront des éléments pour avancer. Les dernières séances seront consacrées à la finalisation de votre travail et à la présentation de vos résultats.

TP1 : bases de l'API Web Audio, serveur minimal

TP2 : Ajout de nouvelles fonctionnalités, refactoring

TP3 : angularJS, nouvelles fonctionnalités

TP4 : un peu de métadonnées / réseaux sociaux ?