How does the lib deal with mutiple cameras ? It there a possibility to select which camera to use ? or does it only select the webcam ..

having issues with chrome and other browsers when users reject the broswer dialog the very first time. it keeps displaying webcam.js error everytime the page is reloaded. please, anyway i can work around that?

Hi,
I am a newbie. can you please tell me that how can I save the still image in my local drive.

Thanks in Advance

Make a webpage that combines webcamjs with this gist (live demo here).

That would result in a useful tool :-)

I found that webcamjs can‘t work on IE8 but IE9 can, do you have any solution to fix it?

The problem is "object doesn't support getContext method or attribute at line 400, char 3"

Thanks!

Hi

Love your script! 😄 But in the README.md, in 'Submitting Images to a Server', you use

var data_uri = Webcam.snap();

But it fails with 'Please provide a callback function...'. I need to save the Image in a variable for further use.

Thank you! ¡Saludos desde Perú!

so that we can access this repo via bower?

For example, I have square element for my capturing. I don't know user's webcam aspect ratio and i'd like to have ability to know it, because if I don't, all images will be stretched from rectangle to square.

Adding if (this.preview_active) this.unfreeze(); to the top of the reset function will fix an issue where calling reset() while frozen breaks any successive freeze() calls when re-attached.

Is there a easy way to expand this software using websockets so clients can view even frames from the webcam on a canvas, etc? At the moment I'm using the following bit of javascript to refresh the image, but the fps are uneven and choppy:

http://dpaste.com/0RNZV4J.txt

When I try snapping photo, I get the above mentioned error in a popup. There is no error recorder in the console. Has anyone experienced similar problem in past?

I have been trying webcamjs and it works perfectly in Google Chrome.
But when I tried it in Firefox and Internet Explorer it does not work at all.

Tried even using your demo url and it doesn't work.
If I click at Take Snapshot I get: "Webcam.js Error: Webcam is not loaded yet"

So this is only working in Chrome for now.

I'm using flash capture method in Chrome for taking a snapshot with the input coming from a CCTV camera (aspect ratio 16:9). The image is getting cropped from all edges except the left even though I have not specified any such settings. The same input when captured with getUserMedia there's no cropping though the snapshot is skewed (stretched).

With the basic demo on Safari on mac, it seems notification from flash are not received because the live parameter is never true.
I have an other issue with IE8 which doesn't support canvas to render snapshot.

Something like http://pixlcore.com/demos/webcamjs/demos/crop-large.html , but I need to have a large live preview (for example 320х240 or 240x240) and small crop (for example 48x48, just for making a small avatar). Is it possible?

Hi,

First of all, thanks for the great work with webcamjs.
I am currently experiencing weird behavior of the flash version on OSX Safari, I cannot find a solution for fixing the height of my video and living the width auto. This doesn't occur on other browser with OSX, neither with Safari 5.1 on Windows, I just give width and height and it resize the webcam with no black stripes on the top and bottom.
Did you ever experienced that ? Do you have any idea how to fix that issue ?

Thank you in advance for your help,

First of all this library is really great, kudos to developer :) One issue I am facing is when using with IE 8 its not showing preview preview is loaded and half and then stops loading, any idea how to solve it ?

Hello and congrats for your library. It's very good.
My problem is that library doesn't work with WebBrowser in VisualStudio. My browser is IE10 and, after add excanvas.js, it works perfectly: but, when I add the content in a webBrowser inside VisualStudio, it crashed.
The error is generic: "SCRIPT ERROR" in file webcam.js.
Do you know what cuold be the problem?

Thanks

[UPDATE]: Analyze the code, the error break out at block 'getMovie' [line 284]. Maybe the error is similat to 'Object doesn't support property or method '_snap''. It seams not find the callback.
Can you help me?

Hello. If I use webcam as HTML5 element I can control stream and define whether webcam turn off. But how can I define whether webcam is turned off if I use it as flash element? Is there any event or hook?

I can subscribe to the onended event of stream. And it works good when webcam stays unavailable (unplug it from computer). Is there the same event for flash?

I tried to change your webcam.as by adding else-branch to activityHandler. But it couldn't help.

What do you think if I add timer to your actionscript which will check camera? Is it good practice?

Ipad-2 (IOS 8) Opera and Chrome did not detect camera.

Would it be possible from the current base code?

This is more a request then a bug...

By adding 2 lines, it is easely fixed.

localStream = stream;
localStream.stop();

First one on the attach: function

            function(stream) {
                localStream = stream;
                // got access, attach stream to video
                video.src = window.URL.createObjectURL( stream ) || stream;
                Webcam.loaded = true;
                Webcam.live = true;
                Webcam.dispatch('load');
                Webcam.dispatch('live');
            },

And the last one in the reset: function

        if (this.userMedia) {
            localStream.stop();
            delete this.canvas;
            delete this.context;
            delete this.video;
        }

Thank's

Hello, I am using a Dell Venue Windows 8.1 Pro 64-bit with an 8 Megapixel back camera. When using the camera app on the Venue, it takes a very high quality photo. When using webcam.js, the preview is very wavy and grainy, and the final snapshot is as well. I've tried different settings in "Webcam.set", but still poor image quality even when I attempt to match the resolution of the camera app. Any ideas? I've attached two files....one is a screen shot of the webcamjs, the other is an photo taken in the Venue camera app. You can see a lot more detail in the camera app photo.

