var G = google.maps;

var overlay1;
var layer;
var zoom=2;
var minZoom=2;
var maxZoom=12;

var overlay2;
var skymap1;
var skymap2;
var mapsready=false;
var minZoom=12;
var maxZoom=17;
//boston
var centerPoint1 = new G.LatLng(42.3498, -71.0788);
//boston
var centerPoint2 = new G.LatLng(42.3498, -71.0788);
var zoom=16;
//var tileBaseURL="http://spotrank.s3.amazonaws.com/sxsw_";
//var tileBaseURL="http://hal.skyhookwireless.com/atlas/hostedtiles/sxsw_";
var tileBaseURL="http://www.skyhookwireless.com/spotrank/images/";
//var tileBaseURL="http://rich.skyhookwireless.com/atlas/hostedtiles/sxsw_";

// API cache to avoid duplicating requests on a single page load.
var api_cache = {}

var seen_ids={}
var lat_lon_re=/(-?\d+\.\d+),(-?\d+\.\d+)/
var slider;

//the +5 is due to the fact that our files are not quite to UTC yet!
var timezones = [-4+6,-4+6];

// and timezones for display purposes
var tznames = ["EDT","EDT"];
/////////////////

// Preloading the images used for the slider handle, not at all necessary...
var imgList = ["slider-disabled.png", "slider-disabled-1.png", "slider.png", "slider-1.png"],
    preloadImg = [];

for(var i = 0, imgSrc; imgSrc = imgList[i]; i++) {
        preloadImg[i] = new Image();
        preloadImg[i].src = "js/" + imgSrc;
};


/*******************************************************************************
 
 Callback functions used by the slider
 
 ******************************************************************************/

// The Object.method that updates the paragraph with the current value
var myObject = function() {
        this.callback = function(cbObj) {
                var tempd = hours[cbObj.value];
                if (tempd) {
                    //convert datehour to a Date
                    var xYYYY = tempd.substring(0,4);
                    var xMM = tempd.substring(5,7);
                    var xDD = tempd.substring(8,10);
                    var xHH = tempd.substring(11,13);
                    var d = new Date(xYYYY,xMM-1,xDD,xHH,0,0,0);

                    //update the Boston date
                    // note, current files are in CST Time, so first we adjust UTC
                    var offsettime = d.getTime() + (3600000*2);
                    //set the text appropriately
                    var nd = new Date(offsettime);
                    // change the overlays
                    var p = document.getElementById("utc-dateWrapper").getElementsByTagName("p")[0];
                    //p.innerHTML = nd.toDateString() + " " + nd.getHours() + ":00:00 Boston";
                    p.innerHTML = "Monday  " + nd.getHours() + ":00:00 ";
   
                    //convert to each timezone as needed
                    offsettime = d.getTime() + (3600000*timezones[0]);
                    //set the text appropriately
                    nd = new Date(offsettime);
                    // change the overlays
                    p = document.getElementById("map1-dateWrapper").getElementsByTagName("p")[0];
                    //p.innerHTML = nd.toDateString() + " " + nd.getHours() + ":00:00 " + tznames[0];
                    p.innerHTML = "Monday the 12th " + nd.getHours() + ":00:00 " + tznames[0];

                    //convert to each timezone as needed
                    offsettime = d.getTime() + (3600000*timezones[1]);
                    //set the text appropriately
                    nd = new Date(offsettime);
                    // change the overlays
                    p = document.getElementById("map2-dateWrapper").getElementsByTagName("p")[0];
                    //p.innerHTML = nd.toDateString() + " " + nd.getHours() + ":00:00 " + tznames[1];
                    p.innerHTML = "Marathon Monday " + nd.getHours() + ":00:00 " + tznames[1];

                    if (overlay1 && overlay2)
                    {
                        overlay1.setDate(hours[cbObj.value]);
                        overlay2.setDate(hours[cbObj.value]);
                    }
            }
        };
        return this;
}();

