Get Camera - Blackberry and save to library advise please
I am using the following code to get pictures from the camera and place them in the app.
However it is not working on Blackberry (camera does not open) onclick="takePicture();"
Also I want to save images to user library as well.
Have found a number of different ways to do this is this any good ? or is there a better method
function takePicture() {
navigator.camera.getPicture(
function(uri) {
var img = document.getElementById('camera_image');
img.style.visibility = "visible";
img.style.display = "block";
img.src = uri;
document.getElementById('camera_status').innerHTML = "Success";
},
function(e) {
console.log("Error getting picture: " + e);
document.getElementById('camera_status').innerHTML = "Error getting picture.";
},
{ quality: 50, destinationType: navigator.camera.DestinationType.FILE_URI});
};
Related
I am trying to generate PDF from image path in react native so i am using below plugin for that
https://www.npmjs.com/package/react-native-image-to-pdf/v/1.2.0
As per above doc i configure all the thing and below is my code
const myAsyncPDFFunction = async () => {
try {
console.log('Call a');
let path ='file:///Users/macminiharshalk/Library/Developer/CoreSimulator/Devices/FADDF530-05FD-4A0E-9E61-C6AEDB719955/data/Containers/Data/Application/37B8FE42-B23A-4018-865F-F57670B3411E/tmp/606C88B3-5759-4942-A544-1231A0C17532.jpg';
const options = {
imagePaths: [path],
name: 'PDFName',
maxSize: {
// optional maximum image dimension - larger images will be resized
width: 900,
height: Math.round(
(Dimensions.get('window').height / Dimensions.get('window').width) *
900,
),
},
quality: 0.7, // optional compression paramter
// targetPathRN: "/storage/emulated/0/Download/", // only for android version 9 and lower
//for versions higher than 9 it is stored in (Download/img-to-pdf/)
};
console.log("options-->", options);
const pdf = await RNImageToPdf.createPDFbyImages(options);
console.log('PDF URIs-->', pdf);
console.log(pdf.filePath);
} catch (e) {
console.log(e);
}
};
When i console log i can able to see pdf path as below
/Users/macminiharshalk/Library/Developer/CoreSimulator/Devices/FADDF530-05FD-4A0E-9E61-C6AEDB719955/data/Containers/Data/Application/37B8FE42-B23A-4018-865F-F57670B3411E/Documents/PDFName.pdf
When i console option parameter it is showing as below
{"imagePaths": ["file:///Users/macminiharshalk/Library/Developer/CoreSimulator/Devices/FADDF530-05FD-4A0E-9E61-C6AEDB719955/data/Containers/Data/Application/37B8FE42-B23A-4018-865F-F57670B3411E/tmp/606C88B3-5759-4942-A544-1231A0C17532.jpg"], "maxSize": {"height": 1948, "width": 900}, "name": "PDFName", "quality": 0.7}
But when i open PDF image is not copy it is blank PDF so any idea how can i show image in PDF ?
please try
const newPath = path.replace('file://', '');
I'm trying to make a live stream app and I want the functionality of switching cameras in smartphones. I've followed this article from MDN but I couldn't get the expected results.
The following are the results I'm getting:
Chrome mobile results: Camera switching from front to back but not switching the other way around.
Firefox mobile results: Camera starting the stream with the rear camera(which is not expected) and not switching to the front camera.
I'm using RTCMultiConnection and RecordRTC for this app.
Code:
function switchCamera(stream){
connection.replaceTrack(stream)
video.pause();
video.srcObject = stream;
video.play();
}
var front = true;
$('#switch').on('click', function(e){
e.preventDefault();
e.stopImmediatePropagation();
front = !front;
var constraints = { video: { facingMode: (front? "user" : "environment") } };
var internalRecorder = recorder.getInternalRecorder();
connection.streamEvents.selectFirst({local: true}).stream.getVideoTracks().forEach(function(track){
track.stop();
});
navigator.mediaDevices.getUserMedia(constraints).then(function(stream){
if(internalRecorder instanceof MultiStreamRecorder){
internalRecorder.resetVideoStreams(stream)
}
switchCamera(stream)
});
I am exporting a diagram made using Jointjs library to pdf using jspdf and canvas:
Below is my javascript code::
var svg = document.querySelector('svg');
var serializer = new XMLSerializer();
var svgString = serializer.serializeToString(svg);
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.fillStyle = '#FFFF';
canvg(canvas, svgString);
var imgData = canvas.toDataURL('image/png');
// Generate PDF
doc.setFontSize(10);
doc.text(35, 25, "Google Cloud Craft");
doc.addImage(imgData, 'PNG', 10, 50);
doc.save('test.pdf');
the result i get after downloading and on canvas is:
What i want is those black arrow marks should not come as they are shown on mouseover events, it should be like below image for reference:
please let me know how can i achieve this.
Let me try to answer.
Add the below code to hide the mouse-over elements before serialising it
$(".marker-arrowhead").css("display", "none");
$(".tool-remove").css("display", "none");
$(".tool-options").css("display", "none");
$(".marker-vertices").css("display", "none");
Hope this helps you.
I found a solution sharing, so that if anyone faces this issue can get help.
this is the solution, who are familiar with jointjs will understand it.
link.attr({
'.marker-arrowheads': {
fill: 'none'
},
'.connection-wrap': {
fill: 'none'
},
'.marker-vertices': {
fill: 'none'
},
'.link-tools': {
fill: 'none'
}
});
Here my proposition :)
const classes = ['.marker-vertices', '.link-tools'];
const svg = this.paper.svg.cloneNode(true);
// remove tools
classes.forEach(c => {
const elements = svg.querySelectorAll(c);
elements.forEach(el => { el.style.display = 'none'; });
});
I want to show an image as a toast instead of plain text message.
I have tried:
try{
var toast = Titanium.UI.createNotification({
duration: Ti.UI.NOTIFICATION_DURATION_LONG,
background: '/images/img1.png'
});
toast.show();
}
catch (err)
{
alert(err.message);
}
Application gets crashed without giving any alert. I have also tried :
try{
var toast = Titanium.UI.createNotification({
duration: Ti.UI.NOTIFICATION_DURATION_LONG,
message: 'text',
});
toast.setBackgroundImage('/images/img1.png');
toast.show();
}
catch (err)
{
alert(err.message);
}
But same issue. App crashes without giving error alert. Anyone knows how to give image in toast?
I think you missed '..' in the background image path.
/images/img1.png should be: ../images/img1.png
I solved it by the functions below. I have decide fade-out time as per my requirement (i.e. 10% of total time). This code may need to handle back button pressed event manually.
var createImageToast = function (img, time)
{
Ti.UI.backgroundColor = 'white';
var win = Ti.UI.createWindow();
var image = Ti.UI.createImageView({
image: img,
});
win.add(image);
win.open();
setTimeout(function(){
decreaseImageOpacity(win,image,1,parseInt(time/10));
},parseInt(time*9/10));
}
var decreaseImageOpacity = function (win, image, opacity, time)
{
if(opacity<=0)
{
win.close();
}
else
{
setTimeout(function(){
image.setOpacity(''+opacity);
decreaseImageOpacity(win,image,opacity-0.1, time);
},parseInt(time/10));
}
}
I am creating a nested list using sencha.
Now on tap i get a list it goes on till i get to the leaf node.
Now what i want is, on clicking a leaf node, i want to generate an event which enables me to open a file.
Not sure how to do that.
my nested list code is
Ext.define("InfoImage.view.nestedList", {
extend:'Ext.NestedList',
xtype:'nestedList',
id:'nestedList',
config:{
fullscreen:'true',
title:'Nested List',
xtype:'nestedList',
displayField : 'text',
html:'Nested List on its way!!!',
store:'nestedListStore'
//itemTpl:'{text}'
}
});
Thanks in advance.
I think, your require PhoneGap here.
File System Access is not available with Sencha Touch. So, you need to use phonegap's File API to access and read the file stored on the system.
Check out the File API Documentation,
FILE API : An API to read, write and navigate file system hierarchies.
Sample e.g from Phonegap,
...
...
// PhoneGap is ready
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function gotFS(fileSystem) {
fileSystem.root.getFile("readme.txt", {create: true}, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
fileEntry.file(gotFile, fail);
}
function gotFile(file){
readDataUrl(file);
readAsText(file);
}
function readDataUrl(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as data URL");
console.log(evt.target.result);
};
reader.readAsDataURL(file);
}
function readAsText(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as text");
console.log(evt.target.result);
};
reader.readAsText(file);
}
...
...
Hope that helps you!
I found the solution using the event: "onleafitemtap" provided by the nested list.