// Configure Roadmap
var startPos = 0;							// Start position for the roadmap horizontal
var shuffleArray = new Array();
var roadmapIntro;

var retrieveRoadmapContent = new Class({
	initialize: function(type,version,URL2){
		var URL;
		if(URL2 != undefined){ URL = URL2 } else { URL = '/site/roadmap/get-year-view' }

		var el = $('roadmapmessaging');
		el.empty();
		var txt = new Element('div',{'class':'filtermsg'}).setHTML('<strong>Loading...</strong>').injectInside(el);
		el.removeProperty('style');
		el.setStyles({'display':'block','top':'210px'});
		el.addClass('roadmaploadingnow');
		var makeRoadmapAjaxRequest = new Ajax(URL, {
			method: 'get',
			onComplete: function(response){
				$('roadmaplistcontainer').setHTML(response);
				if($('roadmaplistcontainer').getFirst().getChildren().length != 0){
					el.removeClass('roadmaploadingnow');
					el.setStyle('display','none');
					this.loadRoadmapContent(type,version);
				} else {
					el.addClass('roadmaploadingstop');
					txt.setHTML('<strong>No pledges found.<br />Please select a different set of filters.</strong>');
					el.addEvents({
						'click': function(e){
							el.removeClass('roadmaploadingstop');
							el.setStyle('display','none');
							el.removeEvents('click');
						}
					});
				}
				
				if(window.ie6){
					var ie6Fixing = $('pagecontainer').getElements('img');
					ie6Fixing.each(function(el,i){
						var imgSrc = el.getProperty('src');
						if(imgSrc.match('.png')){
							imgSrc = imgSrc.replace(/.png/,'.gif');
							el.setProperty('src',imgSrc);
						}
					});
				}
				
			}.bind(this)
		});
		makeRoadmapAjaxRequest.request();
	},
	loadRoadmapContent: function(type,version){
		switch(type){
			case 'initial':
				$('roadmapintro').setStyle('display','block')
				$('btnhelpclose').addEvent('click',function(e){ $('roadmapintro').setStyle('display','none'); });
				new configureRoadMap();
				new roadmapFilter();
			break;
			case 'reload':

			break;
			default:
		}
		new createRoadMap(version);
	}
});

var roadmapFilter = new Class({
	initialize: function(){
		this.setUpFilterOptions();
		$('opentoolbar').getFirst().addEvent('click', function(e){ if($('roadmapfilter').getStyle('opacity') == 1){ this.closeRoadmapFilter(); } else { this.openRoadmapFilter(); } e = new Event(e).stop(); }.bind(this));
		$('btnfilterroadmap').addEvent('click', function(e){ this.filterRoadmapNow(); e = new Event(e).stop(); }.bind(this));
	},
	openRoadmapFilter: function(){
		$('roadmapfilter').toggleClass('filteropen');
		this.roadmapFilter.start({'opacity':[0,1]});
	},
	closeRoadmapFilter: function(){
		this.roadmapFilter.start({'opacity':[1,0]}).chain(function(){
			$('roadmapfilter').toggleClass('filteropen');
		});
	},
	setUpFilterOptions: function(){
		this.roadmapFilter = new Fx.Styles($('roadmapfilter'), {duration: 500, wait: true, transition: Fx.Transitions.linear}).set({'opacity':0});
		this.filtergroupsli = $$('div#roadmapfilter ul li');
		this.filtergroupsli.each(function(el,i){
			if(el.getProperty('class')!= 'text'){
				el.addEvents({
					'mouseover': function(e){ el.addClass('hover');	},
					'mouseleave': function(e){ el.removeClass('hover'); },
					'click': function(e){
						el.addClass('clicked');
						if(el.hasClass('selected')){ el.removeClass('clicked'); }
						el.getParent().getChildren().each(function(el,i){
							if(el.hasClass('clicked')){ el.addClass('selected'); } else { el.removeClass('selected'); }
						});
						el.removeClass('clicked');
					}
				});
			}
		});
	},
	filterRoadmapNow: function(){
		var filters = $$('div#roadmapfilter ul');
		var firstFilter = filters[0].getElements('li.selected');
		var secondFilter = filters[1].getElements('li.selected');
		var thirdFilter = filters[2].getElements('li.selected');
		
		if(firstFilter.length!=0 && secondFilter.length!=0 && thirdFilter.length!=0){
			var URL = '/site/roadmap/get-year-view?';
			if(firstFilter.length>0){ 
				URL += 'type_id=' + firstFilter[0].getProperty('id').split('_')[1];
			}
			if(secondFilter.length>0){
				if(firstFilter.length>0){ URL += '&'; }
				URL += 'phase_id=' + secondFilter[0].getProperty('id').split('_')[1];
			}
			if(thirdFilter.length>0){
				if(firstFilter.length>0 || secondFilter.length>0){ URL += '&'; }
				URL += 'theme_id=' + thirdFilter[0].getProperty('id').split('_')[1];
			}
		} else {
			URL = '/site/roadmap/get-year-view';
		}
		this.closeRoadmapFilter();
		startPos = shuffleArray[1];
		new retrieveRoadmapContent('reload','yrview',URL);

	}
	
});

