Hybris: How to Enable Responsive UiExperience Level in Desktop Level

Sometimes, we don’t have specific JSPs for mobile view and we maybe using an older version of Hybris that does not have Responsive UiExperienceLevel.

In this way, we add meta tags to help guide the device for the responsive UI Experience if we are using Desktop as the UiExperience Level.

This is tested on Hybris 5.5.1. 

On Hybris 6.0+, they have Responsive UiExperienceLevel, therefore in later versions of Hybris, if we use the JSPs inside the responsive directory, then we don’t need to do this.

These are the steps to enabling responsiveness if we are using Desktop UiExperience Level:

1. Create a BeforeViewHandler class
2. The following snippet of how the class looks like 
   

public class UiExperienceMetadataViewHandler implements BeforeViewHandler
{
	@Resource(name = "uiExperienceService")
	private UiExperienceService uiExperienceService;

	/*
	 * (non-Javadoc)
	 * 
	 * @see de.hybris.platform.yacceleratorstorefront.interceptors.BeforeViewHandler#beforeView(javax.servlet.http.
	 * HttpServletRequest, javax.servlet.http.HttpServletResponse, org.springframework.web.servlet.ModelAndView)
	 */
	@Override
	public void beforeView(final HttpServletRequest request, final HttpServletResponse response, final ModelAndView modelAndView)
			throws Exception
	{

		if (modelAndView != null && modelAndView.getModel().containsKey("metatags"))
		{

			final List metaelements = ((List) modelAndView.getModel().get("metatags"));
			final UiExperienceLevel currentUiExperienceLevel = uiExperienceService.getUiExperienceLevel();
			if (UiExperienceLevel.DESKTOP.equals(currentUiExperienceLevel))
			{

			        // Provide some hints to mobile browser even though this is not the mobile site -->
				metaelements.add(createMetaElement("HandheldFriendly", "True"));
			
				metaelements.add(createMetaElement("viewport", "width=device-width, initial-scale=1"));
				
			}
			
		}

	}

	protected MetaElementData createMetaElement(final String name, final String content)
	{
		final MetaElementData element = new MetaElementData();
		element.setName(name);
		element.setContent(content);
		return element;
	}
}