My favorites | Sign in
Project Home Downloads Wiki Issues Source
Search
for
APIDocs  
All available Javascript API calls
Featured, Phase-Implementation
Updated Jun 5, 2010 by jhuck...@gmail.com

Javascript API Calls

Here are all the available API calls for the JPEGCam Javascript library. Everything is under a top-level global 'webcam' namespace.

webcam.set_hook( HOOK_NAME, USER_FUNCTION );

This allows you to set a user callback function that will be fired for various events in the JPEGCam system. Here are all the events you can hook:

  • onLoad
    • Fires when the Flash movie is loaded on the page. This is useful for knowing when the movie is ready to receive scripting calls.
  • onComplete
    • Fires when the JPEG upload is complete. Your function will be passed the raw output from the API script that received the file upload, as the first argument.
  • onError
    • Fires when an error occurs. If this hook is not defined, the library will display a simple JavaScript alert dialog. Your function will be passed the error text as the first argument.

Example:

webcam.set_hook( 'onComplete', 'my_callback_function' );

function my_callback_function(response) {
  alert("Success! PHP returned: " + response);
}

webcam.set_api_url( URL );

This allows you to set the URL to your server-side script that will receive the JPEG uploads from the Flash movie. Beware of cross-domain restrictions in Flash.

Example:

webcam.set_api_url( '/path/to/myscript.php' );

webcam.set_swf_url( URL );

This allows you to set the URL to the location of the "webcam.swf" Flash movie on your server. It is recommended to keep this file in the same directory as your HTML page, but if that is not possible, set the path using this function. Beware of cross-domain restrictions in Flash. The default is the current directory that your HTML page lives in.

Example:

webcam.set_swf_url( '/path/to/webcam.swf' );

webcam.set_quality( QUALITY );

This allows you to adjust the JPEG compression quality of the images taken from the camera. The range is 1 - 100, with 1 being the lowest quality (but smallest size files), to 100 being the highest quality (but largest files). This does NOT control the resolution of the images, only the JPEG compression. The default is 90.

Example:

webcam.set_quality( 90 );

webcam.set_shutter_sound( ENABLED, URL );

This allows you to enable or disable the "shutter" sound effect that the Flash movie makes when a snapshot is taken. Pass in a boolean true or false to the function. It defaults to true. If set to false the sound effect will not even be loaded. You can optionally pass a second argument to this function, which should be a URL (relative to page or fully qualified) to an MP3 sound effect for the shutter sound. This defaults to 'shutter.mp3' in the current directory relative to the HTML page. These values cannot be changed after get_html() is called (see below).

Example:

webcam.set_shutter_sound( true, 'shutter.mp3' );

webcam.get_html( WIDTH, HEIGHT, SERVER_WIDTH, SERVER_HEIGHT );

This returns the necessary HTML code to embed the Flash movie into your page. Pass in the desired pixel width & height, which not only controls the visual size of the movie, but also the JPEG image width & height. Standard sizes are 320x240 and 640x480.

You can optionally pass a desired server image width and height. If these differ from the video width and height, the captured images will be resized to match just prior to upload.

Example:

document.write( webcam.get_html(320, 240) );

webcam.snap();

This instructs the Flash movie to take a snapshot and upload the JPEG to the server. Make sure you set the URL to your API script using webcam.set_api_url(), and have a callback function ready to receive the results from the server, using webcam.set_hook().

Example:

<a href="javascript:void(webcam.snap())">Take Snapshot</a>

webcam.configure( PANEL );

This launches one of Flash's configuration panels, used to setup camera devices, privacy settings, and more. Pass in one of the following strings which sets the default panel "tab" in the settings dialog: "camera", "privacy", "default", "localStorage", "microphone", or "settingsManager".

Example:

<a href="javascript:void(webcam.configure('camera'))">Configure...</a>

webcam.freeze();

