Étape 6: Rendre la page Web HTML5 le travail à votre projet
Flashvars & CamIN & CamOut
Le premier bit important du code est les flashvars et les objets Flash. Les flashvars est une valeur de la variable où vous pouvez déclarer l’id de quel flux webcam vous souhaitez diffuser ou aimeriez voir. Vous verrez un couple de Flasvars qui ressemble à ça :
< param name = « FlashVars » value = "localID = pw2_2" / >
pw2_2 est synonyme de fenêtre Public numéro 2 et numéro 2 de la cam. (Normalement chaque fenêtre Public aura des cames 1 ou 2 selon les besoins du Créateur/propriétaire de la fenêtre Public.)
La flashvar est toujours déclaré à la fin de chaque instruction camin.swf ou camout.swf. Ces deux cam.swf objets fonctionnent comme ils sont nommés, ils montreront un flux webcam sur la page Web selon l’id récupérée et ils enverront un flux webcam avec l’id indiqué. Si autres que Windows Public pouvez incorporer votre flux sur leur page Web. La seule chose que vous devrez éditer ici est id.
Après que vous avez enregistré à http://www.publicwindow.net, vous recevrez un nom de fenêtre Public et un certain nombre de fenêtre Public. Votre flux webcam sera « pw11_1 » quand vous avez une fenêtre Public numéro 11 et vous souhaitez envoyer un flux de webcam 1. (Cette fonction n’est pas encore implémentée, vous pouvez utiliser pw6_1 par exemple)
Le bit de code suivant est les boutons.
Boutons et données série
Si vous faites défiler le code, vous verrez la partie où les 3 boutons sont déclarés. Dans ce morceau de code, nous faisons 3 boutons avec un. Image PNG pour leur donner leur propre apparence. Voici le code que vous verrez.
< div id = « knoppen » class = « fltrt » >
< div onClick="ws.send('0'); » >< img src="img/snake_button.png" >< / img >< / div >
< div onClick="ws.send('R'); » >< img src="img/wolk_button.png" >< / img >< / div >
< div onClick="ws.send('L'); » >< img src="img/lol_button.png" >< / img >< / div >
< / div >
Comme vous pouvez voir les images servent également de liens et donc comme un bouton. Si vous cliquez sur un des boutons, ils enverront un message avec la fonction « ws » qui est une fonction que l'on retrouve dans les fichiers de script java. Le < div onClick="ws.send('0'); » > Déclaration enverra un 0 avec javascript pour python qui enverra ensuite un octet à l’Arduino. Le « 0 » est interprétée par l’Arduino et se traduira par une modification de l’acte accompli par l’Arduino.
Dans cet exemple, nous avons 3 boutons : un serpent, un nuage et un bouton LOL. Le modèle a été utilisé en combinaison avec un cube de LED. Si nous brancher la LED-cube avec un Arduino vers le site Web. Vous serez en mesure de changer l’animation du LED-cube en cliquant sur les boutons.
Résumé
Si vous souhaitez modifier les flux de webcam, vous modifiez l’id les objets flash.
Si vous voulez changer les boutons, l’octet qui vous souhaitez envoyer à l’Arduino. (Et pour l’extérieur juste modifier l’image ou les fichiers CSS)
NOTE : Nos tests ont indiqué qu’il est possible d’envoyer 1 octet seulement.
Maintenant que vous savez comment fonctionne le système, vous serez en mesure de démarrer. Passez à l’étape suivante.