GMap2.prototype.paInfoWindow = null;
GMap2.prototype.clickListener = null;
GMap2.prototype.zoomListener = null;
GMap2.prototype.showPaInfoWindow = function(mark_latlng,a) {
	this.removePaInfoWindow();
	this.paInfoWindow = new PaInfoWindow(mark_latlng,a);
	this.addOverlay(this.paInfoWindow);
	this.clickListener = GEvent.addListener(this, 'click', function(overlay){
		if (!overlay) this.removePaInfoWindow();  // && this.paInfoWindow != null
	});
	this.zoomListener = GEvent.addListener(this, 'zoomend', function(){
		this.removePaInfoWindow();
	});
}

GMap2.prototype.removePaInfoWindow = function() {
	if (this.paInfoWindow !== null) {
		GEvent.removeListener(this.clickListener);
		GEvent.removeListener(this.zoomListener);
		this.removeOverlay(this.paInfoWindow)
		this.paInfoWindow = null;
	}
}

/*
* PaInfoWindow class v1.0
* Copyright (c) 2008, Jon Arne Jørgensen (http://www.jonarne.no)
* Inspired by ExtInfoWindow by Joe Monahan (http://www.seejoecode.com)
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* 
*       http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/


/**
* Creates a new paInfoWindow
*
* @constructor
*	{}
*/
function PaInfoWindow(mark_latlng,array)
{
	this.latlng_ = mark_latlng;
	this.arrays_ = $.makeArray(array);
	this.mode_ = (this.arrays_[0].Project) ? "Project" : "Practice";
	this.paddingTop = 180;
	this.paddingLeft = 10;

}

PaInfoWindow.prototype.toString = function()
{
	return "PaInfoWindow";
}

//use the GOverlay class
PaInfoWindow.prototype = new GOverlay();

