Page 1 of 3

Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 7:11 am
by Snehal Dhruve

I was able to make it work like in the tutorial. but is there any way to connect appery.io backend with a collection named photoDB to the photoswipe gallery? I am a jr developer but trying to using appery.io to create an app and currently stuck at this.
If not then how do a make a gallery by sourcing images from DB and displaying in slider format in the app. Thanks.


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 3:27 pm
by maxkatz

We will be adding Server Code feature shortly, so you will be able to write any custom code to connect to anything.


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 3:30 pm
by Snehal Dhruve

Is there a way around using the grid and image to do a gallery view till then?


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 4:20 pm
by Kateryna Grynko

Hi Snehal,

To get Image object run: codeAppery("image_component_name").get(0) /code
Run the following code to get base64 string with encoded image from Image object.
codefunction getBase64Image(img) {
// Create an empty canvas element
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;

Code: Select all

 // Copy the image contents to the canvas 
 var ctx = canvas.getContext("2d"); 
 ctx.drawImage(img, 0, 0); 

 // Get the data-URL formatted image 
 // Firefox supports PNG and JPEG. You could check img.src to 
 // guess the original format, but be aware the using "image/jpg" 
 // will re-encode the image. 
 var dataURL = canvas.toDataURL("image/png"); 

 return dataURL; 

}
/code
After you get the base64 string you can send it to Appery.io Database. The same string can be received from Database in mapping to Image component Asset.

When gallery images set is generated go ahead and follow the tutorial.


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 5:15 pm
by Snehal Dhruve

Thanks Katya, let me give it a try and get back to you on this.


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 5:31 pm
by Snehal Dhruve

Katya, Is it possible to get snapshots like your typical tutorials. Gave it a try but wasnt that successful. Thanks


Connect Appery.io backend with Photoswipe gallery

Posted: Mon Jun 17, 2013 5:54 pm
by Kateryna Grynko

Sorry, this is outside the scope of our support. What is the problem with implementing this?


Connect Appery.io backend with Photoswipe gallery

Posted: Wed Jun 19, 2013 5:38 am
by Pratik Sah

hey katya ...can u please ellaborate the thing u mentioned ?

where do we implement the code to get base64 string ?

thanks


Connect Appery.io backend with Photoswipe gallery

Posted: Wed Jun 19, 2013 9:19 am
by Maryna Brodina

Hello! Looks like there is some misunderstanding. You can just add photoswipe plugin to your app.
http://www.photoswipe.com/
http://www.photoswipe.com/latest/exam...

Have you already tried to add this plugin to your app? What kind of problem you have?


Connect Appery.io backend with Photoswipe gallery

Posted: Wed Jun 19, 2013 9:32 am
by Pratik Sah

Hello !
I have tried photoswipe tutorial was able to build a photoswipe gallery but i want the images to be load from the database (the backend service).

I have a build a database where i m capturing and saving the images through camera ..and i want to display all these images in my photoswipe gallery .

Please help me !