// The function creates the paragraph tag used within the update callback
function setUpDateSliderOutput(cbObj) {
        // Dynamically create the paragraph 
        var p = document.createElement("p");
        p.className = "res";
        // Append it to the wrapper div
        //document.getElementById(cbObj.elem.id + "-dateWrapper").appendChild(p);
        document.getElementById("map1-dateWrapper").appendChild(p);
        p = document.createElement("p");
        p.className = "res";
        document.getElementById("map2-dateWrapper").appendChild(p);
        p = document.createElement("p");
        p.className = "res";
        document.getElementById("utc-dateWrapper").appendChild(p);

        // set up the slider min/max dates
        var tempd = hours[0];
        //convert datehour to a Date
        var xYYYY = tempd.substring(0,4);
        var xMM = tempd.substring(5,7);
        var xDD = tempd.substring(8,10);
        var xHH = tempd.substring(11,13);
        var d = new Date(xYYYY,xMM-1,xDD,xHH,0,0,0);
        //convert to each timezone as needed
        var offsettime = d.getTime() + (3600000*1);
        //set the text appropriately
        nd = new Date(offsettime);
        p = document.createElement("p");
        p.className = "utc";
        //p.innerHTML = nd.toDateString() + " " + nd.getHours() + ":00:00 Boston";
        p.innerHTML =  "Monday " + nd.getHours() + ":00:00 Boston";
        document.getElementById("start-dateWrapper").appendChild(p);

        p = document.createElement("p");
        p.className = "utc";
        tempd = hours[hours.length-1];
        //convert datehour to a Date
        xYYYY = tempd.substring(0,4);
        xMM = tempd.substring(5,7);
        xDD = tempd.substring(8,10);
        xHH = tempd.substring(11,13);
        d = new Date(xYYYY,xMM-1,xDD,xHH,0,0,0);
        //convert to each timezone as needed
        var offsettime = d.getTime() + (3600000*1);
        //set the text appropriately
        nd = new Date(offsettime);
        //p.innerHTML = nd.toDateString() + " " + nd.getHours() + ":00:00 Boston";
        p.innerHTML =  "Tuesday " + nd.getHours() + ":00:00 Boston";
        document.getElementById("end-dateWrapper").appendChild(p);
        // Stop IE6 memory leaks
        p = null;
};

/////////////////
/////////////////
/////////////////

function load() {


    // go ahead and display the slider div
    document.getElementById("slider-v1-dateWrapper").style.display = '';
    options.maxInc=24;
    // and now create it
    fdSliderController.createSlider(options);

	//create the maps
	container1 = document.getElementById('skymap1');
	container2 = document.getElementById('skymap2');

	var myOptions = {
		zoom: zoom,
		center: centerPoint1,
		mapTypeId: G.MapTypeId.ROADMAP,
		mapTypeControl: false
	}

	skymap1 = new G.Map(container1, myOptions);
    G.event.addListener(skymap1, 'zoom_changed', function () {
            if (mapsready) {
                mapsready=false;
                var z = skymap1.getZoom();
            	if (z < minZoom) {
                    	z = minZoom;
            	}
            	if (z > maxZoom) {
                    	z = maxZoom;
				}

            	//if (z < minZoom || z > maxZoom) {
                	//skymap1.overlayMapTypes.getAt(0).hide();
                	//skymap2.overlayMapTypes.getAt(0).hide();
            	//} else {
                	//skymap1.overlayMapTypes.getAt(0).show();
                	//skymap2.overlayMapTypes.getAt(0).show();
            	//}
            	window.skymap1.setZoom(z);
            	window.skymap2.setZoom(z);
            	mapsready=true;
            }
        });
    G.event.addListener(skymap1, 'center_changed', function() {
                if (mapsready) {
                    mapsready=false;
                    var c = skymap1.getCenter();
                    window.skymap2.setCenter(c);
                    mapsready=true;
                }
        });

	// create the overlays
	overlay1=new SparseTileLayerOverlay(skymap1, 0);
	overlay1.setMap(skymap1);
	overlay1.setUrl=SetUrl;

	google.maps.event.addListener(skymap1,"idle",function(){overlay1.idle();});

    myOptions = {
        zoom: zoom,
        center: centerPoint2,
        mapTypeId: G.MapTypeId.ROADMAP,
        mapTypeControl: false
    }
    skymap2 = new G.Map(container2, myOptions);
    G.event.addListener(skymap2, 'zoom_changed', function () {
                if (mapsready) {
                    mapsready=false;
                    var z = skymap2.getZoom();
            		if (z < minZoom) {
                    		z = minZoom;
            		}
            		if (z > maxZoom) {
                    		z = maxZoom;
					}
                    //if (z < minZoom || z > maxZoom) {
                        //skymap1.overlayMapTypes.getAt(0).hide();
                        //skymap2.overlayMapTypes.getAt(0).hide();
                    //} else {
                        //skymap1.overlayMapTypes.getAt(0).show();
                        //skymap2.overlayMapTypes.getAt(0).show();
                    //}
                    window.skymap1.setZoom(z);
                    window.skymap2.setZoom(z);
                    mapsready=true;
                }
        });
    G.event.addListener(skymap2, 'center_changed', function() {
                if (mapsready) {
                    mapsready=false;
                    var c = skymap2.getCenter();
                    window.skymap1.setCenter(c);
                    mapsready=true;
                }
        });

	// create the overlays
	overlay2=new SparseTileLayerOverlay(skymap2, 7);
	overlay2.setMap(skymap2);
	overlay2.setUrl=SetUrl;

	google.maps.event.addListener(skymap2,"idle",function(){overlay2.idle();});

    mapsready=true;

	// set the slider to latest hour -2 (min of 0)
	var d = new Date();
	var slideroffset = 3;
	if (d.getMinutes() < 15)
	{
		slideroffset++;
	}
	
    //var mid = Math.min(23,(Math.max(0,d.getHours()-slideroffset)));
    var mid = 11;
    //var mid = Math.round((hours.length-1)/2);
    // set the slider to the middle
    fdSliderController.increment("slider-v1",mid);
}


