Widget:Snow situation graph

<includeonly>

    	<script type="text/javascript" src="https://www.google.com/jsapi"></script>
    	<script type="text/javascript">

  		function <!--{$id|default:drawSnowSitChart|escape:'html'}-->_jQueryTest() {
  		  	if ( typeof window.jQuery == 'undefined' ) {
  		  		setTimeout( function(){ <!--{$id|default:drawSnowSitChart|escape:'html'}-->_jQueryTest() }, 300);
  		  	} else {
  		  		google.load('visualization', '1.0', {'packages':['corechart']});
				google.setOnLoadCallback(<!--{$id|default:drawSnowSitChart|escape:'html'}-->_func);
  		  	}
  		}
  		setTimeout( function(){ <!--{$id|default:drawSnowSitChart|escape:'html'}-->_jQueryTest() }, 300);

		function <!--{$id|default:drawSnowSitChart|escape:'html'}-->_func() {

    	    			var siteName = '<!--{$page|escape:'urlpathinfo'}-->';
				var lang = '<!--{$lang|default:fi|escape:'urlpathinfo'}-->';
				var SiteID = '<!--{$SiteID|default:x|escape:'html'}-->';

	    			var searchStr = "action=ask&query=";
	    			searchStr += "[[Havainto::>0]][[SiteID::" + SiteID + "]]";

	    			searchStr += encodeURI("[[Tyyppi::Lumitilanne]]");
				searchStr += encodeURI("|?Päivämäärä|?Lumitilanne|?Lumen paksuus|?Tiedosto|?Lisätiedot|sort=Päivämäärä|limit=1000");
				searchStr += '&format=json';
				jQuery.ajax({
			   		type: 'GET',
			   		url: queryApi,
			   		data: searchStr,
			   		success: success,
			   		dataType: 'jsonp'
				});

				function success(request) {

				    var dataArr = new Array();
				    var imagesArr = new Array();
				    var firstYear = 3000;
				    var lastYear = 0;
				    var firstWinter = 3000;
				    var lastWinter = 0;
				    var today = new Date();
				    var curYear = today.getFullYear();
				    //curYear = 2013;
				    var curMonth = today.getMonth();
				    var curWinter;
				    if (curMonth > 7) { curWinter = curYear+1; } else { curWinter = curYear; }
				    var firstMonth = 12;
				    var lastMonth = 1;
				    var minDays = 365;
				    var maxDays = 0;
				    var minSnow = 100;
				    var maxSnow = 0;
				    var images=0;
				    var snowSit;
				    var snowNum = -1;
				    var ibuDaysSum = 0;
				    var ibuWeight = 0;
				    var bicDaysSum = 0;
				    var bicWeight = 0;
				    var bics = 0;
				    var meanValuesArr = new Array();
				    var meanWeightedArr = new Array();
				    var meanFloatedArr = new Array();

					if (request.query.results != undefined) {

						// analyze & store data
						zi = -1;						
						for (var i in request.query.results) {
							zi++;
							resultItem = request.query.results[i].printouts;
							
							snowSit = resultItem.Lumitilanne[0];
							if (snowSit == 0 || snowSit == 10) { 
								snowNum = 0; 
							} else if (resultItem['Lumen paksuus'][0] != undefined) { 
								//console.log(resultItem['Lumen paksuus']);
								snowNum = resultItem['Lumen paksuus'][0].value; 
							}
							if (typeof(resultItem.Lisätiedot) != undefined) { freeTxt = resultItem.Lisätiedot[0]; }
							else { freeText = ''; }
							obsDate = new Date(toDateFromSecsSince1970(resultItem.Päivämäärä[0].timestamp));
							obsYear = obsDate.getFullYear();
							if (obsDate.getMonth() < 8) {
								snowMonth = obsDate.getMonth() + 4;
								obsWinter = obsDate.getFullYear();
							} else {
								snowMonth = obsDate.getMonth() - 8;
								obsWinter = obsDate.getFullYear() + 1;
							}
							if (obsYear < firstYear) { firstYear = obsYear; }
							if (obsYear > lastYear) { lastYear = obsYear; }
	    					if (obsWinter < firstWinter) { firstWinter = obsWinter; }
	    					if (obsWinter > lastWinter) { lastWinter = obsWinter }
	    					if (snowMonth < firstMonth) { firstMonth = snowMonth; }
	    					if (snowMonth > lastMonth) { lastMonth = snowMonth; }
	                        if (snowNum < minSnow) { minSnow = snowNum; }
	                        if (snowNum > maxSnow) { maxSnow = snowNum; }

	                        // If image, get filename
	                        if (resultItem.tiedosto) {
	                        	images++;
								searchStr2 = "action=query&prop=imageinfo&iiprop=url&format=json&titles=";
								searchStr2 += encodeURIComponent(resultItem.tiedosto);
								jQuery.ajax({
									type: 'GET',
									url: queryApi,
									data: searchStr2,
									dataType: 'jsonp',
									index: zi,
									success: function(request2) {
										for (var x in request2.query.pages) {
											imagesArr[this.index] = request2.query.pages[x].imageinfo[0].url;
											break;
  										}
										images--;
									},
									error: function() { images--; }
								});
							}

							if (obsWinter < curWinter) {
								if (snowSit == 5) {
									ibuDaysSum += obsDate.getDayOfSnowYear();
									ibuWeight++;
								} else if (snowSit == 2) {
									//bicDaysSum += obsDate.getDayOfSnowYear(),
									//bicWeight++;
									bics++;
									meanValuesArr.push(new Object( { days: obsDate.getDayOfSnowYear(), snow: 0, weight: 1 }));
								} else {
									meanValuesArr.push(new Object( { days: obsDate.getDayOfSnowYear(), snow: snowNum, weight: 1 }));
								}
							}
	                    }
	                    if (ibuWeight > 0) { meanValuesArr.push(new Object( { days: ibuDaysSum/ibuWeight, snow: 0, weight: ibuWeight })); }
	                    //if (bicWeight > 0) { meanValuesArr.unshift(new Object( { days: bicDaysSum/bicWeight, snow: 0, weight: bicWeight })); }

						function imagesLoaded() {

							if (images != 0) { setTimeout(function() {
								imagesLoaded()},500);
							} else {

								var color0 = '#36c';
								var color1 = 'transparent';
								var color2 = 'transparent';
								//if (curYear > lastYear) { color0 = 'transparent'; } else { color0 = '#36c'; }

								if (meanValuesArr.length > 0) {

									color1 = '#ccc';
									color2 = '#f90';

									// make floating mean
									meanValuesArr.sort(function(a,b) { return (a.days - b.days); });
									var bicCounter=0;
									for (i = 1; i < meanValuesArr.length; i++) {
										if (meanValuesArr[i].snow == 0) {
											bicCounter++;
											//meanValuesArr[i].weight = Math.pow(4, bics-bicCounter);
											meanValuesArr[i].snow = bics/bicCounter*-10;
										}
									}
									meanWeightedArr.push(meanValuesArr[0]);
									for (i = 1; i < meanValuesArr.length; i++) {
										if (meanValuesArr[i].days == meanWeightedArr[meanWeightedArr.length-1].days) {
											meanWeightedArr[meanWeightedArr.length-1].snow += meanValuesArr[i].snow;
											meanWeightedArr[meanWeightedArr.length-1].weight++;
										} else {
											meanWeightedArr.push(meanValuesArr[i]);
										}
									}
									for (i = 0; i < meanWeightedArr.length; i++) {
										sum = 0;
										weight = 0;
										for (e = 0; e < meanWeightedArr.length; e++) {
											if (meanWeightedArr[e].days > (meanWeightedArr[i].days-14) && meanWeightedArr[e].days < (meanWeightedArr[i].days+14)) {
												sum += meanWeightedArr[e].snow;
												weight += meanWeightedArr[e].weight;
											}
										}
										meanFloatedArr[i] = new Object( { days: meanWeightedArr[i].days, snow: (sum/weight) } );
									}
								}

								// make graph data table
								var annotation = null;
								zi = -1;
								for (var i in request.query.results) {
									zi++;
									resultItem = request.query.results[i].printouts;
									obsDate = new Date(toDateFromSecsSince1970(resultItem.Päivämäärä[0].timestamp));
									dataRow = new Array();
									obsYear = obsDate.getFullYear();
									if (obsDate.getMonth() < 8) {
										snowMonth = obsDate.getMonth() + 4;
										obsWinter = obsDate.getFullYear();
									} else {
										snowMonth = obsDate.getMonth() - 8;
										obsWinter = obsDate.getFullYear() + 1;
									}
									dataRow[0] = obsDate.getDayOfSnowYear();
									snowSit = resultItem.Lumitilanne[0];

									if (snowSit == 0) { snowNum = 0; }
									else if (snowSit == 50 && resultItem['Lumen paksuus'][0] != undefined) { snowNum = resultItem['Lumen paksuus'][0].value; }
									else { snowNum = -1; }

									tooltip = '<div style="padding: 8px; max-width: 196px;"><div><b>' + snowTranslate(snowSit, lang);
									if (snowNum > -1) { tooltip += ': ' + snowNum + ' cm'; }
									tooltip += '</b> (' + obsDate.toLocaleDateString() + ')</div>';
			    					if (imagesArr[zi]) {
										tooltip += '<div style="margin-top: 5px;" class="snowTooltipDiv" id="snowTooltipDiv_' + i + '"><img class="snowTooltipImg" id="snowTooltipImg_' + i + '" style="max-width: 196px; max-height: 196px;" src="' + imagesArr[zi] + '" /></div>';
										jQuery('#snowTooltipImg_' + i).load(function() {
											//console.log(jQuery(this).width() + "x" + jQuery(this).height());
										});
									}
									if (resultItem.Lisätiedot.length > 0) { tooltip += '<div style="margin-top: 5px;">' + resultItem.Lisätiedot[0] + '</div>'; }
	    							tooltip += '</div>';

			    					if (snowNum > -1) {
									if (obsWinter == curWinter) {
										dataRow[1] = snowNum;
										dataRow[2] = tooltip;
										dataRow[3] = annotation;
										dataRow[4] = null;
										dataRow[5] = null;
										dataRow[6] = null;
									} else {
										dataRow[1] = null;
										dataRow[2] = null;
										dataRow[3] = null;
										dataRow[4] = snowNum;
										dataRow[5] = tooltip;
										dataRow[6] = annotation;
									}
									dataRow[7] = null;
									dataRow[8] = null;
									dataRow[9] = true;
	    								dataArr.push(dataRow);
	    							}
								}

								for (i = 0; i < meanFloatedArr.length; i++) {
									dataRow = new Array();
									dataRow[0] = meanFloatedArr[i].days;
									dataRow[1] = null;
									dataRow[2] = null;
									dataRow[3] = null;
									dataRow[4] = null;
									dataRow[5] = null;
									dataRow[6] = null;
									dataRow[7] = meanFloatedArr[i].snow;
									dataRow[8] = '';
									dataRow[9] = false;
									dataArr.push(dataRow);
								}

	                    		// visualization parameters

								// dataTable columns
				 				var dataTable = new google.visualization.DataTable();
				 				dataTable.addColumn('number', 'Date');
				 				if (curWinter > lastWinter) {
				 					if (firstYear == lastYear) { yearSpan = firstYear; }
				 					else { yearSpan = firstYear + '-' + lastYear; }
				 					dataTable.addColumn('number', '');
				 				} else {
				 					if (firstYear == (lastWinter-1)) { yearSpan = firstYear; }
				 					else { yearSpan = firstYear + '-' + (lastWinter-1); }
				 					dataTable.addColumn('number', snowTranslate(7, lang) + ' ' + (curWinter-1) + '-' + curWinter);
				 				}
				  				dataTable.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true }});
				  				dataTable.addColumn({type: 'string', role: 'annotation'});
				  				if (meanValuesArr.length > 0) {
				  					dataTable.addColumn('number',  yearSpan);
				  					dataTable.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true }});
				  					dataTable.addColumn({type: 'string', role: 'annotation'});
									dataTable.addColumn('number', snowTranslate(8, lang) + ' ' + yearSpan);
								} else {
					  				dataTable.addColumn('number',  '');
				  					dataTable.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true }});
				  					dataTable.addColumn({type: 'string', role: 'annotation'});
									dataTable.addColumn('number', '');
				  				}
				  				dataTable.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true }});
				  				dataTable.addColumn({type: 'boolean', role:'certainty' });

  								var hAxisTicks = new Array();
				  				var startOfMonth;
  								for (i=firstMonth; i<=lastMonth; i++) {
  								//0-syys, 1-loka, 2-marras, 3-joulu
  									if (i < 4) {
  										startOfMonth = new Date(curYear, i + 8, 15);
  									} else {
  										startOfMonth = new Date(curYear, i - 4, 15);
  									}
  									if ((lastMonth-firstMonth) < 6) {
			  					    	hAxisTicks.push({v: startOfMonth.getDayOfSnowYear(), f: startOfMonth.getSnowMonthName(lang) });
			  					    } else {
			  					    	hAxisTicks.push({v: startOfMonth.getDayOfSnowYear(), f: startOfMonth.getSnowMonthNameShort(lang) });
			  					    }
			  					}

  								dataTable.addRows(dataArr);
  								if (firstMonth < 4) {
  									firstDate = new Date(curYear, firstMonth + 8, 1);
  								} else {
  									firstDate = new Date(curYear, firstMonth - 4, 1);
  								}
  								if (lastMonth < 4) {
  									lastDate = new Date(curYear, lastMonth + 8, 1);
  								} else {
  									lastDate = new Date(curYear, lastMonth - 4 + 1, 1);
  								}

				  				var options = {
				  				    seriesType: "scatter",
  				    				interpolateNulls: true,
  				    				hAxis: { slantedText: false, maxAlternation: 1, maxValue: lastDate.getDayOfSnowYear()-1, ticks: hAxisTicks, gridlines: { color: 'transparent' }, minorGridlines: { count: 1, color: '#ccc' }, viewWindowMode:'explicit', viewWindow:{ min: firstDate.getDayOfSnowYear() } },
  				    				vAxis: { title: snowTranslate(6, lang), titleTextStyle: { bold: true }, viewWindowMode:'explicit', viewWindow:{ min: 0 } },
  				    				series: {
  				    					0: { type: 'line', pointSize: 12, lineWidth: 5, curveType: 'function', color: color0  },
  				    					1: { type: 'scatter', pointSize: 5, color: color1 },
  				    					2: { type: 'area', pointSize: 0, lineWidth: 3, curveType: 'function', color: color2, enableInteractivity : false }
  				    				},
  				    				legend: { position: 'bottom' },
				  				    backgroundColor: { fill:'transparent' },
  				    				crosshair: { trigger: 'both' },
				  				    chartArea: { top: 10, left: 80, width: (jQuery('#snow_chart_div').width() - 80 - 20), height: (jQuery('#snow_chart_div').height() - 50 - 10), backgroundColor: { stroke: '#ccc', strokeWidth: 1, fill: '#daf0fa' } },
  				  					tooltip: { isHtml: true }
				  				};
  								var chart = new google.visualization.ComboChart(document.getElementById('snow_chart_div'));
				  				chart.draw(dataTable, options);

				  				jQuery( window ).resize(function() {
				  					//console.log((jQuery('#snow_chart_div').width() - 80 - 10));
				  					options.chartArea.width = (jQuery('#snow_chart_div').width() - 80 - 20);
				  					options.chartArea.height = (jQuery('#snow_chart_div').height() - 50 - 10);
									chart.draw(dataTable, options);
								});

							}
						}
						imagesLoaded();
					}
				}
			}

			function snowTranslate(labelId, lang) {
			
				var labels = {
						fi: { 0: 'Maanpinta lumeton', 10: 'Vähän lunta', 40: 'Alle 50 % lunta', 50: 'Maassa on lunta', 60: 'Yli 50 % lunta', 90: 'Lähes täysi lumipeite', 99: 'Ensilumen päivä', 100: 'Täysi lumipeite', 6: 'Lumen paksuus, cm', 7: 'Talvi', 8: 'Keskiarvo' }
						//en: [0: 'No snow cover', 'Freezing', 'Beginning of permanent snow cover', 'Permanent snow cover', 'Snow break-up', 'Beginning of snow-free season', 'Snow cover thickness, cm', 'Winter', 'Mean']
				};

				lang = lang && (lang in labels) ? lang : 'en';
			    return labels[lang][labelId];
			}

			Date.prototype.getDayOfSnowYear = function () {
    			var aggregateMonths = [0, // Sep
                	31, // Oct
                    31 + 30, // Nov
                    31 + 30 + 31, // Dec
                    31 + 30 + 31 + 30, // Jan
                    31 + 30 + 31 + 30 + 31, // Feb
                    31 + 30 + 31 + 30 + 31 + 28, // Mar
                    31 + 30 + 31 + 30 + 31 + 28 + 31, // Apr
                    31 + 30 + 31 + 30 + 31 + 28 + 31 + 31, // May
                    31 + 30 + 31 + 30 + 31 + 28 + 31 + 31 + 30, // Jun
                    31 + 30 + 31 + 30 + 31 + 28 + 31 + 31 + 30 + 31, // Jul
                    31 + 30 + 31 + 30 + 31 + 28 + 31 + 31 + 30 + 31 + 30, // Aug
                ];

                if (this.getMonth() < 8) {
                	return (aggregateMonths[this.getMonth() + 4]  + this.getDate());
                } else {
					return (aggregateMonths[this.getMonth() - 8] + this.getDate() );
				}
			}


			Date.prototype.getSnowMonthName = function(lang) {
			    lang = lang && (lang in Date.locale) ? lang : 'en';
			    if (this.getMonth() < 8) {
			    	//return Date.locale[lang].month_names[this.getMonth()+4];
			    } else {
			    	//return Date.locale[lang].month_names[this.getMonth()-8];
			    }
			    return Date.locale[lang].month_names[this.getMonth()];
			};

			Date.prototype.getSnowMonthNameShort = function(lang) {
			    lang = lang && (lang in Date.locale) ? lang : 'en';
			    if (this.getMonth() < 8) {
				   	//return Date.locale[lang].month_names_short[this.getMonth()+4];
				} else {
				   	//return Date.locale[lang].month_names_short[this.getMonth()-8];
			    }
			    return Date.locale[lang].month_names_short[this.getMonth()];
			};


    	</script>

    <!--Div that will hold the pie chart-->
    <div style="Xbackground-color: #c1e7f7; height: 300px;" id="snow_chart_div"></div>

</includeonly>