Project

General

Profile

1
<!DOCTYPE html
2
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
3
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
4
<html>
5
<?php
6

    
7
require_once('controller.php');
8
$controller = new Controller(false);
9

    
10
if(!isset($_GET['com'])) {
11
	echo "no command given";
12
	return;
13
}
14
if($_GET['com'] != "query"){
15
	echo "unknown command code";
16
	return;
17
}
18

    
19
//make the query
20
if(!isset($_GET['persistent'])){
21
        
22
     $persistent="true";
23
}
24
else
25
{
26
$persistent="false";
27
}
28
$selectedData = json_encode($_GET['data']);
29
$resp = $controller->makeQuery('chart',$persistent);
30

    
31
//echo "selected ".json_encode($_GET['data'],JSON_NUMERIC_CHECK);
32
//each filter to be included get its data and build the json object for the javascript
33
//echo "will include ".count($_GET['data']['incfilters'])." filters";
34

    
35
$myData = json_decode($_GET['data']);
36

    
37
if(isset($myData->incfilters))
38
	$myfilters = $myData->incfilters;
39
else
40
	$myfilters = array();
41

    
42

    
43
for($i=0;$i<count($myfilters);$i++){
44
	if(isset($myfilters[$i]->values) && $myfilters[$i]->values=='all'){
45
		$temp = $controller->getFilterData($myData->table,$myfilters[$i]->name);
46
		if(!is_array($temp)){
47
			$temp = json_decode($temp);
48
		}
49
		//print_r($temp->data);
50
		$myfilters[$i]->values = $temp->data;
51
	}
52
}
53

    
54
?>
55
<head>
56
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
57
<title>chart</title>
58
<!-- Include JQuery Core-->
59
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
60
<script type="text/javascript" src="./js/jquery-ui-1.9.1.custom/js/jquery-ui-1.9.1.custom.js"></script>
61

    
62
<!-- HighCharts -->
63
<script src="./js/Highcharts-4.0.1/js/highcharts.js" type="text/javascript"></script>
64
<script src="./js/Highcharts-4.0.1/js/modules/exporting.js" type="text/javascript"></script>
65

    
66
<script src="./js/themes9.js" type="text/javascript"></script>
67
<!--Styles-->
68
<link rel="stylesheet" href="//code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
69
<link type="text/css" href="./js/jquery/css/start/jquery-ui-1.8.20.custom.css" />
70
<link type="text/css" href="./js/highcharts.css" rel="stylesheet" />
71
<link rel="stylesheet" href="js/filters.css" />
72

    
73

    
74
<script type='text/javascript'>
75
var chart;
76
var chart2;
77
var chartData;
78
var chartData2;
79
var chartDataFromServer;
80
var selectedData;
81
var filterData;
82
var myFilter;
83
//----------------- inits --------------------//
84
var wflag = <?php if(isset($_GET['w']) && $_GET['w']!='' && $_GET['w'][strlen($_GET['w'])-1] == '%'){ echo "true"; }
85
               	  else{ echo "false"; }?>
86

    
87
var mywidth =  <?php if(isset($_GET['w']) && $_GET['w']!=''){
88
			if($_GET['w'][strlen($_GET['w'])-1] == '%'){
89
				echo substr($_GET['w'],0,strlen($_GET['w'])-1);
90

    
91
			}else{
92
				if($_GET['w'][strlen($_GET['w'])-1] == 'x'){
93
					echo substr($_GET['w'],0,strlen($_GET['w'])-2);
94
				}else echo $_GET['w'];
95
			}
96
		    }else echo '700'; ?>;
97

    
98
var hflag = <?php if(isset($_GET['h']) && $_GET['h']!='' && $_GET['h'][strlen($_GET['h'])-1] == '%'){ echo "true"; }
99
                  else{ echo "false"; }?>
