librarywebchic/Mashathon_US_2011

## Mashathon_US_2011
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Find Books Related to where you are</title>
<script type="text/javascript" language="JavaScript" src="../script_libraries/demo_config.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi?key=yourkey"></script>
<script type="text/javascript">
google.load("maps", "3",{"other_params":"sensor=true"});
google.load("jquery", "1.4.4");
google.load("jqueryui", "1.8.7");

function OnLoad(){
    if (google.loader.ClientLocation) {
    	//docs for client location - http://code.google.com/apis/ajax/documentation/#ClientLocation
    	var lat = google.loader.ClientLocation.latitude;
		var lon = google.loader.ClientLocation.longitude;
        var cl = google.loader.ClientLocation;
        var location = [cl.address.city, cl.address.region.toUpperCase(), cl.address.country].join(', ');
   		var queryLocation = [cl.address.city.toLowerCase(), cl.address.region.toLowerCase(), cl.address.country.toLowerCase()].join(' ');
   		$("#loc").append(location);
        $("#found").append('<h3>Are your interested in materials related to ' + queryLocation + ' and nearby areas?</h3>');
        searchMapFAST(lat, lon);

    } else {
    	$("#cantfindyou").append("<h4>Lookup a location</h4>");
    	$("#cantfindyou").append('<form id="search_place" action="" onsubmit="doAddressSearch(); return false;"><input id="place_name" value="" type="input"/><input id="search" value="Search" type="submit"/></form>');

    }
}

function doAddressSearch() {
    var address = document.getElementById("place_name").value;
    geocoder = new google.maps.Geocoder();
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
		var lat = results[0].geometry.location.lat();
		var lon = results[0].geometry.location.lng();
		var queryLocation = results[0].formatted_address;
		$("#cantfindyou").empty();
   		$("#loc").append(location);
        $("#found").append('<h3>Are your interested in materials related to ' + queryLocation + ' and nearby areas?</h3>');
        searchMapFAST(lat, lon);

      } else {
    	$("#cantfindyou").empty();
    	$("#cantfindyou").append("<p>Geocode was not successful for the following reason: " + status + "</p>");
      }
    });
}

function searchMapFAST(lat, lon) {
   	//Ask MapFAST For related subject headings nearby
   	var fast_request = 'http://experimental.worldcat.org/mapfast/services?geo=' + lat + ',' + lon + ';radius=100000&crs=wgs84&mq=&sortby=distance&max-results=5&callback=?'
   	$.getJSON(fast_request, function (data) {
   			if (data.Status.code == '200') {
   				var locations = new Array();
   				$.each(data.Placemark, function(i,item){
       				// need to spilt item.point.coordinates into lat and long
       				var coordinates = new Array();
       				coordinates = item.point.coordinates.split(',');
       				var latitude = coordinates[0];
       				var longitude = coordinates[1];
   					locations[i] = [item.name, latitude, longitude, item.ExtendedData[0].value];
   				});
   		    createMap(lat, lon, locations);
   			} else {
   			    return false;
   			}
   	});
}

function createMap(lat, lng, locations) {
    var mapElement = document.getElementById("map");
		mapElement.style.display = "block";
    var latlng = new google.maps.LatLng(lat, lng);
    var site = location;
    var options = {
		zoom: 7,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.TERRAIN,
		mapTypeControl: true,
    	mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    	navigationControl: true,
    	navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}
    };
	//calling the constructor, thereby initializing the map
	var map = new google.maps.Map(document.getElementById("map"), options);
	infowindow = new google.maps.InfoWindow({
        content: "loading..."
    });


    $.each(locations, function(i, location) {
        var markerLatLng = new google.maps.LatLng(location[1], location[2]);
		marker = new google.maps.Marker({
		  position: markerLatLng,
		  map: map,
		  title: location[0],
		  html: '<h4>' + location[0] + '</h4><p><a href="http://www.worldcat.org/search?q=su:' + location[3] + '&qt=advanced">Find Materials about this subject in WorldCat</a></p>'
		});
		google.maps.event.addListener(marker, 'click', function() {
				infowindow.setContent(this.html);
				infowindow.open(map, this);
		});

    });
}

