For instance, you could integrate this with an error handler, a file download system, or perhaps a way to track comment submission via a separate metric in Analytics.

Please note that you can instantiate this class with a UA code and domain, or allow the class to use a constant for the UA code and the server HTTP_HOST var.

<?php
/**
 * Google Analytics event tracking
 *
 * @author there4 development
 * @created 07/15/2010
 */

class Analytics
{
  private $code;
  private $domain;
  private $useragent;
  private $cookie;
  private $verbose;

  function __construct($code = '', $domain = '') {
    $this->code      = $code ? $code : GOOG_UA;
    $this->domain    = $domain ? $domain : $_SERVER['HTTP_HOST'];
    $this->verbose   = false;
    $this->useragent = 'EventAgent/0.1 (http://there4development.com/)';
    // you may wish to set this
    $this->referer  = $this->domain;
    $this->cookie    = "mycookie";
  }

  /**
   * @see http://code.google.com/apis/analytics/docs/tracking/eventTrackerGuide.html
   *
   * @param string $object the name you supply for the group of objects you want to track.
   * @param string $action A string that is uniquely paired with each category, and commonly
   *    used to define the type of user interaction for the web object.
   * @param string $label An optional string to provide additional dimensions to the event data.
   * @param string $value An integer that you can use to provide numerical data about the user event.
   */
  public function trackEvent($object, $action, $label = '', $value = 1) {
    $var_utmac   = $this->code;
    $var_utmhn   = $this->domain;
    $var_utmn    = rand(1000000000,9999999999); //random request number
    $var_cookie  = rand(10000000,99999999);     //random cookie number
    $var_random  = rand(1000000000,2147483647); //number under 2147483647
    $var_today   = time();                      //today
    $var_referer = $this->referer;             //referer url
    $var_utmp    = 'index.php';
    $var_uservar = '';

    /**
     * url to fetch the gif image from
     * @see http://code.google.com/intl/de-DE/apis/analytics/docs/tracking/gaTrackingTroubleshooting.html#gifParameters
     */
    $urchin_url = 'http://www.google-analytics.com/__utm.gif';
    $urchin_params = ''
      .'?utmwv=1'               // Tracking code version
      .'&utmn='.$var_utmn       // Prevent caching random number
      .'&utmsr=-'               // Screen resolution
      .'&utmsc=-'               // Screen color depth
      .'&utmul=-'               // Browser language
      .'&utmje=0'               // Is browser Java-enabled
      .'&utmfl=-'               // Flash Version
      .'&utmdt=-'               // Page title, url encoded
      .'&utmhn='.$var_utmhn     // Host Name
      .'&utmp='.$var_utmp       // page
      .'&utmr='.$var_referer    // Referral, complete url
      .'&utmac='.$var_utmac     // Account code
      .'&utmt=event'            // Type of request
      ."&utme=".rawurlencode("5($object*$action*$label)($value):") // Extensible parameter, used for the event data here
      .'&utmcc=__utma%3D'.$var_cookie.'.'.$var_random.'.'.$var_today.'.'.$var_today.'.'.$var_today.'.2%3B%2B__utmb%3D'.$var_cookie.'%3B%2B__utmc%3D'.$var_cookie.'%3B%2B__utmz%3D'.$var_cookie.'.'.$var_today.'.2.2.utmccn%3D(direct)%7Cutmcsr%3D(direct)%7Cutmcmd%3D(none)%3B%2B__utmv%3D'.$var_cookie.'.'.$var_uservar.'%3B'
      ; // Cookie values are in this utmcc

    $url = $urchin_url . $urchin_params;

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_USERAGENT, $this->useragent);
    curl_setopt($ch, CURLOPT_VERBOSE, $this->verbose);
    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
    curl_setopt($ch, CURLOPT_COOKIEFILE, $this->cookie);
    $output = curl_exec($ch);
    curl_close($ch);
    return ($output != '') ? true : false;
  }

}
?>