var configureRoadMap = new Class({
	initialize: function(){
		this.lsrc = $('lftbulge').getFirst().getProperty('src');
		this.rsrc = $('rhtbulge').getFirst().getProperty('src');
		var goLeft;
		var goRight;
		this.setUpMovement();
		this.setUpShuffles();
		this.openRoadmap();
		$('opentoolbar').getLast().addEvent('click', function(e){ this.closeRoadmap(); e = new Event(e).stop(); }.bind(this));
		$('opentoolbar').getLast().setStyle('visibility','hidden');
	},
	setUpMovement: function(){
		shuffleArray[5] = new Fx.Scroll('roadmaplistcontainer', {duration: 200, wait: false, transition: Fx.Transitions.Quad.easeInOut});
		this.roadmapOpenToolbar = new Fx.Styles($('opentoolbar'), {duration: 500, wait: true, transition: Fx.Transitions.linear}).set({'opacity':0});
		this.roadmapClosedToolbar = new Fx.Styles($('closedtoolbar'), {duration: 500, wait: true, transition: Fx.Transitions.linear}).set({'opacity':1});
		this.roadmapOpenContent = new Fx.Styles($('roadmapnewcontainer'), {duration: 500, wait: true, transition: Fx.Transitions.linear}).set({'opacity':0});
		this.roadmapClosedContent = new Fx.Styles($('roadmapnewimage'), {duration: 500, wait: true, transition: Fx.Transitions.linear}).set({'opacity':1});
	},
	openRoadmap: function(){
		this.roadmapClosedToolbar.start({'opacity':[1,0]});
		this.roadmapClosedContent.start({'opacity':[1,0]}).chain(function(){
			$('roadmapnew').addClass('roadmapopen');
			this.roadmapOpenToolbar.start({'opacity':[0,1]});
			this.roadmapOpenContent.start({'opacity':[0,1]});
		}.bind(this));
	},
	closeRoadmap: function(){
		this.roadmapOpenToolbar.start({'opacity':[1,0]});
		this.roadmapOpenContent.start({'opacity':[1,0]}).chain(function(){
			$('roadmapnew').removeClass('roadmapopen');
			this.roadmapClosedToolbar.start({'opacity':[0,1]});
			this.roadmapClosedContent.start({'opacity':[0,1]});
			this.resetShuffles();
			$('roadmaplistcontainer').empty();
			$('roadmaptxt').setHTML('Filter the roadmap using the options to the left');
		}.bind(this));
	},
	setUpShuffles: function(){
		$('lftbulge').getFirst().setProperty('src',this.lsrc.replace(/bulge-l-s./,'bulge-l.'));
		$('lftbulge').getFirst().addClass('action');
		$('lftbulge').getFirst().addEvents({
			'mouseover': function(e){ $('lftbulge').getFirst().setProperty('src',this.lsrc.replace(/bulge-l-s./,'bulge-l-o.')); }.bind(this),
			'mouseleave': function(e){ $clear(goLeft); $('lftbulge').getFirst().setProperty('src',this.lsrc.replace(/bulge-l-s./,'bulge-l.')); }.bind(this),
			'mouseenter': function(e){
				goLeft = (function(){
					this.shuffleLeft(shuffleArray,1);
				}).periodical(200, this);
			}.bind(this)
		});
		$('rhtbulge').getFirst().replaceWith($('rhtbulge').getFirst().setProperty('src',this.rsrc.replace(/bulge-r-s./,'bulge-r.')));
		$('rhtbulge').getFirst().addClass('action');
		$('rhtbulge').getFirst().addEvents({
			'mouseover': function(e){ $('rhtbulge').getFirst().setProperty('src',this.rsrc.replace(/bulge-r-s./,'bulge-r-o.')); }.bind(this),
			'mouseleave': function(e){ $clear(goRight); $('rhtbulge').getFirst().setProperty('src',this.rsrc.replace(/bulge-r-s./,'bulge-r.')); }.bind(this),
			'mouseenter': function(e){ 
				goRight = (function(){
					this.shuffleRight(shuffleArray,1);
				}).periodical(200, this);
			}.bind(this)
		});
	},
	shuffleLeft: function(shuffleArray,speed){
		var maxLft = shuffleArray[2];
		if(startPos.getNext()){
			shuffleArray[5].toElement(startPos.getNext());
			startPos = startPos.getNext();
		} else {
			shuffleArray[5].toElement(maxLft);
			startPos = maxLft;
		}

	},
	shuffleRight: function(shuffleArray,speed){
		var maxRht = shuffleArray[1];
		if(startPos.getPrevious()){
			shuffleArray[5].toElement(startPos.getPrevious());
			startPos = startPos.getPrevious();
		} else {
			shuffleArray[5].toElement(maxRht);
			startPos = maxRht;
		}

	},
	resetShuffles: function(){
		var lft = $('lftbulge');
		lft.getFirst().setProperty('src',this.lsrc);
		lft.getFirst().removeClass('action');
		lft.removeEvents();
		lft.getFirst().removeEvents();
		var rht = $('rhtbulge');
		rht.getFirst().setProperty('src',this.rsrc);
		rht.getFirst().removeClass('action');
		rht.removeEvents();
		rht.getFirst().removeEvents();
		startPos = shuffleArray[1];
	}
});