100

    
101
var myheight =  <?php if(isset($_GET['h']) && $_GET['h']!=''){
102
                        if($_GET['h'][strlen($_GET['h'])-1] == '%'){
103
                                echo substr($_GET['h'],0,strlen($_GET['h'])-1);
104
			}else{ 
105
                                if($_GET['w'][strlen($_GET['h'])-1] == 'x'){
106
                                        echo substr($_GET['h'],0,strlen($_GET['h'])-2);
107
                                } else echo $_GET['h'];
108
                        }
109
                      }else echo '400'; ?>;
110

    
111
//----------------- document ready --------------------//
112
$('document').ready(function(){
113
	chartDataFromServer = <?php echo $resp ?>;
114
	selectedData = $.parseJSON(<?php echo $selectedData;?>);
115
	filterData = <?php echo json_encode($myfilters);?>;
116

    
117
	renderChart();
118
	renderfilters();
119
	controlsforfilters();
120
});
121

    
122
function renderChart(){
123

    
124
	if(selectedData['in'] != undefined && selectedData['in'].length>0){
125
		if(chartDataFromServer[0].plotOptions != undefined && chartDataFromServer[0].plotOptions.series != undefined){
126
	 	       chartDataFromServer[0].plotOptions.series.events = new Object();
127
		       chartDataFromServer[0].plotOptions.series.events.checkboxClick = function(event){if(event.checked == true) this.show(); else this.hide();};
128
		}
129
		if(chartDataFromServer[1].plotOptions != undefined && chartDataFromServer[1].plotOptions.series != undefined){
130
		        chartDataFromServer[1].plotOptions.series.events = new Object();
131
	        	chartDataFromServer[1].plotOptions.series.events.checkboxClick = function(event){if(event.checked == true) this.show(); else this.hide();};
132
		}
133
		chartData = chartDataFromServer[0];
134
		chartData2 = chartDataFromServer[1];
135
		setSelections();
136
	}
137
	else{
138
		if(chartDataFromServer.plotOptions != undefined && chartDataFromServer.plotOptions.series != undefined){
139
		        chartDataFromServer.plotOptions.series.events = new Object();
140
			chartDataFromServer.plotOptions.series.events.checkboxClick = function(event){if(event.checked == true) this.show(); else this.hide();};
141
		}
142
		chartData = chartDataFromServer;
143
	}
144
	var formatter = chartData.xAxis.labels.formatter;
145
	if(selectedData['emp'] == undefined)
146
		selectedData['emp'] = new Array();
147
	else{
148
			chartData.xAxis.plotLines = new Array();
149
		for(var e=0;e<selectedData['emp'].length;e++){
150
			var line = new Object();
151
			line.value = chartData['xAxis']['categories'].indexOf(selectedData['emp'][e]);
152
			line.width = 1;
153
			line.color = 'red';
154
			line.dashStyle = 'dash';
155
			line.zIndex = 100;
156
			chartData.xAxis.plotLines.push(line);
157
		}
158
	}
159

    
160
	if(selectedData['bands'] != undefined){
161
		chartData['xAxis']['plotBands'] = new Array();
162
		for(var b=0;b<selectedData['bands'].length;b++){
163
			var band = new Object();
164
			band.color = '#FCFFC5';
165
			var from = chartData.xAxis.categories.indexOf(selectedData['bands'][b][0]);
166
			var to = chartData.xAxis.categories.indexOf(selectedData['bands'][b][1]);
167
			band.from = from;
168
			band.to = (to==-1)? chartData.xAxis.categories.length:to;
169
			band.zIndex = -100;
170
			chartData.xAxis.plotBands.push(band);
171
		}
172
	}
173

    
174
	if(selectedData['xStyle'] != undefined){
175
		chartData.xAxis.labels = labelsforx(selectedData['xStyle'],selectedData['emp']);
176
	}
177
	else{
178
		var temp = new Object(); temp['r'] = '-'; temp['s'] = '-'; temp['l'] = '-';
179
		chartData.xAxis.labels = labelsforx(temp,selectedDatap['emp']);
180
	}
181

    
182
	//headers!!!!
183
	if(typeof selectedData['title'] != 'undefined'  && selectedData['title']!=''){
184
		chartData.title = new Object();
185
		chartData.title.text = selectedData['title'];
186
		chartData.title.align = 'center';
187
	}
188
	else{
189
		chartData.title.text = null;
190
	}
191
	if(selectedData['subtitle']!=''){
192
		chartData.subtitle = new Object();
193
		chartData.subtitle.text = selectedData['subtitle'];
194
	}
195
	else{
196
		chartData.subtitle = null;
197
	}
198

    
199

    
200
	if(selectedData['fields'].length == 1 && selectedData['fields'][0]['type'] == 'pie'){
201
		chartData.xAxis.title.text = null;
202
		chartData.yAxis[0].title.text = null;
203
		$("#zoommessage").hide();
204
	}
205

    
206
	//chartData.xAxis.title.text = selectedData['xaxis']['name'];
207
	var today = new Date();
208
	var dd = today.getDate();
209
	var mm = today.getMonth()+1; //January is 0!
210

    
211
	var yyyy = today.getFullYear();
212
	chartData.credits.text = "from OpenAIRE via HighCharts (date: " + dd + "/" + mm + "/" + yyyy +")";
213

    
214
	if(selectedData['stacking']!=undefined){
215
                chartData['plotOptions']['column']['stacking'] = selectedData['stacking'];
216
                chartData['plotOptions']['area']['stacking'] = selectedData['stacking'];
217
                chartData['plotOptions']['areaspline']['stacking'] = selectedData['stacking'];
218
        }
219

    
220
	chartData.plotOptions['pie']['dataLabels']['formatter'] = function() {
221
		return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 2) +' %';
222
	};
