Frontend now only needs one set of data

Add README documenting data formats

README.md

@@ -0,0 +1,34 @@
+# Overview
+
+This project consists of a PHP backend which can parse CSV files containing
+bank account transaction information, and a JavaScript front-end which can
+analyse and display stats about the parsed data.
+
+# Data formats
+
+## Backend
+
+The backend expects a 'Statements' directory containing CSV files with the
+following fields:
+
+- Date (dd/mm/yy)
+- Amount
+- Description
+
+## Frontend
+
+The JS frontend uses a map containing one entry for each month's worth of
+transactions. At present it expects this map to be assigned to a variable
+called 'data'. Each month consists of an array of transactions, which are
+themselves objects containing the following properties:
+
+- Date - currently a serialisation of a PHP DateTime object, e.g. <br>
+`{"date":"2009-01-05 00:00:00","timezone_type":3,"timezone":"UTC"}`
+- Amount
+- Description - a user-friendly description of the transaction
+- RawDescription - the raw description from the statement (not used)
+- Category - user-defined category for the transaction (optional)
+- Type - user-defined type for the transaction (optional)
+
+If the category has the special value `(Ignored)`, it is excluded from
+certain calculates and graphs and showed as greyed out in tables.

data.php

@@ -203,5 +203,4 @@
  });
 
 ?>
-var transData = <?PHP echo json_encode($transData); ?>;
-var monthData = <?PHP echo json_encode($rawmonths); ?>;
+var data = <?PHP echo json_encode($rawmonths); ?>;

index.html

@@ -23,6 +23,23 @@
    }
 
    $(function() {
+    var transData = [{label: 'Income', data: []}, {label: 'Expense', data: []}];
+
+    $.each(data, function(month, entries) {
+     var split = month.split('-');
+     var timestamp = new Date(split[0], split[1] - 1).getTime();
+     var sum = [0, 0];
+
+     $.each(entries, function() {
+      if (this.Category == '(Ignored)') { return; }
+
+      sum[this.Amount < 0 ? 1 : 0] += this.Amount;
+     });
+
+     transData[0].data.push([timestamp, sum[0]]);
+     transData[1].data.push([timestamp, sum[1]]);
+    }); 
+
     $.plot($('#history'), transData, {
       xaxis: { mode: 'time', timeformat: '%y/%m'},
       series: {
@@ -67,7 +84,7 @@
 
       var pieData = {};
       var table = $('#historytable table');
-      $.each(monthData[date], function(index, trans) {
+      $.each(data[date], function(index, trans) {
        if (incoming != trans.Amount > 0) { return; }
 
        var tr = $('<tr/>').addClass('data').appendTo(table);
@@ -88,14 +105,14 @@
        }
       });
 
-      var data = [];
+      var seriesData = [];
       $.each(pieData, function(category, amount) {
-       data.push({ label: category + ' (' + Math.round(amount) + ')', data: amount });
+       seriesData.push({ label: category + ' (' + Math.round(amount) + ')', data: amount });
       });
 
-      data.sort(function(a, b) { return b.data - a.data; });
+      seriesData.sort(function(a, b) { return b.data - a.data; });
 
-      $.plot($('#expense'), data, {
+      $.plot($('#expense'), seriesData, {
         series: { pie: { show: true, innerRadius: 0.5 } }
       });
      }