I am trying to implement a camera functionality in Desktop and Tablet. I need to detect the device first and then add camera functionality.
I have detected Device using navigator-user-agent but when I try it in windows or tablet, It is detecting as windows only:
enter const webcam_Result = (sync () => {
try {
var has_webcam = await detecting_Webcam();
if (has_webcam === true) {
var detect_Device = navigator.userAgent;
if (detect_Device.includes("Windows")) {
this.setState({
webcam_access: true
});
} else {
this.setState({ webcam_access: false });
}
}
if (has_webcam === false) {
this.setState({ webcam_access: false });
}
} catch (e) {
alert("entered into catch block");
console.log(e);
}
})();
};
Expected Results : need to differentiate desktop and tablet using navigator.useragent
Related
---Dropzone JS---
How can I remove all files with single API call?
Let say,
I've uploaded 4 images; on popup close/cancel event I triggered removeAllFiles(true), that will remove files from Dropzone area, but calling 4 API calls.
How do I get an array of files & remove at once?
_.extend(vm.dzOptions, {
"init" : function () {
let _this = this;
// Setup the observer for the button.
document.querySelector("button.attach-cancel-btn").addEventListener("click", function () {
// If you want to cancel uploads as well, you
// could also call _this.removeAllFiles(true);
_this.removeAllFiles(true);
});
},
"sendingmultiple": function (files, xhr, formData) {
formData.append("destination", dzOptionsData.destination);
formData.append("attachmentCount", files.length);
},
"removedfile" : function (file) {
if (file.status !== "canceled") {
$http.post("/delete-file", {paths: file.absolutePath}).then(
(res) => {
res = res.data;
if (res.code == "OK") {
file.previewElement.remove();
Notification.success({"message": res.message, replaceMessage: true});
}
else {
Notification.error({"message": res.message, replaceMessage: true});
}
},
(err) => {
Notification.error({"message": err.message, replaceMessage: true});
}
);
}
}
});
There should be a feature called removemultiple like other multiple options.
Thanks.
The new .HEIC files on IOS 11 is causing problems because image hosting services to not support it.
The camera roll api is returning.HEIC files. How can we get .JPG/.PNG instead. Or convert .HEIC to .JPG/.PNG
ImagePicker.showImagePicker(options, imgResponse => {
this.setState({ imageLoading: true, avatarMediaId: null });
if ((imgResponse.didCancel) || (imgResponse.error)) {
this.setState({ imageLoading: false });
} else {
let source = {};
let fileName = imgResponse.fileName;
if (Platform.OS === 'ios' && (fileName.endsWith('.heic') || fileName.endsWith('.HEIC'))) {
fileName = `${fileName.split(".")[0]}.JPG`;
}
source = { uri: imgResponse.uri, fileName };
this.uploadImage(source);
}});
I am using open.min.js v2 with node and angular It is perfectly working fine in on Chrome latest version but not Firefox v57.0.1.
Here's the errors I'm seeing in console:
OT.Publisher.onStreamAvailableError OT_MEDIA_ERR_ABORTED: Unknown error while getting user media: InternalError
OT.exception :: title: Unable to Publish (1500) msg: GetUserMedia
I'm using following code:-
session.connect(token, function (error) {
if (error) {
if (error.name === "OT_NOT_CONNECTED") {
videocall_err.innerHTML = 'You are not connected to the internet. Check your network connection.';
}
} else {
var publisherProperties = {
width: 200,
height: 150,
name: result.data.user.fullname
};
publisher = OT.initPublisher('myPublisherDiv', publisherProperties);
session.publish(publisher).on("streamDestroyed", function (event) {
event.preventDefault();
if (event.reason == 'networkDisconnected') {
console.log("networkDisconnected");
}
});
}
});
session.on("sessionDisconnected", function (event) {
});
});
I have disabled backbutton for some condition by backbutton register action event like this:
$ionicPlatform.registerBackButtonAction(function (event) {
if (condition)
{
event.preventDefault();
$ionicHistory.nextViewOptions({ disableBack: true });
}
else
{
$ionicHistory.goBack();
}
}, 800);
So now how can i enable that device backbutton again ?
Because its still disabled and not going in previous view too.
you need to try this
var lastTimeBackPress = 0;
var timePeriodToExit = 2000;
platform.registerBackButtonAction(() => {
// get current active page
let view = this.nav.getActive();
if (view.component.name == "HomePage") {
//Double check to exit app
if (new Date().getTime() - lastTimeBackPress < timePeriodToExit) {
platform.exitApp(); //Exit from app
} else {
let toast = this.toastCtrl.create({
message: 'Press back again to exit App',
duration: 3000,
position: 'bottom'
});
toast.present();
lastTimeBackPress = new Date().getTime();
}
} else {
// go to previous page
this.nav.pop({});
}
});
hope it will work for you
I'm using ngAudio to control audio tracks (spotify 30 seconds previews) on an ionic app. It all works swell in the browser. However, in both ionic view and the actual demo app, the tracks will only stream when I have the phone vibrate toggle turned to not silent/ring mode. If it's in vibrate mode, the user hears nothing. I've dug all over and can't seem to solve this riddle.
Here's my service:
.factory('PlayerService', function(ngAudio) {
var _play = function(show) {
if (typeof audioObject === "undefined") {
audioObject = ngAudio.load(show.track1_preview);
console.log(audioObject);
audioObject.play();
audioObject.playing = show.id;
return audioObject;
} else if (audioObject.paused) {
audioObject = ngAudio.load(show.track1_preview);
audioObject.play();
audioObject.playing = show.id;
return audioObject;
} else {
audioObject.stop();
audioObject = ngAudio.load(show.track1_preview);
audioObject.play();
audioObject.playing = show.id;
return audioObject;
}
}
var _pause = function(show) {
audioObject.stop();
audioObject.playing = '';
}
return {
play: _play,
pause: _pause
};
Here's the controller:
$scope.playStream = function(show) {
PlayerService.play(show);
$scope.audioObject = audioObject; // this allow for styling the play/pause icons
}
$scope.pauseStream = function(show) {
PlayerService.pause(show);
$scope.audioObject = audioObject; // this allow for styling the play/pause icons
//console.log($scope.audioObject);
}
$scope.togglePlayPause = function(show) {
if (!$scope.audioObject || $scope.audioObject.paused) {
$scope.playStream(show);
} else if (show.track1_preview !== $scope.audioObject.id) {
$scope.playStream(show);
} else {
$scope.pauseStream(show);
}
}
Obviously, it's a bit of a crap user experience if someone has to put the phone off vibrate to hear the tracks.
I'm wondering if this is related to asyncronous stuff and mobile. I just don't know. Giving up after 4 hours of messing with it.