I set about to update this with new functionality and to replace the existing javascript with something new from jQuery. I’ve chosen to use qTip to handle the tooltip production, and have extended pChart with new functions for both pChart_Map::SaveImageMap() and pChart_Map::GetImageMap(). These functions now produce an image map rather than the pChart data format.

Demo

You can see a working demo in my project sandbox.

Download

Download pChart_Map

How it works

1. The page has a new jQuery plugin called pChart() for each of the pChart images.
2. The browser calls the pChart image producer with a unique ID for the image
3. As the pChart image is created, pChart writes an image map file for this ID to a tmp directory
4. The jQuery load() event catches when pChart has loaded the image
5. jQuery loads the newly created image map file from disk via pChart
6. jQuery attaches the image map to the image, and then applies qTip to the chart for this image map

Notes

• Make sure that the image tag has an id that matches the MapID on the get request for the chart.

Geolocation with IPInfoDB

Requirements

• jQuery JSON
• jQuery Cookie
• Snoopy PHP

Code and explanations

By placing this at the jQuery level it prevents any page blocking that may occur during loading, and the proxy script prevents any cross site scripting problems.

First, the javascript variables , with a small bit of PHP:

var ip = "<?php print $_SERVER['REMOTE_ADDR'];?>";
var geolocation = "./ip_proxy.php";
var cookiename = 'geo_location';
var cookieoptions = { path: '/', expires: 10 };

These variables setup the path to the proxy script, place the users IP address into a javascript variable, and establish our cookie parameters. Next, we setup our page initialization function:

$(function(){

  fetchlocation();

});

displaylocation = function(location) {
  if (location.Status == 'OK') {
    $('.city').text(location.City);
    $('.zip').text(location.ZipPostalCode);
    if(location.State != '--') {
      $('.state').text(location.State);
    } else {
      $('.state').text(location.RegionName);
    }
  }
}

fetchlocation = function() {
  // look in the cookie for the location data
  cookiedata = $.cookie(cookiename);
  if ('' != cookiedata) {
    locationinfo = $.evalJSON(cookiedata);
    if ((locationinfo != null) && (locationinfo.IP == ip)) {
      displaylocation(locationinfo);
      $.cookie(cookiename, cookiedata, cookieoptions);
      return;
    }
  }
  // it's not in the cookie, so fetch from the server
  $.getJSON(
    geolocation, {
      'timezone' : 'false', // set this to false to save the service 2 queries
      'ip'       : ip
    },
    function(data) {
      data.IP = ip;
      displaylocation(data);
      cookiedata = $.toJSON(data);
      $.cookie(cookiename, cookiedata, cookieoptions);
    }
  );
}

PHP code

The PHP code is well documented within the ip_proxy.php file. It acts as an intermediary between the jQuery script, and the IP producer. Note that the file can restrict based on hosts, and adds an extra State abbreviation variable to the data returned by the IPInfoDB API

I found a php class called Icecube that integrates with the Campfire API. The documentation for the Bitbucket post data can be found in their help docs for the post payload. I combined this class with a code found at 61924.nl, The script from 61924 can receive the payload from Bitbucket, and process it correctly. I’ve modified the script to present the commit messages with improved formatting, and have added some config options.

Download the scripts

Download Icecube at 61924.nl
Download Bitbucket and Campfire script

Setup the scripts

Place both of the scripts into a web accessible directory, and open bitbucket.php and edit the config section of the file.

Next, open your bitbucket.org repo, choose admin, services, and then add a new post type. Then specify the url to bitbucketchat.php.

Using the script

Join the chat with another account, and make a post!

Questions or suggestions? Leave a comment!

Download the modifier

The approach is straightforward. We must base64 encode the image data and place it with the proper formatting into the src attribute of an img tag. The processing is accomplished in this case with a smarty modifier.

<img src="{img2data path='/images/inline.gif'}" />