Languages

Menu
Sites
Language
How can I know Camera Web API ? I want to know camera focus..

I'm working on camera App. my app(AngleCam) is uploaded yesterday.

but I can't know camera focus function source..  so photo have bad quality.

my app have only selfie function .  I want to use back camera.

Please Help..

 

 

 

Edited by: Eun song Chun on 16 Jun, 2016
View Selected Answer

Responses

7 Replies
Mark as answer
Iqbal Hossain

Hello,

You need to add a focus container in html.

<div id="focus-container" class="hidden">
    <div id="focus-frame"></div>
</div>

And need to initialize in the init method,

function init() 
{
   cameraPreview = document.getElementById('camera-preview');
   focusContainer = document.getElementById('focus-container');
   focusFrame = document.getElementById('focus-frame');
   bindEvents();
}

For more about Focus please go to following link,

https://developer.tizen.org/development/tutorials/web-application/w3chtml5supplementary-features/supplementary-features/camera-api-tizen-extension/task-camera#photo

And for, back Camera please use

// Back Camera
var backCamera = function () {
    navigator.getUserMedia(
    	{
		audio: false, 
		video: true,
		facingMode: "environment"  // For Back Camera. Without this parameter only front camera can be opened. 
       } 
	, null, null);
};

If you don't give facingMode parameter, your app will open front camera.

And Here is Tizen Camera Web API link

https://developer.tizen.org/dev-guide/2.4/org.tizen.web.apireference/html/w3c_api/camera_w.html

If you find my post helpful for you, please mark it as the Best Answer to promote this post to others.
Thanks.

 

Iqbal Hossain

Hello,

Has it solve your problem ?

Eun song Chun

Hi Thank you for your answer

your answer is very helpful for me!

 

I'm unsing selfcame example. and your sources apply it.

so, I success back Camera.

 var options = {
         
            audio: true,
            video: true,
            facingMode: "environment"
           
     };

try {
            if (typeof (navigator.getUserMedia) === 'function') {
                // ask user to grant permissions to use media objects
             navigator.getUserMedia(options,
                     this.onCaptureVideoSuccess.bind(this),
                     this.onCaptureVideoError.bind(this));   
            }
        } catch (e) {
            alert('navigator.getUserMedia() error.');
            console.error('navigator.getUserMedia() error: ' + e.message);
        } 

 

 

I want to change camera when I click a button.

but I fail this..  screen is stopped when i click the button.

 

Could you help more this problem?

 

Eun song Chun

Hi Thank you for your answer

your answer is very helpful for me!

 

I'm unsing selfcame example. and your sources apply it.

so, I success back Camera.

 var options = {
         
            audio: true,
            video: true,
            facingMode: "environment"
           
     };

try {
            if (typeof (navigator.getUserMedia) === 'function') {
                // ask user to grant permissions to use media objects
             navigator.getUserMedia(options,
                     this.onCaptureVideoSuccess.bind(this),
                     this.onCaptureVideoError.bind(this));   
            }
        } catch (e) {
            alert('navigator.getUserMedia() error.');
            console.error('navigator.getUserMedia() error: ' + e.message);
        } 

 

 

I want to change camera when I click a button.

but I fail this..  screen is stopped when i click the button.

 

Could you help more this problem?

 

Iqbal Hossain

why not ? ... but  create a different thread for the problem.

kitharing ton
  • Camera API is currently supported in Firefox and Google Chrome on Android devices.
  • createObjectURL is supported in Firefox, Google Chrome and Internet Explorer 10+.
  • FileReader is supported in Firefox, Google Chrome, Internet Explorer 10+ and Opera 11.6+.

 

kitharing ton

Several variants of "Media Capture APIs" have evolved over the past few years. ..... Since I know absolutely nothing about WebGL

 


gangboard.com/big-data-training/hadoop-training