Styjun

Whaling ship logistics

Why is volatility skew/smile for long term options flatter compare to short term options?

A famous scholar sent me an unpublished draft of hers. Then she died. I think her work should be published. What should I do?

Is there a concept of "peer review" in Rabbinical Judaism?

Received a package but didn't order it

"I will not" or "I don't" in the following context?

Which lens has the same capability of lens mounted in Nikon P1000?

Diminutive -ula

Why was Logo created?

Are fuzzy sets appreciated by OR community?

Does the app TikTok violate trademark?

Youtube not blocked by iptables

Why is a road bike faster than a city bike with the same effort? How much faster it can be?

What does it mean by "my days-of-the-week underwear only go to Thursday" in this context?

Algorithm that generates orthogonal vectors: C++ implementation

Number of list elements less than a given integer

How can I tell the difference between fishing for rolls and being involved?

What is the difference between an astronaut in the ISS and a freediver in perfect neutral buoyancy?

If a spaceship ran out of fuel somewhere in space between Earth and Mars, does it slowly drift off to the Sun?

Why was it decided in 1956 to abolish the spelling чорт (devil) in favor of чёрт?

My manager quit. Should I agree to defer wage increase to accommodate budget concerns?

What is the white pattern on trim wheel for?

Help in drawing resonance structures in case of polybasic acids

Subverting the emotional woman and stoic man trope

Troubleshooting Safari issue using video in Angular app

Is Safari on iOS 6 caching $.ajax results?Prevent standalone iOS web app from reloading after loading videoWhat is the difference between angular-route and angular-ui-router?Access iPhone camera from Mobile Safari (iOS8)Alternative to webkit-playsinline for SafariHuge number of files generated for every Angular projectHow to access camera on iOS11 home screen web app?Safari Webapp force to open Safari when click another linkArray state will be cached in iOS 12 Safari. Is it a bug or feature?

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty margin-bottom:0;

0

I've created a web app in Angular that uses the webcam of the users mobile app to scan QR Codes. It's working as intended on Android devices but I'm getting weird behavior on ioS devices (in Safari) that I'm having trouble pinning down. The desired behavior is...
1) User goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera
4) Camera starts and is displayed in a widget on the web page
5) When QR Code is recognized some logic is performed in the app

This is working exactly as intended on Android devices (in Chrome)

The behavior I'm getting on iOS devices is as follows...
1) Use goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera (so far so good)

Here's where the experience diverges...
After clicking allow instead of opening up the video in a widget on the web page (like it does on the Android device) instead it opens up 'full screen' as if you were taking a video. It's also clearly no longer sending data to the app and the only way to get back to the web page is to close the camera. Sorry for the long description but trying to provide as much detail as possible.

There are a number of things going on here but breaking it down it would be great if anyone had suggestions why I would be getting that different camera behavior (opening full screen in camera app instead of displaying in widget). Here is some of the code that is performing the work in the Angular app...

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

Any suggestions would be greatly appreciated. Again works fine in Android, just trying to fix behavior in Safari.

javascript angular safari html5-video

share|improve this question

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

add a comment
 | 

0

I've created a web app in Angular that uses the webcam of the users mobile app to scan QR Codes. It's working as intended on Android devices but I'm getting weird behavior on ioS devices (in Safari) that I'm having trouble pinning down. The desired behavior is...
1) User goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera
4) Camera starts and is displayed in a widget on the web page
5) When QR Code is recognized some logic is performed in the app

This is working exactly as intended on Android devices (in Chrome)

The behavior I'm getting on iOS devices is as follows...
1) Use goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera (so far so good)

Here's where the experience diverges...
After clicking allow instead of opening up the video in a widget on the web page (like it does on the Android device) instead it opens up 'full screen' as if you were taking a video. It's also clearly no longer sending data to the app and the only way to get back to the web page is to close the camera. Sorry for the long description but trying to provide as much detail as possible.

There are a number of things going on here but breaking it down it would be great if anyone had suggestions why I would be getting that different camera behavior (opening full screen in camera app instead of displaying in widget). Here is some of the code that is performing the work in the Angular app...

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

Any suggestions would be greatly appreciated. Again works fine in Android, just trying to fix behavior in Safari.

javascript angular safari html5-video

share|improve this question

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

add a comment
 | 

I've created a web app in Angular that uses the webcam of the users mobile app to scan QR Codes. It's working as intended on Android devices but I'm getting weird behavior on ioS devices (in Safari) that I'm having trouble pinning down. The desired behavior is...
1) User goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera
4) Camera starts and is displayed in a widget on the web page
5) When QR Code is recognized some logic is performed in the app

This is working exactly as intended on Android devices (in Chrome)

The behavior I'm getting on iOS devices is as follows...
1) Use goes to web page that hosts the Angular App
2) They click on a button that takes them to the 'scanning' page
3) User is asked for permission to use camera (so far so good)

Here's where the experience diverges...
After clicking allow instead of opening up the video in a widget on the web page (like it does on the Android device) instead it opens up 'full screen' as if you were taking a video. It's also clearly no longer sending data to the app and the only way to get back to the web page is to close the camera. Sorry for the long description but trying to provide as much detail as possible.

There are a number of things going on here but breaking it down it would be great if anyone had suggestions why I would be getting that different camera behavior (opening full screen in camera app instead of displaying in widget). Here is some of the code that is performing the work in the Angular app...

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

Any suggestions would be greatly appreciated. Again works fine in Android, just trying to fix behavior in Safari.

javascript angular safari html5-video

share|improve this question

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

//From component that is doing the scanning.

startCamera() 
 if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) 
 navigator.mediaDevices.getUserMedia(this.constraints).then(stream => 
 this.video.nativeElement.srcObject = stream;
 this.video.nativeElement.play();
 this.streamTracker = stream.getTracks()[0];
 );
 



//From library that contains scanning logic. Just including for completeness. This also gets called when scanning starts
//It is passed the id 'video' from above
qrcode.setWebcam = function(videoId) {
 var n = navigator;
 qrcode.video = document.getElementById(videoId);

 var options = true;
 if (navigator.mediaDevices && navigator.mediaDevices.enumerateDevices) 
 try 
 navigator.mediaDevices.enumerateDevices().then(function(devices) 
 devices.forEach(function(device) 
 if (device.kind === 'videoinput') 
 if (device.label.toLowerCase().search('back') > -1)
 options = [
 sourceId: device.deviceId
 ];
 
 );
 );
 catch (e) 
 else 

<div class="embed-responsive embed-responsive-1by1 b-light border rounded">
 <video src="" class="embed-responsive-item" #video id="video" autoplay></video>

javascript angular safari html5-video

javascript angular safari html5-video

share|improve this question

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

share|improve this question

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges

asked Mar 28 at 18:37

Artemis JArtemis J

2866 bronze badges