Cette application nécessite l'activation de Javascript.
Apprenez comment activer Javascript dans votre navigateur.
Vous n'êtes pas connecté.
Connexion
Ma Page
Changements Récents
Outils
Aide
Pages récentes
Web 2.0/HTML5 Rabat 201...
Année 2010-2011
Accueil
Intranet Michel Buff...
...
Applications web, M...
Applications web M1...
Apprentissage de l'i...
Lettres
Client android pour ...
Cours composants di...
Cours composants di...
Cours composants di...
Cours HTML5 CityWa...
Cours HTML5/NodeJS...
Cours HTML5/NodeJS...
Cours Miage d'Evry, ...
Cours Web 2.0 / HTM...
Cours web 2.0 2009
Cours web 2.0 année...
Cours Web 2.0 Casa...
Cours web 2.0 M2 Mi...
Cours web 2.0 MBDS...
Cours Web 2.0 MBDS...
Cours web 2.0 Miage...
Cours web 2.0 Miage...
Design Patterns Jav...
Droits d'accès dans ...
EDx: trucs et astuce...
Exemples interactifs...
Exemples interactifs...
Gestion du projet IS...
HTML5 MBDS 2015-2...
HTML5 Monster cont...
HTML5 pour la L3 Pr...
HTML5 Tutorial for ...
HTML5 tutorial for W...
Installation de Node...
JavaEE6 Weblogic e...
JavaEE6 Weblogic e...
Journée ISN du lund...
Journées ISN 6 et 1...
Java EE6 Weblogic E...
L3 Miage : technos ...
M1 informatique - M...
M1 Miage 2014-2015 ...
M1 Miage 2015-2016 ...
M2 MBDS Casablanca...
M2 MBDS Casablanca...
M2 NTDP - Web 2.0
Master 1 IFI 2015-2...
Premiers pas avec A...
Master Miage NTDP ...
Master Miage NTDP ...
MBDS - Madagascar ...
MBDS 2014-2015 Pri...
MBDS 2015-2016: We...
MBDS Casablanca 20...
MBDS Casablanca 20...
MBDS Mini-projet 20...
Miage Evry 2015-201...
MT5, a multitrack pl...
Option web 2.0 Mast...
HTML5 new structuri...
Plarpebu 1.1 : netbe...
Plasticité des IHM W...
Préparation à la cer...
Programmable Web -...
Programmable Web 2...
Programmable Web c...
Projet année Miage ...
Projet Blitzmax EPU ...
Projet Web 2.0/HTML...
Projets et TP rendus...
Server-side JavaScri...
Technologie Web M1...
Technologies Web, M...
TestPagePourSteph
TP 2013 - Nouveaux ...
TP HTML5 / Nouveau...
TP HTML5 2013-2014...
TP Plasticité des IH...
Web 2.0 2010
Web 2.0 MBDS 2012-...
Web 2.0 Rabat proje...
Web 2.0/HTML5 201...
Projet web 2.0 Raba...
Web Avancé EPU 201...
Web avancé Master ...
Web Sciences 2016-...
Web services REST /...
Weblogic / Java EE6...
Modifier
la page
Nouvelle
page
Imprimer
la page
Plus
Page modifiée à
11:09, 1 Mar 2013
par
MichelBuffaTest
0
Préférences d'impression
Voir la Table des Matières
Montrer les infos de modification
Montrer les notes finales en lien
Web 2.0/HTML5 Rabat 2012-2013
De $1
Table des matières
1.
Introduction
2.
Supports utilisés en cours
2.1.1.
CSS 2 + quelques bouts de 3
3.
Supports externes
4.
TP1: installation de l'environnement de développement, premiers exercices
4.1.
Installation des logiciels
4.2.
Etude des exemples vus en cours
4.3.
Ecriture d'un formulaire HTML5
4.4.
Intégration de la géolocalisation
4.5.
Exercices avec la vidéo
4.6.
Exercices avec le dessin dans un canvas
4.7.
Rajouter des styles via CSS pour bien présenter la page de formulaire
5.
TP2 : découverte d'un logiciel de dessin
5.1.
Télécharger l'archive à étudier
5.2.
Step 1 : le paint le plus simple !
5.3.
Step 2 : ajout des événements mouseUp, mouseMove, mouseDown, création d'un objet pour le dessin
5.4.
Step 3 : ajout d'un second canvas transparent superposé au canvas principal, pour dessiner des "lignes élastiques"
5.5.
Step 4 : dessiner le contenu du front canvas dans le main canvas quand on relâche la souris en mode ligne
5.6.
Step 5 : ajout d'outils pour dessiner des rectangles et des cercles
5.7.
Step 6 : utilisation des styles de dessin, de nouveaux champs input HTML5 (color, range)
5.8.
Step7 : travail à faire par vous, ajout de nouvelles fonctions !
6.
TP3 : découverte des web sockets HTML5
6.1.
Etude d'un programme de chat
6.1.1.
We will use the NodeJS web server
6.1.2.
Installation de NodeJS
6.2.
Test de l'application de chat
6.3.
Etude de l'application de chat
7.
TP4 : etudier la partie multi-participants du Paint (steps 7 et 8)
7.1.
On ajoute la partie "chat" au programme de paint
7.2.
Step 8 : Broadcaster les ordres de dessin
7.2.1.
Coté serveur : on broadcaste les ordres de dessin, sauf à l'envoyeur
7.2.2.
Envoi des ordres de dessin
7.2.3.
Traitement des ordres de dessin qu'on reçoit du serveur
7.2.4.
Utilisation de la webcam pour dessiner avec l'image courante de la webcam et la transmettre
7.2.4.1.
Initialiser l'API getUserMedia
7.2.5.
Peindre avec des images en provenance de la vidéo de la webcam
7.2.6.
Envoie des images pour broadcast. On les envoie en format base64 en tant que dataURL
7.2.7.
Traiter les images reçues en base64 pour les dessiner
7.3.
« 50 précédents
50 suivants »
Sélectionnez les versions à comparer et cliquez sur 'Comparaison versions'.
Comparer
Date de révision
Modifié par
Résumé des modifications
Voir la version
11:09, 1 Mar 2013
MichelBuffaTest
32 mots supprimés
Voir la version
11:08, 1 Mar 2013
MichelBuffaTest
32 mots ajoutés
Voir la version
14:34, 20 Fév 2013
MichelBuffa
25 mots ajoutés
Voir la version
08:37, 23 Jan 2013
MichelBuffa
159 mots ajoutés
Voir la version
08:30, 23 Jan 2013
MichelBuffa
4 mots ajoutés
Voir la version
09:13, 19 Jan 2013
MichelBuffa
aucun mot modifié; nom de la page changé en 'Web 2.0/HTML5 2012-2013'
Voir la version
13:13, 15 Jan 2013
MichelBuffa
14 mots ajoutés
Voir la version
21:54, 29 Nov 2012
MichelBuffa
2 mots ajoutés, 2 mots supprimés
Voir la version
21:53, 29 Nov 2012
MichelBuffa
285 mots ajoutés, 172 mots supprimés
Voir la version
21:45, 29 Nov 2012
MichelBuffa
4175 mots ajoutés
Voir la version
10:12, 28 Nov 2012
MichelBuffa
8 mots ajoutés
Voir la version
07:07, 28 Nov 2012
MichelBuffa
1202 mots ajoutés
Voir la version
06:39, 28 Nov 2012
MichelBuffa
220 mots ajoutés, 174 mots supprimés
Voir la version
06:32, 28 Nov 2012
MichelBuffa
440 mots ajoutés, 297 mots supprimés
Voir la version
06:14, 28 Nov 2012
MichelBuffa
3466 mots ajoutés
Voir la version
15:12, 27 Nov 2012
MichelBuffa
115 mots ajoutés
Voir la version
10:49, 27 Nov 2012
MichelBuffa
203 mots ajoutés
Voir la version
08:39, 27 Nov 2012
MichelBuffa
4 mots ajoutés
Voir la version
18:48, 26 Nov 2012
MichelBuffa
50 mots ajoutés, 1 mots supprimés
Voir la version
18:47, 26 Nov 2012
MichelBuffa
151 mots ajoutés
Voir la version
18:36, 26 Nov 2012
MichelBuffa
61 mots ajoutés
Voir la version
18:01, 26 Nov 2012
MichelBuffa
page créée, 427 mots ajoutés
« 50 précédents
50 suivants »
Powered by
MindTouch Deki Open Source Edition
v.8.08
Flux RSS
Utilisateurs
Modèles
Plan du site
Pages populaires
A propos
Surveiller
Attacher fichier ou image
Accès restreint
Déplacer
Supprimer
Mots clés
Envoyer la page
Propriétés de la page
Page de discussion
Table des matières
1.
Introduction
2.
Supports utilisés en cours
2.1.1.
CSS 2 + quelques bouts de 3
3.
Supports externes
4.
TP1: installation de l'environnement de développement, premiers exercices
4.1.
Installation des logiciels
4.2.
Etude des exemples vus en cours
4.3.
Ecriture d'un formulaire HTML5
4.4.
Intégration de la géolocalisation
4.5.
Exercices avec la vidéo
4.6.
Exercices avec le dessin dans un canvas
4.7.
Rajouter des styles via CSS pour bien présenter la page de formulaire
5.
TP2 : découverte d'un logiciel de dessin
5.1.
Télécharger l'archive à étudier
5.2.
Step 1 : le paint le plus simple !
5.3.
Step 2 : ajout des événements mouseUp, mouseMove, mouseDown, création d'un objet pour le dessin
5.4.
Step 3 : ajout d'un second canvas transparent superposé au canvas principal, pour dessiner des "lignes élastiques"
5.5.
Step 4 : dessiner le contenu du front canvas dans le main canvas quand on relâche la souris en mode ligne
5.6.
Step 5 : ajout d'outils pour dessiner des rectangles et des cercles
5.7.
Step 6 : utilisation des styles de dessin, de nouveaux champs input HTML5 (color, range)
5.8.
Step7 : travail à faire par vous, ajout de nouvelles fonctions !
6.
TP3 : découverte des web sockets HTML5
6.1.
Etude d'un programme de chat
6.1.1.
We will use the NodeJS web server
6.1.2.
Installation de NodeJS
6.2.
Test de l'application de chat
6.3.
Etude de l'application de chat
7.
TP4 : etudier la partie multi-participants du Paint (steps 7 et 8)
7.1.
On ajoute la partie "chat" au programme de paint
7.2.
Step 8 : Broadcaster les ordres de dessin
7.2.1.
Coté serveur : on broadcaste les ordres de dessin, sauf à l'envoyeur
7.2.2.
Envoi des ordres de dessin
7.2.3.
Traitement des ordres de dessin qu'on reçoit du serveur
7.2.4.
Utilisation de la webcam pour dessiner avec l'image courante de la webcam et la transmettre
7.2.4.1.
Initialiser l'API getUserMedia
7.2.5.
Peindre avec des images en provenance de la vidéo de la webcam
7.2.6.
Envoie des images pour broadcast. On les envoie en format base64 en tant que dataURL
7.2.7.
Traiter les images reçues en base64 pour les dessiner
7.3.
effacer le message
voir détails
Ce message disparaitra dans
secondes
Le temporisateur de message a été arrêté
Affichage Détails: