Kwintessential Notes

Some time ago I asked if anyone has recommendations for a geotargeting service.

Since the service from Google is simple and free I implemented this one for a demo for a customer. Below you can find the code. For now I display a dojo dialog when there are visitors from Canada, United States and … Sweden (because I am located there). You could of course do a redirect automatically or store the user selection in a cookie for next time. You get the point.

<?xml version=”1.0″ encoding=”UTF-8″?>
<xp:view xmlns:xp=”http://www.ibm.com/xsp/core&#8221; dojoTheme=”true”
dojoParseOnLoad=”true”>
<xp:this.resources>
<xp:styleSheet href=”../resources/dojo.css”></xp:styleSheet>
<xp:styleSheet href=”../dijit/themes/tundra/tundra.css”></xp:styleSheet>
</xp:this.resources>
<script type=”text/javascript”
src=”http://www.google.com/jsapi?key=ACME_GOOGLE_MAPS_KEY”&gt;
</script>
<script type=”text/javascript”
src=”https://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js”&gt;
</script>
<script>
dojo.require(“dojo.parser”);
dojo.require(“dijit.Dialog”);
dojo.require(“dijit.form.TextBox”);
dojo.addOnLoad(checkPref);
function checkPref(){
var location_redirect = getCookie(“site_pref”);
if (location_redirect == “”){
showDialog();
}
else{
top.location.href = window.location = location_redirect;
}
}
function showDialog(){
var cl = google.loader.ClientLocation;
var ccode = cl.address.country_code;
if ((ccode == “CA”)||(ccode == “US”)||(ccode == “SE”)){
//document.getElementById(‘your_location’).innerHTML = “Your country code = ” + ccode;
var dlg = dijit.byId(‘dialog1′);
dlg.show();
}
}
function setCookie(c_name,value,expiredays){
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=c_name+ “=” +escape(value)+
((expiredays==null) ? “” : “;expires=”+exdate.toUTCString());
}
function getCookie(c_name){
if (document.cookie.length>0){
c_start=document.cookie.indexOf(c_name + “=”);
if (c_start!=-1){
c_start=c_start + c_name.length+1;
c_end=document.cookie.indexOf(“;”,c_start);
if (c_end==-1) c_end=document.cookie.length;
return unescape(document.cookie.substring(c_start,c_end));
}
}
return “”;
}
function loadPreferences(){
var location_redirect = getCookie(“site_pref”);
top.location.href = location_redirect;
}
</script>
<div dojoType=”dijit.Dialog” id=”dialog1″ title=”Select country”
style=”display:none;width:600px;”>
<h1>
Welcome to
<b>ACME</b>
</h1>
<div id=”your_location”></div>
<table border=”0″ width=”100%”>
<tr>
<td colspan=”2″>Visit:</td>
</tr>
<tr>
<td>
<b>USA site</b> <a href=”http://www.acme.com/us&#8221; target=”_top”>(English)</a>
<b>USA site 2</b> <a href=”javascript:setCookie(‘site_pref’,'http://www.acme.com/us’,’1000′);loadPreferences();” target=”_top”>(English)</a>
</td>
<td>
<b>Global site</b> <a href=”http://www.acme.com/&#8221; target=”_top”>(English)</a>
<b>Global site2</b> <a href=”javascript:setCookie(‘site_pref’,'http://www.acme.com/’,’1000′);loadPreferences();” target=”_top”>(English)</a>
</td>
</tr>
</table>

<div id=”divider”
style=”border-top:dashed 1px grey;margin:10px 0 10px 0″>
</div>

<div style=”float:left;width:272px;”>
<table width=”100%”>
<tr>
<td>
<b>Americas</b>
<br />
Canada,
<a href=”http://www.acme.com/us&#8221;
target=”_top”>
English
</a>
<br />
Latin America regional site,
<a href=”http://www.acme.com/cl&#8221;
target=”_top”>
Español
</a>
</td>
</tr>
<tr>
<td>
<b>Asia Pacific</b>
<br />
Asia Pacific regional site,
<a href=”http://www.acme.com/sg&#8221;
target=”_top”>
English
</a>
<br />
Australia,
<a href=”http://www.acme.com/au&#8221;
target=”_top”>
English
</a>
<br />
中国(China),
<a href=”http://www.acme.com/cn&#8221;
target=”_top”>
中文
</a>
<br />
日本 (Japan),
<a href=”http://www.acme.com/jp&#8221;
target=”_top”>
日本語
</a>
<br />
남한 (South Korea),
<a href=”http://www.acme.com/kr&#8221;
target=”_top”>
한국어
</a>
</td>
</tr>
</table>
</div>

<div>
<table width=”300px;”>
<tr>
<td>
<b>Europe</b>
<br />
CIS,
<a href=”http://www.acme.com/ru&#8221;
target=”_top”>
Россия
</a>
<br />
Suomi (Finland),
<a href=”http://www.acme.com/fi&#8221;
target=”_top”>
Suomeksi
</a>
<br />
Norge (Norway),
<a href=”http://www.acme.com/no&#8221;
target=”_top”>
Norsk
</a>
<br />
Polska (Poland),
<a href=”http://www.acme.com/pl&#8221;
target=”_top”>
Polski
</a>
<br />
Sverige (Sweden),
<a href=”http://www.acme.com/se&#8221;
target=”_top”>
Svenska
</a>
<br />
United Kingdom &amp; Ireland,
<a href=”http://www.acme.com/uk&#8221;
target=”_top”>
English
</a>
</td>
</tr>
<tr>
<td>
<b>Middle East and Africa</b>
<br />
Africa regional site,
<a href=”http://www.acme.com/za&#8221;
target=”_top”>
English
</a>
</td>
</tr>
</table>
</div>
</div>

</xp:view>

Here an example how it will look like: