as3

jeudi 21 janvier 2010 | graphisme

// mon flash + webcam semble faire planter firefox //
Je viens de réaliser un script en as3, pour faire des captures (snapshot) en jpg de la webcam x fois toutes les y millisecondes, avec un bout de php qui écrit le fichier sur le serveur (ou avec mamp/wamp/… sur votre disque dur) et comme je n’aime pas l’as3, les class, le compilateur Flash, j’ai passé des variables via le html ! J’ai rien inventé, j’ai juste compilé des exemples mais ce fut assez hasardeux pour avoir une image correcte… la plupart des scripts propose du 160 x 120, là j’ai un 1200 x 900 (enfin la isight des macbook monte qu’à 800 x 600 je crois).
Les fichiers sources sont en bas.
Pour changer x et y, fichier html -> ligne 14 et 15 (boucle et delay)
Pour lancer l’application, une fois mamp/wamp ok -> copier aussi dans htdocs ou www, puis ouvrir
http://localhost:xxxx/xxxxx/index.html
L’image de la webcam bug quelques secondes au lancement, une fois stable, on clique et les captures sont sur le disque dur dans le dossier de l’index.html.

import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.utils.Timer;
import flash.events.TimerEvent;

import com.adobe.images.JPGEncoder;

var Delay:Number = (this.loaderInfo.parameters.Delay)?this.loaderInfo.parameters.Delay:5000;
var Boucle:Number = (this.loaderInfo.parameters.Boucle)?this.loaderInfo.parameters.Boucle:10;
var MonChemin:String = (this.loaderInfo.parameters.MonChemin)?this.loaderInfo.parameters.MonChemin:"";

var cam:Camera = Camera.getCamera();

var bandwidth:int=0;// Specifies the maximum amount of bandwidth that the current outgoing video feed can use, in bytes per second. To specify that Flash Player video can use as much bandwidth as needed to maintain the value of quality , pass 0 for bandwidth . The default value is 16384.
var quality:int=100;// this value is 0-100 with 1 being the lowest quality. Pass 0 if you want the quality to vary to keep better framerates
cam.setQuality(bandwidth, quality);
cam.setMode(1200,900,5,true);

var video:Video = new Video(1200,900);
video.attachCamera(cam);
video.x = 0;
video.y = 0;
addChild(video);

var bitmapData:BitmapData = new BitmapData(video.width,video.height);

var bitmap:Bitmap = new Bitmap(bitmapData);
bitmap.x = 1200;
bitmap.y = 0;
addChild(bitmap);
//capture_mc
capture_mc.buttonMode = true;
capture_mc.addEventListener(MouseEvent.CLICK,captureImage);

function captureImage(e:MouseEvent):void {
	//bitmapData.draw(video);
		myTimer.start();
}

function prendrePhoto(e:TimerEvent):void {
	var now:Date = new Date();

	bitmapData.draw(video);
	var bm_video:Bitmap = new Bitmap(bitmapData);
	var jpgEncoder:JPGEncoder = new JPGEncoder(90);
	var jpgStream:ByteArray = jpgEncoder.encode(bitmapData);
	var header:URLRequestHeader = new URLRequestHeader("Content-type", "application/octet-stream");
	var jpgURLRequest:URLRequest = new URLRequest(MonChemin+"upload.php?filename="+now.getHours()+"-"+now.getMinutes()+"-"+now.getSeconds()+".jpg");
	jpgURLRequest.requestHeaders.push(header);
	jpgURLRequest.method = URLRequestMethod.POST;
	jpgURLRequest.data = jpgStream;
	var loader:URLLoader = new URLLoader();
	loader.addEventListener(Event.COMPLETE, uploadCompleted);
	loader.load(jpgURLRequest);
	bitmap.x = 0;

}
function uploadCompleted(e:Object):void {
	trace("uploaded finisehd");
}

var myTimer:Timer=new Timer(Delay,Boucle);
	myTimer.addEventListener("timer", prendrePhoto);

le php qui écrit sur le disque dur (ou sur le serveur).

<? 
$filename=$_GET["filename"];
$fp = fopen($filename , 'wb' );
$jpg = $GLOBALS["HTTP_RAW_POST_DATA"]; 
fwrite( $fp, ($jpg) );
fclose( $fp );
?>

Le HTML, avec intégration swfobject (ni hao ^^).

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
	<head>
		<title>Test</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<meta name="description" content="SwfcamPhp"/>
<meta name="author" content="Ben"/>
<meta name="keywords" content="swf"/>
		<link rel="stylesheet" type="text/css" href="style.css"/>
		<script type="text/javascript" src="swfobject.js"></script>
		<script type="text/javascript">
		var flashvars = {};
		flashvars.MonChemin = window.location.href; //"http://localhost:8888/snapshot/";
		flashvars.Delay = 1000;
		flashvars.Boucle = 10;
		swfobject.embedSWF("camnice.swf", "flashcontent", "1200", "900", "10.0.0","",flashvars);
		</script>
	</head>
	<body>
<div id="flashcontent">you need to get the new flash player</div>




</body>
</html>


Voici la source : swfcam.zip
Merci à quentin pour avoir dégoté un script as3 beaucoup mieux pour la résolution :)
Tout ça me donne quand même envie de me mettre à Processing :)

crédit photo


tags : ,

2 commentaires

zazavalu le 17 Mai 2012 vers 18:32

Bonjour,
j’ai lancé le scripte en local, la webcam est detecté mais les images ne sont pas enregistrées quand je clic.
Qu’est-ce qu’il faut modifier pour que ça marche ?

Très bon site. Merci.

ben le 17 Mai 2012 vers 19:19

@zazvalu De tête, ce n’est pas quand on clique mais avec un delay et un nombre d’images, ici 10 images, une par seconde :

flashvars.Delay = 1000;
flashvars.Boucle = 10;

Si c’est pour un usage local, processing est une bonne alternative !

Comments are closed.