1. Send a request to Google Maps API
2. Get the response in JSON format (no problem to switch to XML)
3. Parse the response from Google to a more readable format
4. And finally, use those values in a PHP script

I needed the response for the meta geotags on surfspot.de, where I use a lot of maps to show the locations of… surfspots, obviously. The geotag for a spot would be something like this:

<meta name="geo.region" content="COUNTRY_SHORT-REGION_SHORT" />
<meta name="geo.placename" content="CITY" />
<meta name="geo.position" content="LATITUDE;LONGITUDE" />
<meta name="ICBM" content="LATITUDE, LONGITUDE" />

… with latitude and longitude known (stored in database) , and city, region and country to find out from Google. Pls find details about HTML geotags on Wikipedia. The meaning of the ICBM tag is just hilarious 😀 For details on Google Geocoding, pls refer to their documentation.

Fist, we need the class to query Google:

class JD_Geocoder_Request
{
 /**
 * @class vars
 */

 // Google´s geocode URL
 public $url = 'http://maps.google.com/maps/api/geocode/json?';

 // Params for request
 public $sensor       = "false"; // REQUIRED FOR REQUEST!
 public $language     = "en";

 // Class vars
 public $response     = '';
 public $country_long = '';
 public $country_short= '';
 public $region_long  = '';
 public $region_short = '';
 public $city         = '';
 public $address      = '';
 public $lat          = '';
 public $lng          = '';
 public $location_type= '';

 /**
 * Constructor
 *
 * @param mixed $config
 * @return void
 */
 public function __construct($config = null)
 {

 }

} // end class

I prefer to store all results I may or may not need in class vars, so I can just echo them out.

Second, we need to know what kind of search we need to perform, forward geocoding with an address (say, from a form), or a reverse geocoding search, using lat and lng for the query. I implemented both methods, but pls be aware I didn´t test the forward search… since I don´t need it yet 😉

/**
 * Forward search: string must be an address
 *
 * @param string $address
 * @return obj $response
 */
 public function forwardSearch($address)
 {
   return $this->_sendRequest("address=" . urlencode(stripslashes($address)));
 } // end forward

 /**
 * Reverse search: string must be latitude and longitude
 *
 * @param float $lat
 * @param float $lng
 * @return obj $response
 */
 public function reverseSearch($lat, $lng)
 {
   return $this->_sendRequest("latlng=" . (float) $lat . ',' . (float) $lng);
 } // end reverse

Both methods handle formatting the parameters, as well. If you want to handle just the response object, you can skip ahead and ignore the next functions. As said earlier, I like to store the response in class vars in order to just echo them out, or store them in a database. The two functions set the defaults I need to know, and search for other values as well. Pls note that only the response object $address_components is used for the search, Google may or may not return a lot more – check their docs for this.

/**
 * Search Address Components Object
 *
 * @param string $type
 * @return object / false
 */
 public function searchAddressComponents($type) {
   foreach($this->response->results[0]->address_components as $k=>$found){
     if(in_array($type, $found->types)){
       return $found;
     }
   }
   return false;
 }

/**
 * Parse JSON default values: map object values to readable content
 *
 * @param none
 * @return none
 */
 private function _setDefaults()
 {
   $country = $this->searchAddressComponents("country");
   $this->country_long    = $country->long_name;
   $this->country_short    = $country->short_name;
   $region = $this->searchAddressComponents("administrative_area_level_1");
   $this->region_long = $region->long_name;
   $this->region_short    = $region->short_name;
   $city = $this->searchAddressComponents("locality");
   $this->city    = $city->short_name;
   $this->address = $this->response->results[0]->formatted_address;
   $this->lat = $this->response->results[0]->geometry->location->lat;
   $this->lng = $this->response->results[0]->geometry->location->lng;
   $this->location_type = $this->response->results[0]->geometry->location_type;
 } // end set

The JSON response from Google is likely to change, so you need to control the mapping every now and then. If you use the reverse geocoding, pls note that lat and lng may NOT be the same values you used to call the search with, but refer to the next best address, even if location_type is returned as „rooftop“. This doesn´t matter if you search on land, but surfspots might be 500m down a beach from a known location, at least, known to Google.

Now for the slightly more difficult part… the actual request to Google Maps API, and parsing the JSON response. Using the Zend Framework, sending a request to Google is a tad bit easier than using pure PHP. If you don´t use ZF and/or use XML response format, check this article on phpRiot, and replace the $client code.

/**
 * Send Google geocoding request
 *
 * @param string $search
 * @return object response (body only)
 */
 private function _sendRequest($search)
 {
   $client = new Zend_Http_Client();
   $client->setUri($this->url . $search . '&language=' . strtolower($this->language) . '&sensor=' . strtolower($this->sensor));
   $client->setConfig(array(
     'maxredirects' => 0,
     'timeout'      => 30));
   $client->setHeaders(array(
     'Accept-encoding' => 'json',
     'X-Powered-By' => 'Zend Framework GEOCMS by Joerg Drzycimski'));
   $response = $client->request();
   $body = $response->getBody();
   $this->response = Zend_Json::decode($body, Zend_Json::TYPE_OBJECT);
   if ($this->response->status == "OK") {
     // set some default values for reading
     $defaults = $this->_setDefaults();
     return $this->response;
   } else {
     echo "Geocoding failed, server responded: " . $this->response->status;
     return false;
   }
 } // end request

