Android Browser Issues

Ran into a really frustrating issue with Android's Webkit browser today. I'm using jQuery Mobile in a project but have tweaked it quite a bit. The site works awesome on an iPhone. Android (2.2.1) not so much.

The symptoms:
1) Regular html select inputs where not opening up with the list of options.
2) Certain links and buttons had difficulty registering clicks.
3) One of my text boxes would get scrolled to the top of the page as soon as you started entering text.

The solution?
Make sure -webkit-backface-visibility is not set to hidden on any parent elements. The jQuery Mobile CSS has it set to hidden for the ui-page class. Overriding it for android by setting it to visible fixed all 3 of the above issues.

This took about 6 hours to solve.

Kill me now.

MVC3 Boilerplate

Every time I create a new ASP.NET MVC3 project there are certain libraries and code I re-use regularly. One of them being HTML5 Boilerplate which I love. I did some googling for "MVC3 Boilerplate" and didn't find anything, so I decided to start my own and placed it here on GitHub.


With every release MVC3 included more awesome out of the box (finally has jQuery AND jQuery UI!), but I'd like to see the option to go further. One of the things I love about Ruby on Rails is it includes more of what you need to get you straight to coding like a de facto ORM (ActiveRecord). I also don't like how complicated AspNetSqlMembershipProvider is and the fact it doesn't store data in cleanly named "Users" table so I decided to add my own simple User class that can be modified and extended.


I'd love to see someone with more experience then me clean up, take over, re-do or otherwise improve on this idea. So feel free to fork my project or make suggestions. I'm not always the best and keeping projects up to date but I'll see what I can do.


Some of the features I've included are:

• HTML5 Boilerplate
• Elmah (error logging)
• JSON Parser (comes in handy when making JSON based ajax calls)
• Modernizr (part of HTML5 Boilerplate, but awesome enough to warrant its own mention)
• AntiXSS Library (Most of the places this is used was based on the Tekpub MVC2 Starter Site, I'm probably doing it wrong and/or not using it enough)
• Ninject (dependency injection)
• SquishIt (used to compress and minimize javascript and CSS)
• Sql Server CE (included so you don't need full MS SQL or SQL Express)
• EF Code First (used as the ORM)
• Bits from Tekpub MVC 2 Starter Site
• Basic User Signup using simple POCO User object

I really don't know how much I'll keep this project up to date but even if it helps one person that's enough for me. ;)

Roku Support 2011 Bug

This is the fun chat I had with Roku support today. To be fair this was an honest mistake and totally excusable, but what I'm not impressed with is the reason I had to contact them in the first place. I bought 2 Rokus as gifts last year. My sister's Roku had an issue and she contacted their support. They determined it needed to be replaced but they needed proof of purchase which means I had to contact them. Grrr. When I called they only offered a fax number to fax the email receipt from Amazon. I was finally able to get an email from Tom, but after forwarding the receipt they want me to call back later to confirm they got it and to proceed with the RMA. So I have to contact them 3 times to RMA a gift. Kill Me.

How We're Surprising The Kids with a Disney World Trip

We booked a trip to Disney World for my fiance's 8 year old daughter and 10 year old son as their Christmas present. Which means we needed a good way to surprise them. I did some Googling and liked a couple ideas:

• Wrapping up a mylar helium balloon with tickets attached so when the gift is opened the balloon floats out.
• Putting a "gold ticket" inside a chocolate bar
• Scavenger hunt

Since I'm not that good at "arts and crafts" I decided to go with what I knew and make a website. 

http://cdeutsch.com/xmas/

(best viewed using the Google Chrome web browser)

We plan to surprise the kids Christmas night, so if you know us keep it a secret for a few more days.  ;)

For any "non-programmers" reading this you can probably stop now. ;)

For the geeks, I used StaticMatic and TextMate to do the coding. The site is a single page of HTML5 and jQuery (and jQuery UI). You can get the source code here on GitHub.

The snow was Seb Lee-Delisle's work. It's a bit CPU intensive so if the application feels slow it's mostly due to the snow. The computer we'll be using to surprise the kids is fast enough to not be an issue.

