jQuery Mobile + IE 9 Rendering Issues

As noted by the jQuery Mobile team below there are issues with IE9 and jQuery mobile, where the background gradients and the border radius cause some nasty looking UI issues. You will notice that the gradient does not respect the border radius. This should be fixed within the next couple weeks as they release beta 2, but in the interim, I took the liberty of gathering all the necessary css classes and removing the filters. Below is the code to remove these filters, which makes things less “fancy”, however, it is the solution that the jQuery Mobile team has decided to implement and it looks a lot better than before!


.ui-body-a,
.ui-btn-up-a,
.ui-btn-hover-a,
.ui-btn-down-a,
.ui-bar-b,
.ui-body-b,
.ui-btn-up-b,
.ui-btn-hover-b,
.ui-btn-down-b,
.ui-bar-c,
.ui-body-c,
.ui-btn-up-c,
.ui-btn-hover-c,
.ui-btn-down-c,
.ui-bar-d,
.ui-body-d,
.ui-btn-up-d,
.ui-btn-hover-d,
.ui-btn-down-d,
.ui-bar-e,
.ui-body-e,
.ui-btn-up-e,
.ui-btn-hover-e,
.ui-btn-down-e
{
filter: none !important;
}


More from the jQuery Mobile team…

http://jquerymobile.com/blog/2011/07/08/jquery-mobile-team-update-week-of-july-4th/

ToAbsolute Path from Relative Path

Here is the problem I was solving for…which is quite easy, once I found the right method!

• Take path “http://myserver.com/folder/page.aspx
• From here go to ../anotherPage.aspx

VirtualPathUtility.Combine() to the rescue

The VirtualPathUtility class has many useful methods for working with relative and absolute paths. It wasn’t until I found the combine method that I discovered exactly what I was looking for!


VirtualPathUtility.Combine("/myserver.com/folder/page.aspx", "../anotherPage.aspx")


This results in “/myserver.com/anotherPage.aspx”. You can provide any dot notation and it will work perfectly. Hope it saves you some time.

.matti

Windows Phone 7 – Developer’s Review (repost)

Just posted about Windows Phone 7 on Knotice’s blog. Check it out!

http://lunchpail.knotice.com/2010/11/15/windows-phone-7-a-developer%E2%80%99s-review/

.matti

Getting Started with WinPho7 Development

Ready to start writing some WinPho7 Apps? Here is what you need to get going…

Prior to writing any code it would be good to familiarize yourself with the Windows Phone Application Platform.

1. If you don’t have a Windows Live ID, get one by going here https://signup.live.com.
2. After you have a Live ID you can use the App Hub, which is Microsofts jumping point for all things App related. This is where you will download the dev tools and will have access to training and labs and other WinPho7 development resources.
3. Get the Free Dev Tools. Go to http://create.msdn.com/en-us/resources/downloads and click the link
   to download the Windows Phone Developer Tools.
4. After you downloaded the vm_web.exe file, run it. This will launch the setup wizard. If you get an error, it is more than likely a permissions issue. Go to C:\users\[username]\downloads, right click vm_web.exe, go to properties. Click the enable button on the bottom if it isn’t already enabled. Go to the Compatibility tab and check “Run this program as administrator”
5. The setup wizard will now download and install the tools. There are 9 components that it is installing and should take about 25-30 minutes, so go back to facebook for a little bit. =D
6. After the setup completes click the Run the Product Now button.
7. Visual Studio 2010 should now be open. Go to File -> New Project. Find Windows Phone Application click it and give it a clever name like “Hello World”.
8. Hit F5 and you are done!

Happy coding!

.matti

User-Agent Strings and Mobile Device Detection Solutions

What exactly is a user-agent string?

Within the context of the HTTP protocol, a user-agent
is simply a string passed in the User-Agent
request header that is used as a means to identify
itself. User-Agents are most notably used by web
browsers, web crawlers and mobile devices. For more information check out RFC 1945.

An example of the user-agent for an iphone is…
Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_0_1 like Mac
OS X; en-us) AppleWebKit/525.18.1 (KHTML, like Gecko)
Version/3.1.1 Mobile/5B108 Safari/525.20
To see what your current user-agent go to www.useragentstring.com.

How are user-agent strings used?

The most common use of user-agent strings is to tailor
the response for a given piece of content based upon what
the user-agent is representing. For example if you
wanted to serve up a mobile friendly version of a web
page, you could detect if the user-agent matches a
specific pattern or user-agent. This detection can be as
simple as looking for a specific user-agent string if you
only wanted to target an iphone or a droid or as complex
as utilizing a third party device detection provider to
serve up content for nearly any mobile device.

Device Detection Solutions

There are several popular third party device detection
providers, depending upon what level of accuracy you
require and how much money you are willing to spend will
ultimately determine how accurate your device detection
will be.

Device Atlas – High cost, but highly
accurate. DeviceAtlas has an easy to use API for
accessing their user-agent database and can be used with
nearly any programming language.

Mobile Device Browser File – Free,
but ASP.NET only. Not as accurate and is no longer
supported after October 29, 2010.

WURFL – Open
source solution that seems to have a large following and
great support. If you don’t have the money to fork up
for DeviceAtlas this is your best bet.

