Screen Width - Sightly/HTL

[Singaiah_Chintalapudi]

Hello,

Currently, I have a html5 video on my component. This is a interactive video and plays upon page load. I would like not to play the video on mobile. So, I am trying to get a screen width on Sightly so I can add a condition on Sightly/HTL to inject this video only if screen width is > 480. I know that Sightly/HTL executes on Server Side.

Any ideas to get the screen width to inject a video html based on width would be appreciated.

Thanks.

[Singaiah_Chintalapudi]

Hi,

Can someone help with the above?

Thanks.

[ArpitVarshney · Accepted solution]

As mentioned in the post(how to hide header menu item when using mobile devices? ),Please write your logic in SlingModel/Wcmusepojo class to check whether the device is mobile or not and put a check in htl like below:

package com.dev.java;

public class Main extends WCMUsePojo{

private boolean mobile;

@Override

public void activate() throws Exception {

setMobile(getRequest().getHeader("User-Agent").indexOf("Mobile") != -1 ? Boolean.TRUE: Boolean.FALSE);

}

public boolean isMobile() {

return mobile;

}

public void setMobile(boolean mobile) {

this.mobile = mobile;

}

}

Corresponding SIGHTLY

<div data-sly-use.main="com.dev.java.Main">

<sly data-sly-test.isMobile="${main.isMobile}">

     video

</sly>

[shivvikasy]

This worked for me. Thanks

[kautuk_sahni]

Very details reply. Thanks for answering.