// New Roadmap Class
var createRoadMap = new Class({
	initialize: function(type){
		switch(type){
			case 'yrview':
			
				this.yrElementPins = $$('ul#roadmaplist li div.yrpins img'); // year pins
				this.mthElementPins = $$('ul#roadmaplist li div.mthpins img'); // month pins
				this.mapYrElements = this.yrElementPins.map(function(el){ return this.mapYrSegments(el) }.bind(this));
				this.mapMthElements = this.mthElementPins.map(function(el){ return this.mapMthPinElements(el) }.bind(this));
				this.yrElementPins.each(function(el,i){
					var yrSegment = this.setUpSlidingElement(this.mapYrElements[i],'yrview');
					// Pin Count Popups & Opener Toggle
					this.mapYrElements[i][2].addEvents({
						'mouseenter': function(e){
							this.updatePinImg(el);
							this.createCountPopup(e,i);
						}.bind(this),
						'mouseleave': function(e){
							this.updatePinImg(el);
							this.closePopup();
						}.bind(this),
						'click': function(e){
							if(this.mapYrElements[i][0].getStyle('width') != '505px'){ this.openSegment(yrSegment,i); }
						}.bind(this)
					});
				}.bind(this));
				
				this.mthElementPins.each(function(el,i){
					this.mapMthElements[i][6].addEvents({
						'mouseenter': function(e){
							this.updatePinImg(el);
							this.createTargetDetailsPopup(e,i);
						}.bind(this)
					});
				}.bind(this));

			break;
			case 'tgview':
				this.startPin = $('yrstartpin').getFirst();
				this.endPin = $('yrendpin').getFirst();
				this.mthBlobs = $$('ul#roadmaplist ul.mthactivities img'); // month blobs
				
				this.activeMthBlobs = new Array();
				this.mthBlobs.each(function(el){ return this.findActiveBlobs(el); }.bind(this));
				
				this.elTgSegmentArray = new Array(this.getParentHeirachy(this.startPin,3),this.getParentHeirachy(this.endPin,3));
				this.activeMthBlobs.each(function(el){ return this.showActiveBlobs(el); }.bind(this));

				this.mapTgElements = this.elTgSegmentArray.map(function(el){ return this.mapTgSegments(el) }.bind(this));
				this.mapMthBlobElements = this.mthBlobs.map(function(el){ return this.mapBlobElements(el) }.bind(this));

				this.elTgSegmentArray.each(function(el,i){
					var yrSegment = this.setUpSlidingElement(this.mapTgElements[i],'tgview');
					// Blob markers & Opener Toggle
					this.mapTgElements[i][2].addEvents({
						'click': function(e){
							if(this.mapTgElements[i][0].getStyle('width') != '505px'){ this.openSegment(yrSegment,i); }
						}.bind(this)
					});
					this.mapTgElements[i][6].addEvents({
						'click': function(e){
							if(this.mapTgElements[i][0].getStyle('width') != '505px'){ this.openSegment(yrSegment,i); }
						}.bind(this)
					});
				}.bind(this));
				
				this.mapMthBlobElements.each(function(el,i){
					// Blob popups
					el[4].addEvents({
						'mouseover': function(e){
							this.closePopup();
							this.createBlobPopup(e,i);
						}.bind(this)
					});
				}.bind(this));

			break;
			default:
		}
		this.setUpShuffles(type);
	},
	setUpShuffles: function(type){
		shuffleArray[0] = $('roadmaplist');									// 0 element container
		shuffleArray[1] = shuffleArray[0].getFirst();						// 1 element farthest right
		shuffleArray[2] = shuffleArray[0].getLast();						// 2 element farthest left
		shuffleArray[3] = shuffleArray[0].getChildren().length;				// 3 children
		shuffleArray[4] = shuffleArray[0].getChildren().length * 103; 		// 4 overall width

		shuffleArray[0].setStyle('width',shuffleArray[4]);
		startPos = shuffleArray[2];
		shuffleArray[5].toElement(shuffleArray[2]);
		
		this.listwrapper = new Fx.Style(shuffleArray[0], 'width', {duration:600, wait:true });
		
		/*if(type == 'tgview'){
			this.createStartEndPopups(this.startPin,this.endPin);
		}*/
		
	},
	mapYrSegments: function(el){
		var elChildren = this.getParentHeirachy(el,2).getChildren();
		var elArray = new Array();
		elArray.include(this.getParentHeirachy(el,3)); 				 // 0 yrcontent
		elArray.include(this.getParentHeirachy(el,2)); 				 // 1 yrinsert
		elArray.include(el); 	 					 			 	 // 2 yrpins image
		elArray.include(elChildren[1]);				 			 	 // 3 mthpins
		elArray.include(elChildren[2]);			 				 	 // 4 mthdate
		elArray.include(this.getParentHeirachy(el,2).getNext());	 // 5 yrdate
		//console.log(elArray);
		return elArray;
	},
	mapTgSegments: function(el){
		var elChildren = el.getFirst().getChildren();
		var elArray = new Array();
		elArray.include(el); 									 // 0 yrcontent
		elArray.include(el.getFirst()); 			 			 // 1 yrinsert
		elArray.include(elChildren[0]);	 			 			 // 2 yrpins
		elArray.include(elChildren[1]);				 			 // 3 mthpins
		elArray.include(elChildren[4]);			 				 // 4 mthdate
		elArray.include(el.getFirst().getNext());	 			 // 5 yrdate
		elArray.include(elChildren[2]);				 			 // 6 timeline
		elArray.include(elChildren[3]);				 			 // 7 activities
		//console.log(elArray);
		return elArray;
	},
	mapMthPinElements: function(el){
		var elArray = new Array();
		elChildren = el.getNext().getText().split('||');
		elArray.include(elChildren[0]); 				 						// 0 Title
		elArray.include(elChildren[1]); 				 						// 1 Description
		elArray.include('/site/roadmap/get-target-view?id=' + elChildren[2]); 	// 2 Link
		elArray.include(elChildren[3]); 				 						// 3 Month
		elArray.include(elChildren[4]); 				 						// 4 Category ID
		elArray.include(elChildren[5]); 				 						// 5 Category Name
		elArray.include(el); 		  				 							// 6 Pin image
		//console.log(elArray);
		return elArray;
	},
	mapBlobElements: function(el){
		var elArray = new Array();
		elChildren = el.getNext().getText().split('||');
		elArray.include(elChildren[0]); 				 						// 0 Title
		elArray.include(elChildren[1]); 				 						// 1 Description
		elArray.include(elChildren[2]);				 							// 2 Type
		elArray.include(elChildren[3]); 				 						// 3 ID
		elArray.include(el);							 						// 4 Blob image
		if(elChildren[4]){
			elArray.include(elChildren[4]); 				 					// 5 Type Name - used for other items
		}
		//console.log(elArray);
		return elArray;
	},
	setUpSlidingElement: function(el,type){
		switch(type){
			case 'yrview':
				var elMovement = new Array();
				// Open Year Slider
				elMovement[0] = new Fx.Style(el[0], 'width', {duration:600, wait:true });
				// Year Pins / Month Pins / Month Date
				elMovement[1] = new Fx.Styles(el[2].getParent(), {duration:400, wait:false }).set({'opacity':1});
				elMovement[2] = new Fx.Styles(el[3], {duration:400, wait:false }).set({'opacity':0});
				elMovement[3] = new Fx.Styles(el[4], {duration:400, wait:false }).set({'opacity':0});
			break;
			default:
			case 'tgview':
				var elMovement = new Array();
				// Open Year Slider
				elMovement[0] = new Fx.Style(el[0], 'width', {duration:600, wait:true });
				// Year Pins | Month Pins | Month Date | Activities List | Blob Marker Image | Timeline
				elMovement[1] = new Fx.Styles(el[2], {duration:400, wait:false }).set({'opacity':1});
				elMovement[2] = new Fx.Styles(el[3], {duration:400, wait:false }).set({'opacity':0});
				elMovement[3] = new Fx.Styles(el[4], {duration:400, wait:false }).set({'opacity':0});
				elMovement[4] = new Fx.Styles(el[7], {duration:400, wait:false }).set({'opacity':0});
				if(el[6].getFirst()){
					elMovement[5] = new Fx.Styles(el[6].getFirst(), {duration:400, wait:false }).set({'opacity':1});
					elMovement[6] = el[6];
				}
			break;
		}
		return elMovement;
	},
	openSegment: function(el,i){
		var yrSegment = el;
		if(this.mapYrElements){
			this.mapYrElements[i][0].addClass('yropening');
		} else {
			this.mapTgElements[i][0].addClass('yropening');
		}
		yrSegment[1].start({'opacity':[1,0]}).chain(function(el){
			if(yrSegment[5]){
				yrSegment[5].start({'opacity':[1,0]}).chain(function(){
					if(yrSegment[6]){
						yrSegment[6].setStyle('width','515px');
					}
				});
			}

			var ele = $('roadmaplist');
			var elWidth = ele.getStyle('width').replace(/px/,'').toInt();
			this.listwrapper.start(elWidth,(elWidth + 412));
			//ele.setStyle('width',(elWidth + 412) + 'px');
			
			if(this.mapYrElements){
				this.mapYrElements[i][0].addEvent('click',function(){ this.closeSegment(yrSegment,i); this.mapYrElements[i][0].removeEvents(); }.bind(this));
				var parentContainer = this.mapYrElements[i][0].getParent().getParent();
			} else {
				this.mapTgElements[i][0].addEvent('click',function(){ this.closeSegment(yrSegment,i); this.mapTgElements[i][0].removeEvents(); }.bind(this));
				var parentContainer = this.mapTgElements[i][0].getParent().getParent();
			}
			
			if(parentContainer.getNext()){
				var doubleBubble = parentContainer.getNext().getFirst().getFirst().hasClass('yropen');
			} else {
				var doubleBubble = false;
			}
			if(parentContainer.getNext()){
				if(parentContainer.getNext().getNext() && !doubleBubble){ 
					var poleposition = parentContainer.getNext().getNext();
				} else if(parentContainer.getNext()){
					var poleposition = parentContainer.getNext();
				}
			} else {
				var poleposition = parentContainer;
			}
			
			yrSegment[0].start(93,505).chain(function(ele){
				if(this.mapYrElements){
					this.mapYrElements[i][0].removeClass('yropening');
					this.mapYrElements[i][0].addClass('yropen');
				} else {
					this.mapTgElements[i][0].removeClass('yropening');
					this.mapTgElements[i][0].addClass('yropen');
				}
				yrSegment[2].start({'opacity':[0,1]});
				if(yrSegment[4]){
					yrSegment[4].start({'opacity':[0,1]});
				}
				yrSegment[3].start({'opacity':[0,1]}).chain(function(){
					shuffleArray[5].toElement(poleposition);
					if(doubleBubble){
						shuffleArray[5].scrollTo((poleposition.getPosition().x),0);
					}
					startPos = poleposition;
				});
			}.bind(this));
		}.bind(this));
	},
	findActiveBlobs: function(el){
		if(!this.activeMthBlobs.contains(el.getParent())){
			this.activeMthBlobs.include(el.getParent());
		}
		return;
	},
	closeSegment: function(el,i){
		var yrSegment = el;
		yrSegment[2].start({'opacity':[1,0]});
		if(yrSegment[4]){
			yrSegment[4].start({'opacity':[1,0]});
		}
		yrSegment[3].start({'opacity':[1,0]}).chain(function(el){
			if(this.mapYrElements){
				this.mapYrElements[i][0].removeClass('yropen');
				this.mapYrElements[i][0].addClass('yropening');
			} else {
				this.mapTgElements[i][0].removeClass('yropen');
				this.mapTgElements[i][0].addClass('yropening');
			}
			var ele = $('roadmaplist');
			var elWidth = ele.getStyle('width').replace(/px/,'').toInt();
			this.listwrapper.start(elWidth,(elWidth - 412));
			//ele.setStyle('width',(elWidth - 412) + 'px');
			yrSegment[0].start(505,93).chain(function(el){

				yrSegment[1].start({'opacity':[0,1]}).chain(function(el){
					if(yrSegment[5]){
						if(yrSegment[6]){
							yrSegment[6].setStyle('width','103px');
						}
						yrSegment[5].start({'opacity':[0,1]});
					}
					if(this.mapYrElements){
						this.mapYrElements[i][0].removeClass('yropening');
					} else {
						this.mapTgElements[i][0].removeClass('yropening');
					}
					
					if(this.mapYrElements){
						var parentContainer = this.mapYrElements[i][0].getParent().getParent();
					} else {
						var parentContainer = this.mapTgElements[i][0].getParent().getParent();
					}
					
					if(parentContainer.getNext()){
						if(parentContainer.getNext().getNext()){
							var poleposition = parentContainer.getNext().getNext();
						} else if(parentContainer.getNext()){
							var poleposition = parentContainer.getNext();
						}
					} else {
						var poleposition = parentContainer;
					}

					shuffleArray[5].toElement(poleposition);
					startPos = poleposition;
					
				}.bind(this));
			}.bind(this));
		}.bind(this));
	},
	findActiveBlobs: function(el){
		if(!this.activeMthBlobs.contains(el.getParent())){
			this.activeMthBlobs.include(el.getParent());
		}
		return;
	},
	showActiveBlobs: function(el){
		var elContainer = this.getParentHeirachy(el,3);
		if(!elContainer.getParent().hasChild($('yrstartpin')) && !elContainer.getParent().hasChild($('yrendpin'))){
			elContainer.getPrevious().empty();
			var im = new Element('img',{'src':'/images/icon-dot-green.gif','alt':'View items in this year','title':'View items in this year','width':'8','height':'8'}).injectInside(elContainer.getPrevious());
			this.elTgSegmentArray.include(this.getParentHeirachy(elContainer,2));
		}
		return;
	},
	createCountPopup: function(e,i){
		var objLoc = this.mapYrElements[i][2].getPosition([$('roadmaplistcontainer')]);
		var el = $('roadmapmessaging');
		el.empty();
		if(e.client.x <= (window.getWidth()/2)){
			el.addClass('yrcountlft roadmapcountbubble');
			el.setStyles({
				'top': (objLoc.y - 25) + 'px',
				'left': (objLoc.x + 20) + 'px',
				'display':'block'
			});
		} else {
			el.addClass('yrcountrht roadmapcountbubble');
			el.setStyles({
				'top': (objLoc.y - 32) + 'px',
				'left': (objLoc.x - 62) + 'px',
				'display':'block'
			});
		}
		el.setText(this.mapYrElements[i][2].getProperty('alt'));
		
	},
	createStartEndPopups: function(startPin,endPin){
		/*var sPin = new Element('div',{'class':'startendpins yrcountrht roadmapcountbubble'}).setText(startPin.getProperty('alt')).injectAfter($('roadmapmessaging'));
		var ePin = new Element('div',{'class':'startendpins yrcountlft roadmapcountbubble'}).setText(endPin.getProperty('alt')).injectAfter($('roadmapmessaging'));
		var startPinLoc = startPin.getPosition([$('roadmaplistcontainer')]);
		console.log(startPinLoc);
		var endPinLoc = endPin.getPosition([$('roadmaplistcontainer')]);
		console.log(endPinLoc);
		//console.log(((10000 - endPinLoc.x)-));
		sPin.setStyles({
			'top': (startPinLoc.y - 32) + 'px',
			'left': (startPinLoc.x + 40) + 'px',
			'display':'block'
		});
		ePin.setStyles({
			'top': (endPinLoc.y - 32) + 'px',
			'left': (endPinLoc.x - 62) + 'px',
			'display':'block'
		});*/
	},
	createTargetDetailsPopup: function(e,i){
		switch(this.mapMthElements[i][5].toUpperCase()){
			case 'GOVERNMENT TARGET': var colour = 'green'; var type = 'gov'; var icon = 'icon-gov'; break;
			default:
			case 'UKGBC TARGET': var colour = 'green'; var type = ''; var icon = 'icon-ukgbc'; break;
		}
		var objLoc = this.mapMthElements[i][6].getPosition([$('roadmaplistcontainer')]);
		var el = $('roadmapmessaging');
		el.empty();
		if(e.client.x <= (window.getWidth()/2)){
			el.addClass('yrbubble' + type + 'lft roadmapmsgbubble ' + colour);
			el.setStyles({
				'top': (objLoc.y - 17) + 'px',
				'left': (objLoc.x + 0) + 'px',
				'display':'block'
			});
		} else {
			el.addClass('yrbubble' + type + 'rht roadmapmsgbubble ' + colour);
			el.setStyles({
				'top': (objLoc.y - 17) + 'px',
				'left': (objLoc.x - 205) + 'px',
				'display':'block'
			});
		}
		var h = new Element('h2',{'class':icon}).setText(this.mapMthElements[i][5]).injectInside(el);
		var s = new Element('strong').setText(this.mapMthElements[i][0]).injectInside(el);
		var l = new Element('a',{'href':this.mapMthElements[i][2]}).setText('View more info...').injectInside(el);
		l.addEvent('click', function(e){
			this.callRoadmapAjax(this.mapMthElements[i][2],'tgview'); // URL to submit | view to recall ('yrview' or 'tgview')
			startPos = shuffleArray[1];
			$('roadmaptxt').setHTML(this.mapMthElements[i][0]);
			this.closePopup();
			e = new Event(e).stop();
		}.bind(this));
		el.addEvent('mouseleave', function(e){ this.closePopup(); this.updatePinImg(this.mapMthElements[i][6]); }.bind(this));
	},
	createBlobPopup: function(e,i){
		switch(this.mapMthBlobElements[i][2].toUpperCase()){
			case 'STAGE': var colour = 'orange'; var icon = 'icon-ukgbc'; var itemTitle = 'Key Date'; var URL = '/site/roadmap/get-single-stage?stage_id=' + this.mapMthBlobElements[i][3]; var itemSrc = ''; break;
			case 'EVENT': var colour = 'green'; var icon = 'icon-ukgbc'; var itemTitle = 'UKGBC Event'; var URL = '/site/roadmap/get-single-event?event_id=' + this.mapMthBlobElements[i][3]; var itemSrc = '/site/event/show-event-details?id=' + this.mapMthBlobElements[i][3]; break;
			case 'RESOURCE': var colour = 'pink'; var icon = 'icon-ukgbc'; var itemTitle = 'UKGBC Resource'; var URL = '/site/roadmap/get-single-resource?resource_id=' + this.mapMthBlobElements[i][3]; var itemSrc = '/site/resources/show-resource-details?id=' + this.mapMthBlobElements[i][3]; break;
			case 'OTHER': 
				var colour = 'red';
				var icon = 'icon-ukgbc';
				var itemTitle = this.mapMthBlobElements[i][5];
				if(itemTitle.match('TASK GROUP')){
					var itemSrc = '/site/taskgroups/info?id=' + this.mapMthBlobElements[i][3];
					var URL = '/site/roadmap/get-single-other?other_id=' + this.mapMthBlobElements[i][3];
				} else {
					var itemSrc = '';
					var URL = '/site/roadmap/get-single-other?other_id=' + this.mapMthBlobElements[i][3];
				}
			break;
			default:
		}
		
		var objLoc = this.mapMthBlobElements[i][4].getPosition([$('roadmaplistcontainer')]);
		var el = $('roadmapmessaging');
		el.empty();
		if(e.clientX <= (window.getWidth()/2)){
			el.addClass('blob' + colour + 'bubblerht roadmapmsgbubble ' + colour);
			el.setStyles({
				'top': (objLoc.y - 125) + 'px',
				'left': (objLoc.x - 8) + 'px',
				'display':'block'
			});
		} else {
			el.addClass('blob' + colour + 'bubblelft roadmapmsgbubble ' + colour);
			el.setStyles({
				'top': (objLoc.y - 125) + 'px',
				'left': (objLoc.x - 230) + 'px',
				'display':'block'
			});
		}
		var h = new Element('h2',{'class':icon}).setText(itemTitle).injectInside(el);
		var s = new Element('strong').setText(this.mapMthBlobElements[i][0]).injectInside(el);
		var l = new Element('a',{'href':itemSrc}).setText('More info...').injectInside(el);
		l.addEvent('click', function(e){
			this.callPopupAjax(URL, colour); // URL to submit
			this.closePopup();
			e = new Event(e).stop();
		}.bind(this));
		el.addEvent('mouseleave', function(e){ this.closePopup(); }.bind(this));
	},
	getParentHeirachy: function(el,loop){
		for(i=1;i<=loop;i++){
			el = el.getParent();
		}
		return el;
	},
	updatePinImg: function(el){
		var src = el.getProperty('src');
		if(src.match('grn')){
			el.setProperty('src',src.replace(/grn/,'drk'));
		} else {
			el.setProperty('src',src.replace(/drk/,'grn'));
		}
	},
	closePopup: function(){
		var el = $('roadmapmessaging');
		el.setStyle('display','none');
		el.removeEvents('mouseleave');
		el.empty('');
		el.className = '';
	},
	callRoadmapAjax: function(URL,roadmapView){
		new retrieveRoadmapContent('reload',roadmapView,URL);
	},
	callPopupAjax: function(URL,colour){
		var el = $('roadmapmessaging')
		el.empty();
		el.addClass('roadmaploadingnow');
		var txt = new Element('div',{'class':'filtermsg'}).setHTML('<strong>Loading...</strong>').injectInside(el);
		var scope = this;
		var refreshRoadmapPopupAjaxRequest = new Ajax(URL, {
			method: 'get',
			onComplete: function(response){
				el.empty();
				el.removeClass('roadmaploadingnow');
				var cb = new Element('img',{'src':'/images/btn-exit.gif','class':'closeimg','alt':'Close details'}).injectInside(el);
				cb.addEvents({
					'click': function(e){
						scope.closePopup();
					}
				});
				var sc = new Element('div',{'class':'moreinfoscroller'}).setHTML(response).injectInside(el);
				el.addClass('roadmappopup ' + colour);
				var objLoc = $('roadmapnew').getCoordinates();
				el.setStyles({
					'top': (objLoc.top + 40) + 'px',
					'left': (objLoc.left + 105) + 'px',
					'display':'block'
				});
			}
		});
		refreshRoadmapPopupAjaxRequest.request();
	}
});