Photoswipe with base64, Images - jquery-mobile

Question

I am developing an iPad application using Phonegap (Cordova-1.9.0) and jQuery Mobile 1.0.1 . I need to use image gallery for my application.In my application.I found photoswipe image gallery.
I capture image from iPad camera and save as Camera.DestinationType.DATA_URL (Phonegap api ). My imagea are saved as base64, type.
Photoswipe image gallery works fine when I save image as Camera.DestinationType.FILE_URI.
But my problem is that how do i use photoswipe gallery using Camera.DestinationType.DATA_URL?
thank you

Answer 1

I found a solution for a similar problem.
I use photoSwipe with base64 in a web page, and it works this way:
<li><img src="data:image/png;base64,<c:out value='${entry.imagenString}'/>"></li>
In the href and src attributes I put the string of base64 with the notation to indicate that is a base64.
I'll try to use it in Phonegap, but I think that must be the same code.
Edit: I tested it in Phonegap and it works.

Answer 2

I use this :
var imagesArray = data.callback.include.images;
// images :
if(imagesArray && imagesArray.length > 0 && imagesArray != null && imagesArray != undefined){
var images = imagesArray.map((item)=>{
var link = item.trim();
var base = link.split('base64,');
var a = base[0];
var b = base[1];
return `<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<a href=${a}base64,${b} itemprop="contentUrl" data-size="1024x1024">
<img src=${a}base64,${b} itemprop="thumbnail" alt="Image description" />
</a>
<figcaption itemprop="caption description">CAPTION :</figcaption>
</figure>`
})
// building the gallery :
var now = new Date().getTime();
var galleryClassName = "gal-" + shareId + "-" + commentId + "-" + now;
var gallery = `<div class="comments-gallery ${galleryClassName} gallery" itemscope itemtype="http://schema.org/ImageGallery">
${images}
</div>`;
}else { gallery = "" }
then include the gallery variable and then initialize it by calling its class as
var output = `<div class="row"> ${gallery} </div>`;
// init gallerires :
initPhotoSwipeFromDOM("." + galleryClassName);