wip #201

src/admin_assets/js/pages/analytics.js

@@ -126,15 +126,19 @@ gapi.analytics.ready(function() {
 		 * first will be the start date and the second will be the end date.
 		 */
 		template:
-		  '<div class="DateRangeSelector">' +
-		  '  <div class="DateRangeSelector-item">' +
-		  '    <label>Start Date</label> ' +
-		  '    <input type="date">' +
-		  '  </div>' +
-		  '  <div class="DateRangeSelector-item">' +
-		  '    <label>End Date</label> ' +
-		  '    <input type="date">' +
-		  '  </div>' +
+		  '<div class="row">'+
+		  '<form class="form-horizontal">'+
+		  '<div class="DateRangeSelector form-group">' +
+		  '    <label class="control-label col-lg-2" localize>Start Date</label> ' +
+		  '<div class="col-lg-2">'+
+		  '    <input type="date" class="form-control">' +
+		  '</div>'+
+		  '    <label class="control-label col-lg-2" localize>End Date</label> ' +
+		  '<div class="col-lg-2">'+
+		  '    <input type="date" class="form-control">' +
+		  '</div>'+
+		  '</div>'+
+		  '</form>'+
 		  '</div>'
 	  });
 
@@ -230,9 +234,41 @@ gapi.analytics.ready(function() {
            }
            function setup_ga_data()
            {
+											 // Load the Visualization API and the piechart package.
+								  google.load('visualization', '1.0', {'packages':['corechart']});
+
+								  // Set a callback to run when the Google Visualization API is loaded.
+								  google.setOnLoadCallback(drawChart);
+
+								  // Callback that creates and populates a data table,
+								  // instantiates the pie chart, passes in the data and
+								  // draws it.
+								  function drawChart() {
+
+									// Create the data table.
+									var data = new google.visualization.DataTable();
+									data.addColumn('string', 'Topping');
+									data.addColumn('number', 'Slices');
+									data.addRows([
+									  ['Mushrooms', 3],
+									  ['Onions', 1],
+									  ['Olives', 1],
+									  ['Zucchini', 1],
+									  ['Pepperoni', 2]
+									]);
+
+									// Set chart options
+									var options = {'title':'How Much Pizza I Ate Last Night',
+												   'width':400,
+												   'height':300};
+
+									// Instantiate and draw our chart, passing in some options.
+									var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
+									chart.draw(data, options);
+								  }
 
            	 var dateRange1 = {
-				'start-date': '60daysAgo',
+				'start-date': '5daysAgo',
 				'end-date': 'yesterday'
 			  };
 			  var dateRangeSelector1 = new gapi.analytics.ext.DateRangeSelector({
@@ -256,7 +292,8 @@ gapi.analytics.ready(function() {
                  }
                }
              });
-
+            countryDataChart.set({query: dateRange1});
+
              countryDataChart.execute();
 
              var deviceDataChart = new gapi.analytics.googleCharts.DataChart({
@@ -275,7 +312,6 @@ gapi.analytics.ready(function() {
                  }
                }
              });
-             deviceDataChart.set({query: dateRange1});
              deviceDataChart.execute(); 
 
              var report = new gapi.analytics.report.Data({