Introduction | Demonstration Calculator | Source Code
How The Google Compatibility Calculator Works
Enter your name and the name of the person you want to be matched with into the appropriate boxes in the calculator, then click “Calculate Our Compatibility”. A client-side JavaScript uses AJAX to query Google for the number of search results that come up for each name at Google. It then uses those numbers to determine a compatibility score.
Please note the calculator doesn’t work properly, since Google changed the API.
Introduction | Demonstration Calculator | Source Code
Demonstration Calculator
GOOGLE COMPATIBILITY CALCULATOR
Introduction | Demonstration Calculator | Source Code
Fun Google Compatibility Calculator Source Code
This calculator is licensed to you under Creative Commons Attribution 3.0. If you would like to use the source code on your site or create a derivative work from it, you must include the following HTML on the page where the calculator appears. We’re giving you this code for free with a legal license to use it. All you have to do is credit us in the manner we specify.
Required Credit HTML
INSTALLATION
Download popucalc.zip. In it you will find the three graphics, PHP script for querying Google via their RESTful search API, an HTML file with the AJAX JavaScript and the search form, plus a README file with further instructions on getting it running.
Here are the two source files if you’d like to examine them.
JavaScript & HTML source code
<script type="text/javascript">
var firstval = "";
var secondval = "";
var firstdone = false;
var seconddone = false;
var offset=3;
function popucalc(){
document.getElementById('calcresults').innerHTML = '<b>Calculating</b><br /><img src="/images/pleasewait.gif">';
var firstname = escape(document.popcalc.firstname.value);
var getURL = 'popucalc.php?SP=' + firstname;
parseName(getURL,'first name');
var secondname = escape(document.popcalc.secondname.value);
getURL = 'popucalc.php?SP=' + secondname;
parseName(getURL,'second name');
}
function parseName(getURL,nameID)
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
}
//this is the part that processes the incoming data
xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
{
var myresults = xmlHttp.responseText;
parseResults(myresults,nameID);
}
}
//This is the part that sends it
xmlHttp.open("get",getURL,true);
xmlHttp.send(null);
}
function parseResults(result,nameID){
if(nameID == 'first name') {
firstval = (isNaN(parseInt(result))) ? 0 : parseInt(result);
firstdone = true;
} else if (nameID == "second name"){
secondval = (isNaN(parseInt(result))) ? 0 : parseInt(result);
seconddone = true;
}
if((firstdone)&&(seconddone)) showresults();
}
function showresults(){
var topper;
var bottomer;
firstdone=false;
seconddone=false;
if(firstval > secondval){
bottomer = firstval;
topper = secondval;
} else {
topper = firstval;
bottomer = secondval;
}
var popindex;
if((topper == 0)||(bottomer==0)){
popindex = 0;
} else {
var popindex = (topper/bottomer);
popindex = Math.round(popindex*1000)/1000
}
var popcover = Math.round(200 - ((popindex * 190) + 10));
var popamt = Math.round(popindex * 1000)/10;
var resultspot = document.getElementById('calcresults');
var resout = '<b>Matched: ' + popamt + '% </b><br>' + document.popcalc.firstname.value + ' and ' + document.popcalc.secondname.value + '<br>';
resout += '<div style="width:210px;height:45px;padding:5px;border:1pt solid #222;font-size:12px;"><div style="width:100px;float:left;text-align:left">Cool</div><div style="width:100px;float:left;text-align:right">Scorching</div><br style="clear:all">';
var quoter = "'/images/pcgradient.gif'";
resout += '<div style="width:200px;height:20px;margin:0px;padding:0px; background:url('+quoter+');text-align:right;"><img src="/images/pcwhite.gif" height=20 width=' + popcover + ' style="margin:0px;padding:opx;border:none;" /></div></div><br /><br />';
resultspot.innerHTML = resout;
}
</script>
<div style="border:2px solid #222;margin:5px;padding:5px;width:350px;"><h3>GOOGLE COMPATIBILITY CALCULATOR</H3>
<form name="popcalc" action="javascript:void();">
Your Name: <input size=20 name="firstname" id="firstname" type=text> <br>
Crush's Name: <input size=20 name="secondname" id="secondname" type=text><br>
<input type="submit" value="Calculate Our Compatibility" onClick="popucalc()";>
</form>
<div id="calcresults" style="height:120px;"></div><br />
</div>
PHP source code
<?php
$searchphrase = $_REQUEST["SP"];
$searchphrase = str_replace(""","",$searchphrase);
$searchphrase = str_replace("%22","",$searchphrase);
$searchphrase=urlencode($searchphrase);
$booboo = passnum($searchphrase);
echo $booboo;
function passnum($searchphrase){
$url = "http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=%22" . $searchphrase . "%22";
// sendRequest
// note how referer is set manually
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_REFERER, "http://www.mysite.com/index.html");
$body = curl_exec($ch);
curl_close($ch);
// now, process the JSON string
$json = json_decode($body, true);
// now have some fun with the results...
$sam = $json["responseData"]["cursor"]["estimatedResultCount"];
return $sam;
}
?>