Photo-location - and images AUTO-UPLOADED to Cloudinary

Project Showcase
1

Main features

  • Upload a photo to Glide and mark it with a location
  • Auto-upload the photos to Cloudinary
  • Resizing and other maniputations of the photo uploaded to Cloudinary
  • Remove the photo from Glide
  • View all the photos uploaded - and directly sourced from Cloudinary account
  • Photo and location saved to both Glide Table and Google Sheets

image
image400×839 53.1 KB

Idea
Photo and location is inputted to the glide table “Input…” and data are copied to “Registrations”
Photo and location is then cleared from glide table “Input…”

Building your own version

Copy and modify version: URL: https://photo-location-temp.glideapp.io/

Prerequisite

  • A Cloudinary account
  • A upload preset is to be setup inside Cloudinary
  • A folder for your uploaded images is to be setup inside Cloudinary

If you haven’t got a Cloudinary account yet the please consider signing up by an invitation link. This will give some extra credits for me and allow for more free transformations, file storage etc. Mine is: https://cloudinary.com/invites/lpov9zyyucivvxsnalc5/ufjxv2xds2yignimyvnu

But you could also ask some of the other Cloudinary gurus of the community for their invitation link.

Tricks

  • Input you Cloudinary account name (in column cloud_name) in General sheet in Google sheets

  • Create a folder in Cloudinary e.g. image_and_locations_v2_1

  • Create a Auto upload mapping in Cloudinary (URL prefix: https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/xxxxxxRRB29pZ2kwVHF72/pub/)

    image
    image973×334 37 KB

  • Create an Upload preset in cloudinary (found in Settings)

    image
    image716×211 13.3 KB

    image
    image987×234 27.6 KB

  • The app gets its assets saved to a specific folder - this can be determined from Google Sheets, sheet General and path to the App image in that sheet. It will be something like:
    https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/xxedxRRB29pZ2kwVHF72/pub/

  • In the Glide Table “Input_simple_image_locations” and column “Image name” you need to replace the path to the actual used by your app - like:
    https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/xxedxRRB29pZ2kwVHF72/pub/

Variation (edited 2021-05-19)
If you want to store the original image in Cloudinary then this is possible as well - you need to do two things:

  • Discard the Upload present in Cloudinary (you then don’t do any transformations on the image on the way into Cloudinary)
  • Add a transformation on the “Cloudinary folder path” column in General sheet like (remember to input your own cloud name):
    https://res.cloudinary.com/<cloud_name>/image/upload/bo_17px_solid_rgb:fa74ff,c_thumb,g_face,h_500,q_auto,r_max,w_500/image_and_locations_v2_1/
13 Likes
2

@Shiv Take a look on the sample app - I hope you can get inspired by it. The maniputed images will be stored in Glide table and Google sheets. Of course you can also store the original image if you want to. If you store it (the reference) in google sheets it would be easy to clean up from time to time)

3 Likes
3

Looks amazing, but as I’m trying t set this up, where can i find this:

(URL prefix: https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/xxxxxxRRB29pZ2kwVHF72/pub/ )

4
  • The app gets its assets saved to a specific folder - this can be determined from Google Sheets, sheet General and path to the App image in that sheet. It will be something like:
    https://storage.googleapis.com/glide-prod.appspot.com/uploads-v2/xxedxRRB29pZ2kwVHF72/pub/

As described. Look in the google sheeet and in General sheet. I have put in one image which should be stored in your app folder. Hope this works. Otherwise - create a new image column in this sheet (through the glide builder) and upload an
image from your computer drive. Go to google sheets to see the path to the image

2 Likes
5

I make Wiz’ words my words.

3 Likes
6

I did an edit in the original post.

If you want to store the original image in Cloudinary then this is possible as well - you need to do two things:

  • Discard the Upload present in Cloudinary (you then don’t do any transformations on the image on the way into Cloudinary)
  • Add a transformation on the “Cloudinary folder path” column in General sheet like (remember to input your own cloud name):
    https://res.cloudinary.com/<cloud_name>/image/upload/bo_17px_solid_rgb:fa74ff,c_thumb,g_face,h_500,q_auto,r_max,w_500/image_and_locations_v2_1/

(For fun, when having both the Upload preset in Cloudinary and the transformations on “import” to Glide the image could look like this)

image
image535×536 13.3 KB

3 Likes
7

Found out that the template app that I was linking to was the wrong app. Now updated to the correct template app. Sorry about that.

2 Likes