Optional, new in v1.0.4. This is not required if you use webcam.snap(), described above. This captures an image from the webcam but does NOT upload it. Instead, the image is displayed "frozen" in the Flash movie, and the user may take further action. For example, you may provide separate "Upload" and "Reset" buttons to upload the frozen image and/or reset the camera.

Example:

<a href="javascript:void(webcam.freeze())">Freeze</a>

webcam.upload();

Optional, new in v1.0.4. This is not required if you use webcam.snap(), described above. This uploads the captured image to the server, previously frozen with webcam.freeze(). This is provided as its own function so you can have separate "Capture" and "Upload" buttons for the user.

Example:

<a href="javascript:void(webcam.upload())">Upload</a>

webcam.reset();

Optional, new in v1.0.4. This resets the frozen image, previously captured with webcam.freeze(), and restores the live webcam feed for further capturing.

Example:

<a href="javascript:void(webcam.reset())">Reset</a>

webcam.set_stealth( ENABLED );

Optional, new in v1.0.9. This sets or disables "stealth" mode (defaults to disabled). When enabled, this causes the image to be captured and uploaded without interrupting the video preview. Meaning, the snapshot is not "frozen", but instead the webcam video continues to be played. Using this mode you can, for example, capture and upload multiple snapshots at preset intervals.

Example:

webcam.set_stealth( true );
Comment by avinash....@gmail.com, Feb 2, 2009

thanks so much!!!! your code is awesome!!!do us also a "Save As" Dialog box when clicked on a Save button type.

Comment by project member jhuck...@gmail.com, Feb 2, 2009

Hey avinash.chebbi,

Unfortunately, a "Save as" dialog is not something JPEGCam can do. If you want the user to be able to download the captured image to their own local PC, you can do it yourself. After the image is captured and saved to your server, have the browser "redirect" to it (using an IFRAME, or open a new window). But, in your server-side code that is going to serve up the image, you need to send back a Content-Disposition HTTP header, instructing the browser to download the image instead of viewing it. This causes the "Save as" dialog to appear (depending on browser/platform the actual behavior is slightly different). Here is an example with PHP:

$download_filename = "name_of_image.jpg";
header("Content-disposition: attachment; filename=" . $download_filename);

Good luck.

Comment by demola.o...@gmail.com, Feb 16, 2009

is it possible to pass a name parameter to the server side code? for example, embed the user's id in a hidden filed and passing to the server script so that the file name that is created includes the passed parameter.

Comment by project member jhuck...@gmail.com, Feb 16, 2009

A user already asked this question over on the IdeasAndSuggestions page. Scroll to the bottom to see the question and answer.

Comment by Jagdeep....@gmail.com, Aug 6, 2009

hi, i want to convert php code which saves frame as jpeg to CAKEPHP action. How can i do this. It uses $HTTP_RAW_POST_DATA. How would i pass this data to controller's action. Please help me!

Comment by roberto.sarrecchia, Jun 2, 2010

Hello, could you suggest me an equivalent form of test.php in classic .asp?

Comment by praveen....@gmail.com, Jun 5, 2010

Hello! This has a real thoughtful API. As a webapp designer I cant stop myself from wishing a small feature. Why should the display-freeze and image-capture be linked together. Lets say i want to upload periodic snapshots every 2 secs, I wouldnt want the user-display to freeze every time i capture and upload.

FREEZE & CAPTURE - UPLOAD (Right now possible with this api)

(OPTIONAL FREEZE) - CAPTURE - UPLOAD (Wished feature)

I am not a flash programmer, so forgive me if i am asking something that cannot be done. I wish a capture() API call can copy the Bitmap data with out freezing or affecting the display.

Thanks in advance.

Comment by project member jhuck...@gmail.com, Jun 5, 2010

@praveen.baratam: Implemented in JPEGCam 1.0.9, which was just released. Please see the new test page for example, or the updated API Docs for the new set_stealth() function. Thanks for the feature request!

Comment by praveen....@gmail.com, Jun 8, 2010

Thanks a lot. Is there any specific reason for posting image directly to the server than as part of a form?

