code and design reflected in occasionally coherent words

Article Search:

July 10, 2009

This is an old Google Image Search 'hack' I updated to work with Google's AJAX search API and PHP using cURL and JSON... For creative fun I've been working on some content sensitive visual mish-mash, and wanted to post some quick code in hopes others will do something creative with it. Back in the day, before Google's AJAX search API was robust enough to include image and video searches you had to work around things like so:

<html>
<body>
<form action="<?php echo $PHP_SELF;?>" method="post">
Please enter a word:
<input type="text" name="word">
<input type="submit">
</form>

<?php
//get the word submitted from the form
$word = $_POST['word'];
$img_pattern = "#<img src=http\S* width=[0-9]* height=[0-9]*>#";

// validate the word
if ($word != '') {

// initialise the session
$ch = curl_init();

// Set the URL
curl_setopt($ch, CURLOPT_URL, "http://images.google.com/images?gbv=1&hl=en&sa=1&q=".urlencode($word)."&btnG=Search+images");

// Return the output from the cURL session rather than displaying in the browser.
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);

//Execute the session, returning the results to $curlout, and close.
$curlout = curl_exec($ch);
curl_close($ch);

preg_match_all($img_pattern, $curlout, $img_tags);

//display the results - I'll leave the formatting to you
print("Image results for $word: ".sizeof($img_tags[0])."<br/>\n");
foreach ($img_tags[0] as $val){
print(" ".$val."\n");
}
}
?>

</body>
</html>

Of course now their search API has matured to even include experimental arguments like imgtype and imgcolor, which allows you to restrict your search to things like faces or purple images. With AJAX you don't need to burden your server with all this craziness, but if if you want all you need to do is use the PHP's JSON functions namely json_decode(). As you may noticed I added the aforementioned experimental arguments.

<html>
<body>
<form action="<?php echo $PHP_SELF;?>" method="post">
Please enter a word:
<input type="text" name="word" value="<?php echo $_POST['word'];?>">
<select name="type">
<option value="">optional content types</option>
<option value="face">restrict to images of faces</option>
<option value="photo">restrict to photos</option>
<option value="clipart">restrict to clipart images</option>
<option value="lineart">restrict to images of line drawings</option>
</select>
<select name="color">
<option value="">optional content color</option>
<option value="black">filter to black images</option>
<option value="blue">filter to blue images</option>
<option value="brown">filter to brown images</option>
<option value="gray">filter to gray images</option>
<option value="green">filter to green images</option>
<option value="orange">filter to orange images</option>
<option value="pink">filter to pink images</option>
<option value="purple">filter to purple images</option>
<option value="red">filter to red images</option>
<option value="teal">filter to teal images</option>
<option value="white">filter to white images</option>
<option value="yellow">filter to yellow images</option>
</select>
<input type="submit">
</form>

<?php
$word = $_POST['word'];
$type = (isset($_POST['type']))? "&imgtype=".urlencode($_POST['type']) : "";
$color = (isset($_POST['color']))? "&imgcolor=".urlencode($_POST['color']) : "";
$ajax_url = "http://ajax.googleapis.com/ajax/services/search/images?v=1.0&rsz=large&q=".urlencode($word).$type.$color."&key=yerBigazLonggGobldeyGukKeyHere";
// validate the word
if ($word != '') {

// initialise the session
$ch = curl_init();

// Set the URL
curl_setopt($ch, CURLOPT_URL, $ajax_url);

// Return the output from the cURL session rather than displaying in the browser.
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
// Google likes this type of courtesy
curl_setopt($ch, CURLOPT_REFERER, "http://www.yersiite.com/");
//Execute the session, returning the results to $curlout, and close.
$curlout = curl_exec($ch);
curl_close($ch);

$response = json_decode($curlout, true);

for($counter=0; $counter < sizeof($response['responseData']['results']); $counter++){
print("<img src=\"".$response['responseData']['results'][$counter]['tbUrl']."\" />\n");
}
// If you want to see the json_decode output just uncomment the next 2 lines
// $v = var_export($response);
// echo $v;
}
?>
</body>
</html

As a side note, the decoded JSON output looks crazy as var_dump/export doesn't insert html break tags, but it will be nicely formated if you look at the source. I hope you take creative advantage of this. I'm using it for some content sensitive design... maybe some fancy twitter topic mishmash... or something else cool. here's the above code http://timbrockman.com/curl_ajax_json_googlesearch.php

7 Comments »

  1. cant get this working on my server… php config @ http://www.sentire.co.uk/labs/

    Im not sure what the problem is but any help would be appreciated. with your first example the php self doesnt seem to work and with the second i just get a blank screen

    Comment by frank macdonald — November 9, 2009 @ 5:55 pm

  2. Hi again mate,

    The problem is the way the code is desplaying on ur website. It is changing some of the ” characters to ” characters and some ‘ characters are also becoming ” . Could you pleaaaaaaaase upload the php file in a zip or rar folder so i can use the code !!! :P

    Comment by frank macdonald — November 9, 2009 @ 6:26 pm

  3. yeh this is an issue i cant even demonstrate to you what character it’s changing into. copy and paste your code from this page into a text editor and you will see whats happening. if you want anyone to be able to use this its important you either change the way you are displaying the code or upload the php file in a zip or rar archive bro. sorry bout the mass of comments but this issue is ANNOYING ME :p

    Comment by frank macdonald — November 9, 2009 @ 6:30 pm

  4. Sorry about that, it should be fixed…
    Wordpress has these nice filter functions built in to display straight quotes as curly quotes.
    Thanks for calling that to my attention.

    Comment by Tim Brockman — November 9, 2009 @ 7:48 pm

  5. Hi again,

    I though id show you what your image script has made possible :P take a peak at http://www.frankmacdonald.co.uk/reactor/

    works well for pulling related images. nice work.

    Comment by Frank MacDonald — December 6, 2009 @ 4:22 pm

  6. hi,,

    first of all i thanks for posting this code, because its very usefull for my project, but i cant run this code in php, i dont know what can i change this code further,,, please guide me how can i run this code,,,,,

    thank you ………..

    Comment by sathya — May 27, 2011 @ 2:26 am

  7. Nice

    Comment by Bobby — September 14, 2011 @ 5:29 am

RSS feed for comments on this post. TrackBack URL

Leave a comment

...