I am having difficulties using the Javascript toolbox to call the exif.js function.
The exif.js function can be downloaded from GitHub - exif-js/exif-js: JavaScript library for reading EXIF image metadata
Before I upload the exif.js file to my root folder on bubble I was wanting to just use the online source:
This I placed in the SEO - Metatags
The demo script shows pulls the ID’s from two images, so I used the Image element twice and set the ID Attribute to img1 and img2 for each of the images, respectively.
Then I put a button on the page to call the exif.js and grab the EXIF data.
To grab the data from the workflow I dropped the Javascript plugin on to the page and set it up as myExifData with suffix myEXIF
The script I used
window.onload=getExif;
function getExif() {
var img1 = document.getElementById(“img1”);
EXIF.getData(img1, function() {
var make = EXIF.getTag(this, “Make”);
var model = EXIF.getTag(this, “Model”);
var makeAndModel = document.getElementById(“makeAndModel”);
makeAndModel.innerHTML =${make} ${model}
;
});var img2 = document.getElementById("img2"); EXIF.getData(img2, function() { var allMetaData = EXIF.getAllTags(this); var allMetaDataSpan = document.getElementById("allMetaDataSpan"); allMetaDataSpan.innerHTML = JSON.stringify(allMetaData, null, "\t"); });
}
Because the Javascript plugin only returns one (array value), I simplified the above to just pull the EXIF data from the second image “img2”
var img2 = document.getElementById(“img2”);
EXIF.getData(img2, function() {
var allMetaData = EXIF.getAllTags(this);
var allMetaDataSpan = document.getElementById(“allMetaDataSpan”);
allMetaDataSpan.innerHTML = JSON.stringify(allMetaData, null, “\t”);bubble_fn_myEXIF(allMetaDataSpan);
};
Then finally, I put a text box on my page and set it to the value of myExifData
However, I do not get any results showing up in my text box.
I suspect it is because the the variable declaration for img2 does not actually have access to the ID Attribute “img2”, but I do not know how to fix this?