google.setOnLoadCallback(OnLoad);
</script>
</head>
<body>
<div id="found"></div>
<div id="cantfindyou"></div>
<div id="map" style="width:710px;height:350px;"></div>
</body>
</html>
	<!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" xml:lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Find Books Related to where you are</title>
	<script type="text/javascript" language="JavaScript" src="../script_libraries/demo_config.js"></script>
	<script type="text/javascript" src="http://www.google.com/jsapi?key=yourkey"></script>
	<script type="text/javascript">
	google.load("maps", "3",{"other_params":"sensor=true"});
	google.load("jquery", "1.4.4");
	google.load("jqueryui", "1.8.7");

	function OnLoad(){
	if (google.loader.ClientLocation) {
	//docs for client location - http://code.google.com/apis/ajax/documentation/#ClientLocation
	var lat = google.loader.ClientLocation.latitude;
	var lon = google.loader.ClientLocation.longitude;
	var cl = google.loader.ClientLocation;
	var location = [cl.address.city, cl.address.region.toUpperCase(), cl.address.country].join(', ');
	var queryLocation = [cl.address.city.toLowerCase(), cl.address.region.toLowerCase(), cl.address.country.toLowerCase()].join(' ');
	$("#loc").append(location);
	$("#found").append('<h3>Are your interested in materials related to ' + queryLocation + ' and nearby areas?</h3>');
	searchMapFAST(lat, lon);

	} else {
	$("#cantfindyou").append("<h4>Lookup a location</h4>");
	$("#cantfindyou").append('<form id="search_place" action="" onsubmit="doAddressSearch(); return false;"><input id="place_name" value="" type="input"/><input id="search" value="Search" type="submit"/></form>');

	}
	}

	function doAddressSearch() {
	var address = document.getElementById("place_name").value;
	geocoder = new google.maps.Geocoder();
	geocoder.geocode( { 'address': address}, function(results, status) {
	if (status == google.maps.GeocoderStatus.OK) {
	var lat = results[0].geometry.location.lat();
	var lon = results[0].geometry.location.lng();
	var queryLocation = results[0].formatted_address;
	$("#cantfindyou").empty();
	$("#loc").append(location);
	$("#found").append('<h3>Are your interested in materials related to ' + queryLocation + ' and nearby areas?</h3>');
	searchMapFAST(lat, lon);

	} else {
	$("#cantfindyou").empty();
	$("#cantfindyou").append("<p>Geocode was not successful for the following reason: " + status + "</p>");
	}
	});
	}

	function searchMapFAST(lat, lon) {
	//Ask MapFAST For related subject headings nearby
	var fast_request = 'http://experimental.worldcat.org/mapfast/services?geo=' + lat + ',' + lon + ';radius=100000&crs=wgs84&mq=&sortby=distance&max-results=5&callback=?'
	$.getJSON(fast_request, function (data) {
	if (data.Status.code == '200') {
	var locations = new Array();
	$.each(data.Placemark, function(i,item){
	// need to spilt item.point.coordinates into lat and long
	var coordinates = new Array();
	coordinates = item.point.coordinates.split(',');
	var latitude = coordinates[0];
	var longitude = coordinates[1];
	locations[i] = [item.name, latitude, longitude, item.ExtendedData[0].value];
	});
	createMap(lat, lon, locations);
	} else {
	return false;
	}
	});
	}

	function createMap(lat, lng, locations) {
	var mapElement = document.getElementById("map");
	mapElement.style.display = "block";
	var latlng = new google.maps.LatLng(lat, lng);
	var site = location;
	var options = {
	zoom: 7,
	center: latlng,
	mapTypeId: google.maps.MapTypeId.TERRAIN,
	mapTypeControl: true,
	mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
	navigationControl: true,
	navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}
	};
	//calling the constructor, thereby initializing the map
	var map = new google.maps.Map(document.getElementById("map"), options);
	infowindow = new google.maps.InfoWindow({
	content: "loading..."
	});


	$.each(locations, function(i, location) {
	var markerLatLng = new google.maps.LatLng(location[1], location[2]);
	marker = new google.maps.Marker({
	position: markerLatLng,
	map: map,
	title: location[0],
	html: '<h4>' + location[0] + '</h4><p><a href="http://www.worldcat.org/search?q=su:' + location[3] + '&qt=advanced">Find Materials about this subject in WorldCat</a></p>'
	});
	google.maps.event.addListener(marker, 'click', function() {
	infowindow.setContent(this.html);
	infowindow.open(map, this);
	});

	});
	}

	google.setOnLoadCallback(OnLoad);
	</script>
	</head>
	<body>
	<div id="found"></div>
	<div id="cantfindyou"></div>
	<div id="map" style="width:710px;height:350px;"></div>
	</body>
	</html>