223

    
224
	if(chartData.series.length > 4){
225
		chartData.legend.layout = 'horizontal';
226
		chartData.legend.align = 'center';
227
		chartData.legend.verticalAlign = 'bottom';
228
		chartData.legend.x = null;
229
		chartData.legend.y = null;
230
		chartData.legend.floating = false;
231
		//chartData.legend.itemStyle = new Object();
232
		//chartData.legend.itemStyle.margin = "4px";
233
	}
234

    
235
	if(selectedData['type'] == 'scatter'){
236
		if(selectedData['color'] == 'yes')
237
			chartData.tooltip.formatter = function() { return '<b>'+ this.series.name +'</b><br/>'+ chartData['xAxis']['title']['text']+ ': '+ this.x +'<br/>'+ chartData['yAxis'][0]['title']['text']+': '+ this.y ;};
238
		else if(selectedData['group'] != '')
239
			chartData.tooltip.formatter = function() { return '<b>'+ this.point.name +'</b><br/>'+ chartData['xAxis']['title']['text']+ ': '+ this.x +'<br/>'+ chartData['yAxis'][0]['title']['text']+': '+ this.y ;};
240
		else
241
			chartData.tooltip.formatter = function() { return chartData['xAxis']['title']['text']+ ': '+ this.x +'<br/>'+ chartData['yAxis'][0]['title']['text']+': '+ this.y ;};
242
		chartData['chart']['type'] = 'scatter';
243
	}
