--- a/ckanext/ga_report/public/scripts/ckanext_ga_reports.js +++ b/ckanext/ga_report/public/scripts/ckanext_ga_reports.js @@ -45,6 +45,7 @@ graph: graph, legend: legend } ); + myLegend.prepend('
Click on a series below to isolate its graph:
'); graph.render(); }; @@ -54,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(); + } ); }; @@ -81,7 +87,7 @@ * Show the correct rickshaw graph in the sidebar. * Not to be called before all graphs load. */ - $('a[data-toggle="hashchange"]').on( + $('a[data-toggle="hashtab"]').on( 'shown', function(e) { var href = $(e.target).attr('href'); @@ -94,39 +100,23 @@ } legend_name = '#legend_'+legend_name; $('#graph-legend-container > *').hide(); + $('#graph-legend-container .instructions').show(); $(legend_name).show(); } ); + /* The first tab might already have been shown */ + $('li.active > a[data-toggle="hashtab"]').trigger('shown'); }; CKAN.GA_Reports.bind_month_selector = function() { var handler = function(e) { var target = $(e.delegateTarget); var form = target.closest('form'); - form.attr('action', form.attr('action')+window.location.hash); - form.submit(); + 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); }; -/* - * Custom bootstrap plugin for handling data-toggle="hashchange". - * Behaves like data-toggle="tab" but I respond to the hashchange. - * Page state is memo-ized in the URL this way. Why doesn't Bootstrap do this? - */ -$(function() { - var mapping = {}; - $('a[data-toggle="hashchange"]').each( - function(i,link) { - link = $(link); - mapping[link.attr('href')] = link; - } - ); - $(window).hashchange(function() { - var link = mapping[window.location.hash]; - if (link) { link.tab('show'); } - }); -}); -