Photobooth.js : le framework JavaScript permet d'ajouter un système de webcam
à un site Web en utilisant HTML5

Les rubriques (actu, forums, tutos) de Développez
Tags
Réseaux sociaux


 Discussion forum

Sur le même sujet
Le , par Hinault Romaric, Responsable Actualités
Le HTML5, le futur standard du Web vient de révéler une fois de plus l’une de ses nombreuses facettes.

Un développeur indépendant a exploité les nouveautés du langage pour mettre au point Photobooth.js, une bibliothèque open source en JavaScript qui permet d’intégrer dans un site Web assez aisément un système de prise de photo par webcam.

Photobooth s’appuie sur la méthode getUserMedia du framework audio et vidéo open source WebRTC, qui est actuellement en cours de standardisation par le W3C comme une partie du HTML5.

Photobooth.js permet de prendre directement des photos depuis un site Web. L’utilisateur a même la possibilité de contrôler la webcam, ainsi que l’image en y apportant des correctifs en direct comme la saturation, la luminosité, la teinte, etc.




Photobooth.js peut être utilisé avec les versions récentes de Chrome, Firefox, Opera ou tout autre navigateur supportant getUserMedia.

Photobooth.js est téléchargeable ainsi que son code source en open source sur GitHub. La bibliothèque peut être utilisée avec jQuery ou JavaScript. Le système d’appareil photo peut être ajouté à un site Web en utilisant juste la ligne de code suivante :

Code :
1
2
 
myPhotobooth = newPhotobooth( document.getElementById( "container") );
Télécharger le code source, une démo ou la documentation

Source : Présentation du projet

Et vous ?

Qu'en pensez-vous ?


Vous avez aimé cette actualité ? Alors partagez-la avec vos amis en cliquant sur les boutons ci-dessous :


 Poster une réponse

Avatar de alex_vino alex_vino
http://www.developpez.com
Membre Expert
le 07/12/2012 14:07
Vraiment du bon boulot
Le rendu final est vraiment bon et c'est simple d'utilisation.

Par contre niveau compatibilité c'est dommage (meme pas IE10).
Depuis le temps qu'on nous radote avec le HTML5 comme le standard qui harmonise tout les navigateurs, je remarque plutot que le Web est a plusieurs vitesse et résulte de l'implication des navigateurs (ou agent utilisateur).

J'imagine tres bien utiliser ce plugin sur les navigateurs compatibles et proposer la version Flash dans le cas contraire.
Avatar de SylvainPV SylvainPV
http://www.developpez.com
Rédacteur/Modérateur
le 07/12/2012 14:48
Par contre niveau compatibilité c'est dommage (meme pas IE10).
Depuis le temps qu'on nous radote avec le HTML5 comme le standard qui harmonise tout les navigateurs, je remarque plutot que le Web est a plusieurs vitesse et résulte de l'implication des navigateurs (ou agent utilisateur).

En même temps les API getUserMedia sont à peine sorties ! (Chrome 21 et Firefox 17). Chaque navigateur viendra à les supporter en son temps. Ne pas oublier que le HTML5 est un standard en cours de spécification prévu d'être finalisé en 2014 !
Avatar de Bovino Bovino
http://www.developpez.com
Responsable Développement Web
le 07/12/2012 15:00
Sans être (et de loin) un fanboy de IE, je suis toujours surpris de voir que personne ne se félicite jamais que IE ait introduit avant tout le monde des choses telles que le Drag'ndrop ou innerHTML, en revanche, quand IE n'implémente pas une spécification qui est toujours à l'état de brouillon (et donc pas supposé être implémenté)... D'ailleurs, Safari est-il aussi un navigateur "fléau du Web" puisqu'il n'est pas compatible non plus ?

Enfin, signalons que le script est obligé de passer par des préfixes vendeurs, alors qu'il est recommandé de ne pas les utiliser en production puisque les fonctionnalités disponibles par ce biais ne le sont qu'à titre expérimental et leurs spécifications susceptibles d'être modifiées...
Avatar de SylvainPV SylvainPV
http://www.developpez.com
Rédacteur/Modérateur
le 07/12/2012 16:02
@Bovino: ou encore le box model de IE qui est bien plus pertinent que le standard du W3C : http://en.wikipedia.org/wiki/Interne..._box_model_bug

