Re: CSS @Media queries work arounds?

I ended up doing the following:

Build  ad tiny jsni wrapper around window.matchMedia() wrapper to detect media changes. I added the wrapper as feature request: issue 8399, including the code.

Detected media changes are pushed to the Facade of the interested app components and they further process them. Note: I push the event change, and not let components pull them through a listeners as that can lead to memory leaks.

I use a central MediaInfo register (singleton) that contains all media info instances such that a component can always retrieve the current media info when it's first shown.

The components can then add/remove widgets/extra styles on a media info change, like a resize. In my case: i have to show a top menu as left menu on smaller devices (like a facebook menu).

Because I needed to detect this change in my app code and not wanted to have duplicated media info in both the app and CSS (and gwt not supporting Css media queries), I have chosen this solution.

An alternative would be to create both a left and top menu and hide/show them through css3 media queries. I don't like this and also created too much unnecessary widgets/components. Note: I am now only talking about a single menu, but more things have to change due to the above media info change.

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/groups/opt_out.