/**
* Acceseded by GMap2's addOverlay method.  Creates the wrapping div for our info window and
* adds it to the relevant map pane. Also binds mousedown events to a private function so
* that they are not passed to the underlaying map.
* @param {GMap2} map The map that this PaInfoWindow is added to
*/
PaInfoWindow.prototype.initialize = function(gm)
	{
	this.map_ = gm;
	var count = this.arrays_.length;

	// Create an element to get the image size from css, and then destroy it again
	$image = $(document.createElement('a')).addClass('painfowindow image').hide();
	$(this.map_.getContainer()).append($image);
	var imageSize = { width:$image.width(), height:$image.height() };
	$image.remove();
	$image = null;

	//this.beak_ = document.createElement('div');
	//this.beak_.id = this.infoWindowId_+'_beak';
	var containerWidth = (count > 1) ? imageSize.width+50 : imageSize.width;
	var pixelLocation = this.map_.fromLatLngToDivPixel(this.latlng_);
	this.$container_ = $('<div>').addClass('painfowindow container').css({
		width : containerWidth,
		background : 'transparent',
		position : 'absolute',
		left : pixelLocation.x-(containerWidth/2),
		top : (pixelLocation.y-85)
	}).bind('click dblclick mousedown',function(e){
		e.preventDefault();
		e.stopPropagation();
		return false;
	});
	
	var $tabContainer = $('<div>').width(containerWidth).height(8);
	var $images = $('<div>').addClass('painfowindow content').css({width:imageSize.width*2});

	var imagesArray = new Array();
	for (var i = 0; i < count; i++) {
		imagesArray.push(
			$('<a>').addClass('painfowindow image').css({
				float : 'left',
				width : imageSize.width,
				height : imageSize.height,
				backgroundColor:TextColors[this.arrays_[i].color].css,
				backgroundImage:"url("+this.arrays_[i].image+")",
			}).attr({href:this.arrays_[i].link}).bind('click',function(){
				$.overlayIframe.load($(this).attr('href'));
				return false;
			}).append(
				$('<span>'+this.arrays_[i].name+'</span>').css('backgroundColor','inherit')
			).appendTo($images)
		);

		$('<div>').width(Math.floor(containerWidth/count)-1).height((i==0)?6:2).css({
				'marginTop':((i==0) ? 0 : 4),
				'float':'left',
				'backgroundColor':TextColors[this.arrays_[i].color].css,
				'borderRight':'1px solid black',
				'borderBottom':'1px solid '+((i==0) ? TextColors[this.arrays_[i].color].css : 'black' ),
			}).appendTo($tabContainer);
	}

	var currentImage = 0;
	$colorBar = $('<div>').width(containerWidth).height(2).css({
			'clear':'left',
			'backgroundColor':TextColors[this.arrays_[currentImage].color].css
		}).appendTo($tabContainer);
	
	var $content = $(document.createElement('div')).css({
		width : imageSize.width,
		height : imageSize.height,
		float : 'left',
		overflow : 'hidden'
	}).append($images);

	this.$container_.append($tabContainer).append($content);

	if (count > 1) {
		var $panLeft = $('<div>').text('<').css({ float : 'left', width : 25, height : 50 }).click(function(){
			var prevImage = (currentImage > 0) ? currentImage-1 : count-1;
			$images.css('marginLeft',0).children().css('float','left');
			imagesArray[prevImage].css('float','left').css('marginLeft',-(imageSize.width)).prependTo($images).animate({
				marginLeft:0
			},"fast");
			currentImage = prevImage;
			var c = $tabContainer.children().eq(currentImage).height(5).css('marginTop',0)
						.css('borderBottomColor',function(){return $(this).css('backgroundColor');})
						.siblings().not(':last').height(1).css({'marginTop':4,'borderBottomColor':'black'})
						.end().end().css('backgroundColor');
			$colorBar.css('backgroundColor',c);
			return false;
		}).addClass('painfowindow arrows');

		var $panRight = $panLeft.clone().text('>').click(function(){
			var nextImage = (currentImage < count-1) ? currentImage+1 : 0;
			$images.css('marginLeft',-(imageSize.width)).children().css('float','right');
			imagesArray[nextImage].css('float','right').css('marginRight',-(imageSize.width)).prependTo($images).animate({
				marginRight:0
			},"fast");
			currentImage = nextImage;
			var c = $tabContainer.children().eq(currentImage).height(5).css('marginTop',0)
						.css('borderBottomColor',function(){return $(this).css('backgroundColor');})
						.siblings().not(':last').height(1).css({'marginTop':4,'borderBottomColor':'black'})
						.end().end().css('backgroundColor');
 			$colorBar.css('backgroundColor',c);
			return false;
		});
		$content.before($panLeft).after($panRight);
	} else {
		$tabContainer.children().not(':last').hide().end().css({'float':'left','marginTop':6});
	}

	$(this.map_.getPane(G_MAP_FLOAT_PANE)).append(this.$container_);
	this.repositionMap();
	}

PaInfoWindow.prototype.repositionMap = function()
{
	var bounds = this.map_.getBounds();
	var NE = this.map_.fromLatLngToContainerPixel(bounds.getNorthEast());
	var SW = this.map_.fromLatLngToContainerPixel(bounds.getSouthWest());
	var markerPosition = this.map_.fromLatLngToContainerPixel(this.latlng_);

	var panY = 0;
	var panX = 0;

	var offsetTop = markerPosition.y - 85;
	var offsetLeft =  markerPosition.x - (this.$container_.width()/2);
	if (offsetTop < NE.y+this.paddingTop) panY = NE.y+this.paddingTop - offsetTop;
	if (offsetLeft < SW.x+this.paddingLeft) panX = SW.x+this.paddingLeft - offsetLeft;
	
	this.map_.panBy(new GSize(panX,panY));
}

/**
 * Not shure about why i need this
 * @param {Boolean} force Will be true when pixel coordinates need to be recomputed.
 */
PaInfoWindow.prototype.redraw = function(force)
{
	if (!force || this.container_ == null) return;
}


/**
 * Remove the paInfoWindow container from the map pane.
 */
PaInfoWindow.prototype.remove = function()
{
	this.arrays_ = null;
	this.$container_.remove();
}


/**
 * Returns a copy of this overlay, for the parent Map to duplicate itself in full.
 * This is part of the Overlay interface and is used, for example, to copy
 * everything in the main view into the mini-map.
 * @return {GOverlay}
 */
PaInfoWindow.prototype.copy = function()
	{
	return new PaInfoWindow(this.latlng_,this.arrays_);
	}