Comment by project member jhuck...@gmail.com, Jun 8, 2010

@praveen.baratam: Yes. If you wanted to submit a form with the binary image data, you would have to get the raw bytes out of Flash and into JavaScript?. Such a thing is incredibly slow and memory intensive, not to mention difficult because Flash converts it to XML when you use ExternalInterface?. The data would have to be base64 encoded, which would make it even larger. Having Flash submit the data directly is much faster and more efficient.

Comment by aniisah....@gmail.com, Jul 2, 2010

In grails, to save image:

String filePath = "c:/image.jpg"
InputStream inputStream = request.getInputStream();

OutputStream out=new FileOutputStream (filePath);
byte[] buf = new byte [1024] ;
int len;
while((len=inputStream.read(buf))>0) out.write(buf,0,len);
out.close();
inputStream.close();
Comment by stephan....@gmail.com, Jul 22, 2010

In Django 1.2: model example:

class Validation(models.Model):
    image = models.ImageField(upload_to="validation")

views example:

from django.contrib.sites.models import Site
from django.core.files.base import ContentFile
from django.http import HttpResponse
from django.views.decorators.csrf import csrf_exempt

@csrf_exempt
def post_webcam_image(request, email):
    filename = 'webcam.jpg'
    validation.image.save(filename,
                          ContentFile(request.raw_post_data))
    return HttpResponse("http://%s%s" % (Site.objects.get_current(), 
                                         validation.image.url))
Comment by jhal...@gmail.com, Aug 23, 2010

I have a problem, I need to take many photos in a car parking all day in the door, but when the systema has taken mor than 50 pic, the flash freeze, just black, HELP Please !!

Comment by swapnild...@gmail.com, Sep 1, 2010

I am trying to save the image to new URL and I am not able to. Can you please help me. When I am printing the URL on test2.html it displays it as http://' but I am passing the same URL string given you. I haven't made any changes to shutter.mp3 test.php test2.html webcam.js webcam.swf

Comment by soniach...@gmail.com, Oct 24, 2010

Hi there..how brilliant you are..it's working on my pc server but why I can't access the camera through the web from internet/outside PC. thank you and your early is appreciated.

soni

Comment by adrianom...@gmail.com, Nov 4, 2010

bom exemplo em java, valeu.

Comment by a5h4...@gmail.com, Feb 24, 2011

Can I use two webcams simultaneously on one page??, thanks

Comment by saroo2...@gmail.com, Mar 9, 2011

Which webcam devices are supported?

Comment by gwenhast...@gmail.com, Mar 22, 2011

HI there,

I have tried modifying test.html and test.php for https urls but keep getting errors.. and hints on getting this to work with https urls ie the normal case of http urls is working perfectly...
thanx for this tool

Comment by LandungP...@gmail.com, Mar 22, 2011

Hi, How set to take picture with output file format is bmp?

Comment by jeffy.a...@gmail.com, May 6, 2011

I'm using ajax to change the captured image in an img tag, but in Internet Explorer and Safari gives the error and the browser is closed or restarted. Could anyone help me?

Comment by jeffy.a...@gmail.com, May 9, 2011

only on internet explorer i have this problem: res://ieframe.dll/acr_error.htm# and the browser stopped. only back after cleaning the cache.

Comment by Bruno.Te...@gmail.com, Jun 16, 2011

The flash always crashes when we click "Cancel" and "Submit" (version: 1.0.9)

Comment by g.osod...@gmail.com, Jun 17, 2011

Am I the only one getting a low resolution on my webcam? It used to work well when I was working on my cousin's Mac. But then I had to return it and when I got my app running on pc, I've realized webcam on flash wouldn't do so well neither in windows nor in Ubuntu, for the webcam video gets loaded on low resolution no matter the WidthxHeight?? settings...I saw earlier somewhere round here that flash 9 was a requirement, Is flash 10 causing this? My pictures are all pixelated!! Please Help!

Comment by lederm...@ims.tuwien.ac.at, Jun 30, 2011

