aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--NEWS3
-rw-r--r--tmpl/donations.html26
-rw-r--r--tmpl/donations_by_year.html28
-rw-r--r--tmpl/head_chart.html6
4 files changed, 63 insertions, 0 deletions
diff --git a/NEWS b/NEWS
index 01d4584..595fc9b 100644
--- a/NEWS
+++ b/NEWS
@@ -1,3 +1,6 @@
+
+- add donations graphs
+
Version 0.3
- sort transactions by category
diff --git a/tmpl/donations.html b/tmpl/donations.html
index fef42b4..435b95d 100644
--- a/tmpl/donations.html
+++ b/tmpl/donations.html
@@ -2,6 +2,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[% config.sitename %] Donations</title>
+ [% INCLUDE head_chart.html %]
</head>
<body>
[%- USE date(format='%Y/%m/%d') -%]
@@ -20,6 +21,31 @@
</ul>
<h3>Donations per year</h3>
+
+ <canvas id="donations_history_bar_chart" height="250" width="[% 80 + donations.by_year.keys.size * 65 %]"></canvas>
+
+ <script>
+
+ var barChartData = {
+ labels : ["[% donations.by_year.keys.sort.reverse.join('","') %]"],
+ datasets : [
+ {
+ fillColor : "#151f79",
+ strokeColor : "#101333",
+ data : [
+ [%- FOR year IN donations.by_year.keys.sort.reverse -%]
+ [%- donations.by_year.$year.total -%]
+ [%- IF ! loop.last() -%],[%- END -%]
+ [%- END %]]
+ }
+ ]
+
+ }
+
+ var myLine = new Chart(document.getElementById("donations_history_bar_chart").getContext("2d")).Bar(barChartData);
+
+ </script>
+
<ul>
[%- FOR year IN donations.by_year.keys.sort.reverse %]
<li><a href="donations_y_[% year %].html">[% year %]: [% donations.by_year.$year.total %] Euros</a></li>
diff --git a/tmpl/donations_by_year.html b/tmpl/donations_by_year.html
index f81325c..c9a963f 100644
--- a/tmpl/donations_by_year.html
+++ b/tmpl/donations_by_year.html
@@ -2,6 +2,7 @@
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[% config.sitename %]: Donations for [% year %]</title>
+ [% INCLUDE head_chart.html %]
</head>
<body>
<h1>Mageia.Org donations for year [% year %]</h1>
@@ -17,6 +18,33 @@
[%- END -%]
</ul>
<h3>Donations for each month</h3>
+
+ [% IF donations.by_year.$year.months.size > 1 %]
+ <canvas id="donations_history_bar_chart" height="250" width="[% 80 + donations.by_year.$year.months.size * 65 %]"></canvas>
+
+ <script>
+
+ var barChartData = {
+ labels : ["[% donations.by_year.$year.months.sort.join('","') %]"],
+ datasets : [
+ {
+ fillColor : "#151f79",
+ strokeColor : "#101333",
+ data : [
+ [%- FOR month IN donations.by_year.$year.months.sort -%]
+ [%- donations.by_month.$month.total -%]
+ [%- IF ! loop.last() -%],[%- END -%]
+ [%- END %]]
+ }
+ ]
+
+ }
+
+ var myLine = new Chart(document.getElementById("donations_history_bar_chart").getContext("2d")).Bar(barChartData);
+
+ </script>
+ [% END %]
+
<ul>
[%- FOR month IN donations.by_month.keys.sort -%]
[%- IF donations.by_month.$month.year == year -%]
diff --git a/tmpl/head_chart.html b/tmpl/head_chart.html
new file mode 100644
index 0000000..a808d98
--- /dev/null
+++ b/tmpl/head_chart.html
@@ -0,0 +1,6 @@
+ <script src="[% config.staticdir_url %]/Chart.js"></script>
+ <meta name = "viewport" content = "initial-scale = 1, user-scalable = no">
+ <style>
+ canvas{
+ }
+ </style>