Quote:
|
Originally Posted by peestandingup
I agree. Since these OS's are likely to be on bigger hardware, netbooks & such (and I wouldnt count Apple out on this either), its probably best to think of this as what's best for the screen res being used. True they can all display most full versions of the sites just fine, but less pinching, zooming, etc is best.
Is there such a way of doing a "catch all" of the Web Kit browser in general & setting some kind of minimum resolution for the re-direct?? Probably anything 800 x 600 & below outta do it (for now) for phones. Anything above of course will be used by netbooks & everything else, hence not get the re-direct.
|
OK, here's a new version of the script that looks for any webkit browser (which includes: iPhone, iPod Touch, Pre and Android) that has a screen size with either dimension less than 600 pixels. It also has a cookie system so that you can turn the redirect on/off per session by using a parameter on the URL.
Just paste this code into your top javascript
:
Code:
// script to automatically redirect to the iphone interface from any
// small screen webkit browser (e.g. iPhone, iPod Touch, Palm Pre, Android, etc...)
// Check if we are on a small screen
function CheckForSmallScreen(minWidth, minHeight)
{
return(window.screen.height < minHeight || window.screen.width < minWidth);
}
// Check if the browser userAgent string is AppleWebKit
function CheckForWebKitUA()
{
return(navigator.userAgent.search(/AppleWebKit/i) != -1);
}
// Check if the URL already has /iphone in it
function CheckForIPhoneURL()
{
return(window.location.pathname.toString().search(/^\/iphone|^\/m/i) != -1);
}
// Switch to the iphone UI if we're a webkit browser, are not already the /iPhone URL and are on a small screen
function RedirectIfSmallWebKitBrowser()
{
var parms = window.location.search;
if (parms.search(/autoPhoneRedirect=no|stripiPhoneCookie=yes/i) != -1)
{
SM.util.setCookie("autoPhoneRedirect", "no", 1);
}
else if (parms.search(/autoPhoneRedirect=yes/i) != -1)
{
SM.util.setCookie("autoPhoneRedirect", "yes", 1);
}
// check to see if redirection has been turned off via cookie
var value = "";
value = SM.util.getCookie("autoPhoneRedirect");
if (value != "no")
{
if (CheckForWebKitUA() && !CheckForIPhoneURL() && CheckForSmallScreen(600,600))
{
window.location.replace("/m");
}
}
}
RedirectIfSmallWebKitBrowser();
Then, if you ever want to disable the auto redirect on a mobile browser, you would just enter your homepage URL followed by ?autoPhoneRedirect=no like this:
http://jfriend.smugmug.com/?autoPhoneRedirect=no
or if you wanted to re-enabled it, you'd enter:
http://jfriend.smugmug.com/?autoPhoneRedirect=yes
If it redirects you to the mobile (/m) pages and you want to go back to the normal UI, you can just click on the link in the /m pages that says "Non-Mobile Homepage" and it will automatically turn off auto redirection.
Since I don't own one of these webkit-based phones, I can only simulate this locally - I can't fully test it. Let me know if anyone has success or issues with it. This script is enabled on my own site:
http://jfriend.smugmug.com so if you want to try it out, you can go there on your iphone, ipod touch, Android phone, Palm Pre, etc... and see how the auto-redirection works.