Google Analytics Dashboard WordPress Plugin Version 2.0 Released

It has taken me a while but I've finally been able to release version 2 of the Google Analytics Dashboard WordPress Plugin. The primary enhancement of this version is that it no longer blocks the dashboard, posts or pages interfaces while loading. The next major change is an upgrade to using Google's OAuth login system (see my Google OAuth example using PHP for more information on how I did that if you are interested). The old login system is still available but the OAuth login is the one to use going forward and I may remove the old one at some point. The move to OAuth along with the refactoring I did to the code will allow support for other Google sites such as Feedburner. As a bonus I also moved the caching system to the newer WordPress transient storage interface. The use of the transient storage interface should fix one of the biggest issues people have seen in the past so no more worrying about finding a temp directory that is writable.

Here are a list of the major changes:

  • The dashboard panel now loads asynchronously so the entire dashboard doesn't block while it is loading
  • Made the analytics column in posts and pages load asynchronously so that it doesn't block the loading of the page
  • Added support for Google OAuth logins
  • Use transient API support with wordpress version 2.8+
  • Added ability to support multiple analytics sources

Some other minor changes:

  • Stop unlink warnings when caching won't work
  • Refactored code so that major parts are split into classes
  • Refactored code to better seperate UI code
  • Fixed mime type not being sent correctly for admin area javascript file
  • Fix bug in wordpress version checking

Google OAuth for Installed Apps PHP Example

I have been working on a long needed update to the Google analytics dashboard plugin for WordPress and one of the items I had on my TODO list was using Google's OAuth login instead of the old ClientLogin. Setting OAuth up for a WordPress plugin is complicated because it isn't a hosted application and as such I can't register it to get OAuth keys. That is where a special way of doing OAuth comes in called OAuth for installed apps.

There seems to be a lot of general documentation on how to do OAuth but there wasn't much about using it for installed apps so what follows is an example using PHP that is basically what went into the plugin update.

Continue reading

Java AirPlay Client

Ever since getting one of the new AppleTV devices I have been wanting to fiddle with AirPlay. I finally got around to looking at a dump of the traffic between an iPad and the AppleTV over Christmas and was surprised at how simple it was. Soon after I noticed a blog post about AirFlick for the Mac. AirFlick was close to what I was wanting at the time but I really wanted something that would let me control AirPlay from Linux or Windows.

I decided to make something that could run anywhere so I created my own AirPlay client called AP4J. I used Java and a pure Java Bonjour implementation called JmDNS so AP4J can run anywhere Java runs.

The current version only has the ability to control an AirPlay device. That means you have to supply a location that has a compatible video (h264 encoded) but once playing you will have control over the video just as you would using the iPad or iPhone. The next step will be to add the ability to directly serve videos instead of only being able to control the playback of videos. My goal will be the ability to run AP4J on my Windows Home Media server where I can have it stream videos to my AppleTV.

I have tested AP4J on Linux, Windows and Mac but only extensively on Linux. I have also tested a number of sites that have compatible videos available, a few of those are listed here:

Now for a couple screen shots. This is what you see after starting the server and going to the web interface:

This is what it looks like when a video is playing:

Browser Based Push Notifications with Mongrel2 and EventSource

One of the interesting things about Mongrel2 is its ability to send output to multiple clients with a single handler message. This has a lot of potential for push applications and while I was investigating Mongrel2 a new version of iOS came out that included changes to Safari. While looking at the list of Safari changes in iOS 4.2 I noticed something called EventSource and went to investigate what it was.

As it turns out EventSource is a newer way of doing browser push currently supported by Chrome, Opera and Safari (mobile Safari as well). There is a good HTML5Rocks post on Server-Sent Events that goes into more detail on the differences of using it over something like WebSockets. One of the differences is that EventSource specially addresses mobile device use with the ability to do a "Connectionless push" through a proxy so the end device can sleep but still receive push notifications.

Before reading on check out my example Mongrel2 ruby handler post if you haven't already. The following examples will be based on the code from that post. I'm also going to use Modernizr to detect support for EventSource so check out my post on using Modernizr to detect browser support as well.

Continue reading

Example Mongrel2 Handler in Ruby

Right before I went to Rubyconf I started looking at Mongrel2 so I had something to hack on while I was there. I grabbed the two Ruby handlers listed on the main site, Ruby Mongrel2 and Rack Mongrel2, to get started. I noticed right away that I couldn't kill the handler process once it started using either one of these libraries. I started down the path of figuring out why they wouldn't respond to SIGINT and eventually to writing my own handler in Ruby that demonstrates how to fix the issue

Continue reading

Using Modernizr – Simple Guide and Examples

Modernizr is a Javascript library that detects the presence of browser functionality. This makes life a lot easier when using more modern features on your website by encapsulating all the feature tests into a library you don't have to worry about. You can use Modernizr either in your own Javascript or you can use the CSS classes it sets on the HTML element.

To get a full list of the browser functionality that is tested check out the Modernizr docs. If the feature you need a test for isn't available it is fairly easy to add new tests as well.

I'll start with an example that shows how to use the feature tests in Javascript. After Modernizr runs it populates the "Modernizr" structure with boolean values for each functionality test. This example waits for the page to load and then simply populates a DIV with text depending on your browsers support for web sockets:

