Permalink
Browse files

stats overview page

  • Loading branch information...
1 parent 9d4fe9a commit d9b3f8d7a815eb3a4aa2da7dbe7d2b188e006347 @potch potch committed Oct 17, 2011
@@ -18,7 +18,7 @@ <h2>{{ _('Most Used Applications') }}</h3>
<div class="piechart"></div>
<table data-metric="apps">
</table>
- <a href="applications/">{{ _('See more applications&hellip;') }}</a>
+ <a href="usage/applications/">{{ _('See more applications&hellip;') }}</a>
</div>
</div>
<div class="toplist">
@@ -27,7 +27,7 @@ <h2>{{ _('Most Used Languages') }}</h3>
<div class="piechart"></div>
<table data-metric="locales">
</table>
- <a href="languages/">{{ _('See more languages&hellip;') }}</a>
+ <a href="usage/languages/">{{ _('See more languages&hellip;') }}</a>
</div>
</div>
<div class="toplist">
@@ -36,7 +36,7 @@ <h2>{{ _('Most Used OSes') }}</h3>
<div class="piechart"></div>
<table data-metric="os">
</table>
- <a href="os/">{{ _('See more operating systems&hellip;') }}</a>
+ <a href="usage/os/">{{ _('See more operating systems&hellip;') }}</a>
</div>
</div>
</div>
View
@@ -6,7 +6,6 @@
max-width: 1280px;
width: auto;
min-width: 1024px;
- padding-bottom: 500px;
padding-left: 20px;
padding-right: 20px;
.header-search {
@@ -172,99 +171,45 @@ table tbody tr {
overflow: hidden;
}
.toplist {
+ overflow: hidden;
float: left;
width: 31%;
padding: 0;
margin-left: 3.5%;
+ &:first-child {
+ margin-left: 0;
+ }
+ h3 {
+ margin: 0 0 .2em 0;
+ }
+ .highcharts-tooltip {
+ position: absolute;
+ top: 0 !important;
+ left: 0 !important;
+ }
+ table {
+ width: 100%;
+ height: 160px;
+ margin: .7em 0;
+ }
+ tr:first-child {
+ border-top: 0;
+ }
+ td {
+ text-align: right;
+ padding: 0;
+ line-height: 2em;
+ &:first-child {
+ text-align: left;
+ }
+ &:last-child {
+ text-align: left;
+ font-size: 90%;
+ width:40px;
+ padding-left: .3em;
+ }
+ }
}
-.toplist:first-child {
- margin-left: 0;
-}
-.toplist .statbox {
- padding: 1em;
- margin: 0;
-}
-.toplist h3 {
- margin: 0 0 .2em 0;
-}
-#toplist1 {
- width: 210px;
- margin: .5em auto 0 auto;
-}
-.toplist tr:first-child {
- border-top: 0;
-}
-.toplist table {
- width: 100%;
- height: 160px;
- margin: .7em 0;
-}
-.toplist td {
- text-align: right;
- padding: 0;
- line-height: 2em;
-}
-.toplist td:last-child {
- text-align: left;
- font-size: 90%;
- width:40px;
- padding-left: .3em;
-}
-.toplist td:first-child {
- text-align: left;
-}
-
-/**
- * Rules for Report Menu
-**/
-
-.report-menu nav {
- display: block;
-}
-.report-menu h3 {
- margin-top: 0;
-}
-.report-menu ul li {
- font-size: 110%;
-}
-.report-menu ul li ul li {
- font-size: 90%;
-}
-.report-menu ul li ul li a {
- margin: .4em 0;
-}
-.report-menu ul li a {
- margin: .4em 0;
-}
-.report-menu ul ul {
- margin-left: 25px;
-}
-.report-menu ul li.selected > a {
- position: relative;
- color: #333;
-}
-.report-menu ul li.selected > a:hover {
- text-decoration: none;
-}
-
-/* Makes the triangles for selected reports */
-.report-menu ul li.selected > a:before {
- content: "\00a0";
- display: block; /* reduce the damage in FF3.0 */
- position: absolute;
- width: 0;
- height: 0;
- top: 20%; /* value = - border-top-width - border-bottom-width */
- left: 10px; /* value = (:before right) + (:before border-right) - (:after border-right) */
- border: 5px solid transparent;
- border-left-color: #333;
- border-style: solid;
-}
-.report-menu ul li ul li.selected > a:before {
- border-width: 4px;
-}
-
-/* @end */
/**
* bar-chart tables
@@ -57,7 +57,7 @@
}
}
};
-
+ Highcharts.setOptions({ lang: { resetZoom: '' } });
var chart;
// which unit do we use for a given metric?
var metricTypes = {
@@ -85,6 +85,7 @@
fields = obj.fields ? obj.fields.slice(0,5) : ['count'],
data = obj.data,
series = {},
+ chartRange = {},
t, row, i, field, val;
// Initialize the empty series object.
@@ -179,33 +180,38 @@
var newConfig = $.extend(baseConfig, { series: chartData });
// set up dual-axes for the overview chart.
if (metric == "overview" && newConfig.series.length) {
- newConfig.yAxis = [
- { // Downloads
- title: {
- text: gettext('Downloads')
- },
- // min: 0,
- labels: {
- formatter: function() {
- return Highcharts.numberFormat(this.value, 0);
+ _.extend(newConfig, {
+ yAxis : [
+ { // Downloads
+ title: {
+ text: gettext('Downloads')
+ },
+ // min: 0,
+ labels: {
+ formatter: function() {
+ return Highcharts.numberFormat(this.value, 0);
+ }
}
+ }, { // Daily Users
+ title: {
+ text: gettext('Daily Users')
+ },
+ labels: {
+ formatter: function() {
+ return Highcharts.numberFormat(this.value, 0);
+ }
+ },
+ // min: 0,
+ opposite: true
}
- }, { // Daily Users
- title: {
- text: gettext('Daily Users')
- },
- labels: {
- formatter: function() {
- return Highcharts.numberFormat(this.value, 0);
- }
- },
- // min: 0,
- opposite: true
+ ],
+ tooltip: {
+ shared : true,
+ crosshairs : true
}
- ];
+ });
// set Daily Users series to use the right yAxis.
newConfig.series[1].yAxis = 1;
- newConfig.tooltip.shared = true;
}
newConfig.tooltip.formatter = tooltipFormatter;
@@ -228,6 +234,10 @@
if (chart) chart.destroy();
chart = new Highcharts.Chart(newConfig);
+ chartRange = chart.xAxis[0].getExtremes();
+ $("h1").click(function() {
+ chart.xAxis[0].setExtremes(chartRange.min, chartRange.max);
+ })
$chart.removeClass('loading');
});
})();
Oops, something went wrong.

0 comments on commit d9b3f8d

Please sign in to comment.