
<?
/*
 *  flyr - search photos for geotagged data
 *
 *  build a Google Maps application:
 *  http://www.google.com/apis/maps/
 *
 *  $Header: /usr/local/cvsrep/flyr/map.php,v 1.19 2005/09/22 14:16:18 pauldowney Exp $
 *
 *  written by Paul Downey (paul.downey@whatfettle.com)
 *  released under GNU General Public License (http://www.gnu.org/copyleft/gpl.html)
 */

/*
 *  search flickr
 */
require_once("flyr.php");

$f = new flyr();
$f->parseForm($_GET);
$photos = $f->search();
$folder = htmlentities($f->folder);

/*
 *  HTTP headers
 */
header("Content-type: text/html; charset=utf-8");
header("Last-Modified: " . $f->date);

/*
 *  generate Google maps application
 */
print <<<EOF
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

EOF;

$f->printComment();

print <<<EOF
  <head>
    <title>Flyr - Flickr Geotagged Photos Map</title>
        <link rel="stylesheet" type="text/css" href="style.css" />
        <link rel="shortcut icon" href="/favicon.ico" />
        <link rel="icon" href="/favicon.ico" />
        <script src="http://maps.google.com/maps?file=api&v=1&key=$gm_api_key" type="text/javascript"></script>
  </head>
  <body>

EOF;
    // TBD - make these form variables ..
    $zoomOut = 14;
    $zoomOutType = "G_MAP_TYPE";

    $zoomIn = 4;
    $zoomInType = "G_HYBRID_TYPE";

$f->printTitle();

print <<<EOF

    <table border="0" width="100%">
        <tr>
          <td valign="top" align="center">
            <div id="map" style="width: 500px; height: 400px"></div>
            <div id="controls">
                <table border="0" >
                    <tr>
                        <td><button onclick="gotoPhoto(1);">&laquo;</button></td>
                        <td><button onclick="nextPhoto(-1);">&lt;</button></td>
                        <td><button onclick="nextPhoto(0);">&otimes;</button></td>
                        <td><button onclick="nextPhoto(+1);">&gt;</button></td>
                        <td><button onclick="gotoPhoto(-1);">&raquo;</button></td>
                    </tr>
                </table>
            </div>
EOF;
            $f->printNav("maps");
print <<<EOF
          </td>
          <td valign="top" align="center">
            <div id="imageinfo">
                <p></p>
            </div>
          </td>
        </tr>
    </table>

    <script type="text/javascript">
    //<![CDATA[
    
    var map = new GMap(document.getElementById("map"));
    var point;
    var mark = [];
    var text;
    var n = 0;

    map.addControl(new GLargeMapControl());
    map.addControl(new GMapTypeControl());
    map.setMapType($zoomOutType)

    var point = new GPoint(0.0, 0.0);
    map.centerAndZoom(point, $zoomOut);

    // create markers

    var defaultMarker = new GMarker();

    var iconOn = new GIcon(defaultMarker.icon);

    var iconOn = new GIcon();
    iconOn.image = "http://flyr.whatfettle.com/images/small_on.png";
    iconOn.shadow = "http://flyr.whatfettle.com/images/small_shadow.png";
    iconOn.iconSize = new GSize(12, 20);
    iconOn.shadowSize = new GSize(22, 20);
    iconOn.iconAnchor = new GPoint(6, 20);
    iconOn.infoWindowAnchor = new GPoint(5, 1);

    var markOn;

    var offIcon = new GIcon(iconOn);
    offIcon.image = "http://flyr.whatfettle.com/images/small_off.png";

    var photo = new Array();

EOF;

$n = 0;

foreach ($photos as $photo) 
{
    $n = $n + 1;

    $photo_uri = $photo['small'];
    $page = $photo['page'];
    $lon = $photo['lon'];
    $lat = $photo['lat'];
    $title = $photo['title'];
    $description = $photo['description'];
    $from = $photo['from'];
    $glink = $photo['glink'];

    print <<<EOF

        var point = new GPoint($lon, $lat);

EOF;

    if ($n == 1)
    {
    print <<<EOF
        map.centerAndZoom(point, $zoomOut);

EOF;
    }

    print <<<EOF
        var mark$n = new GMarker(point, offIcon);


        photo[$n] = function() { 

            elm = document.getElementById('imageinfo'); 

            elm.innerHTML = 
                "<a href='$page'><img src='$photo_uri' border='0'/></a>"
                + "<p><b><a href='$page' style='text-decoration: none;'"
                + ">$title</a></b>"
                + "<br/>$from"
                + "<br/>$glink"
                + "</p>"
                + "<p>$description</p>";

            mark$n.showMapBlowup($zoomIn, $zoomInType);
        }

        GEvent.addListener(mark$n, "click", photo[$n]);
        map.addOverlay(mark$n);

EOF;
}


echo <<<EOF

    var currentPhoto = 1;

    function nextPhoto(direction)
    {
        gotoPhoto(currentPhoto+direction);
    }

    function gotoPhoto(n)
    {
        currentPhoto = n;

        if (currentPhoto <= 0) { currentPhoto = $n; } 
        else if (currentPhoto > $n) { currentPhoto = 1; }

        f = photo[currentPhoto];
        f();
    }

    gotoPhoto(1); 

    //]]>
    </script>
EOF;

$f->printFooter();

echo <<<EOF
    </body>
</html>
EOF;

exit();
?>