In closing…

User-agent strings are pretty simple to understand, however detecting them and figuring out exactly what the ua string represents is another thing. This is why companies like DeviceAtlas exist, because it is no menial task to keep up with the ever growing number of user-agent strings. Because of this not any one solution is going to be 100% accurate, which is why it is not a bad idea to use multiple sources to detect your user-agents.

.matti

Windows Phone 7 Officially Available Nov 8 in U.S.

WOOT!

Here’s the mobilecrunch article:
http://www.mobilecrunch.com/2010/09/30/windows-phone-7-launches-oct-11-handsets-for-sale-nov-8/

Note that AT&T has exclusivity for this launch.

.matti

Windows Phone 7 Available November 8

That’s the word according to mobile crunch (full article below). According to mobile crunch, their sources indicate a US ship date of November 8 with Europe getting WinPho7 a month earlier in October. Interesting that Europe is getting their hands on the phone first, maybe Microsoft thinks they will have a better chance converting Nokia/Other Euro Phone users and get a good foothold over seas first. While also getting a chance to straighten out any kinks before unleashing it to the iphone/android saturated market in the US. The lack of tethering, copy/paste and other expected features will likely already deter a good amount of prospective customers, so hopefully Microsoft has their act together on this one [fingers crossed].

http://www.mobilecrunch.com/2010/09/26/windows-phone-7-to-be-shipping-nov-8-in-the-us

.matti

Map All Requests to ASP.NET ISAPI Filter

I was doing some URL rewriting fun today and ran into problems when I discovered my .htm, .html and anything non-asp.net were not being rewritten. Then I thought…duuuuh, the asp.net isapi filter isn’t configured for anything other than the native asp.net file extensions (aspx, ashx, asmx, etc). After playing with IIS 7 and continually clicking “ISAPI Filters” only to my dismay finding what I was not looking for, my pointer finally found its way to “Handler Mappings”. And from there I added a new Wildcard Script Map and vuala, URL rewriting was back in business. So, if you ever run into this, save yourself some time and just go straight into the web.config and if you are running IIS 7 add the following configuration to system.webserver / handlers.

<add name="ASP.NET Map" path="*" verb="*" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll" resourceType="Unspecified" requireAccess="None" preCondition="classicMode,runtimeVersionv2.0,bitness32" />

Here are the steps if you want to manage it through IIS:

1. Open IIS and select your application
2. Click Handler Mappings
3. On the right-hand side, click “Add Wildcard Script Map”
4. Enter “%windir%\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll” in the Executable. (This may be different depending upon what version of the framework you are using.)
5. Enter a name
6. Click OK

.matti

Windows Phone 7 – Boot Camp

I had the opportunity to attend the windows phone 7 boot camp in Cleveland yesterday and was a great presentation.  Jeff Blankenburg, Cleveland’s local Microsoft developer evangelist ran the show.  He did a great job explaining Microsofts data-centric strategy to the mobile consumer market vs iphone/android app-centric’s approach.  I have an iphone and one of the biggest peeves I have is that to get anywhere you start at an app.  I want to send an email….there’s an app for that, you know that by now.  With Windows Phone 7, you want to send an email, you send an email.  Sure you can get an app to send emails if you really want, but you don’t have to.  The other nice thing about this approach is that by simply going to a person on my phone, I have all their data there already, facebook, twitter, etc.  Rather than forcing my force step to always be “what app do I need to open in order to get the data I want?”, it’s “What data am I after?”.

Another very nice change that Microsoft made was what they are calling their “Metro” UI.  This is the style you will see on the windows phone 7 interface.  It is very clean and minimalistic, which for me is music to my ears.  Simple is beautiful and Microsoft captured this as you will hopefully get to experience.  Much of the Metro-ness is inspired by places and things we are all very familiar with, such as airports.  When you go to an airport you aren’t opening an app to figure out what terminal to go to and then another to find your plain ticket, you just know by what is presented to you via signs and other visual indicators.  And that is the great thing about Windows Phone 7, when you start using it, you just know.

From a development perspective, you have 2 choices for styles of Apps: Silverlight or XNA.  Using the free dev tools (link below) I was able to create a simple Silverlight calculator application in under an hour.  I spent way to much time playing with the UI, expression blend makes it really easy to add different colors, gradients, etc.  Although I did not yet dive into XNA, Jeff presented several XNA applications that were really awesome, especially since all your game play is integrated with XBox Live.  Go achievements!

Overall I think Windows Phone 7 is very clean and user-friendly.  A great step forward for Microsoft in the mobile space.

To get started, go to the link below and download the free tools.

http://developer.windowsphone.com/windows-phone-7/

Here’s a link to Jeff”s page, he also runs the .NET special interest group (http://www.bennettadelson.com/netsig.aspx), which is a great place to learn and speak geek.

http://www.jeffblankenburg.com

–

.matti

//TODO: Finish css-ing…

I finally forked up the little money it takes to do your own css for wordpress…I think it was a matter of whether or not i’d have the time once I decided to do it.  No matter, I haven’t finished it all yet, so if you find yourself here and see ugliness just look the other way and come back in a couple weeks.  Cool?  Alright!