// == Some global variables ==
var YSLIDERLENGTH = 164;       // maximum length that the knob can move (slide height minus knob height)
var MAXZOOM = 19;
var mapSize;
var mapObject;
// == Create a Custom GControl ==
function YSliderControl(tempMapSize, tempMapObject) 
{ 
	mapSize = tempMapSize;
	mapObject = tempMapObject;
}

YSliderControl.prototype = new GControl();

// == This function positions the slider to match the specified zoom level ==
YSliderControl.prototype.setSlider = function(zoom)
{
	var top = YSLIDERLENGTH - Math.round((YSLIDERLENGTH/MAXZOOM*zoom));
	this.slide.top = top;
	//this.knob.style.top = "27px";
	this.knob.style.top = top+"px";
}

// == This function reads the slider and sets the zoom level ==
YSliderControl.prototype.setZoom = function()
{
	var z= Math.round((YSLIDERLENGTH - this.slide.top) * MAXZOOM/YSLIDERLENGTH);
	this.mapObject.setZoom(z);
}


// == This gets called bu the API when addControl(new YSlider()) is used ==
YSliderControl.prototype.initialize = function(mapObject)
{
	// obtain Function Closure on a reference to "this"
	var that = this;
	// store a reference to the map so that we can call setZoom() on it
	this.mapObject = mapObject;

	// Is this MSIE, if so we need to use AlphaImageLoader
	var agent = navigator.userAgent.toLowerCase();
	if ((agent.indexOf("msie") > -1) && (agent.indexOf("opera") < 1)){this.ie = true} else {this.ie = false}

	// create the background graphic as a <div> containing an image
	var container = document.createElement("div");
	container.style.width="22px";
	container.style.height="164px";

	// Handle transparent PNG files in MSIE
	if (this.ie)
	{
		var loader = "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.northwestidx.com/images/map/slider_bg.png', sizingMethod='scale');";
		container.innerHTML = '<a href="javascript:void(0);" title="Drag to Zoom"><div style="height:164px; width:22px; ' +loader+ '" ></div></a>';
	}
	else
	{
		var tempInnerHTML = '<a href="javascript:void(0);" title="Drag to Zoom"><img src="http://www.northwestidx.com/images/map/slider_bg.png" width=22 height=164 border=0/></a>';
		container.innerHTML = tempInnerHTML;
	}

	// create the knob as a GDraggableObject
	// Handle transparent PNG files in MSIE
	if (this.ie)
	{
		var loader = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.northwestidx.com/images/map/slider_button.png', sizingMethod='scale');";
		this.knob = document.createElement("div");
		this.knob.title = "Drag to Zoom";
		this.knob.style.height="14px";
		this.knob.style.width="22px";
		this.knob.style.filter=loader;
	}
	else
	{
		this.knob = document.createElement("div");
		this.knob.innerHTML = "<img src=\"http://www.northwestidx.com/images/map/slider_button.png\" height=14 width=22 border=0 title='Drag to Zoom' />";
    }

	container.appendChild(this.knob);
	this.slide = new GDraggableObject(this.knob, {container:container});

	// attach the control to the map
	mapObject.getContainer().appendChild(container);

	// Listen for other things changing the zoom level and move the slider
	GEvent.addListener(mapObject, "zoomend", function(a,b) {that.setSlider(b)});

	// Listen for the slider being moved and set the zoom level
	GEvent.addListener(this.slide, "dragend", function() {that.setZoom()});

	return container;
}

// == Set the default position for the control ==
YSliderControl.prototype.getDefaultPosition = function()
{
	if(mapSize == "large")
	{	return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(8, 27));	}
	else
	{	return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(12, 62));	}
}