I modified the jQuery TickerType plugin to type out the "You're going to Disney World" message at the end. 

If you've never used StaticMatic it's pretty cool. It allows you to use Haml and Sass to do your markup which is a fun quick way to code HTML. Great for a quick static website.

Since I use pieces of Paul Irish's HTML5 Boilerplate in just about every site I do now (I'm even updating old sites to use it as I work on them) I went looking for a StaticMatic plugin for it and thankfully found staticmatic-boilerplate by Aaron Cruz on GitHub.

Overall it was a fun break to use StaticMatic and TextMate (and OS X for that matter) versus the Visual Studio 10 environment I currently spend most of my time in.

But there are two things I'd love to see improved with StaticMatic and/or the Boilerplate plugin:

1) Make it easier to add jQuery UI to your site.

2) Make it easier to switch between uncompressed Javascript while developing and the production minified and combined javascript.

Fixed: PowerPoint 2010 Crashes When Typing

I ran into an issue where I'd open Power Point and as soon as I'd type a key into a slide it would lock up and crash.

The issue seems to be with Boot Camp drivers 3.1 and up which affects Apple hardware running Windows via BootCamp.

The solution that worked from me was found in this thread on the Apple Discussion forum posted by nallex:
Open "Control Panel" from the Start Menu
Select "Clock, Language, and Region"
Select "Change keyboards or other input methods" 
Click "Change keyboards..." button
Click "Add..." button
Roll down "English (United States)" (if it's not already expanded)
Select "US"
Click "OK"
Click "OK"
Click "OK"

Hopefully Apple comes out with BootCamp drivers to fix this issue.

.NET WebClient 403 Forbidden Error

Wasted 2 hours trying to track down the following error when making a simple WebClient DownloadFile request to an Amazon S3 url:
The remote server returned an error: (403) Forbidden.

Offending code and Url:

Uri uu = new Uri("https://zencoder-live.s3.amazonaws.com:443/add9d5d739193c13fcde60d3d7ff5ba7%2Ffe33f4d52e1cff0ef06592ed4041a7dc.mp4?Signature=b%2FXw9ylREb4up4QDw6Tyv9GyQhU%3D&Expires=1291150754&AWSAccessKeyId=AKIAIIEXNN2J4YDTRUVQ");
using (WebClient wClient = new WebClient())
{
    wClient.DownloadFile(uu, @"C:\output.mp4");
}

I was able to use Fiddler to compare Firefox's request versus my .NET application's request.

Firefox:GET /add9d5d739193c13fcde60d3d7ff5ba7%2Ffe33f4d52e1cff0ef06592ed4041a7dc.mp4?Signature=b%2FXw9ylREb4up4QDw6Tyv9GyQhU%3D&Expires=1291150754&AWSAccessKeyId=AKIAIIEXNN2J4YDTRUVQ HTTP/1.1


.NET WebClient:GET /add9d5d739193c13fcde60d3d7ff5ba7/fe33f4d52e1cff0ef06592ed4041a7dc.mp4?Signature%3Db%2FXw9ylREb4up4QDw6Tyv9GyQhU%3D%26Expires%3D1291150754%26AWSAccessKeyId%3DAKIAIIEXNN2J4YDTRUVQ HTTP/1.1

Notice that .NET is escaping my Url. Particularly the forward slash (%2F). You used to be able to pass a dontEscape parameter to the new Uri constructor but now that parameter is deprecated and is always false.

Luckily I came across a workaround on StackOverflow by Rasmus Faber:

Uri uu = new Uri("https://zencoder-live.s3.amazonaws.com:443/add9d5d739193c13fcde60d3d7ff5ba7%2Ffe33f4d52e1cff0ef06592ed4041a7dc.mp4?Signature=b%2FXw9ylREb4up4QDw6Tyv9GyQhU%3D&Expires=1291150754&AWSAccessKeyId=AKIAIIEXNN2J4YDTRUVQ");
ForceCanonicalPathAndQuery(uu);
using (WebClient wClient = new WebClient())
{
    wClient.DownloadFile(uu, @"C:\output.mp4");
}

void ForceCanonicalPathAndQuery(Uri uri){
  string paq = uri.PathAndQuery; // need to access PathAndQuery
  FieldInfo flagsFieldInfo = typeof(Uri).GetField("m_Flags", BindingFlags.Instance | BindingFlags.NonPublic);
  ulong flags = (ulong) flagsFieldInfo.GetValue(uri);
  flags &= ~((ulong) 0x30); // Flags.PathNotCanonical|Flags.QueryNotCanonical
  flagsFieldInfo.SetValue(uri, flags);
}

Now the code downloads the file like without the error!

.NET Zencoder API Wrapper

I've been working with automated video encoding systems for over 10 years. I'd like to say there have been lots of improvements in the tools available but the only tools that have made life easier are the hosted solutions like Zencoder.

Zencoder has a really nice API builder on their website and tools like John Sheehan's RestSharp make calling web services from .NET easier then ever. But why not take it a step further and get it down to one line of code to submit an encoding job? That's what I've done over my Thanksgiving weekend and the results are on GitHub in my ZencoderWrapper repository.

One liner transcode:

JobResponse job = new ZencoderClient(API_KEY).SubmitJob("http://cdeutsch.com/input.avi", "ftp://ftpuser:[email protected]/videos/", "output.mp4");

You'll need to create an account on Zencoder to use the service. And if you want to encode more then 5 seconds of video you'll need to pick a payment option. You can alternatively use the ZencoderWrapper to create your account:

CreateAccountRequest account = new CreateAccountRequest("[email protected]", "password123");

Here's a more advanced example of creating an Ogg Vorbis file with thumbnails and notifications:

ZencoderClient client = new ZencoderClient(API_KEY);
JobRequest jobRequest = new JobRequest("http://cdeutsch.com/input.avi", new OutputSetting("ftp://ftpuser:[email protected]/videos/", "output.ogg"));
//configure output settings.
jobRequest.outputs[0].audio_codec = AudioCodecSetting.Vorbis;
jobRequest.outputs[0].video_codec = VideoCodecSetting.Theora;
//add a notification.
jobRequest.outputs[0].NotificationSettings = new List<NotificationSetting>();
jobRequest.outputs[0].NotificationSettings.Add(new NotificationSetting(NotificationType.Email, "[email protected]"));
//create thumbnails
jobRequest.outputs[0].thumbnails = new ThumbnailSetting();
jobRequest.outputs[0].thumbnails.base_url = "ftp://ftpuser:[email protected]/thumbs/";
jobRequest.outputs[0].thumbnails.format = ThumbnailFormatSetting.PNG;
jobRequest.outputs[0].thumbnails.interval = 5;
jobRequest.outputs[0].thumbnails.number = 3;
jobRequest.outputs[0].thumbnails.prefix = "thumb_";
jobRequest.outputs[0].thumbnails.size = "120x80";
jobRequest.outputs[0].thumbnails.start_at_first_frame = true;
//submit the job
JobResponse job = client.SubmitJob(jobRequest);

Here's how to check the status of the job we just created:

//get job details.
JobListingResponse job = client.GetJob(job.id);

Here's how to check to the status of the job's output file (there can be multiple outputs):

//get progress of first (in this case only) output file.
JobOutputProgressResponse progress = client.GetJobOutputProgress(job.outputs[0].id);

And finally here's how to get a list of all of your jobs:

//get list of jobs
List<JobListingResponse> jobList = client.ListJobs();

If I can convince Implex (the company I work for) to outsource their encoding to Zencoder I'll be using this wrapper for their QwikCast product. I also have another personal project I plan to use the wrapper in.

If you end up using it shoot me a message I'd love the feedback!

UPDATE 11/28/2010:
Not sure how I overlooked this earlier (either missed the Zencoder "Libraries" link or just got carried away with the idea of trying something new I guess) but Chad Burggraf has already created an excellent C# Zencoder client. I may end up using his library over my own for the asynchronous support. Part of it will depend on if Chad's library can compile with Mono since the personal project I want to build will ultimately be running on OSX. I'm not sure if my library will compile in Mono "as-is", but I believe RestSharp will and I don't think I used anything special beyond what's contained in RestSharp.