If you want to load the swf from a different domain than your POST url, you have to add a cross-domain policy file at http://<post_destination_domain>/crossdomain.xml like this:

<?xml version="1.0"?> <!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd"> <cross-domain-policy> <allow-access-from domain="*"/> <allow-http-request-headers-from domain="*" headers="*"/> <site-control permitted-cross-domain-policies="master-only"/> </cross-domain-policy>

(obviously instead of '' you should limit this to the actual domain where your swf is loaded from)

for more infos see http://www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html

just cost me 2 hours to figure this out correctly, thought it may save someone some time...

Comment by catort...@gmail.com, Jul 6, 2011

there is a way to put my flash in portrait position? i need to recomplie it?

Comment by sarah.a....@vanderbilt.edu, Jul 20, 2011

I am very confused. Also a noob. I downloaded the sample to a new folder on my computer and when I try to take a snapshot it says Error not loaded yet. I havent even edited anything yet. What do I need to do to make it save an image?

Comment by dyonmahe...@gmail.com, Dec 1, 2011

i have 2 webcams and i want to use both of its to take different picture on the same time. how can i di that? pleas help me............

Comment by nanda.si...@gmail.com, Dec 20, 2011

Hello everyone,

I have a problem with the given example. I didn't do anything just extracted and pasted in server's (apache server) root folder. Initially, it seems working perfectly, I can able to see myself via webcam. The real problem is, when I click "Take Snapshot", it says "Error: Movie not loaded yet".

Will anyone, give a hint or solution to solve this problem?

Comment by brendan....@rocketmail.com, Jan 12, 2012

Hi,

I was wondering if there was a way with this plugin or any others to access the webcams zoom in/out functionality??!!!! also, is there a way so if the user accepts that flash can access the webcam once, that the permission screen over the webcam does not come up again??

Thanks!

Comment by czigola@gmail.com, Feb 1, 2012

It took some time to figure this one out: the upload wasn't working. I sniffed into the TCP traffic and there wasn't any when calling webcam.upload() !

The problem was the URL: it contained : and ? characters (well formed.) The solution: pass an absolute URL http://example.com/foo:bar/?_SESSION_ID=1234 instead of /foo:bar/?SESSION_ID=1234

Comment by daniel.p...@gmail.com, Mar 15, 2012

I want to "un-reflect" the photo. It's possible?

Comment by tukuna.p...@gmail.com, Mar 19, 2012

how to use it in a jsp script?

Comment by mohdia...@gmail.com, Mar 28, 2012

Thank you for this great library. Is there a way to know when the camera is ready? not the flash movie, but the camera itself. It takes a little time to start showing the images on the screen which doesn't correspond to the OnLoad? event. Thank you.

Comment by sierev...@solverium.nl, Apr 9, 2012

Great lib !! I'm wondering if there will be an event-callback on clicking the hardware button on the webcam, so I will be able to use a webcam handheld and trigger the script by clicking the webcam button?

Comment by gauurav....@gmail.com, Apr 16, 2012

Great Library!!! Tons of THANKS for keeping this open source... I got a query if there is a way to make it more user friendly my points are: 1. i wanna pop that menu directly which let user give option to remember the option to allow... 2. wanna pop some messages like "Camera not found on system" and so other error or guidelines messages.. 3. Effects like flash etc... and many more like that to make it professional otherwise you have left some wonderful footprints to get inspire by this project... Thanks again Gaurav Mehra

Comment by kogswell...@gmail.com, Apr 18, 2012

Error: Movie not loaded yet

I got this error when I tried to upload the image to a different server from which I had loaded the HTML (and JS and SWF). When I put everything on the same server it worked. So do in face beware of crossing domains.

Comment by s.arif.m...@gmail.com, Apr 29, 2012

can some one tell me why the player is not showing properly here... http://www.binary-elites.com/hims/patient/index/add username : arif password : 123456

its working properly on other pages...

thanks in advance


Sign in to add a comment
Powered by Google Project Hosting