244
	else {
245
			chartData.tooltip.percentageDecimals = 1;
246
			chartData.tooltip.valueDecimals = 1;
247
			 if(selectedData['fields'][0]['type'] != 'pie'){
248
                                //chartData.tooltip.headerFormat = '<span style="font-size:10px">{point.key}</span><table>';
249
                                //chartData.tooltip.pointFormat = '<tr><td style="color:{series.color};padding:0">{series.name}:</td>'+'<td style="padding:0"><b>{point.y}</b></td></tr>';
250
                                //chartData.tooltip.footerFormat = '</table>';
251
                                chartData.tooltip.shared = true;
252
                                chartData.tooltip.useHTML = true;
253
                        }
254
                        //else
255
			chartData.tooltip.formatter = function() {
256
				if(selectedData['fields'][0]['type']!='pie'){
257
					/*//var ind = chart.xAxis[0].categories.indexOf(this.x);
258
					var str = '';
259
					if(this.point.config.name)
260
						str += '<b>'+ this.point.config.name +'</b><br/>';
261
					//str += this.x + '<br />';
262
					//var myseries = chart.series;
263
					//for(var i=0;i<myseries.length;i++){
264
					//	str += myseries[i].name + ":" + numberWithCommas(myseries[i].data[ind].y) + "<br />";
265
					//}
266
					str += this.series.name + ': '+ '<b>' + numberWithCommas(this.y) + '</b><br/>';
267
					str += chart.xAxis[0].axisTitle.textStr + ": <b>" + this.x + '</b>';
268
					return str;*/
269
					var s = '<b>'+ this.x +'</b>';
270

    
271
                			$.each(this.points, function(i, point) {
272
                    				s += '<br/><span style="color:'+point.series.color+'">'+ point.series.name +'</span>: '+
273
                        			numberWithCommas(point.y);
274
                			});
275

    
276
                			return s;
277
				}
278
				else{
279
					var name;
280
					if(selectedData['fieldsheaders'].length >0)
281
						name = selectedData['fieldsheaders'][0];
282
					else if(selectedData['yaxisheaders'].length>0)
283
						name = selectedData['yaxisheaders'][0];
284
					else
285
						name = "number";
286
					return '<b>'+ this.point.config.name +'</b>: ' + Highcharts.numberFormat(this.percentage, 2) +' %<br/>(' + name + ": " + numberWithCommas(this.y) +")";
287
				}
288
			};
289
		if(selectedData['fields'].length==1)
290
			chartData['chart']['type'] = selectedData['fields'][0]['type'];
291

    
292
	}
293
	if('theme' in selectedData){
294
		highchartsOptions = Highcharts.setOptions(themes[selectedData['theme']][1]);
295
	}
296
	else
297
		highchartsOptions = Highcharts.setOptions(themes[0][1]);
298

    
299

    
300
	//alert('Found ' + document.getElementsByTagName('div').length + ' divs');
301

    
302
	if(mywidth>0){
303
		if(wflag)
304
			chartData.chart.width = mywidth * $(document).width() /100;
305
		else
306
			chartData.chart.width = mywidth;
307
	}
308
	else
309
		chartData.chart.width = 90 * $(document).width() / 100;
310
	if(myheight>0){
311
                if(hflag)
312
                        chartData.chart.height = myheight * $(document).height() /100;
313
                else
314
                        chartData.chart.height = myheight;
315
        }
316
	else
317
		chartData.chart.height = 80 * $(document).height() /100;
318

    
319
	chartData.exporting = JSON.parse( '{ "url" : "<?php echo $export_server ?>" }');
320
	
321
	chart = new Highcharts.Chart(chartData, function(chart){
322
		var series = chart.series;
323
		var i=0;
324
		for(; i<series.length; i++){
325
			if( series[i].legendItem && series[i].checkbox) {
326
        			series[i].checkbox.style.marginLeft = '18px';
327
    			}
328
		}
329
	});
330

    
331

    
332
	//chart.setSize(mywidth, myheight, false);
333
	//alert(JSON.stringify(chartData));
