Re: routing based on browser width

pharrington
Sun, 06 Sep 2009 14:14:17 -0000

On Sep 6, 10:09 am, pharrington
<xenogene...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:
> On Sep 6, 12:51 am, dansinker
<dansin...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
>
>
> > I have a site that''s directed toward mobile use. As a result,
the
> > basic structure consists of pages that render exclusively on mobile
> > devices, and then corresponding pages for desktop browsers that
> > explain that they need to come back on a mobile device.
>
> > Currently, I''m using Javascript on the mobile page to detect
browser
> > width and then it redirects to the desktop page if it''s above
480px
> > wide.
>
> > That works fine, but it''s less than perfect when people link
or
> > bookmark the desktop page, it never redirects back to the mobile one.
> > And, it seems to be less than perfect for search engines as well.
>
> > Here''s what I''ve got now:
>
> > index.rhtml renders first and tosses this Javascript at it:
>
> > {
winWidth=document.all?document.body.clientWidth:window.innerWidth;
> >         if (winWidth > 481)
> >         location="<%= url_for({:controller =>
''info'', :action =>
> > ''share_welcome'', :id => @story, :only_path =>
false, :protocol =>
> > ''http://''}) %>"
> >         }
>
> > So you can see, it directs browsers over a certain width to, in this
> > case, share_welcome.rhtml
>
> > So, in a desktop browser, the index page looks like mysite.com/
> > share_welcome, while a mobile browser just sees mysite.com
>
> > There''s *got* to be a way to route this browser width logic
ahead of
> > page load so that it''s always mysite.com no matter what,
right?
>
> > Is it possible to build this into routes.rb somehow?
>
> > I''m stumped. Any ideas?
>
> > Thanks so much!
>
> > Dan
>
> My browser (Firefox 3.5) does not send browser width-at-the-time
> information in the request headers. I doubt any browsers do, so you
> can''t use this in any sort of routes or respond_to shinanagins.
>
> If you need your application to perform differently depending on
> different user agents, you need to relay on the User-Agent header.
> This will of course require some research to find the UA''s that
your
> app needs to consider as mobile devices, and be ready to respond to
> user feedback when someone browses with a UA you did not anticipate.


Of course, if all that needs to change though is client-side behavior
(pages need to be rendered differently etc), perhaps reasoned and
judicious use of Javascript+CSS is the better approach.