Forum Academy Marketplace Showcase Pricing Features

Editing/deleting "pinterest" grid

I copied @fayewatson “pinterest” style grid as you can see here. https://calendario-app-test.bubbleapps.io/version-test/dos?debug_mode=true When you click on the image the popup appears displaying the selected image. I have also created a “delete picture” button. I am having trouble figuring out how to delete the displayed image in the popup, from both column and database. Can you help with that? Thanks. https://bubble.io/page?type=page&name=dos&id=calendario-app-test&tab=tabs-1

Hello :slight_smile: I just made one change in the workflows when an image within each grid is clicked. Previously you had:

This would display the image in a popup. However, instead of doing this, we can set the type of content to the popup to be PictureGrid and send the most recently clicked PictureGrid’s data to that popup. The updated workflow is:

The popup data setup now looks like:

(Popup)

(Image)

We were able to leave the popup’s data source empty since we are sending the recently clicked Current cell’s data to the popup right before the popup is shown.

Then the workflow for the delete button is:

I also set this condition on the delete button so that’s only visible to the User who uploaded the picture.

I also just realized that if an image is deleted, you need to make changes to the Group Number of every PictureGrid which was uploaded after the upload date of the deleted picture. For example, if you had four pictures, and you deleted the picture in column 2 (3 needs to become 2, and 4 needs to become 3 to avoid a big blank space in column 2). Check out the workflows on the delete button and test to see if the grid ‘adjusts’ as expected. If it doesn’t let me know and we can try to find a solution. :slight_smile:

Thanks for the help with that. I will check it out as soon as I get a chance.

I was wondering if the initial workflow for uploading an image could be set up this way- Instead of groups# as you set it maybe when a RG’s picture count is less than the previous RG add picture. Maybe that would eliminate the white space.

That could definitely be interesting to try :slight_smile: But, if a User deleted many pictures, and then didn’t upload anything for a while the spaces would be there. I think you’d have to make changes to every picture uploaded. I created a custom state on the forum example which will ‘hide’ an image (as if we’re deleting it). If you click the ‘x’ on many pictures in one column, this is what the grid would look like if we didn’t adjust the group numbers:

Preview:

Editor: