Salesforce Developer Community

Vadivel Murugan 9
NEWBIE
15 Points
Member since 2016

Chatter

Feed
0

Best Answers
0

Likes Received
0

Likes Given
1

Questions
1

Replies

Take Snap Shot Using getMediaUser for Javascript

Hi,

I am using javascript to take snapshot for through mobile camera. But when i have used dual camera mobile that time the rear camera is not working. it like display full block. the below code i have used.

<apex:page standardController="Service_Report__c" extensions="Photoupload1" showHeader="false" sidebar="false">
<html>
<head>

<apex:includeScript value="{!$Resource.Cordova}"/>
<script type="text/javascript" charset="utf-8" src="cordova-2.4.0.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="https://github.com/apache/cordova-plugin-camera.git"></script>
<script type="text/javascript" src="https://rawgithub.com/jaysalvat/jquery.facedetection/master/js/jquery.facedetection.js"></script>
<script type="text/javascript" src="https://rawgithub.com/jaysalvat/jquery.facedetection/master/js/facedetection/ccv.js"></script>
<script type="text/javascript" src="https://rawgithub.com/jaysalvat/jquery.facedetection/master/js/facedetection/face.js"></script>
<script type="text/javascript" src="{!URLFOR($Resource.PhotoBooth, 'photobooth-js-gh-pages/website/js/jquery.js')}"></script>
<link href='https://fonts.googleapis.com/css?family=Abel' rel='stylesheet' type='text/css'/>

<script type="text/javascript" src="{!URLFOR($Resource.PhotoBooth, 'photobooth-js-gh-pages/photobooth_min.js')}"></script>
<script type="text/javascript" src="{!URLFOR($Resource.PhotoBooth, 'photobooth-js-gh-pages/website/js/script.js')}"></script>
<script type="text/javascript" src="{!URLFOR($Resource.PhotoBooth, 'photobooth-js-gh-pages/website/js/hijs.js')}"></script>
<link type="text/css" rel="stylesheet" media="screen" href="{!URLFOR($Resource.PhotoBooth, 'photobooth-js-gh-pages/website/css/page.css')}" />

<style>
#wrapper {
width:1600px;
clear:both;
}
#first {
width:800px;
float:left;
}
#second {
width:800px;
float:left;
}
</style>
</head>

<div> <br/><br/>
<p style="font-size: 25px; font-weight: normal; margin-left: 40%;">System Photos Capture Page</p><br/>
</div>




<div class="select" style="width:80%;display:none">
<label for="audioSource">Audio source: </label><select id="audioSource"></select>
</div><br/>
<div class="select" style="width:80%;">
<label for="videoSource">Camera source: </label><select id="videoSource"></select>
</div><br/>

<div id="wrapper">
<div id="first">
<video id="video" autoplay="autoplay" align="center" style="background-color: white;width:40%; height:40%;">
</video><br/><br/>
<button data-theme="d" id="screenshot" onclick="Capture()">Screen Shot</button>
<button data-theme="d" id="Upload" onclick="Upload()">Upload</button>
</div>
<div id="second">
<canvas id="tagCanvas" style="background-color: white;width:40%;height:40%;">
</canvas>
</div>
</div><br/><br/><br/>

<script>
var videoElement = document.querySelector('video');
var audioSelect = document.querySelector('select#audioSource');
var videoSelect = document.querySelector('select#videoSource');

navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia || navigator.mozGetUserMedia;

function gotSources(sourceInfos) {
for (var i = 0; i !== sourceInfos.length; ++i) {
var sourceInfo = sourceInfos[i];
var option = document.createElement('option');
option.value = sourceInfo.id;
if (sourceInfo.kind === 'audio') {
option.text = sourceInfo.label || 'microphone ' +
(audioSelect.length + 1);
audioSelect.appendChild(option);
} else if (sourceInfo.kind=== 'video') {
option.text = sourceInfo.label || 'camera ' + (videoSelect.length + 1);
videoSelect.appendChild(option);
} else {
console.log('Some other kind of source: ', sourceInfo);
}
}
}

if (typeof MediaStreamTrack === 'undefined' ||
typeof MediaStreamTrack.getSources === 'undefined') {
alert('This browser does not support MediaStreamTrack.\n\nTry Chrome.');
} else {
MediaStreamTrack.getSources(gotSources);
}

function successCallback(stream) {
window.stream = stream; // make stream available to console
videoElement.src = window.URL.createObjectURL(stream);
videoElement.play();
}

function errorCallback(error) {
console.log('navigator.getUserMedia error: ', error);
}

function start() {

var audioSource = audioSelect.value;
var videoSource = videoSelect.value;

alert(videoSelect.value-1);

var constraints = {
audio: false,
video: {facingMode: "environment",
optional: [{
sourceId: videoSource
}]
}
};

navigator.getUserMedia(constraints, successCallback, errorCallback);
}

audioSelect.onchange = start;
videoSelect.onchange = start;

start();

function Capture() {

var canvas = document.querySelector('#tagCanvas');
var ctx = canvas.getContext('2d');
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
ctx.drawImage(video, 0, 0);
try {
var imageUrl = canvas.toDataURL();

} catch (e) {
alert("Error in getting canvas url");
}
}

function Upload(){

var canvas = document.querySelector('#tagCanvas');
var imageUrl = canvas.toDataURL();
saveImage(imageUrl);
}
</script>


<apex:form >

<apex:actionRegion >
<apex:actionFunction action="{!saveImage}" name="saveImage" rerender="dummy">
<apex:param name="imageBase" assignTo="{!imageBase}" value="" />
</apex:actionFunction>
<apex:outputPanel id="dummy"/>
</apex:actionRegion>

</apex:form>

</html>
</apex:page>

If any one kno how to use rear camera in snapshot for mobile. Kindly let me know

Vadivel Murugan 9
March 29, 2016
Like
0

8 replies

How to write a Test method for a private method when the test method is in seperate test class.

Hi all, i am trying to write a test method for a private method and my test methods is in seperate test class.My methosd has a "private static" modifier but after writing test method as

static testMethod void test_getRestrictedProfileSet()
        {
            Test.startTest();
            ProductsAndServicesController testgetprofile=new ProductsAndServicesController();
            system.assert(testgetprofile.getRestrictedProfileSet()!=null);
            Test.stopTest();
        }

i am getting this error::::::Error: Compile Error: Method is not visible: [ProductsAndServicesController].getRestrictedProfileSet() at line 16 column 27...............................can anybody help me in solving this problem.It will be so helpful for me.

rahulrahx
October 02, 2012
Like
0