How to upload a photo to the tiggzi database immediately after it was taken by the phone camera?

[Kateryna Grynko]

First, rename local storage variable from '_sessionToken' to 'sessionToken' in JavaScript code (line 279)

[Melvin Tan Gim Huat]

Hi Katya,

That suggested change did not make things work. I reviewed the code again and if I'm not wrong, the user should see an alert screen whether the photo upload was a success or failure.

However, there was no alert screen after executing the code. Maybe this is a useful clue.

Any other suggestions?

Thanks.

[Kateryna Grynko]

Hi,
Sorry, there was a mistake in our JS code here
Please edit JS asset and paste code from this source instead of first part of code (starts from "var Base64").

[Melvin Tan Gim Huat]

Hi Katya,

That worked; I can upload the photo taken by the iPhone camera now.
However, when I try to load the photo in an image asset, it fails to load correctly.

I've tried many changes and I'm certain the photo filename is correct (includes the Tiggzi-generated text in front of file name).

Any idea on the possible causes?

I see that the ACL column for the iPhone uploaded images has code in there (see screenshot). Can this be the cause? What does this mean anyway?

[Maryna Brodina]

Hello! Could you clarify please what do you mean on "it fails to load correctly"? What exactly heppens?

This means you can make a particular object accessible to a particular user(s)

[Melvin Tan Gim Huat]

Hi Marina,

You can see the screenshot below. After I click on "Add Photo", I'm able to activate the iPhone camera to capture an image and it successfully uploads to Tiggzi database.

Thereafter, I click on "Load Photo". When I do that, the file name of the image that had just been uploaded to Tiggzi database is displayed below and a REST service I have on the screen is activated to retrieve this file name from the database.

As you can see though, the image does not load but instead, displays the "?" icon.

[Maryna Brodina]

Ok, thank's. I see now. Our developpers already working on it. A'll update.

[Melvin Tan Gim Huat]

Thanks Marina. Is this a bug that your team is working to fix? Or do you mean that your team is helping to look into this specific issue on my app?

[Maryna Brodina]

No, it seems it's not a bug, our team trying to help you to get this feature work

[Maryna Brodina]

Hello again:)

To make it work next changes must be performed:

1) Screen "newThoughtScreen", service "camera2", action "Run Custom Javascript". Change Javascript from

codevar imageDataBase64 = arguments[0].imageDataBase64;
var rawData = Base64.decode(imageDataBase64);
uploadFromCamera('filename.jpg', rawData);/code

to

codevar imageDataBase64 = arguments[0].imageDataBase64;
var rawData = window.atob(imageDataBase64.substring(23));
uploadFromCamera('filename.jpg', rawData);/code

2) JavaScript asset "Base64". Change JavaScript code from:

codefunction uploadFromCamera(filename, data, mimetype) {

var serverUrl = 'https://api.tiggzi.com/rest/1/db/files/' + filename;

$.ajax({
type: "POST",
beforeSend: function(request) {
request.setRequestHeader("X-Tiggzi-Database-Id", melvintangh_settings['database_id']);
request.setRequestHeader("X-Tiggzi-Session-Token", localStorage.getItem('sessionToken'));
//request.setRequestHeader("Content-Type", file.type);

},
url: serverUrl,
data: data,
processData: false,
contentType: false,
success: function(data) {

// OPTIONAL, this is the file name under which the image was stored in database....
localStorage.setItem('db_file_name', data.filename);
alert("Upload successful");
},
error: function(data) {
// do something in case of an error...
alert("File Upload error");
}
});
}/code

to

codefunction stringToArrayBuffer(str) {
var buf = new ArrayBuffer(str.length);
var bufView = new Uint8Array(buf);
for (var i=0, strLen=str&#46;length; i<strLen; i++) {
bufView = str&#46;charCodeAt(i);
}
return buf;
}

function uploadFromCamera(filename, data, mimetype) {

var serverUrl = 'https:&#47;&#47;api&#46;tiggzi&#46;com&#47;rest&#47;1&#47;db&#47;files&#47;' + filename;

$&#46;ajax({
type: "POST",
beforeSend: function(request) {
request&#46;setRequestHeader("X-Tiggzi-Database-Id", melvintangh_settings['database_id']);
request&#46;setRequestHeader("X-Tiggzi-Session-Token", localStorage&#46;getItem('sessionToken'));
&#47;&#47;request&#46;setRequestHeader("Content-Type", file&#46;type);

},
url: serverUrl,
data: stringToArrayBuffer(data),
processData: false,
contentType: false,
success: function(data) {

&#47;&#47; OPTIONAL, this is the file name under which the image was stored in database&#46;&#46;&#46;&#46;
localStorage&#46;setItem('db_file_name', data&#46;filename);
alert("Upload successful");
},
error: function(data) {
&#47;&#47; do something in case of an error&#46;&#46;&#46;
alert("File Upload error");
}
});
}/code