334
	if(selectedData['in'] != undefined && selectedData['in'].length>0){
335
		if(chartData.xAxis.labels != undefined) chartData2.xAxis.labels = chartData.xAxis.labels
336
		if(chartData.title != undefined) {chartData2.title = new Object(); chartData2.title.text = chartData.title.text;}
337
		if(chartData.subtitle != undefined) {chartData2.subtitle = new Object(); chartData2.subtitle.text = chartData.subtitle.text;}
338
		chartData2.xAxis.title.text = chartData.xAxis.title.text;
339
		chartData2.yAxis[0].title.text = chartData.yAxis[0].title.text;
340
		chartData2.credits.text = chartData.credits.text;
341
		chartData2.plotOptions['pie']['dataLabels']['formatter'] = chartData.plotOptions['pie']['dataLabels']['formatter'];
342
		chartData2.tooltip = chartData.tooltip;
343
		chartData2['chart']['type'] = chartData['chart']['type'];
344
		chartData2['chart']['renderTo'] = 'chart2';
345
		chartData2['xAxis']['plotLines'] = chartData['xAxis']['plotLines'];
346
		chartData2['xAxis']['plotBands'] = chartData['xAxis']['plotBands'];
347
		if(chartData['chart']['height'] != undefined)
348
			chartData2['chart']['height'] = chartData['chart']['height'];
349
		if(chartData['chart']['width'] != undefined)
350
			chartData2['chart']['width'] = chartData['chart']['width'];
351
		if(selectedData['xStyle'] != undefined){
352
		        chartData2.xAxis.labels = labelsforx(selectedData['xStyle'],selectedData['emp']);
353
		}
354
		else{
355
		        var temp = new Object(); temp['r'] = '-'; temp['s'] = '-'; temp['l'] = '-';
356
		        chartData2.xAxis.labels = labelsforx(temp,selectedData['emp']);
357
		}
358
		if(selectedData['stacking']!=undefined){
359
		        chartData2['plotOptions']['column']['stacking'] = selectedData['stacking'];
360
		        chartData2['plotOptions']['area']['stacking'] = selectedData['stacking'];
361
		        chartData2['plotOptions']['areaspline']['stacking'] = selectedData['stacking'];
362
		}
363

    
364
		if(chartData2.series.length > 4)
365
                	chartData2.legend = chartData.legend;
366
		//chartData.plotOptions.column.pointWidth = 30;
367
		//chartData2.plotOptions.column.pointWidth = 30;
368
		chart2 = new Highcharts.Chart(chartData2, function(chart2){
369
	        	var series = chart2.series;
370
	        	var i=0;
371
	        	for(; i<series.length; i++){
372
	        	        if( series[i].legendItem && series[i].checkbox) {
373
	        	                series[i].checkbox.style.marginLeft = '18px';
374
	        	        }
375
	        	}
376
		});
377

    
378
	}
379
	credits();
