Product: First and last products should have larger adjacent images

[domyen]

If you navigate to the first and last products in an index, their adjacent products in the index (the ones at the very bottom of the page) in this case the single adjacent product should use the larger sized image and be wider.

We solve this in the blog with php logic that reads like this:

if there is a previous post AND a next post
  show previous and next post
else
  if there is a previous post
    show previous post
  else
    show next post
  endif
endif

What is the logic for handlebars?

Screenshot of first product in index' adjacent post:

[tmeasday]

You'll see the parent div (.collage) has class .single in this case. Do we need more than this?

[domyen]

We need to be able to change out the image so it doesn't load the lower quality asset.

[zol]

Looks good!

[domyen]

@tmeasday we had this working in the previous version; when there is only one adjacent post, the background image should be the featureUrl.

[tmeasday]

Can you check if the picture polyfill is working too? Esp on changing routes.

[domyen]

@tmeasday when the image is by itself and large, shrinking the viewport to mobile size should change the source to the smaller sized thumbnail.

Repro:

1. http://localhost:3000/what/campus
2. Go to bottom of the page
3. The image will be large
4. Resize viewport to mobile size
5. The image should change to the thumbnail

[tmeasday]

I think this is sorted now. Bear with me @dominicnguyen ;)