The way break points and corresponding styles are configured — for each field and each view mode — is very flexible but might require a site builder to repeatedly apply the same settings on different fields and view modes. That could be quite tedious. For most sites, I guess there will only be a few different configurations, each re-used on many different fields.

Something probably has to be done, but I'm not sure what. Perhaps the module could have a configuration page were all the different "patterns" would be set up, and the formatter settings would simply allow to select one of those. So, whereas the core Image formatter allows to select an existing image style, the Adaptive image formatter would allow to select an existing adaptive image configuration.

Anyone with a better idea?

Comments

david lesieur’s picture

david lesieur commented

Interesting mock up on http://drupal.org/node/1170478#comment-4551336, where the configuration is made at the image style level. I'm not sure that such approach could easily be plugged into the image styles administration, but it might be worth investigating.

mrpauldriver’s picture

mrpauldriver commented

With different grid and region sizes the permutations could easily mount up. But yes something probably needs to be done.

One thing that does occur to me is that there are probably fewer viewport sizes than potential theme permutations and perhaps these could be coded into the module, which could save half of the work and probably more.

Display sizes, whether on mobile or desktop are known values (see http://en.wikipedia.org/wiki/Display_resolution) and given that is not usually necessary to go larger than 1280 pixels you could have a few key break points and be fairly sure that you are covering the vast majority of websites and most devices.

Suggest break points at 320, 480, 640, 800, 1024 and 1280.

There would still need to be a manual config option as a nod to outsize displays and also for the emerging trend towards ultrawide layouts, such as the new theme in use at smashingmagazine.com

As an aside, I spent most of this evening trying to get this working with views slideshow and flexslider in order to build a responsive slider with device optimised images and I'm glad to say that this module has allowed me to achieve the goal. Thank you.

It took me an age to finally crack it and it was only after a lot digging did I eventually find yet another break point patten configuration within the views UI. Perhaps mention of views setup should be made in documentation, which in other respects is very well written.

Good work David.

caschbre’s picture

caschbre commented

I think one step that could help here is to integrate with the Breakpoints module (http://drupal.org/project/breakpoints). Maybe even make that a dependency. That would eliminate the need for this module to have it's own configuration of # of breakpoints. Simply let the breakpoints module handle that. Then on the field formatter configuration the user can choose one of the breakpoints groups (pre-defined breakpoints) and for each of those breakpoints, choose the image style to use.

david lesieur’s picture

david lesieur commented

For reference, #1621276: Default breakpoints relates to the same problem.