380
}
381

    
382

    
383
function setSelections(){
384
	var str = "<input type='radio' name='sel' checked value='not'/>"+selectedData['in'][0]['text']+"&nbsp&nbsp&nbsp<input type='radio' name='sel' value='cumulate'/>Cumulative" ;
385
	$("#selections").empty().append(str);
386

    
387
	$("input[name='sel']").live("click",function(){
388
		if($(this).val() == "cumulate"){
389
			$("#chart").hide();
390
			$("#chart2").show();
391
		}
392
		else{
393
			$("#chart2").hide();
394
			$("#chart").show();
395
		}
396
	});
397
}
398

    
399
function controlsforfilters(){
400
	$("a.all").live("click",function(){
401
		$(this).siblings('.filterForm').find('input').attr("checked","checked");
402
		newValues($(this).siblings('.filterForm').find('input')[0]);
403
		return false;
404
	});
405

    
406
	$("a.none").live("click",function(){
407
                $(this).siblings('.filterForm').find('input').removeAttr("checked");
408
		newValues($(this).siblings('.filterForm').find('input')[0]);
409
		return false;
410
        });
411

    
412
	$(".formContainer input").live("click",function(){
413
		newValues(this);
414
	});
415
}
416

    
417
function newValues(obj){
418
	var field = $(obj).parent().attr('id');
419
	var myfilters = selectedData['filters'];
420
	var thisfilter;
421
	for(var i=0;i<selectedData['incfilters'].length;i++){
422
		if(selectedData['incfilters'][i]['name'] == field){
423
			thisfilter = selectedData['incfilters'][i];
424
			break;
425
		}
426
	}
427

    
428
	//change the url params
429
	//if is it checked
430
	if($(obj).is(":checked")){
431
		$(obj).parents(".filter").find("a.none").show();
432
		var flag = false;
433
		var i;
434
		for(i=0;i<myfilters.length;i++){
435
			if(myfilters[i]['name'] == field){
436
				flag=true;
437
				break;
438
			}
439
		}
440
		//if there is already such a filter delete all values and insert all the checked
441
		if(flag){
442
			myfilters[i].values = new Array();
443
			$(obj).parent().find("input:checked").each(function(){
444
				myfilters[i].values.push($(this).val());
445
			});
446
			//myfilters[i].values.push($(obj).val());
447
		}
448
		//if there is no such filter
449
		else{
450
			//create one
451
			var newfilter = new Object();
452
			newfilter.name = field;
453
			newfilter.values = new Array();
454
			var ch = $(obj).parent().find("input:checked");
455
			$(ch).each(function(){
456
				newfilter.values.push($(this).val());
457
			});
458
			//newfilter.values[0] = $(obj).val();
459
			myfilters.push(newfilter);
460
		}
461
	}
462
	//if it was unchecked
463
	else{
464
		//there should be already such a filter
465
		var flag = false;
466
                var i;
467
                for(i=0;i<myfilters.length;i++){
468
                        if(myfilters[i]['name'] == field){
469
                                flag=true;
470
                                break;
471
                        }
472
                }
473
		//remove the value
474
                if($(obj).parent().find("input:checked").length == 0){
475
                        $(obj).parents(".filter").find("a.none").hide();
476
                        myfilters[i].values = new Array();
477
                }
478
                else{
479
                        var j;
480
                        for(j=0;j<myfilters[i].values.length;j++){
481
                                if(myfilters[i].values[j] == $(obj).val()){
482
                                        myfilters[i].values.splice(j,1);
483
                                        break;
484
                                }
485
                        }
486
                }
487

    
488

    
489
		//if no more values, add the values in the incfilter list and if it is all remove the filter
490
		if(myfilters[i].values.length == 0){
491
			if(thisfilter.values[0]=="all")
492
				myfilters.splice(i,1);
493
			else
494
				myfilters[i].values = thisfilter.values;
495
		}
496
	}
497
	//ajax call to get the new data
498
	$.ajax({
499
	   type: "GET",
500
	   url: "ajaxRouter9.php",
501
	   data: "com=query&type=chart&data="+encodeURIComponent(JSON.stringify(selectedData)),  
502
	   success: function(resp){
503
		 // we have the response
504
		chartDataFromServer = JSON.parse(resp);
505
		renderChart();
506
		},
507
	   error: function(e){
508
		 alert('Error: ' + e);
509
	   }
510
	});
511

    
512
}
513

    
514

    
515
function labelsforx(style, emp){
516
	var st = Object();
517
	st.justify = null;
518
	st.style = Array();
519
	st.style['font-size'] = '8px';
520
	st.formatter = null;
521

    
522
	if(style['r'] != null && style['r'] != "-"){
523
		st.rotation = style['r'];
524
		st.y =25;
525
	}
526
	if(style['s'] != null && style['s'] != "-")
527
		st.step = style['s'];
528
	if(style['l'] != null && style['l'] != "-")
529
		st.staggerLines = style['l'];
530

    
531
	if(style['ft'] != null && style['ft'] != "-"){
532
		if(style['wt'] != null && style['wt'] != "-")
533
			st.formatter = function(){
534
				eflag = false;
535
				for(var e=0;e<emp.length;e++){
536
                                	if(this.value == emp[e]){
537
                                        	eflag = true;
538
                                                break;
539
                                        }
540
                                }
541

    
542
				if (typeof this.value == 'string' || this.value instanceof String){
543
					var ar = this.value.split(" ");
544
					var str = '';
545
					if(ar.length == 1){
546
						if(eflag) return '<span style="fill:red;">' + this.value.substr(0,selectedData['xStyle']['ft']) + '</span>';
547
						else return this.value.substr(0,selectedData['xStyle']['ft']);
548
					}
549
					for(var i=0;i<ar.length;i++) {
550
						str +=ar[i].substr(0,selectedData['xStyle']['wt'])+' ';
551
					}
552
					if(eflag) return '<span style="fill:red;">' + str.substr(0,selectedData['xStyle']['ft']) + '</span>';
553
					else return str.substr(0,selectedData['xStyle']['ft']);
554
				}
555
				else
556
					if(eflag) return '<span style="fill:red;">' + this.value + '</span>';
557
			};
558
		else
559
			st.formatter = function(){
560
				eflag = false;
561
                                for(var e=0;e<emp.length;e++){
562
                                        if(this.value == emp[e]){
563
                                                eflag = true;
564
                                                break;
565
                                        }
566
                                }
567

    
568
				if (typeof this.value == 'string' || this.value instanceof String){
569
					if(this.value.length>selectedData['xStyle']['ft'])
570
						if(eflag) return '<span style="fill:red;">' + this.value.substr(0,selectedData['xStyle']['ft']) + "..." + '</span>';
571
						else return this.value.substr(0,selectedData['xStyle']['ft']) + "...";
572
					else
573
						if(eflag) return '<span style="fill:red;">' + this.value + '</span>';
574
						else return this.value;
575
				}
576
				else return this.value;
577
			};
578
	}
579
	else if(style['wt'] != null && style['wt'] != "-")
580
		st.formatter = function(){
581
				eflag = false;
582
                                for(var e=0;e<emp.length;e++){
583
                                        if(this.value == emp[e]){
584
                                                eflag = true;
585
                                                break;
586
                                        }
587
                                }
588
				if (typeof this.value == 'string' || this.value instanceof String){
589
					var ar = this.value.split(" ");
590
					var str = '';
591
					if(ar.length == 1)
592
						if(eflag) return '<span style="fill:red;">' + this.value + '</span>';
593
 						else return this.value;
594
					for(var i=0;i<ar.length;i++) {
595
						str +=ar[i].substr(0,selectedData['xStyle']['wt'])+' ';
596
					}
597
					if(eflag) return '<span style="fill:red;">' + str + '</span>';
598
					else return str
599
				}
600
				else
601
					if(eflag) return '<span style="fill:red;">' + this.value + '</span>';
602
			};
603
	else{
604
		st.formatter = function(){
605
                	for(var e=0;e<emp.length;e++){
606
                        	if(this.value == emp[e]){
607
					return '<span style="fill:red;">' + this.value + '</span>';
608
                                }
609
                        }
610
			return this.value;
611
		};
612
	}
613
	return st;
614
}
615

    
616
function isInt(n) {
617
   return typeof n === 'number' && n % 1 == 0;
618
}
619

    
620
function numberWithCommas(num){
621
	if(isInt(num)){
622
		var array = num.toString().split('');
623
		var index = -3;
624
		var len = array.length;
625
		while((len + index) > 0){
626
			array.splice(index, 0 , ',');
627
			index -= 4;
628
		}
629
		return array.join('');
630
	}
631
	else
632
		return Math.round(num*100)/100;
633
}
634

    
635
function credits(){
636
	var today = new Date();
637
	var dd = today.getDate();
638
	var mm = today.getMonth()+1; //January is 0!
639
	var yyyy = today.getFullYear();
640
	var cr = document.getElementById("credits");
641
	cr.innerHTML = "from OpenAIRE via HighCharts (date: " + dd + "/" + mm + "/" + yyyy +")";
642
}
643

    
644
function renderfilters(){
645
	var container = document.getElementById("filters");
646
	if(filterData!=null){
647
		var len = filterData.length;
648
		for(var i=0;i<len;i++){
649
			//checkboxes
650
			if(filterData[i].values != undefined){
651
				var str = "<div class='filter'><div class='filterHeader'><p>"+filterData[i].showname+"</p><input type='hidden' value='"+filterData[i].name+"' class='filtername'/></div><a class='all' href='#'>select all</a><a class='none' href='#' style='display:none;float:right'>clear</a><div class='filterForm'><div class='formContainer'><form id='"+filterData[i].name+"' class='filterform'>";
652
				for(var v=0;v<filterData[i].values.length;v++){
653
					str+="<input type='checkbox' value='"+filterData[i].values[v]+"' name='form"+filterData[i].name+"'>"+filterData[i].values[v]+"<br>";
654
				}
655
				str +=	"</form></div></div></div>";
656
				$(container).append(str);
657
			}
658
			//slider
659
			else{
660
				var str = "<div class='filter'><div class='filterHeader'><p>"+filterData[i].showname+"</p><input type='hidden' value='"+filterData[i].name+"' class='filtername'/></div>";
661
				str += "<div class='filter-slider'><div class='slider-container'><div id='slider"+filterData[i].name+"' class='ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all' aria-disabled='false'></div></div>";
662

    
663
				str += "<span class='price-tip slider-user-min'><span id='userMin"+filterData[i].name+"'>"+filterData[i]['min']+"</span></span>";
664
				str += "<span class='price-tip slider-user-max'><span id='userMax"+filterData[i].name+"'>"+filterData[i]['max']+"</span></span>";
665
				str += "<span class='min' style='display:none'><span id='productMin"+filterData[i].name+"'>"+filterData[i]['min']+"</span></span>";
666
				str += "<span class='max' style='display:none'><span id='productMax"+filterData[i].name+"'>"+filterData[i]['max']+"</span></span>";
667
				str += "</div></div>";
668
				$(container).append(str);
669
				myFilter = filterData[i];
670
				$(function(){
671
					$("#slider"+myFilter.name).slider({
672
						step: 1,
673
						range: true,
674
						min: parseInt(myFilter['min']),
675
						max: parseInt(myFilter['max']),
676
						values: [parseInt(myFilter['min']), parseInt(myFilter['max'])],
677
						change: function(event, ui){
678
							$(this).parent().parent().find('.slider-user-min').find('span').html(ui.values[0]);
679
							$(this).parent().parent().find('.slider-user-max').find('span').html(ui.values[1]);
680
							slidermove(myFilter.name,ui.values[0],ui.values[1]);
681
						}
682
					});
683
				});
684
			}
685
		}
686
	}
687
	else{
688
		$(container).css("width","0px");
689
	}
690
}
691

    
692
function slidermove(field,min,max){
693
	var myfilters = selectedData['filters'];
694
	var len = myfilters.length;
695
	for(var i=0;i<len;i++){
696
		if(myfilters[i]['name'] == field){
697
			myfilters[i]['min'] = min;
698
			myfilters[i]['max'] = max;
699
			break;
700
		}
701
	}	
702

    
703

    
704
	//ajax call to get the new data
705
	$.ajax({  
706
	   type: "GET",  
707
	   url: "ajaxRouter9.php",
708
	   data: "com=query&type=chart&data="+encodeURIComponent(JSON.stringify(selectedData)),  
709
	   success: function(resp){  
710
		 // we have the response 
711
		chartDataFromServer = JSON.parse(resp);
712
		renderChart();
713
		},  
714
	   error: function(e){  
715
		 alert('Error: ' + e);  
716
	   }
717
	});
718
}
719
</script>
720
</head>
721
<body>
722
<div id="filters"></div>
723
<div id="charts-main" style="margin-right:10px;float:left">
724
	<div id='chart' style="width:95%;height:95%;margin:auto;"></div>
725
	<div id='chart2' style="width:95%;height:95%;margin:auto;display:none;"><!-- SECTION FOR THE GRAPHIC --></div>
726

    
727
	<div id="selections" style="width:95%;height:5%;margin:auto;text-align:center;font-family:Verdana;font-size:small;color:#000"></div>
728
	<div id='credits'></div>
729
	<div id='zoommessage'>select an area to zoom in</div>
730
</div>
731
</body>
732
</html>
733

    
(5-5/21)