﻿

// http://googlegeodevelopers.blogspot.com/2008/06/panoramio-api-markermanager-instant.html
// http://gmaps-samples.googlecode.com/svn/trunk/panoramio/pano_layer_enabled.html

// API Reference: http://code.google.com/apis/maps/documentation/reference.html#GMarker
// marker manager: http://gmaps-utility-library.googlecode.com/svn/trunk/markermanager/release/docs/reference.html

// custom icons for markers: http://groups.google.com/group/Google-Maps-API/web/examples-tutorials-custom-icons-for-markers

// example: http://gmaps-utility-library.googlecode.com/svn/trunk/markermanager/release/examples/google_northamerica_offices.html


function PhotoLayer(map, opt_opts) {
	var me = this;
	me.map = map;
	me.ids = {};
	me.mgr = new MarkerManager(map, { maxZoom: 19 });

	//var icon = new GIcon(G_DEFAULT_ICON);
	var icon = new GIcon();
	icon.image = "images/photo_blank.gif";
	icon.shadow = "";
	icon.iconSize = new GSize(46, 46);
	icon.shadowSize = new GSize(22, 22);
	icon.iconAnchor = new GPoint(23, 46);

	me.markerIcon = icon;
	me.enabled = false;

	GEvent.addListener(map, "moveend", function() {
		if (me.enabled) {
			var bounds = map.getBounds();
			var southWest = bounds.getSouthWest();
			var northEast = bounds.getNorthEast();
			me.load(me, { maxy: northEast.lat(), miny: southWest.lat(), maxx: northEast.lng(), minx: southWest.lng() });
		}
	});

	GEvent.addListener(map, "click", function(thisMarker) {
		if (thisMarker) {
			document.location = 'photo_detail.aspx?p=' + thisMarker.getTitle();
		}
	});

}

PhotoLayer.prototype.enable = function() {
	this.enabled = true;
	GEvent.trigger(this.map, "moveend");
}

PhotoLayer.prototype.disable = function() {
	this.enabled = false;
	this.mgr.clearMarkers();
	this.ids = {};
}

PhotoLayer.prototype.getEnabled = function() {
	return this.enabled;
}

PhotoLayer.prototype.load = function(photoLayer, userOptions) {
	var options = {
		minx: "-180",
		maxx: "180",
		miny: "-90",
		maxy: "90"
	};

	for (optionName in userOptions) {
		if (userOptions.hasOwnProperty(optionName)) {
			options[optionName] = userOptions[optionName];
		}
	}

	var url = "services/get_photos.aspx?";

	for (optionName in options) {
		if (options.hasOwnProperty(optionName)) {
			var optionVal = "" + options[optionName] + "";
			url += optionName + "=" + optionVal + "&";
		}
	}

	// get the JSON
	$.getJSON(url, { rnd: Math.random }, function(data) {
		PhotoLayerCallback(data, photoLayer);
	});

}

function PhotoLayerCallback(json, photoLayer) {
	this.photoLayer = photoLayer;

	for (var i = 0; i < json.photos.length; i++) {
		var photo = json.photos[i];
		if (!photoLayer.ids[photo.photo_id]) {

			// PhotoLayer method didn't work - so have moved this in here
			var markerIcon = new GIcon(photoLayer.markerIcon);
			markerIcon.image = 'images/dbimage.aspx?i=' + photo.map_photo;
			var marker = new GMarker(new GLatLng(photo.latitude, photo.longitude), { icon: markerIcon, title: photo.photo_id }); //title: photo.photo_title
			// we need the photo id - the only thing we can put it in seems to be the title.
			
			if (photo.photo_title.length > 33) {
				photo.photo_title = photo.photo_title.substring(0, 33) + "&#8230;";
			}

/*
			// click is taken care of at a map level (where it passes this marker to the click function)
			
			GEvent.addListener(marker, "click", function(thisMarker) {
				var test = thisMarker;
				document.location = 'photo_detail.aspx?p=' + thisMarker.title;
			});
*/

			photoLayer.mgr.addMarker(marker, 0);
			photoLayer.ids[photo.photo_id] = "exists";
			photoLayer.mgr.addMarker(marker, photoLayer.map.getZoom());
		}
	}
}