Firstly, thanks for all your hardwork on this plugin! It's really great. It works well. However, I've noticed in IE when using the fallback it doesn't fire the custom events mentioned here:

https://github.com/jhuckaby/webcamjs#custom-events

On chrome and getusermedia supported browsers I'm using the live event to fire events to change the look and feel so I know the camera is ready. If I do this on IE, it doesn't do it all. Is there common fix for this? Or is this a feature that is not supported for the Flash fallback?

(I tested this in IE11 btw)

Thanks.

I just ran into the problem of having to raise the z-index of the div containing the webcam (particular app problem, nothing to do with webcam.js per se).

I implemented an additional callback hook to inform me when Flash gets loaded. Works nicely for IE8 and Safari7, probably everywhere else, too.

line 145:

    // flash fallback
    var div = document.createElement('div');
    div.innerHTML = this.getSWFHTML();
    elem.appendChild(div);
    // tell the world
    this.dispatch('flash');

Not just frames. Would be awesome!
//Adam

Thanks very much for this! It works great, except when I place it in a jQuery tab. It works fine if it is the active tab displayed when the page is loaded, but not if it is in a secondary tab. The content for the tabs is not loaded via AJAX but is straight HTML elements. The call to attach is within the $(document).ready(), but I've tried it on its own as well. I've tried attaching in the jQuery tabs show event callback, but it still doesn't work there.

please help me update this photobooth

i have error Webam.dispatch('uploadProgress', progress, e); on webcam.js (line 368)
must be Webcam.dispatch('uploadProgress', progress, e);

Many thanks for a excellent script.

It all works perfectly, however i'm wondering if its possible to sync when a image is uploaded to my server and when it is loaded and displayed on my website. At the moment I'm using timers for everything, maybe there is a better way to make it more fluid and smooth? So when image is uploaded it sends a signal to my website to reload the image rather than using timers.

Here is the code I'm using:

http://dpaste.com/0J0A2PV.txt

(JUST UPDATED ABOVE LINK AS IT EXPIRED!)

There is no reset of params and size of image remains the same from one area to another.
I've solved this problem, but I can't create a branch to commit changes.

great lib 👍
wait for your updating

Is it possible for this to have the video go directly to a canvas? I see that the snap shots can be put to canvas but can the video? I have tried but been unsucccessful. Thanks!

Hello, this is great project. Just one question - when I use webcam.js from smartphone, it displays video from the face-facing camera on the phone, but I would need to switch to the back (primary) camera. How can I achieve this? Thanks.

Hi,
what should I do to suppress the "Could not access webcam" when no camera is available. Some of my users have camera, others have not, I don't want to display the error message.

Hello,
I wanna know if there is a way to change the resolution of the camera without changing face's proportion. The camera needs to be a rectangle to face's proportion be ok. Is there any way to change it to a square and keep face's proportion?

I was able to run the demos on my iMac in Safari 7.0.x, it properly fell back to the flash choice, showed the streaming video and captured the snapshot.

I am also running a Windows 7 virtual machine (VMware Fusion) on the iMac. When I run the demo pages in IE11, it properly falls back to flash and asks if I want to allow access to the webcam. It also properly shows the streaming video. But when I click the "Take Snapshot" button, it does not capture the photo. I debugged down to the line of code in webcam.js:

        // flash fallback
        var raw_data = this.getMovie()._snap();

But the error is " Object doesn't support property or method '_snap' ".

I'm not at all familiar with flash programming but I see in the flash code there is a call to add a callback for the _snap external interface.

I am running a recent download of Flash (Adobe Flash Player 13 ActiveX, v13.0.0.214).

Any thoughts or suggestions?

Bizarre (:

//Adam

HD Demo does not work for me.

webcamjs is very useful for my web project.
Is there any way to control TWO webcams installed in a computer?
thanks

When I start the webcam in the flash version and the first time, I get a different flash overlay, as the next start.
the first panel must be concluded with a close button. Is there also an event for this close button?

this is more a question than an issue

I try to test in chrome on ipad but camera doesn't load

Another odd one, trying to recreate reliably.
//Adam

I was hoping if i could use this library on a mobile website and it would open up the rear camera/front camera according to users choice, it would be great. Then i wont be required to use jquery mobile library.

The image is not getting captured, In IE 11. It works fine in other browsers.
The error is

SCRIPT:438 Object doesn't support property or method '_snap'

I don't know why but I get this error whenever I try to capture image. Can somebody tell the reason? I am using Chrome for testing.

Would love to see it back!
//Adam

I'd like to flip the webcam image so that it would act like a mirror (ie: if I move my head to the right it should follow on the screen instead of going the other way).

Is this already possible?

Thanks!

Hi!

After update Adobe Flash, capturing by Flash module wont work.

Ive use a JPEGCam v1.0.9 and its came wont work (just black screen in capture and when saving image to server). Alsoo Ive see demo (http://pixlcore.com/demos/webcamjs/demos/flash.html) and this wont work too - browser stops plugin (crash) after sometime freezing.

I cant see anything how to fix it.

Hi,

thank you for this script : it is perfect for my needs and work very well

but how can i rotate the preview canvas? and so snap image that are rotated ...

some users of my website use external webcam in portrait mode, so a 90 degree rotation could be useful, maybe passing a parameter, sorry i'am not so good in js, i try to modify your code but i didn't come up with anything

hope you can help