function changeAllZooms(mapnum)
{
    if (mapsready) {
        var z;
        switch(mapnum) {
            case 1:
                z = skymap1.getZoom();
                window.skymap2.setZoom(z);
                break;
            case 2:
                z = skymap2.getZoom();
                window.skymap1.setZoom(z);
                break;
            default:
                break;
        }
    }
}

function SetUrl(xy,z)
    {
        var q=[];
		var myOffset=0;

		var myDiv = this.map.getDiv().id;
		if (myDiv == "skymap2")
		{
			myOffset=7;
		}
	    var myDay =  +this.DD + +myOffset;
    	q[0] = tileBaseURL
                //+ this.YYYY + "/" + this.MM + "_" + myDay + "_" + this.HH + "/Layers/"
                + this.MM + "_" + myDay + "_" + this.HH + "/Layers/"
                + z + "/" + xy.x + "/" + xy.y + ".png";

        //q[0]=tileBaseURL
            //+"&srs=EPSG:4326&format=image/png&transparent=true&version=1.1.1&styles="
            //+"&width="+xy.X+"&height="+xy.Y
            //+"&bbox="+xy.x0.toFixed(6)+","+xy.y1.toFixed(6)+","+xy.x1.toFixed(6)+","+xy.y0.toFixed(6);

        //q[0] = tileBaseURL + z + "/" + xy.x + "/" + xy.y + ".png";
        //q[0] = tileBaseURL + "2010/04_19_12/Layers/" + z + "/" + xy.x + "/" + xy.y + ".png";

        //q[1]="http://mt"+((xy.x+xy.y)%4)+".google.com/mapslt?lyrs=transit"+"&x="+xy.x+"&y="+xy.y+"&z="+z;

        return q;
    }

function SetAlpha()
{
	overlay.setStyle(0,{alpha:.5});

	//overlay.setStyle(0,{alpha:document.getElementById("Alpha0").checked-0});
	//overlay.setStyle(1,{alpha:document.getElementById("Alpha1").checked-0});
}

function SetLevel()
{
	overlay.setStyle(0,{level:0});
	//overlay.setStyle(0,{level:document.getElementById("Level0").checked-0});
	//overlay.setStyle(1,{level:document.getElementById("Level1").checked-0});
}