--- a/ckanext/ga_report/public/scripts/ckanext_ga_reports.js +++ b/ckanext/ga_report/public/scripts/ckanext_ga_reports.js @@ -1,15 +1,26 @@ - var CKAN = CKAN || {}; CKAN.GA_Reports = {}; CKAN.GA_Reports.render_rickshaw = function( css_name, data, mode, colorscheme ) { var graphLegends = $('#graph-legend-container'); + + if (!Modernizr.svg) { + $("#chart_"+css_name) + .html( '<div class="alert">Your browser does not support vector graphics. No graphs can be rendered.</div>') + .closest('.rickshaw_chart_container').css('height',50); + var myLegend = $('<div id="legend_'+css_name+'"/>') + .html('(Graph cannot be rendered)') + .appendTo(graphLegends); + return; + } var myLegend = $('<div id="legend_'+css_name+'"/>').appendTo(graphLegends); var palette = new Rickshaw.Color.Palette( { scheme: colorscheme } ); $.each(data, function(i, object) { object['color'] = palette.color(); }); + // Rickshaw renders the legend in reverse order... + data.reverse(); var graphElement = document.querySelector("#chart_"+css_name); @@ -24,21 +35,17 @@ graph: graph, orientation: 'left', tickFormat: Rickshaw.Fixtures.Number.formatKMBT, - element: document.getElementById('y_axis_'+css_name), + element: document.getElementById('y_axis_'+css_name) } ); var legend = new Rickshaw.Graph.Legend( { element: document.querySelector('#legend_'+css_name), graph: graph } ); - var hoverDetail = new Rickshaw.Graph.HoverDetail( { + var shelving = new Rickshaw.Graph.Behavior.Series.Toggle( { graph: graph, - formatter: function(series, x, y) { - var date = '<span class="date">' + new Date(x * 1000).toUTCString() + '</span>'; - var swatch = '<span class="detail_swatch" style="background-color: ' + series.color + '"></span>'; - var content = swatch + series.name + ": " + parseInt(y) + '<br>' + date; - return content; - } + legend: legend } ); + myLegend.prepend('<div class="instructions">Click on a series below to isolate its graph:</div>'); graph.render(); }; @@ -48,24 +55,29 @@ * Sparkline graphs should be drawn. * Note that they cannot be drawn sooner. */ + var created = false; $('a[href="#totals"]').on( 'shown', - function() { - var sparkOptions = { - enableTagOptions: true, - type: 'line', - width: 100, - height: 26, - chartRangeMin: 0, - spotColor: '', - maxSpotColor: '', - minSpotColor: '', - highlightSpotColor: '000000', - lineColor: '3F8E6D', - fillColor: 'B7E66B' - }; - $('.sparkline').sparkline('html',sparkOptions); - } + function() { + if (!created) { + var sparkOptions = { + enableTagOptions: true, + type: 'line', + width: 100, + height: 26, + chartRangeMin: 0, + spotColor: '', + maxSpotColor: '', + minSpotColor: '', + highlightSpotColor: '000000', + lineColor: '3F8E6D', + fillColor: 'B7E66B' + }; + $('.sparkline').sparkline('html',sparkOptions); + created = true; + } + $.sparkline_display_visible(); + } ); }; @@ -88,9 +100,22 @@ } legend_name = '#legend_'+legend_name; $('#graph-legend-container > *').hide(); + $('#graph-legend-container .instructions').show(); $(legend_name).show(); } ); +}; + +CKAN.GA_Reports.bind_month_selector = function() { + var handler = function(e) { + var target = $(e.delegateTarget); + var form = target.closest('form'); + var url = form.attr('action')+'?month='+target.val()+window.location.hash; + window.location = url; + }; + var selectors = $('select[name="month"]'); + assert(selectors.length>0); + selectors.bind('change', handler); }; /*