search

uiowa / admissions-viewbook

Viewbook application for Admissions.
http://viewbook.admissions.uiowa.edu/
1 stars 0 forks source link

Replace aerial photo at the bottom of the viewbook site with a new photo with lightbox capabilities #46

Closed bspeare closed 3 years ago

bspeare commented 3 years ago

Problem

The current photo does not allow recruiters to show a photo of east and west side of campus. This is used by counselors to point out academic buildings, res halls, east/west, general campus layout, etc.

Current image:

Screen Shot 2020-10-22 at 8 31 28 AM

Proposed Solution

Replace aerial photo at the bottom left of the site with this photo: https://uiowa.photoshelter.com/search/result/I0000uBLdqQxDSiA?terms=&. The photo also needs to be linked to a pop-up modal to allow for a full view of the image.

mjoneill commented 3 years ago

@bspeare @ABoston88

Curious if there's a need for this on uiowa.edu, or even on current e.recruitment site.

bspeare commented 3 years ago

After our discussion today, it sounds like we will move forward with only adding the lightbox feature for this one image on the viewbook site.

bspeare commented 3 years ago

https://www.npmjs.com/package/vue-pure-lightbox?

joewhitsitt commented 3 years ago

fyi, that was the first search result for vue lightbox to make a joke about pointing.

bspeare commented 3 years ago

@joewhitsitt I wanted to capture your search! :)

GaryRidgway commented 3 years ago

I have started to take a look at the vue-pure-lightbox and it does look like a functional option. I have however been looking around and found other options that looked good as well with a bit more functionality. Something that dawned on me as I was looking however is that we are using Vue3, and this may be problematic if we are trying to pull in other Vue work, so if there is research being done for this I recommend keeping that in mind. I found this solution that i thought looked really nice in the demo but I have yet to try any solution out. This one provides the ability to click in the surrounding Grey area to close the modal and some image viewing tools that provide a good user experience.

bspeare commented 3 years ago

Since this is just for one image, can we just use a modal? https://v3.vuejs.org/examples/modal.html#modal-component

GaryRidgway commented 3 years ago

It does seem like a modal would work!

It seems the easiest way to solve this problem might just be to add another full width image of the preferred image below the current location of the gallery. Does anyone think that is not a good idea for any reason?

bspeare commented 3 years ago

@GaryRidgway The grid in that section is pretty dependent on the exact image sizing. Can we replace that photo with the new photo that opens the full size image in a modal?