You can see a prototype version of the widget by clicking here.
Template engine
I attempted this built as single piece of php but it quickly became obvious that this was not the right approach. Instead I adapted a simple template engine from my faithful O’Reilly book. This allowed me to separate the logic from the markup
function FillTemplate($inName, $inValues = array()){
$theTemplateFile = $_SERVER['DOCUMENT_ROOT'].'/templates/'.$inName;
if($theFile = fopen($theTemplateFile, 'r')){
$theTemplate = fread($theFile, filesize($theTemplateFile));
fclose($theFile);
}
$theKeys = array_keys($inValues);
foreach($theKeys as $theKey){
$theTemplate = str_replace("\{$theKey}",$inValues[$theKey],$theTemplate);
}
return $theTemplate;
}
Map Logic
Here’s the source for the Map Logic. As an attempt to make the script secure you can see I’ve used a UK Postcode Regex from Stuart Wade to validate the form input. And also mysql_real_escape_string() on any database calls.
Any security tips would be greatly appreciated
The Map Logic uses four separate templates to handle the interaction, and the error state.
<?php
//Pin counter
connectDB();
$result = mysql_query("SELECT * FROM mapPins");
$num_rows = mysql_num_rows($result);
$bindings['PINCOUNT'] = $num_rows;
//Place Pins
$pinQuery = "SELECT Latitude,Longitude FROM mapPins";
$pinArray = mysql_query($pinQuery)or die('Query failed: '.mysql_error());
$pinCode="";
while ($row = mysql_fetch_array($pinArray, MYSQL_NUM)) {;
$i++;
$pinCode .="var latlng$i = new GLatLng($row[0] ,$row[1] );";
$pinCode .="map.addOverlay(new GMarker(latlng$i));";
}
$bindings['MAPPINS'] = $pinCode;
$bindings['DESTINATION'] = $PHP_SELF;
function centerFromDB($postcode){
//Connect to the database
connectDB();
//Convert the Postcode to all uppercase
$postcode = strtoupper($postcode);
//Break the Postcode into array
$postcode = explode(' ', $postcode);
//Pull out the relevant fields from our database
$query = "SELECT Latitude,Longitude FROM postcodes WHERE Pcode= '$postcode[0]'";
$result = mysql_query($query) or die('Query failed: '.mysql_error());
return mysql_fetch_array($result, MYSQL_ASSOC);
}
if (isset($_POST['submitPostCode']) & $_POST['code']!="") {
if(eregi("^([A-PR-UWYZ0-9][A-HK-Y0-9][AEHMNPRTVXY0-9]?[ABEHMNPRVWXY0-9]? {1,2}[0-9][ABD-HJLN-UW-Z]{2}|GIR 0AA)$",mysql_real_escape_string($_POST['code']))){
$line = centerFromDB(mysql_real_escape_string($_POST['code']));
//Grab the Postcode from the form
$postcode = mysql_real_escape_string($_POST['code']);
//Uppercase
$postcode = strtoupper($postcode);
//Break the Postcode into array
$postcode = explode(' ', $postcode);
//Output Results
$bindings['INITIALCENTER'] = "var center = new GLatLng(".$line['Latitude'].", ".$line['Longitude'].");";
$bindings['OUTCODE'] = $postcode[0];
$bindings['SECONDHALF'] = $postcode[1];
$template = "map02.template";
}else{
$template = "mapError.template";
}
}elseif(isset($_POST['plotPoints'])){
$outCode = mysql_real_escape_string($_GET['outCode']);
$secondHalf = mysql_real_escape_string($_GET['secondHalf']);
$mapLat = mysql_real_escape_string($_GET['mapLat']);
$mapLng = mysql_real_escape_string($_GET['mapLng']);
$today = date("Y-m-d");
$line = centerFromDB($outCode.' '.$secondHalf);
//connect to db
connectDB();
//add point to db
mysql_query("INSERT INTO mapPins (outCode, secondHalf, Latitude, Longitude, theDate) VALUES('$outCode', '$secondHalf', '$mapLat', '$mapLng', '$today') ") or die(mysql_error());
$pinQuery = "SELECT Latitude,Longitude FROM mapPins WHERE outCode='$outCode' AND secondHalf='$secondHalf'";
$pinArray = mysql_query($pinQuery)or die('Query failed: '.mysql_error());
$pinCode="";
while ($row = mysql_fetch_array($pinArray, MYSQL_NUM)) {;
$i++;
$pinCode .="var latlng$i = new GLatLng($row[0] ,$row[1] );";
$pinCode .="map.addOverlay(new GMarker(latlng$i));";
}
//new
$bindings['CURRENTPC'] = $outCode.' '.$secondHalf;
$bindings['MAPPINS'] = $pinCode;
$bindings['NEWCENTER'] = "var center = new GLatLng(".$line['Latitude'].", ".$line['Longitude'].");";
$template = "map03.template";
}else{
$template = "map01.template";
}
echo FillTemplate($template, $bindings);
?>
Integrating script with WordPress
After developing this script I discovered that WordPress can’t run PHP in the body of a post without a plugin. Strange. So I had to put the prototype on a loose page.
Take a look at the trick I used to capture the output of a WordPress tag so I could incorporate it into Map Logic, and then my templates. In this example I captured the footer code, then bound it to a template tag.
<?php
require('./wp-blog-header.php');
ob_start();
get_footer();
$footer = ob_get_contents();
ob_end_clean();
$bindings['FOOTER'] = $footer;
?>