<!DOCTYPE html>
<html class="no-js">
  <head>
    <title>Modernizr - Javascript Example</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
    <script src="modernizr.js" type="text/javascript"></script>
    <script type="text/javascript">
      $(document).ready(function()
      { 
        if (Modernizr.websockets)
        {
          $("#result").html('Your browser has support for Web Sockets');
        } 
        else
        {
          $("#result").html('Your browser does not support Web Sockets');
        } 
      });
    </script>
  </head>
  <body>

    <p id="result"></p>

  </body>
</html>

See this code in action: Modernizr Javascript example.

You can try this example with an older version of Firefox and the text should indicate that there is no support for web sockets. Try again with a newer version of Google's Chrome browser and the page will indicate that there is support for web sockets.

The next example shows how to use the Modernizr CSS support. The key here is to know that the library will inject classes into the HTML tag. Those classes correspond to the functionality tests and are listed in the documentation. I am again testing for web sockets support and Modernizr will set the HTML class to either no-websockets or websockets and display one of two DIVs:

<!DOCTYPE html>
<html class="no-js">
  <head>
    <title>Modernizr - CSS Example</title>

    <style type="text/css" media="screen">
      div.wsno, div.wsyes { display: none }
      .no-websockets div.wsno { display: block }
      .websockets div.wsyes { display: block }
    </style>

    <script src="modernizr.js" type="text/javascript"></script>
  </head>
  <body>

    <div class="wsno">
      Your browser does not support WebSockets.
    </div>

    <div class="wsyes">
      Your browser supports WebSockets.
    </div>

  </body>
</html>

See this code in action: Modernizr CSS example.

For a much more detailed CSS example check out this A List Apart article.

If you need the information Modernizr assembles outside of the browser check out Modernizr on the server.

While I was putting together the two demo pages for this I discovered a new service much like the Google Javascript library CDN but with more Javascript libraries. It is called Cached Commons and it uses Github's CDN.

Example Git pre-receive and post-receive Hooks to Avoid a Signal 13 Error

Git has a very nice set of example hooks that you can find just by creating a new repo. The following is an easy way to see them all:

mkdir myrepo
cd myrepo
git init
ls .git/hooks/

If you do that you will end up with a list something like this:

applypatch-msg.sample  post-commit.sample   post-update.sample     pre-commit.sample          pre-rebase.sample
commit-msg.sample      post-receive.sample  pre-applypatch.sample  prepare-commit-msg.sample  update.sample

I recently did this thinking I would create a pre-receive hook. Since there isn't a sample for pre-receive I went to the git hooks reference to see if there was anything special I needed to know. I didn't pay any attention to the fact that git will send something in on STDIN when it runs the hook and as it turns out that is important. In some instances if you don't read STDIN you will get an error message like the following when you try to push and the hook gets used:

fatal: The remote end hung up unexpectedly
error: error in sideband demultiplexer
error:  died of signal 13

The fix for this is to make sure you read STDIN when creating pre-receive and post-receive hooks. The following example shell script will show the commit information for each new revision id when you push and the hook is executed:

#!/bin/sh
while read oldrev newrev refname
do
  # Do something with $oldrev $newrev $refname 
  git show --no-color --root -s --pretty=medium $newrev
done

The key part in the above is the "while read" that reads STDIN. So whatever language you write your hook in just make sure you read everything from STDIN before completing the script.

Getting Started with JRuby Webapps using Rack and Sinatra

Going to JRubyConf inspired me enough to expand my knowledge of JRuby. This is a quick guide for anyone looking to see what can be done with JRuby and Sinatra.

Of course the first step is to install the Java JDK. Download, install and then set it up in your path. I'm using JDK 6 update 21 on Linux for this post in case it matters.

There are a couple ways to install JRuby after you have Java installed. The hard way is to download JRuby and install it by hand. The easy way is to use Ruby Version Manager to install it. Using RVM will let you switch between Ruby versions as well as giving you a simple command to install JRuby:

rvm install jruby
rvm use jruby

Continue reading

Minimal EC2 Linux Install Using TTYLinux

If you have ever wondered how to get a Linux EC2 node down to the bare minimum this post is for you. I have been wanting to do this for a long time but it wasn't possible until pv-grub support that was added recently. To make this even more exciting Amazon now offers EC2 micro instances that will go well with this type of bare bones system.

You may wonder why you would want to do this. I'll give you at least two reasons. First there is speed. The configuration I ended up with will boot in about 14 seconds. Almost all of that time is spent waiting on the AWS DHCP server for an IP address. The second reason is security. There is little on this system that you don't need. The majority of what you need is provided by a single application that you can easily monitor for patches. That leaves you to worry about only the tools you must have to get your job done. I'll also include a couple downsides. First this isn't going to be easy for everyone and it can be fairly complicated. The second issue you will run into is that there is nothing in this distribution. If you need something like PHP you might spend a long time building all the support you need. There isn't much to be done about the complexity if you want to do this all yourself. Selection of tools can help you lessen the impact of the bare nature of the system, more on that in a future post.

Continue reading

How to Build and Compile a Custom Linux Kernel for EC2

I have a long running goal that I'm trying to reach with all these pv-grub for EC2 posts. That goal is to find the smallest/tightest usable node that can be created for EC2. The next step in that path requires a custom Linux kernel. What follows is how to build the latest Linux kernel so that it works on EC2 using pv-grub.

It is important to have a recent kernel since most of what is needed to get a kernel to work on EC2 is now incorporated into the source. These instructions assume the latest kernel is 2.6.35.4 and I've used them with 2.6.35 as well but keep that in mind since the one patch that is required could eventually be merged in. Before getting started it may help to read over how to compile the Linux kernel normally and then my post on running CentOS 5.5 on EC2 using pv-grub.

Continue reading