Now that you have the request up and running, the code requirde to generate the meta geotags is quite simple:

$georequest = new JD_Geocoder_Request();
$lat = '54.424899';
$lng = '11.096671';
$georequest->reverseSearch($lat,$lng);
echo '<meta name="geo.region" content="' . $georequest->country_short . '-' . $georequest->region_short . '" />';
echo '<meta name="geo.placename" content="' . $georequest->city . '" />';
echo '<meta name="geo.position" content="' . $lat . ';' . $lng . '" />';
echo '<meta name="ICBM" content="' . $lat . ',' . $lng . '" />';

Links: Class File as ZIP.

The post Google Maps Geocoding with JSON and PHP appeared first on Jörg Drzycimski.

Create the „rating.php“, and add the following lines:

<?php
require_once('bootstrap.php'); // Setup Zend Framework Environment
header("Cache-Control: no-cache");
$rating = new Mylib_Rating_Controller();
$score = $rating->setRatingById($_GET['id'], $_GET['val']); // rate object and get scores
echo Zend_Json::encode($score); // send response array in JSON format
?>

The setRatingById passes the values from your JavaScript to the (soon to be created) controller, and receives the updated values from your (soon to be created) database. When I started out using jQuery in combination with Ajax, I was kind of afraid to find it difficult… but it really is that easy 😉

Next up: The rating controller

The post No-MVC Zend Framework: jQuery Ajax receiver / Part V appeared first on Jörg Drzycimski.

The JavaScript

Before continuing (or if this doesn’t work for you), you might want to familiarize yourself with the Star Rating plugin at http://zensoftware.org/archives/483.

Add the following lines to the HEAD section of your „index.php“. This assumes that you already have one… if not, use you standard HTML template, and don’t forget to include your bootstrap 😉

<script type="text/javascript" src="/js/jquery/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/js/rating/jquery.rating.js"></script>
<link type="text/css" href="/js/rating/jquery.rating.css" rel="stylesheet" media="screen" />

<script type="text/javascript">
$(function(){

 $(".rating")
 .rating({"showCancel": false})
 .bind("change", function(){
   var id = $(this).attr("id");
   var rate = "id=" + id + "&val=" + $(this).val();
   var loading = 'Loading';
   // Or use image instead, looks prettier ;-)
   // var loading = '<img src="/images/loading.gif" />';
   $.ajax({
     type: "GET",
     url: "/includes/rating.php",
     dataType: "json",
     data: rate,
     timeout: 10000,
     beforeSend: function(){
       $("#rating_value_" + id).html(loading);
     },
     success: function(response){
       $("#rating_value_" + id).html(response.average + " points");
     },
     error: function(){
       $("#rating_value").html("Error!");
     }
    }); // end ajax
  }); // end rating / bind

}); // end $()
</script>

I used „loading“ as a variable (as opposed to the direct output of „Error!“). You can Google the standard Ajax loading image, and put the HTML image tag in that variable to pretty things up, instead of that boring message.

BTW, I always use a leading slash and the complete path in relation to the root directory (e.g. „/images“) before each image, JS and CSS file. This way, I don’t have to worry about broken links when I split header and content sections into different files, and move them to different directories… which I favorize, because header sections are the same throughout the website, whereas content sections might use different templates.

The PHP / HTML code

You can put this code anywhere within your BODY section of your „index.php“, even in existing pages‘ DIVs:

<?php
$id = 1;
$rating = new Mylib_Rating_Controller();
echo $rating->getRatingView($id);
?>

Set the variable „$id“ to any unique id you want to rate. On my website surfspot.de, I use it to rate a page, so the id comes from my database, and represents the page id. If you have more than one rating on one page, say for a couple of images, instantiate the class once, and only use echo $rating->getRatingView($id) with a different id for each image.

Next up: The jQuery Ajax receiver

The post No-MVC Zend Framework: jQuery Star Rating code / Part IV appeared first on Jörg Drzycimski.

Installing Zend Framework

On your server, add some directories to accomodate ZF, jQuery, and your own PHP files. Assuming that you start from scratch, you need to point your webserver to the „public“ directory, instead of  „document root“. This way, one can’t access your lib files, e.g. configs, by URL.

> document root
  > library
    > Mylib
    > Zend
  > public
     > images
     > includes
     > js
       > jquery

Download the lastest ZF version at http://framework.zend.com/download/latest, and unpack the files. Get the content of the „library/Zend“ form your archive, and copy it into the „library/Zend“ folder on your server. Next, get the latest of jQueryUI at http://jqueryui.com/download, and put the content in the „jquery“ folder. jQueryUI is just a nice JavaScript framework (that word again…) with widgets and effects… you might need them later 😉

A short note: though ZF supports the Dojo JavaScript framework, I personally prefer jQuery. Dojo definetly has the cooler widgets, but the support sucks… no forum to speak of, and mailing list support slow if ever. If you run into problems with Dojo, you’re basically on your own… the exact opposite of jQuery, where you 1. get support within hours, and 2. rarely run into problems to begin with 😉 Just my 2 cents…

Anyway, the part missing for our little tutorial is the Star Rating plugin for jQuery. Get it at http://zensoftware.org/archives/483, and put it in your „js“ folder, into a „rating“ subdirectory.

Next up: Bootstrapping ZF

The post No-MVC Zend Framework: Installing ZF & jQuery / Part II appeared first on Jörg Drzycimski.