Mais tout comme toi et un paquet d'autres devs web, je déteste IE :p Responsable de trop d'heures sups et crises de rage par le passé. Certes ça va de mieux en mieux avec IE9 et IE10, mais les plaies saignent encore
Avatar de alex_vino alex_vino
http://www.developpez.com
Membre Expert
le 07/12/2012 17:21
Citation Envoyé par SylvainPV  Voir le message
Ne pas oublier que le HTML5 est un standard en cours de spécification prévu d'être finalisé en 2014 !

Je ne crois plus vraiment les dates annoncées, surout quand on entend de plus en plus parlé de HTML6 + CSS4, je me demande si HTML5 sera un jour figé.
Mais bon cela n'est plus le sujet de l'article

@Bovino: Je suis aussi d'accord avec toi, mais Microsoft ne fait pas grand chose pour enlever sa mauvaise réputation en le domaine, leurs nouveaux navigateurs n'étant pas compatibles avec les anciens systemes qui représentent pourtant une grande partie des utilisateurs. Le projet que je viens de commencer cible IE6
Avatar de camus3 camus3
http://www.developpez.com
Membre Expert
le 08/12/2012 2:15
Enfin, signalons que le script est obligé de passer par des préfixes vendeurs, alors qu'il est recommandé de ne pas les utiliser en production puisque les fonctionnalités disponibles par ce biais ne le sont qu'à titre expérimental et leurs spécifications susceptibles d'être modifiées...

Sauf qu'on ne développe plus pour un standard mais une / plusieurs plateformes. C'est d'ailleurs pour cela que certain navigateurs commencent à support les préfixes d'autres navigateurs. il n'y a jamais eut de standard HTML5 et HTML5 ne sera jamais un standard fixe, un papier fini à un instant T.

Prenons requestAnimationFrame qui est supporté sans préfixe dans Chrome. Depuis quand requestAnimationFrame est standardisé ? il n'a jamais été standardisé puisque la spec HTML5 n'est même pas publiée. Chrome support aussi webkitRequestAnimationFrame.

La grande erreur des supporters des standards est de ne pas comprendre que la plupart des développeurs web n'ont jamais codés pour des standards, mais pour une ou plusieurs plateformes. C'est encore plus vrai avec le développement mobile. Ou alors on code pour le plus petit dénominateur commun sans tirer parti des possibilités de telle ou telle plateforme , ce qui est justifié pour n'importe quel site orienté document , mais pas pour une webApp complexe qui fait autre chose que d'afficher des pages principe-détail.

Sans être (et de loin) un fanboy de IE, je suis toujours surpris de voir que personne ne se félicite jamais que IE ait introduit avant tout le monde des choses telles que le Drag'ndrop ou innerHTML, en revanche, quand IE n'implémente pas une spécification qui est toujours à l'état de brouillon (et donc pas supposé être implémenté)... D'ailleurs, Safari est-il aussi un navigateur "fléau du Web" puisqu'il n'est pas compatible non plus ?

Internet Explorer était un bon navigateur en son temps , bien meilleurs que Netscape. Le problème est la politique de Microsoft qui oblige l'utilisateur à acheter une nouvelle version de windows pour upgrader IE , le second problème ,les entreprises dont les applications web internes tournent avec des technos non-standard , comme activeX , les "behaviors" , vb , ou autres particularités de IE qui ne fonctionneront plus si l'entreprise décide de changer de navigateur tout en gardant XP. Beaucoup de boites sont donc coincées et ne sont pas prêtes de mettre à jour leurs navigateurs ou d'en changer. Voila l'héritage technique d'Internet Explorer, et MS n'a pas prouvé qu'il souhaitait réellement régler ce problème.

Quand à Safari ,contrairement à IE , il utilise un moteur , webkit , qui est totalement open source. Les entreprises ne sont pas non plus "prisonnières" de Safari et de technos "non standard" qui pullulent sur IE.
Offres d'emploi IT
Développeur .NET H/F
CDD
SECIB - Languedoc Roussillon - proximité MONTPELLIER
Parue le 28/11/2014
Directeur de projet (h/f)
CDI
Kacileo - Ile de France - Ouest de Paris
Parue le 10/12/2014
Consultant magic xpa h/f
CDD Freelance
ALCALEM (SESAL) - Ile de France - Paris (75000)
Parue le 22/11/2014

Voir plus d'offres Voir la carte des offres IT
 
 
 
 
Partenaires

PlanetHoster
Ikoula