//Jquery should already be loaded.
			//Just because IE incase the console doesn't exist (LTE IE9).
			var console = console ? console : {
				log: function () {},
				info: function () {}, 
				warn: function () {}, 
				error: function () {} 
			};
			jQuery(function () {
				//WARNING: THIS METHOD WILL NOT WORK IF YOU UPGRADE JQUERY TOO FAR
				//if( jQuery.browser.msie || ( jQuery.browser.version=='11.0' && jQuery.browser.mozilla )/* IE 11 is weird and reporting mozilla flag?.*/ ){
				if( window.document.documentMode ) {
					console.warn('Using Internet Explorer!');
					jQuery('#play-slider-1').on('change', function () {
						//console.log('Changed slider 1');
						navi_helper.pause_images(1);
						navi_helper.go_to_picture(1, jQuery(this).val() );
					});
					jQuery('#play-slider-2').on('change', function () {
						//console.log('Changed slider 2');
						navi_helper.pause_images(2);
						navi_helper.go_to_picture(2, jQuery(this).val() );
					});
				}else {
					jQuery('#play-slider-1').on('input', function () {
						//console.log('Changed slider 1');
						navi_helper.pause_images(1);
						navi_helper.go_to_picture(1, jQuery(this).val() );
					});
					jQuery('#play-slider-2').on('input', function () {
						//console.log('Changed slider 2');
						navi_helper.pause_images(2);
						navi_helper.go_to_picture(2, jQuery(this).val() );
					});
				}
			});
			var navi_helper = {
				current_page:0,
				min_page:0,
				max_page:12,
				contentSets:{
					//index: content set
					0:0,
					
					1:1,
					2:1,
					3:2,
					4:2,
					5:3,
					6:4,
					7:4,
					8:5,
					9:5,
					10:6,
					11:6,
					12:6,
				},
				picRotName: '{0}map.jpg', //use replace{} 
				supportsTouch: (typeof Touch == "object"),
				contentSetInfo:{
					1: {
						1:'The speed that the wind moves across a glacier impacts the air temperature at the surface of the glacier and where the snow does or does not gather. The greater the wind speed, typically the less snow deposited on the glacier surface.',
						2:'When the air temperature is above freezing, snow and ice will begin to melt.',
						3:'Air temperature is related to elevation, which is measured by how far a location is above sea level.  The higher the elevation, the colder the air. Tall mountains - with high elevations - usually have more days of below-freezing temperatures.',
						4:'A glacier grows when new snow accumulates over time.  New snow must fall each winter to offset the amount that melts during summer.  if the amount that melts is more than the amount of new snow that falls, the glacier shrinks.',
						5:'When the air temperature is above freezing, the precipitation falls as rain rather than snow, which can actually cause the glacier to melt faster.',
						6:'When there is a lot of dust in the air and it settles onto a glacier, the dark color of the dust absorbs more energy from the sun than the white ice/snow. This heat energy then melts the surrounding ice/snow.',
						7:'Carbon dioxide is a greenhouse gas, meaning that once in the atmosphere it traps heat in our atmosphere instead of letting the heat transfer to space. Carbon dioxide is naturally found in the atmosphere in very small quantities and helps regulate the Earth\'s temperature. As the amount of carbon dioxide in the atmosphere increases due to human activities, more heat is trapped and the air temperature rises.',
						8:'In locations with glaciers, winter is a typically cold season with weather conditions that lead to snow and ice formation. The longer the winter, the more time for cold temperatures and the build-up of snow and ice. The shorter the winter, the less time for these conditions.',
					},		
					2: {
						9: '<p style="margin:0;text-align:right;"><img src="https://polar-ice.org/wp-content/uploads/2017/12/closing1.png" style="background-color:transparent;cursor:pointer;max-width:20px;" /></p><img src="https://polar-ice.org/wp-content/uploads/2017/12/Lihir_Group_Landsat.jpg" style="float:left;padding:1em;max-width:20%;background-color: transparent;"/>Landsat satellites take pictures of the Earth as they orbit our planet, regardless of the weather. This produces great images of the Earth below, when it is a clear day. If there are clouds between the satellite and the ground, then the image will be of the clouds not the Earth’s surface. The more clouds there are in an area, that more challenging it can be to capture good images of the complete images of features on the Earth.',
						10: '<p style="margin:0;text-align:right;"><img src="https://polar-ice.org/wp-content/uploads/2017/12/closing1.png" style="background-color:transparent;cursor:pointer;max-width:20px;" /></p><p style="color:white;font-size: small;">Although we often thinking of glaciers shrinking or falling apart as an iconic image of the impacts of climate change, it can be hard to know that global climate change is causing the changes in glaciers. That is until recently...</p><p style="color:white;font-size: small;">In December 2016, Gerard H. Roe, Marcia B. Baker and Florian Herla <a href="https://www.nature.com/articles/ngeo2863" target="_blank">published their research</a> in Nature: Geosciences looking at 37 glaciers from around the world. They used numerical modeling and statistics, with a combination of direct measurement observations and theory, to ask the question: is anthropogenic climate change causing glaciers to retreat (aka get smaller). The answer overwhelming is yes!</p><p style="color:white;font-size: small;"> For all 37 glaciers that they looked at, the same overall pattern emerges: changes in the length of the glacier can be explained by climate change. </p>'
					},
					5: {
						11:'<p style="margin:0;text-align:right;"><img src="https://polar-ice.org/wp-content/uploads/2017/12/closing1.png" style="background-color:transparent;cursor:pointer;max-width:20px;" /></p><p style="color:white;font-size:small;">Carbon dioxide mixes throughout the atmosphere all over our globe, regardless of where it entered the atmosphere. Because of this natural mixing, we can use the long-term measurements taken at the Mauna Loa Laboratory in Hawaii as a great example what of is going on everywhere in the atmosphere.</p><p style="color:white;font-size:small;">Scientists actually calculate the global trend of the amount of carbon dioxide in the atmosphere using data from hundreds of instruments from around the world and compare the trend taken from the ground observations to data taken from satellites. This calculated global trend is almost exactly the same as the trend at Mauna Loa. Therefore, scientists are confident that you can use the data from Mauna Loa as a good &ldquo;<a href="https://youtu.be/vBU14vy9mEg" target="_blank">proxy</a>&rdquo; of what is going on everywhere.</p><p style="color:white;font-size:small;">Check out this great <a href="https://youtu.be/rEbE5fcnFVs" target="_blank">animation</a> from the Scripps Institution of Oceanography at UC San Diego of the Keeling Curve.</p>',
						12:'<p style="margin:0;text-align:right;"><img src="https://polar-ice.org/wp-content/uploads/2017/12/closing1.png" style="background-color:transparent;cursor:pointer;max-width:20px;" /></p><p style="color:white;font-size:small;">The relationship between greenhouse gases (like carbon dioxide, methane, water vapor, etc.) in the atmosphere and air temperature is complex. While there are many things that impact air temperature on our planet, the great benefit of greenhouse gases is that they absorb some heat energy before it leaves our Earth’s system and enters space. The more greenhouse gases in the atmosphere, the more heat energy they can &ldquo;trap,&rdquo; and thus the warmer the air temperature on Earth becomes.</p>'
					},
					6:{
						13:'<p style="margin:0;text-align:right;"><img src="https://polar-ice.org/wp-content/uploads/2017/12/closing1.png" style="background-color:transparent;cursor:pointer;max-width:20px;" /></p><img src="https://polar-ice.org/wp-content/uploads/2017/12/Rutgers_Stadium.jpg" style="float:left;padding:1em;max-width:33%;background-color: transparent;"/>(Photo Credit: <a href="https://commons.wikimedia.org/wiki/File:Rutgers_Stadium.jpg" target="_blank">Ruman Fuchs</a>) 9,186 feet is long! You would need to put 25.6 football fields end-to-end to reach that distance. It is also just under a 3K road race.'
					}
				},	
				fps: 3, //show two frames every second. (1000 ms/#)
				my_timer: {
					1: null,
					2: null
				},
				dynamic_images:{ //You'll need to update if you want dynamic year and month. Currently hardcoded into feb 2015
				},
				//This module is for pictures only. (e.g. slide 4)
				pictureModule: {
					myFPS:1.5, //a picture will be shown ever ( 1000 / myFPS ) ms 
					picturePointer: {
						//index is content set
						2: {
							imgID:'#set-2-dynamo-image',
							sliderID:'#graph-slider-set-2',
							imgSet:[
								'1972','1973'
								,'1985','1986','1988','1989'
								,'1990','1991','1999'
								,'2000','2001','2003','2004','2005','2006','2007','2009'
								,'2011','2014','2015'
							],
							currentPointer:0,
							syncToGraph: false,
						},
						3: {
							imgID:'#set-3-dynamo-image',
							sliderID:'#graph-slider-set-3',
							imgSet:[
								'1972','1973'
								,'1985','1986','1988','1989'
								,'1990','1991','1999'
								,'2000','2001','2003','2004','2005','2006','2007','2009'
								,'2011','2014','2015'
							],
							currentPointer:0,
							syncToGraph: true,
						},
					},
					pictureTimer: {
						//Slide number
						2: null,
						3: null,
					},
					resetImg: function (setNum){
						this.picturePointer[setNum].currentPointer = 0;
						var newSrc = navi_helper.picRotName.replace('{0}', this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer] );
						jQuery(this.picturePointer[setNum].imgID).prop({
							src: 'https://polar-ice.org/wp-content/uploads/2017/12/' + newSrc
						});
						jQuery(this.picturePointer[setNum].imgID+'-title').text(
							this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer]
						);
					},
					stopAll: function () {
						for(var i in this.pictureTimer) {
							if(this.pictureTimer[i]){
								this.pause(i);	
							}
							this.resetImg(i);
							/*if( this.picturePointer[i].syncToGraph ) {
								this.synchronizeGraph(i);
							}*/
						}
						return true;
					},
					play: function ( setNum ) {
						console.log('[Set: '+ setNum +'] Play');
						//let's stop whatever is going on
						this.pause(setNum);	
						if( this.pictureTimer[setNum] ) {
							console.log('Already playing...');
							return true;
						}
						this.pictureTimer[setNum] = setInterval( function () {
							//Make sure this works on other browsers.
							navi_helper.pictureModule.picturePointer[setNum].currentPointer++;
							if (
								navi_helper.pictureModule.picturePointer[setNum].currentPointer > navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1
							) { 
								//If we go over to the next one, we'll stop here.
								navi_helper.pictureModule.picturePointer[setNum].currentPointer = navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1;
								navi_helper.pictureModule.pause(setNum);
								return true;
							}
							var newSrc = navi_helper.picRotName.replace('{0}', navi_helper.pictureModule.picturePointer[setNum].imgSet[navi_helper.pictureModule.picturePointer[setNum].currentPointer] );
							jQuery(navi_helper.pictureModule.picturePointer[setNum].imgID).prop({
								src: 'https://polar-ice.org/wp-content/uploads/2017/12/' + newSrc
							});
							jQuery(navi_helper.pictureModule.picturePointer[setNum].imgID+'-title').text(
								navi_helper.pictureModule.picturePointer[setNum].imgSet[navi_helper.pictureModule.picturePointer[setNum].currentPointer]
							);
							jQuery(navi_helper.pictureModule.picturePointer[setNum].sliderID).val(navi_helper.pictureModule.picturePointer[setNum].currentPointer);
							if( navi_helper.pictureModule.picturePointer[setNum].syncToGraph ) {
								navi_helper.pictureModule.synchronizeGraph(setNum);
							}
						}, (1000 / this.myFPS));
						//Let's now refresh
					},
					pause: function (setNum) {
						console.log('[Set: '+ setNum +'] Pause');
						if( !this.pictureTimer[setNum] ) {
							console.log('Already paused or stopped...');
						}
						clearInterval(this.pictureTimer[setNum]);
						this.pictureTimer[setNum]=null;
						/*
						if( this.pictureTimer[page_num] ) {
							clearInterval(this.pictureTimer[page_num]);
							this.pictureTimer[page_num]=null;
						}
						*/
					},
					sliderGoTo: function (setNum, value) {
						console.log('[Set: '+ setNum +'] Slider Value: {'+value+'}');
						this.pause(setNum);
						navi_helper.pictureModule.picturePointer[setNum].currentPointer = value;
						if (
							navi_helper.pictureModule.picturePointer[setNum].currentPointer > navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1
						) { 
							//stop here.
							navi_helper.pictureModule.picturePointer[setNum].currentPointer = navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1;
							return true;
							//navi_helper.pictureModule.picturePointer[setNum].currentPointer = 0;
						}else if (
								navi_helper.pictureModule.picturePointer[setNum].currentPointer < 0
						) { 
							navi_helper.pictureModule.picturePointer[setNum].currentPointer = 0;
							return true;
							//navi_helper.pictureModule.picturePointer[setNum].currentPointer = navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1;
						}
						jQuery(navi_helper.pictureModule.picturePointer[setNum].sliderID).val(navi_helper.pictureModule.picturePointer[setNum].currentPointer);
						var newSrc = navi_helper.picRotName.replace('{0}', this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer] );
						jQuery(this.picturePointer[setNum].imgID).prop({
							src: 'https://polar-ice.org/wp-content/uploads/2017/12/' + newSrc
						});
						jQuery(this.picturePointer[setNum].imgID+'-title').text(
							this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer]
						);
						if( navi_helper.pictureModule.picturePointer[setNum].syncToGraph ) {
							navi_helper.pictureModule.synchronizeGraph(setNum);
						}
					},
					step: function (setNum, stepUp) {
						console.log('[Set: '+ setNum +'] Step: {'+(stepUp ? 'Up' : 'Back')+'}');
						this.pause(setNum);
						if( stepUp ){
							//Next year
							navi_helper.pictureModule.picturePointer[setNum].currentPointer++;
							if (
								navi_helper.pictureModule.picturePointer[setNum].currentPointer > navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1
							) { 
								//stop here.
								navi_helper.pictureModule.picturePointer[setNum].currentPointer = navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1;
								return true;
								//navi_helper.pictureModule.picturePointer[setNum].currentPointer = 0;
							}
						}else{
							//previous year
							navi_helper.pictureModule.picturePointer[setNum].currentPointer--;
							if (
								navi_helper.pictureModule.picturePointer[setNum].currentPointer < 0
							) { 
								navi_helper.pictureModule.picturePointer[setNum].currentPointer = 0;
								return true;
								//navi_helper.pictureModule.picturePointer[setNum].currentPointer = navi_helper.pictureModule.picturePointer[setNum].imgSet.length-1;
							}
						}
						jQuery(navi_helper.pictureModule.picturePointer[setNum].sliderID).val(navi_helper.pictureModule.picturePointer[setNum].currentPointer);
						var newSrc = navi_helper.picRotName.replace('{0}', this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer] );
						jQuery(this.picturePointer[setNum].imgID).prop({
							src: 'https://polar-ice.org/wp-content/uploads/2017/12/' + newSrc
						});
						jQuery(this.picturePointer[setNum].imgID+'-title').text(
							this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer]
						);
						if( navi_helper.pictureModule.picturePointer[setNum].syncToGraph ) {
							navi_helper.pictureModule.synchronizeGraph(setNum);
						}
						return true;
					},
					synchronizeGraph: function (setNum) {
						//alert(setNum);
						if( setNum == 1 || setNum == 2 || setNum == 4 || setNum == 5 ) {
							console.log('[synchronizeGraph] No graphs to synchronize in this set ('+ navi_helper.contentSets[navi_helper.current_page] +').')
						}else if( setNum == 3 ) {
							console.log('[synchronizeGraph] Synchronizing Graph to Picture Set 3');
							if( !navi_helper.chartModule.chart ) {
								console.log('Chart not initialized yet, leaving function.');
								return true;
							}
							//We can just set the data to what we have.
							var findYear = this.picturePointer[setNum].imgSet[this.picturePointer[setNum].currentPointer];
							for(var i=0;i<navi_helper.chartModule.seriesSets['chart-1'].length;i++){
								if( navi_helper.chartModule.seriesSets['chart-1'][i][0] == findYear ) {
									//console.log('Year found');
									navi_helper.chartModule.chart.series[0].setData( 
										navi_helper.chartModule.seriesSets['chart-1'].slice(0, i+1) 
									);
									//console.log(navi_helper.chartModule.seriesSets[3]['chart-1'].slice(0, i+1) )
								}
							}
							jQuery('#set-3-year-label').text(findYear);
						}
						return true;
					},
				},
				initializeButtons: function () {
					jQuery('button','.button-panel').on('click', function () {
						if( jQuery(this).data('action-for') == "picture" ) {
							switch(jQuery(this).data('action')) {
								case 'step-back':
									navi_helper.pictureModule.step( jQuery(this).data('pic-set'), false );
									break;
								case 'play':
									navi_helper.pictureModule.play( jQuery(this).data('pic-set') );
									break;
								case 'pause':
									navi_helper.pictureModule.pause( jQuery(this).data('pic-set') );
									break;
								case 'step-up':
									navi_helper.pictureModule.step( jQuery(this).data('pic-set'), true );
									break;
								default:
									break;
							}
						}else if( jQuery(this).data('action-for') == "graph" ) {
							switch(jQuery(this).data('action')) {
								case 'step-back':
									navi_helper.chartModule.step( jQuery(this).data('pic-set'), false );
									break;
								case 'play':
									navi_helper.chartModule.play( jQuery(this).data('pic-set') );
									break;
								case 'pause':
									navi_helper.chartModule.pause( jQuery(this).data('pic-set') );
									break;
								case 'step-up':
									navi_helper.chartModule.step( jQuery(this).data('pic-set'), true );
									break;
								default:
									break;
							}
						}
					});
					jQuery('input[type="range"]','.slider-panel').on('input', function () {
			//jQuery(this).data('set')
						if( jQuery(this).data('action-for') == "picture" ) {
							//console.log('Debug #graph-slider-set-4 ON INPUT: `'+jQuery(this).val()+'`')
							navi_helper.pictureModule.sliderGoTo(jQuery(this).data('set'), jQuery(this).val() );
						}else if( jQuery(this).data('action-for') == "graph" ) {
							//console.log('Debug #graph-slider-set-4 ON INPUT: `'+jQuery(this).val()+'`')
							navi_helper.chartModule.sliderGoTo(jQuery(this).data('set'), jQuery(this).val() );
						}
					});
					/*
					jQuery('#graph-slider-set-4').on('change', function () {
						console.log('Debug #graph-slider-set-4 ON CHANGE: `'+jQuery(this).val()+'`')
					});
					jQuery('#graph-slider-set-4').on('input', function () {
						console.log('Debug #graph-slider-set-4 ON INPUT: `'+jQuery(this).val()+'`')
					});
					*/
					return true;
				},
				chartModule: {
					chart: null,
					subcharts: {
						1: null,
						2: null,
						3: null
					},
					seriesSets:{
						'chart-1': [],
						'chart-2': [],
						'chart-3': []
					}, 
					initializeGraphs: function () {
						console.log('[Chart Module]: Initalizing Graphs')
						Highcharts.setOptions({global: { useUTC: true } });
						this.seriesSets['chart-1'] = [
							[1970,null], [1971,null], [1972,7055.566], [1973,7021.614], [1974,null], [1975,null], [1976,null], [1977,null], [1978,null], [1979,null], [1980,null], [1981,null], [1982,null], [1983,null], [1984,null], [1985,6872.962], [1986,6816.155], [1987,null], [1988,6798.889], [1989,6772.039], [1990,6726.988], [1991,6714.106], [1992,null], [1993,null], [1994,null], [1995,null], [1996,null], [1997,null], [1998,null], [1999,6417.728], [2000,6370.623], [2001,6307.417], [2002,null], [2003,6252.468], [2004,6252.146], [2005,6066.854], [2006,6053.859], [2007,6032.412], [2008,null], [2009,5899.601], [2010,null], [2011,5747.249], [2012,null], [2013,null], [2014,5574.717], [2015,5400.459] 
						];
						this.seriesSets['chart-2'] = [
							[1970,8.1], [1971,8.5], [1972,7.2], [1973,9.2], [1974,6.8], [1975,8.6], [1976,8], [1977,7.7], [1978,7.5], [1979,7.9], [1980,8.1], [1981,8.6], [1982,10], [1983,9.5], [1984,7.6], [1985,9.2], [1986,9.4], [1987,8.4], [1988,9.1], [1989,7.2], [1990,8.9], [1991,8.7], [1992,9.9], [1993,9.2], [1994,8.5], [1995,8.4], [1996,8.3], [1997,9.2], [1998,9.5], [1999,9.6], [2000,9.6], [2001,9], [2002,9.2], [2003,11.1], [2004,8.8], [2005,9.2], [2006,9.9], [2007,9.3], [2008,9.6], [2009,10.4]
						];
						this.seriesSets['chart-3'] = [
							[1970,328.44], [1971,329.91], [1972,331.1066667], [1973,332.56], [1974,333.2033333], [1975,334.5366667], [1976,336.0566667], [1977,337.81], [1978,334.54], [1979,330.9833333], [1980,339.4766667], [1981,340.5866667], [1982,342.0666667], [1983,344.03], [1984,345.35], [1985,346.7066667], [1986,348.0566667], [1987,349.9066667], [1988,352.27], [1989,353.7233333], [1990,354.73], [1991,356.0566667], [1992,357.0933333], [1993,357.4966667], [1994,359.2166667], [1995,361.3166667], [1996,363.2833333], [1997,364.05], [1998,367.5866667], [1999,368.8833333], [2000,369.8966667], [2001,371.4433333], [2002,373.7933333], [2003,376.4533333], [2004,377.7233333], [2005,380.5666667], [2006,382.3066667], [2007,384.1966667], [2008,386.0666667], [2009,387.8733333], [2010,390.2333333], [2011,392.1233333], [2012,394.1533333], [2013,397.0433333], [2014,399.1266667], [2015,401.0133333]
						];
					},
					clearChartData: function () {
						//console.log(this.my_chart);
						while(this.my_chart.series.length > 0) {
							this.my_chart.series[0].remove(true);
						}
					},
					clickEnabled:false,
					chartClickEvent: function ( event ) {
					},
					myFPS:1.5, //a picture will be shown ever ( 1000 / myFPS ) ms 
					chartPointer: {
						//index is content set
						4: {
							imgID:'#set-4-dynamo-image',
							labelID:'#set-4-year-label',
							sliderID:'#graph-slider-set-4',
							useChart:'chart-2',
							min:1970,
							max:2009,
							currentPointer:1970,
							syncToPic: false,
							syncToSubchart: true,
							subchartDetails: [{
								subchart:'1',
								useSubchart:'chart-1'
							}]
							/*syncToPic: true,
							syncToSubchart: false,
							*/
						},
						5: {
							imgID:null,
							labelID:'#set-5-year-label',
							sliderID:'#graph-slider-set-5',
							useChart:'chart-3',
							min:1970,
							max:2015,
							currentPointer:1970,
							syncToPic: false,
							syncToSubchart: true,
							subchartDetails: [{
								subchart:'1',
								useSubchart:'chart-2'
							}]
						},
						6: {
							imgID:'#set-6-dynamo-image',
							labelID:'#set-6-year-label',
							sliderID:'#graph-slider-set-6',
							useChart:'chart-3',
							min:1970,
							max:2015,
							currentPointer:1970,
							syncToPic: true,
							syncToSubchart: true,
							subchartDetails: [{
								subchart:'1',
								useSubchart:'chart-1'
							},{
								subchart:'2',
								useSubchart:'chart-2'
							}]
						},
					},
					imgBreakPoints:[
						{min:0,max:1972, img:'1972'},
						{min:1973,max:1984, img:'1973'},
						{min:1985,max:1985, img:'1985'},
						{min:1986,max:1987, img:'1986'},
						{min:1988,max:1988, img:'1988'},
						{min:1989,max:1989, img:'1989'},
						{min:1990,max:1990, img:'1990'},
						{min:1991,max:1998, img:'1991'},
						{min:1999,max:1999, img:'1999'},
						{min:2000,max:2000, img:'2000'},
						{min:2001,max:2002, img:'2001'},
						{min:2003,max:2003, img:'2003'},
						{min:2004,max:2004, img:'2004'},
						{min:2005,max:2005, img:'2005'},
						{min:2006,max:2006, img:'2006'},
						{min:2007,max:2008, img:'2007'},
						{min:2009,max:2010, img:'2009'},
						{min:2011,max:2013, img:'2011'},
						{min:2014,max:2014, img:'2014'},
						{min:2015,max:2025, img:'2015'},
					],
					chartTimer: {
						//Set number
						4: null,
						5: null,
					},
					stopAll: function () {
						for(var i in this.chartTimer) {
							if(this.chartTimer[i]){
								this.pause(i);	
							}
							this.resetImg(i);
							/*if( this.picturePointer[i].syncToGraph ) {
								this.synchronizeGraph(i);
							}*/
						}
						return true;
					},
					resetImg: function (setNum){
						this.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
						if(this.chartPointer[setNum].syncToPic){
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID+'-title').text(
								this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer)
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID).prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/'+ this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer) +'map.jpg'
							});
						}
					},
					findImgBreakpoint: function (myYear){
						var i=0;
						//console.log('findImgBreakpoint: `'+ myYear +'`');
						for(i;i<this.imgBreakPoints.length;i++){
							//console.log('Looking for: `'+ myYear +'` Between `'+ this.imgBreakPoints[i].min +'` and `'+ this.imgBreakPoints[i].max +'`');
							if ( this.imgBreakPoints[i].min <= myYear && myYear <= this.imgBreakPoints[i].max ) {
								//console.log('Found `'+this.imgBreakPoints[i].img+'`');
								return 	this.imgBreakPoints[i].img;
							}
						}
						return '';
					},
					synchronizePicture: function (setNum){
						if( 
							setNum == 1 ||
							setNum == 2 ||
							setNum == 3 
						) {
							console.log('[synchronizePicture] No pictures to synchronize in this set ('+ navi_helper.contentSets[navi_helper.current_page] +').')
						}else if( setNum == 4 ) {
							//console.log('Synchronize Picture');
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID+'-title').text(
								this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer)
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID).prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/'+ this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer) +'map.jpg'
							});
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						}else if( setNum == 6 ) {
							//console.log('Synchronize Picture');
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID+'-title').text(
								this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer)
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].imgID).prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/'+ this.findImgBreakpoint(navi_helper.chartModule.chartPointer[setNum].currentPointer) +'map.jpg'
							});
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						}
					},
					synchronizeSubchart: function (setNum){
						if( 
							setNum == 1 ||
							setNum == 2 ||
							setNum == 3 
							//|| setNum == 4 
						) {
							console.log('[synchronizeSubchart] No subcharts for this set ('+ navi_helper.contentSets[navi_helper.current_page] +').')
						}else if( setNum == 4 ) {
							//console.log('Synchronize Subchart');
							var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
							navi_helper.chartModule.subcharts['1'].series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].subchartDetails[0].useSubchart].slice(0, translateI+1) 
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						}else if( setNum == 5 ) {
							//console.log('Synchronize Subchart');
							var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
							navi_helper.chartModule.subcharts['1'].series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].subchartDetails[0].useSubchart].slice(0, translateI+1) 
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						}else if ( setNum == 6 ){
							//Have to syncho the other two charts.
							//console.log('Synchronize Subchart Set 6: Special: two charts.');
							var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
							navi_helper.chartModule.subcharts['1'].series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].subchartDetails[1].useSubchart].slice(0, translateI+1) 
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
							//synchronize glacier length
							var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
							navi_helper.chartModule.subcharts['2'].series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].subchartDetails[0].useSubchart].slice(0, translateI+1) 
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].labelID).text(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						}
					},
					play: function ( setNum ) {
						console.log('[Set: '+ setNum +'] Play');
						//let's stop whatever is going on
						this.pause(setNum);	
						if( this.chartTimer[setNum] ) {
							console.log('Already playing...');
							return true;
						}
						this.chartTimer[setNum] = setInterval( function () {
							//console.log( navi_helper.chartModule.chartPointer[setNum]);
							//console.log(navi_helper.chartModule.chartPointer[setNum].currentPointer);
							navi_helper.chartModule.chartPointer[setNum].currentPointer++;
							if (
								navi_helper.chartModule.chartPointer[setNum].currentPointer > navi_helper.chartModule.chartPointer[setNum].max
							) { 
								navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].max;
								navi_helper.chartModule.pause(setNum);
								return true;
							}
							var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
							navi_helper.chartModule.chart.series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].useChart].slice(0, translateI+1) 
							);
							jQuery(navi_helper.chartModule.chartPointer[setNum].sliderID).val(navi_helper.chartModule.chartPointer[setNum].currentPointer);
							if( navi_helper.chartModule.chartPointer[setNum].syncToPic ) {
								navi_helper.chartModule.synchronizePicture(setNum);
							}
							if( navi_helper.chartModule.chartPointer[setNum].syncToSubchart ) {
								navi_helper.chartModule.synchronizeSubchart(setNum);
							}
						}, (1000 / this.myFPS));
						//Let's now refresh
					},
					pause: function (setNum) {
						console.log('[Set: '+ setNum +'] Pause');
						if( !this.chartTimer[setNum] ) {
							console.log('Already paused or stopped...');
						}
						clearInterval(this.chartTimer[setNum]);
						this.chartTimer[setNum]=null;
					},
					sliderGoTo: function (setNum, value) {
						console.log('[Set: '+ setNum +'] Slider Value: {'+value+'}');
						navi_helper.chartModule.pause(setNum);
						navi_helper.chartModule.chartPointer[setNum].currentPointer = value;
						if (
								navi_helper.chartModule.chartPointer[setNum].currentPointer > navi_helper.chartModule.chartPointer[setNum].max
						) { 
							navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].max;
							return true;
						}else if (
								navi_helper.chartModule.chartPointer[setNum].currentPointer < navi_helper.chartModule.chartPointer[setNum].min
						) { 
							navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
							return true;
						}
						var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
						navi_helper.chartModule.chart.series[0].setData( 
							navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].useChart].slice(0, translateI+1) 
						);
						//jQuery().val(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						if( navi_helper.chartModule.chartPointer[setNum].syncToPic ) {
							navi_helper.chartModule.synchronizePicture(setNum);
						}
						if( navi_helper.chartModule.chartPointer[setNum].syncToSubchart ) {
							navi_helper.chartModule.synchronizeSubchart(setNum);
						}
					},
					step: function (setNum, stepUp) {
						console.log('[Set: '+ setNum +'] Step: {'+(stepUp ? 'Up' : 'Back')+'}');
						this.pause(setNum);
						if( stepUp ){
							//Next year
							navi_helper.chartModule.chartPointer[setNum].currentPointer++;
							if (
								navi_helper.chartModule.chartPointer[setNum].currentPointer > navi_helper.chartModule.chartPointer[setNum].max
							) { 
								navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].max;
								return true;
							}
						}else{
							//previous year
							navi_helper.chartModule.chartPointer[setNum].currentPointer--;
							if (
								navi_helper.chartModule.chartPointer[setNum].currentPointer < navi_helper.chartModule.chartPointer[setNum].min
							) { 
								navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
								return true;
							}
						}
						var translateI = navi_helper.chartModule.chartPointer[setNum].currentPointer - navi_helper.chartModule.chartPointer[setNum].min;
						navi_helper.chartModule.chart.series[0].setData( 
							navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].useChart].slice(0, translateI+1) 
						);
						jQuery(navi_helper.chartModule.chartPointer[setNum].sliderID).val(navi_helper.chartModule.chartPointer[setNum].currentPointer);
						if( navi_helper.chartModule.chartPointer[setNum].syncToPic ) {
							navi_helper.chartModule.synchronizePicture(setNum);
						}
						if( navi_helper.chartModule.chartPointer[setNum].syncToSubchart ) {
							navi_helper.chartModule.synchronizeSubchart(setNum);
						}
						return true;
					},
					updateGraphState: function ( setNum ) {
						if(
								setNum == 1 ||
								setNum == 2 
						){
							console.log('[updateGraphState] No graphs in this set ('+ navi_helper.contentSets[navi_helper.current_page] +').');
							return true;
						}else if( setNum == 3 ){
							//Load graph for SUmmer Glacier Length
							console.log('[updateGraphState] Preparing Summer Glacier Graph.');
							if(this.chart){
								this.chart.destroy();
								this.chart=null;
							}
							if(this.subcharts['1']){
								this.subcharts['1'].destroy();
								this.subcharts['1']=null;
							}
							if(this.subcharts['2']){
								this.subcharts['2'].destroy();
								this.subcharts['2']=null;
							}
							if(this.subcharts['3']){
								this.subcharts['3'].destroy();
								this.subcharts['3']=null;
							}
						    this.chart = Highcharts.chart('set-3-chart', {
						        chart: {
						        	id:'set3',
						            type: 'spline',
									spacingRight: 10,
						        },
						        plotOptions:{},
						        title: {
						            text: 'Summer Glacier Length Over Time (1970 - 2015) Hintereisferner, Alps'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Year of Summer Measurement"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Glacier Length (m)'
						            },
									labels:{
									},
									min:5100,
									max:7100
						        },
						        series: [{
						            name: 'Glacier Length (m)',
						            data: [], //navi_helper.chartModule.seriesSets[3]['chart-1']
						        	color:'red'
						        }]
						    });
						}else if( setNum == 4 ){
							if(this.chart){
								this.chart.destroy();
								this.chart=null;
							}
							if(this.subcharts['1']){
								this.subcharts['1'].destroy();
								this.subcharts['1']=null;
							}
							if(this.subcharts['2']){
								this.subcharts['2'].destroy();
								this.subcharts['2']=null;
							}
							if(this.subcharts['3']){
								this.subcharts['3'].destroy();
								this.subcharts['3']=null;
							}
						    this.chart = Highcharts.chart('set-4-chart', {
						        chart: {
						        	id:'set4',
						            type: 'spline',
									spacingRight: 10,
									className: 'set4'
						        },
						        plotOptions:{},
						        title: {
						            text: 'Average Summer Air Temperature Each Year (1970 - 2015) in Europe'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Annual Summer Average"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Summer Average Air Temperature (Deg C)'
						            },
									labels:{
									},
									min:6,
									max:12
						        },
						        series: [{
						            name: 'Summer Average Air Temperature (Deg C)',
						            data: navi_helper.chartModule.seriesSets['chart-2'].slice(0,1)
						        }]
						    });
						    this.subcharts['1'] = Highcharts.chart('set-4-subchart-1', {
						        chart: {
						        	id:'set3',
						            type: 'spline',
									className: 'set3',
									height:300
						        },
						        plotOptions:{},
						        title: {
						            text: 'Hintereisferner, Alps Glacier Length'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Year of Summer Measurement"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Glacier Length (m)'
						            },
									labels:{
									},
									min:5000,
									max:7500,
									tickInterval:500
						        },
						        series: [{
						            name: 'Glacier Length (m)',
						            data: [], //navi_helper.chartModule.seriesSets[3]['chart-1']
						        	color:'red'
						        }]
						    });
							navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
							jQuery(navi_helper.chartModule.chartPointer[setNum].sliderID).val(navi_helper.chartModule.chartPointer[setNum].min);
							navi_helper.chartModule.synchronizeSubchart(setNum);
						}else if( setNum == 5 ){
							if(this.chart){
								this.chart.destroy();
								this.chart=null;
							}
							if(this.subcharts['1']){
								this.subcharts['1'].destroy();
								this.subcharts['1']=null;
							}
							if(this.subcharts['2']){
								this.subcharts['2'].destroy();
								this.subcharts['2']=null;
							}
							if(this.subcharts['3']){
								this.subcharts['3'].destroy();
								this.subcharts['3']=null;
							}
						    this.chart = Highcharts.chart('set-5-chart', {
						        chart: {
						        	id:'set5',
						            type: 'spline',
									spacingRight: 10,
									className: 'set5'
						        },
						        plotOptions:{},
						        title: {
						            text: 'Average Summer Air Carbon Dioxide each Year (1970 - 2015)'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Annual Summer Average"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Summer Average Air Carbon Dioxide (ppm)'
						            },
									labels:{
									},
									min:320,
									max:420
						        },
						        series: [{
						            name: 'Summer Average Air Carbon Dioxide (ppm)',
						            data: navi_helper.chartModule.seriesSets['chart-3'].slice(0,1),
						            color:'green'
						        }]
						    });
						    this.subcharts['1'] = Highcharts.chart('set-5-subchart-1', {
						        chart: {
						        	id:'set4',
						            type: 'spline',
									className: 'set4',
									height:300
						        },
						        legend:{
						        	enabled:false
						        },
						        plotOptions:{},
						        title: {
						            text: 'Average Summer Air Temperature Each Year (1970 - 2015) in Europe',
						            style:{
						            	fontSize:'small'
						            }
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Annual Summer Average"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Sum Avg. Air Temp (Deg C)'
						            },
									labels:{
										style:{
										}
									},
									min:6,
									max:12,
									endOnTick:false,
									startOnTick:false,
									floor: 6,
									ceiling: 12,
									tickInterval:2,
						        },
						        series: [{
						            name: 'Summer Average Air Temperature (Deg C)',
						            data: navi_helper.chartModule.seriesSets['chart-2'].slice(0,1)
						        }]
						    });
							navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
							jQuery(navi_helper.chartModule.chartPointer[setNum].sliderID).val(navi_helper.chartModule.chartPointer[setNum].min);
							navi_helper.chartModule.synchronizeSubchart(setNum);
						}else if( setNum == 6 ){
							if(this.chart){
								this.chart.destroy();
								this.chart=null;
							}
							if(this.subcharts['1']){
								this.subcharts['1'].destroy();
								this.subcharts['1']=null;
							}
							if(this.subcharts['2']){
								this.subcharts['2'].destroy();
								this.subcharts['2']=null;
							}
							if(this.subcharts['3']){
								this.subcharts['3'].destroy();
								this.subcharts['3']=null;
							}
						    this.chart = Highcharts.chart('set-6-chart', {
						        chart: {
						        	id:'set6',
						            type: 'spline',
									spacingRight: 10,
									className: 'set6',
									height:330
						        },
						        plotOptions:{
						        	spline:{marker:{enabled:true}}
						        },
						        title: {
						            text: 'Average Summer Air Carbon Dioxide each Year (1970 - 2015)'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Annual Summer Average"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Summer Average Air Carbon Dioxide (ppm)'
						            },
									labels:{
									},
									min:300,
									max:425,
									tickInterval:25
						        },
						        series: [{
						            name: 'Summer Average Air Carbon Dioxide (ppm)',
						            data: navi_helper.chartModule.seriesSets['chart-3'].slice(0,1),
						            color:'green'
						        }]
						    });
						    this.subcharts['1'] = Highcharts.chart('set-6-subchart-1', {
						        chart: {
						        	id:'set6-1',
						            type: 'spline',
									className: 'set6-1',
									height:330
						        },
						        legend:{
						        	enabled:true
						        },
						        plotOptions:{
						        	spline:{marker:{enabled:true}}
						        },
						        title: {
						            text: 'Average Summer Air Temperature Each Year (1970 - 2015) in Europe'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Annual Summer Average"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Summer Average Air Temperature (Deg C)'
						            },
									labels:{
									},
									min:6,
									max:12,
									endOnTick:false,
									startOnTick:false,
									floor: 6,
									ceiling: 12,
									tickInterval:2,
						        },
						        series: [{
						            name: 'Summer Average Air Temperature (Deg C)',
						            data: navi_helper.chartModule.seriesSets['chart-2'].slice(0,1)
						        }]
						    });
						    this.subcharts['2'] = Highcharts.chart('set-6-subchart-2', {
						        chart: {
						        	id:'set6-2',
						            type: 'spline',
									spacingRight: 10,
									height:330
						        },
						        plotOptions:{
						        	spline:{marker:{enabled:true}}
						        },
						        title: {
						            text: 'Summer Glacier Length Over Time (1970 - 2015) Hintereisferner, Alps'
						        },
						        tooltip:{
						        	useHTML:true,
						        	enabled:false
						        },
						        xAxis: {
						            title: {
						            	text: "Year of Summer Measurement"
						            },
						            type: 'linear',
						            min:1970,
						            max:2015,
									labels:{
									}
						        },
						        yAxis: {
						            title: {
						                text: 'Glacier Length (m)'
						            },
									labels:{
									},
									min:5000,
									max:7500,
									tickInterval:500
						        },
						        series: [{
						            name: 'Glacier Length (m)',
						            data: [], //navi_helper.chartModule.seriesSets[3]['chart-1']
						        	color:'red'
						        }]
						    });
							navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].min;
							if( navi_helper.current_page == 12 ) {
								navi_helper.chartModule.chartPointer[setNum].currentPointer = navi_helper.chartModule.chartPointer[setNum].max;
							}
							jQuery(navi_helper.chartModule.chartPointer[setNum].sliderID).val(navi_helper.chartModule.chartPointer[setNum].currentPointer);
							navi_helper.chartModule.chart.series[0].setData( 
								navi_helper.chartModule.seriesSets[navi_helper.chartModule.chartPointer[setNum].useChart].slice(0, navi_helper.chartModule.chartPointer[setNum].currentPointer + 1 - navi_helper.chartModule.chartPointer[setNum].min) 
							);
							navi_helper.chartModule.synchronizeSubchart(setNum);
						}
						return true;	
					}
				},
				my_popups:{
					1:[], //None
					2:[], //None
					3:[], //None
					4:[],
					5:[],
					6:[]
				},
				go_to_page: function ( page_num ) {
					jQuery('span.hover-box,span.hover-box-img').slideUp();
					//console.info('[navi_helper]: Go to page `'+ page_num +'`.');
					if( page_num == 'next' ) {
						this.current_page++;
					}else if( page_num == 'prev' ) {
						this.current_page--;
						if( this.current_page < this.min_page) {
							this.current_page = this.min_page;
						}
					}else{
						this.current_page = parseInt(page_num);
					}
					if( this.current_page < this.min_page) {
						this.current_page = this.min_page;
					}else if ( this.max_page < this.current_page ) {
						this.current_page = this.max_page;
					}
					if( this.current_page == 12 ){
						console.log('End!');
					}
					this.pictureModule.stopAll();
					this.chartModule.stopAll();
					this.chartModule.updateGraphState(navi_helper.contentSets[navi_helper.current_page]);
					this.chartModule.synchronizePicture(navi_helper.contentSets[navi_helper.current_page]);
					this.chartModule.synchronizeSubchart(navi_helper.contentSets[navi_helper.current_page]);
					this.pictureModule.synchronizeGraph(navi_helper.contentSets[navi_helper.current_page]);
					//Specials by Content set
					if( this.contentSets[this.current_page] == 1 ){
						//If this page is 1, add hovers, and remove the background.
						if( this.current_page == 1 ) {
							console.log('CURRENT FLOATABLES: ',
								'span.floating-span.is-hoverable', 
								'#mosaic-right-content-set-' + this.contentSets[this.current_page],
								jQuery('span.floating-span.is-hoverable', '#mosaic-right-content-set-' + this.contentSets[this.current_page])
							);
							jQuery('span.floating-span.is-hoverable', '#mosaic-right-content-set-' + this.contentSets[this.current_page])
							.on('mouseenter mouseleave', function (event) {
								console.log('is-hovering', event, this);
								jQuery('span.hover-box').text(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Hovering');
							})
							/*
							.on('hover', function (event) {
								console.log('is-hovering', event, this);
								jQuery('span.hover-box').text(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Hovering');
							})
							*/
							.css({'background-color':'transparent'})
							;
							jQuery('span.display-page-1').show();
						}else if( this.current_page == 2 ) {
							jQuery('span.hover-box').hide();
							jQuery('span.floating-span.is-hoverable.gray-out', '#mosaic-right-content-set-' + this.contentSets[this.current_page])
							.css({'background-color':'gray'})
							.off('mouseenter mouseleave');
							jQuery('span.floating-span.is-hoverable.highlight', '#mosaic-right-content-set-' + this.contentSets[this.current_page])
							.css({'background-color':'lightblue'});
							jQuery('span.display-page-1').hide();
						}
					}else if( this.contentSets[this.current_page] == 2 ){
						if( this.current_page == 3 ) {
							jQuery('.display-page-3').show();
							jQuery('.display-page-4').hide();
							jQuery('.is-hoverable', '#mosaic-right-content-set-' + this.contentSets[this.current_page])
							
							.on('mouseenter mouseleave', function (event) {
								jQuery('span.hover-box-img').html(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Hovering');
							});
							jQuery('.is-clickable', '#mosaic-page-'+this.current_page+'-left' )
							.on('click', function (event) {
								jQuery('span.hover-box-img').html(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Clicking');
							});
							//reset image
							/*jQuery('#set-2-dynamo-image').prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/1972map.png'
							});*/
							//Stop all timers.
						}else if( this.current_page == 4 ) {
							jQuery('.display-page-3').hide();
							jQuery('.display-page-4').show();
						}
					}else if ( this.contentSets[this.current_page] == 4 ) {
						if( this.current_page == 6 ) {
							jQuery('.display-page-7').hide();
							//reset image
							/*jQuery('#set-4-dynamo-image').prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/1972map.png'
							});*/
							//Stop all timers.
						}else if( this.current_page == 7 ) {
							jQuery('.display-page-7').show();
						}
					}else if ( this.contentSets[this.current_page] == 5 ) {
						if( this.current_page == 8 ) {
							jQuery('.display-page-8').show();
							jQuery('.display-page-9').hide();
							jQuery('#attach-point-8').append( jQuery('#set-5-movable').detach() );
							jQuery('.is-clickable', '#mosaic-page-'+this.current_page+'-left' )
							.on('click', function (event) {
								jQuery('span.hover-box-img').html(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Clicking');
							});
							//reset image
							/*jQuery('#set-4-dynamo-image').prop({
								src:'https://polar-ice.org/wp-content/uploads/2017/12/1972map.png'
							});*/
							//Stop all timers.
						}else if( this.current_page == 9 ) {
							jQuery('.display-page-8').hide();
							jQuery('.display-page-9').show();
							jQuery('#attach-point-9').append( jQuery('#set-5-movable').detach() );
							jQuery('.is-clickable', '#mosaic-page-'+this.current_page+'-left' )
							.on('click', function (event) {
								jQuery('span.hover-box-img').html(
										navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
										'text-set'
									)]
								).slideDown();
								console.log('Clicking');
							});
						}
					}else if ( this.contentSets[this.current_page] == 6 ) {
						jQuery('.is-clickable', '#mosaic-page-'+this.current_page+'-left' )
						.on('click', function (event) {
							jQuery('span.hover-box-img').html(
									navi_helper.contentSetInfo[navi_helper.contentSets[navi_helper.current_page]][jQuery(this).data(
									'text-set'
								)]
							).slideDown();
							console.log('Clicking');
						});
					}
					this.update_info_bubbles();
					jQuery('button','#mosaic-button-nav').removeClass('current-page');
					jQuery('button[data-page-id="'+ this.current_page +'"]','#mosaic-button-nav').addClass('current-page');
					jQuery('.switch-page','#mosaic-page-content').removeClass('view-page');
					jQuery('#mosaic-page-' + this.current_page + '-left','#mosaic-page-content').addClass('view-page');
					jQuery('#mosaic-right-content-set-' + this.contentSets[this.current_page], '#mosaic-page-content').addClass('view-page');
					//jQuery('#play-controls-1').css({display: ( this.current_page > 3 ? 'block' : 'none' ) } );
					//this.update_image_information();
					return this.next_button_state() && this.prev_button_state();
				},
				update_info_bubbles: function () {
					jQuery('span.marker').remove();
					var my_icons = navi_helper.my_popups[ this.current_page ];
//console.log('Updating info bubbles.');
					for(var index in my_icons ) {
						var create_icon = my_icons[index];
						//Only picture-frame-1 is currently getting icons
						var target = jQuery('#image-wrapper-1');
						//console.log(create_icon);
						if( create_icon.icon == '' ) {
							//
							jQuery('<span class="marker"/>')
							.css({
								top: create_icon.position.top,
								left: create_icon.position.left
							}).html('<i class="fa fa-1pt25x">&nbsp;&nbsp;&nbsp;&nbsp;</i><span class="caption '+create_icon.position.align+' '+create_icon.size+'">'+ create_icon.content +'</span>').
							appendTo(target);
						}else if( create_icon.icon == 'info' ) {
							jQuery('<span class="marker"/>')
							.css({
								top: create_icon.position.top,
								left: create_icon.position.left
							}).html('<i class="fa fa-info-circle fa-1pt25x"></i><span class="caption '+create_icon.position.align+' '+create_icon.size+'">'+ create_icon.content +'</span>').
							appendTo(target);
						}else if( create_icon.icon == 'penguin' ) {
							jQuery('<span class="marker penguin is-clickable"/>')
							.css({
								top: create_icon.position.top,
								left: create_icon.position.left
							}).html('<i class="fa fa-does-not-exist fa-1pt25x"></i><span class="caption '+create_icon.position.align+' '+create_icon.size+'">'+ create_icon.content +'</span>').
							appendTo(target);
							for(var i in create_icon.icon_position){
								var new_pos = create_icon.icon_position[i];
								jQuery('<span class="marker penguin"/>')
								.css({
									top: new_pos.top,
									left: new_pos.left
								}).html('<img src="/polar_ice/photos/icon_penguin.png" style="max-width:35px;"/>').
								appendTo(target);
							}							
						}else if( create_icon.icon == 'whale' ) {
							jQuery('<span class="marker whale is-clickable"/>')
							.css({
								top: create_icon.position.top,
								left: create_icon.position.left
							}).html('<i class="fa fa-does-not-exist fa-1pt25x"></i><span class="caption '+create_icon.position.align+' '+create_icon.size+'">'+ create_icon.content +'</span>').
							appendTo(target);
							for(var i in create_icon.icon_position){
								var new_pos = create_icon.icon_position[i];
								jQuery('<span class="marker whale"/>')
								.css({
									top: new_pos.top,
									left: new_pos.left
								}).html('<img src="/polar_ice/photos/icon_whale.png" style="max-width:60px;"/>').
								appendTo(target);
							}
						}else if( create_icon.icon == 'plankton' ) {
							//Are amoebas plankton? Probably. No longer questioning it.
							jQuery('<span class="marker plankton is-clickable"/>')
							.css({
								top: create_icon.position.top,
								left: create_icon.position.left
							}).html('<i class="fa fa-does-not-exist fa-1pt25x"></i><span class="caption '+create_icon.position.align+' '+create_icon.size+'">'+ create_icon.content +'</span>').
							appendTo(target);
							for(var i in create_icon.icon_position){
								var new_pos = create_icon.icon_position[i];
								jQuery('<span class="marker plankton"/>')
								.css({
									top: new_pos.top,
									left: new_pos.left
								}).html('<img src="/polar_ice/photos/amoeba-159483_960_720.png" style="max-width:55px;"/>').
								appendTo(target);
							}
						}
					}
					jQuery('span.marker').on('click', function() {
						var $marker = jQuery(this),
							$caption = jQuery('span.caption', $marker);
						//console.log($caption);
						if( $caption.length < 1 ) {
							if( $marker.hasClass('penguin') ) {
								jQuery('span.marker.penguin.is-clickable').trigger('click');
							}else if( $marker.hasClass('whale') ) {
								jQuery('span.marker.whale.is-clickable').trigger('click');
							}else if( $marker.hasClass('plankton') ) {
								jQuery('span.marker.plankton.is-clickable').trigger('click');
							}
						}else{
							if ($caption.is(':hidden')) {
								$caption.slideDown(300);
							} else {
								$caption.slideUp(300);
							}
						}
					});
					//Fix anchor links in the span marker click to avoid event propagation
					// and other bad behavior
					jQuery('span.marker a').on('click', function (event) {
						event.stopPropagation();
						return true;
					});
					return true;
				},
				update_image_information: function () {
					return true;
					this.pause_images(1);
					this.pause_images(2);
					if( this.current_page < 4 ) {
						jQuery('#picture-frame-1').removeClass('dual-image');
						jQuery('#picture-frame-2').removeClass('dual-image').hide();
						jQuery('#image-changer-1').prop({src: this.static_image});
						jQuery('#play-controls-1').hide();
						return true;
					}
					jQuery('#play-controls-1').show();
					jQuery('#picture-frame-1').removeClass('dual-image');
					jQuery('#picture-frame-2').removeClass('dual-image').hide();
					var my_rules = this.dynamic_images[ this.current_page ];
					if( my_rules.num_images == 1 ) {
						this.dynamic_images[ this.current_page ].frames[1].show_picture = 0;
						jQuery('#play-slider-1').val(0).prop({max:this.dynamic_images[ this.current_page ].frames[1].pictures.length-1}); 
						var pad = "00";
						var str_day = '' + this.dynamic_images[ this.current_page ].frames[1].curr_day;
						var str_hr = '' + this.dynamic_images[ this.current_page ].frames[1].curr_hr;
						jQuery('#image-changer-1').prop({
							src: this.dynamic_images[ this.current_page ].location + 
							'201502' + 
							pad.substring(0, pad.length - str_day.length) + str_day + 
							'T' +
							pad.substring(0, pad.length - str_hr.length) + str_hr + 
							'00.png'
						});//.removeClass('dual-image');
						jQuery('#picture-frame-2').css({display:'none'});
					}else{
						jQuery('#play-slider-1').val(0).prop({max:this.dynamic_images[ this.current_page ].frames[1].pictures.length-1});
						jQuery('#play-slider-2').val(0).prop({max:this.dynamic_images[ this.current_page ].frames[2].pictures.length-1});
						this.dynamic_images[ this.current_page ].frames[1].show_picture = 0;
						this.dynamic_images[ this.current_page ].frames[2].show_picture = 0;
						jQuery('#picture-frame-1').addClass('dual-image');
						jQuery('#picture-frame-2').addClass('dual-image').css({display:'inline-block'});
						var pad = "00";
						var str_day = '' + this.dynamic_images[ this.current_page ].frames[1].curr_day;
						var str_hr = '' + this.dynamic_images[ this.current_page ].frames[1].curr_hr;
						var str_day2 = '' + this.dynamic_images[ this.current_page ].frames[2].curr_day;
						var str_hr2 = '' + this.dynamic_images[ this.current_page ].frames[2].curr_hr;
						jQuery('#image-changer-1').prop({
							src: this.dynamic_images[ this.current_page ].location + 
							'201502' + 
							pad.substring(0, pad.length - str_day.length) + str_day + 
							'T' +
							pad.substring(0, pad.length - str_hr.length) + str_hr + 
							'00.png'
						});
						jQuery('#image-changer-2').prop({
							src: this.dynamic_images[ this.current_page ].location + 
							'201502' + 
							pad.substring(0, pad.length - str_day2.length) + str_day2 + 
							'T' +
							pad.substring(0, pad.length - str_hr2.length) + str_hr2 + 
							'00.png'
						});
					}
					if( this.current_page == 4 || this.current_page == 6 ){
						if( my_rules.num_images == 1 ) {
							this.play_images(1);
						}else{
							this.play_images(1);
							this.play_images(2);
						}
					}
					return true;
				},
				play_images: function (frame_id) {
					this.pause_images(frame_id);
					this.my_timer[frame_id] = setInterval( function () {
						//console.log('Image change.');
						navi_helper.forward_image_source(frame_id);
					}, ( 1000 / this.fps ) );
				},
				pause_images: function (frame_id) {
					if( this.my_timer[frame_id] !== null ) {
						clearInterval( this.my_timer[frame_id] );
						this.my_timer[frame_id] = null;
					}
				},
				step_forward: function (frame_id) {
					this.pause_images(frame_id);
					this.forward_image_source(frame_id);
				},
				step_back: function (frame_id) { 
					this.pause_images(frame_id);
					this.previous_image_source(frame_id);
				},
				go_to_picture: function (frame_id, picture_id){
					this.dynamic_images[ this.current_page ].frames[frame_id].show_picture = picture_id;
					this.show_images(frame_id);
				},
				forward_image_source: function (frame_id) {
					this.dynamic_images[ this.current_page ].frames[frame_id].show_picture++;
					if( this.dynamic_images[ this.current_page ].frames[frame_id].show_picture >= this.dynamic_images[ this.current_page ].frames[frame_id].pictures.length  ) {
						this.dynamic_images[ this.current_page ].frames[frame_id].show_picture=0;
					}
					//console.log(this.dynamic_images[ this.current_page ]);
					jQuery('#play-slider-' + frame_id).val( this.dynamic_images[ this.current_page ].frames[frame_id].show_picture ) ;
					this.show_images(frame_id);
					return true;
				},
				previous_image_source: function (frame_id) {
					this.dynamic_images[ this.current_page ].frames[frame_id].show_picture--;
					if( this.dynamic_images[ this.current_page ].frames[frame_id].show_picture < 0 ) {
						this.dynamic_images[ this.current_page ].frames[frame_id].show_picture=this.dynamic_images[ this.current_page ].frames[frame_id].pictures.length-1;
					}
					jQuery('#play-slider-' + frame_id).val( this.dynamic_images[ this.current_page ].frames[frame_id].show_picture ) ;
					this.show_images(frame_id);
					return true;
				},
				show_images: function (frame_id) {
					var my_rules = this.dynamic_images[ this.current_page ].frames[frame_id];
					var pad = "00";
					var str_day = '' + this.dynamic_images[ this.current_page ].frames[frame_id].curr_day;
					var str_hr = '' + this.dynamic_images[ this.current_page ].frames[frame_id].curr_hr;
					jQuery('#image-changer-' + frame_id).prop({
						src: this.dynamic_images[ this.current_page ].frames[frame_id].pictures[ this.dynamic_images[ this.current_page ].frames[frame_id].show_picture ]
					});
					///polar_ice/maps/justmap_new_160212/tidalcurrents_20150208T0100.png
					/*
					jQuery('#image-changer-' + frame_id).prop({
						src: this.dynamic_images[ this.current_page ].location + 
						'201502' + 
						pad.substring(0, pad.length - str_day.length) + str_day + 
						'T' +
						pad.substring(0, pad.length - str_hr.length) + str_hr + 
						'00.png'
					});
					*/
					return true;
				},
				prev_button_state: function () {
					jQuery('#mosaic-prev-button').prop({disabled: (this.current_page == this.min_page) });
					return true;
				},
				next_button_state: function () {
					jQuery('#mosaic-next-button').prop({disabled: (this.current_page == this.max_page) });
					return true;
				},
				preload_all_images: function() {
					return true;
				},
				initialize_pictures: function () {
					var my_dynamic_images = this.dynamic_images;
					for(var page in my_dynamic_images){
						var my_frames = this.dynamic_images[page].frames;
						for(var my_frame in my_frames){
							//We'll need to calculate then push (in order)
							var total_time = (this.dynamic_images[ page ].frames[my_frame].curr_day * 100) + this.dynamic_images[ page ].frames[my_frame].curr_hr;
							var end_time = (this.dynamic_images[ page ].frames[my_frame].end_day * 100) + this.dynamic_images[ page ].frames[my_frame].end_hr;
							while( total_time < end_time ) {
								this.dynamic_images[ page ].frames[my_frame].curr_hr++;
								if( this.dynamic_images[ page ].frames[my_frame].curr_hr >= 24 ) {
									this.dynamic_images[ page ].frames[my_frame].curr_day++;
									this.dynamic_images[ page ].frames[my_frame].curr_hr=0;
								}
								//e.g. day = 8 (or '08') hour = 11 (or '11'), total time = 811 or ('0811') vs end time of 2200 for day 22, hour 00
								total_time = (this.dynamic_images[ page ].frames[my_frame].curr_day * 100) + this.dynamic_images[ page ].frames[my_frame].curr_hr;
								var pad = "00";
								var str_day = '' + this.dynamic_images[ page ].frames[my_frame].curr_day;
								var str_hr = '' + this.dynamic_images[ page ].frames[my_frame].curr_hr;
								this.dynamic_images[ page ].frames[my_frame].pictures.push(
									this.dynamic_images[ page ].location + 
									'201502' + 
									pad.substring(0, pad.length - str_day.length) + str_day + 
									'T' +
									pad.substring(0, pad.length - str_hr.length) + str_hr + 
									'00.png'
								);
							}
							console.info('Page: `'+ page +'`, Frame: `'+ my_frame +'` initialized');
						}
					}
					return true;
				}
			};
			//There might be a conflict with the shorthand Dollar sign ($), so we'll just use jQuery instead
			jQuery(function () {
				console.log('[jQuery loaded]');
				
				jQuery.get('https://polar-ice.org/wp-content/uploads/2020/04/story_2_eng.html.txt', function(data) {
				console.log('THE DATA: ', data);
				
					var myHTML = data.replace(/REPLACE_OPEN_ANGLE_BRACKET/g, '<');
					
					myHTML = myHTML.replace(/REPLACE_CLOSE_ANGLE_BRACKET/g, '>');
					jQuery('#story-2-div').html(myHTML);
					
					console.log('HTML Loaded. Loading other items.');
					jQuery('#mosaic-prev-button').prop({disabled:true});
					jQuery('#mosaic-next-button').prop({disabled:false});
					jQuery('button','#mosaic-button-nav').on('click', function () {
						navi_helper.go_to_page( jQuery(this).data('page-id') );
					});
					//We're going to remove the #sidebar for now and make #main width 100%
					jQuery('#sidebar').hide();
					jQuery('#main').css({width:'100%'});
					navi_helper.chartModule.initializeGraphs();
					navi_helper.initializeButtons();
					navi_helper.go_to_page(0);
					jQuery('span.hover-box').on('click', function () {
						jQuery(this).slideUp();
					})
					jQuery('span.hover-box-img').on('click', function () {
						jQuery(this).slideUp();
					})
					
				}, 'text');
				
			});