User:Jonas Lund/ImageMerger

What

ImageMerger is a cgi-based script that merges two images using Flickr and Google Images as source.

How

Imger.py

#!/env/bin/python
# coding: utf-8
print "Content-type: text/html\n"
import cgi, cgitb, datetime, urllib2, os, flickrapi, oauth, pprint, lxml.etree, json, random
from subprocess import call
cgitb.enable()

#Get Query
form = cgi.FieldStorage()
query = form["query"].value

#get Flickr Pic
API_KEY = ''
API_SECRET = ''

flickr = flickrapi.FlickrAPI(API_KEY, format='etree')
photos = flickr.photos_search(tags=query, per_page='1')
for photo in photos[0]:
  owner = photo.attrib['owner']
  pid = photo.attrib['id']
  photoSizes = flickr.photos_getSizes(photo_id=pid)  
  flickSrc = photoSizes[0][3].attrib['source']
  segements = flickSrc.rpartition('/')
  for s in segements:
      flickrFile = s
  
  ext = flickrFile.partition(".")
  flickTmp = "flicktmp.{0}".format(ext[2])
          
  #download
  cmd = "/usr/bin/wget {0} -O /home/jlund/public_html/imger/imgs/{1} -q".format(flickSrc, flickTmp)
  call(cmd, shell=True)
  
#get Google Pic
googleSearch = "https://ajax.googleapis.com/ajax/services/search/images?q={0}&v=1.0&rsz=1".format(query)
f = urllib2.urlopen(googleSearch)
data = json.load(f)

for r in data["responseData"]["results"]:
  googleSrc = r['url']
  segements = googleSrc.rpartition('/')
  for s in segements:
      googleFile = s
  
  ext = googleFile.partition(".")
  googleTmp = "googletmp.{0}".format(ext[2])

  #download
  cmd = "/usr/bin/wget {0} -O /home/jlund/public_html/imger/imgs/{1} -q".format(googleSrc, googleTmp)
  call(cmd, shell=True)
  
#merge with imageMagick and output
now = datetime.datetime.now()
newFilename = str(now.day) + str(now.hour) + str(now.minute) + str(now.second) + ".png"
rand = random.randrange(1,11)
mask = "mask{0}.png".format(rand)

mergeCmd = "/usr/bin/composite /home/jlund/public_html/imger/imgs/{0} /home/jlund/public_html/imger/imgs/{1} /home/jlund/public_html/imger/imgs/{2} /home/jlund/public_html/imger/imgs/{3}".format(flickTmp, googleTmp, mask, newFilename)
call(mergeCmd, shell=True)

#cleanup
rmCmd = "rm /home/jlund/public_html/imger/imgs/{0}; rm /home/jlund/public_html/imger/imgs/{1};".format(flickTmp, googleTmp)
call(rmCmd, shell=True)
print "http://pzwart3.wdka.hro.nl/~jlund/imger/imgs/{0}".format(newFilename)

index.html

<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

  <title>Image Merger</title>
  <meta name="description" content="Image Merger">
  <meta name="author" content="Image Merger">
  <meta name="viewport" content="width=device-width,initial-scale=1">

  <style>
    body, html {width: 100%;}
    html {margin: 0; padding: 0;}
    body {font: 14px/1.3 sans-serif; color: #333;}
    #search-form {position: absolute; top: 20px; right: 20px; width: 300px;}
    #loader {display: none; position: fixed; top: 20px; left: 0; text-align: center;}
    img {margin: 20px;}
    #results {text-align: center; width: 100%;}
  </style>
</head>

<body>
  <div id="loader">
    <img src="http://pzwart3.wdka.hro.nl/~jlund/imger/loader.gif"/>
  </div> 
   
  <div id="search-form" role="main">
      <form action="http://pzwart3.wdka.hro.nl/~jlund/cgi-bin/imger.py" method="POST" id="search">
          <label for="query">Search for...</label>
          <input type="text" name="query" id="query" />
          <input type="submit" name="submit" value="Go!">        
      </form>
  </div>

  <div id="results">
  </div>

  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  <script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.4.min.js"><\/script>')</script>
  <script>
    
    $("#loader").ajaxStart(function() { 
      $(this).show();
    });
    
    $("#search").submit(function() { 
      var formVal = $("#query").val();
      
      $.ajax({ 
        type: "POST",
        data: {query: formVal},
        url : 'http://pzwart3.wdka.hro.nl/~jlund/cgi-bin/imger.py',
        success : function(data) { 
            $("#loader").hide();
            if(data) {
              $("<img/>", {
                src: data                 
              }).prependTo($("#results"));                            
            }            
        }        
      });
      
      return false;
    });
  
  </script>
</body>
</html>

Why