Add OHLC chart for solds.

accountant/frontend/static/js/entries.js

@@ -79,6 +79,60 @@ accountantApp.controller(
         }]
     };
 
+    // Configure chart for entries.
+    $scope.soldChartConfig = {
+        options: {
+            chart: {
+                zoomType: 'x'
+            },
+            rangeSelector: {
+                selected: 0,
+            },
+            tooltip: {
+                crosshairs: true,
+                shared: true,
+                valueDecimals: 2,
+                valueSuffix: '€'
+            }
+        },
+        series: [{
+            type: "ohlc",
+            name: "Sold",
+            data: [],
+            dataGrouping : {
+                units : [[
+                    'week', // unit name
+                    [1] // allowed multiples
+                ], [
+                    'month',
+                    [1, 2, 3, 4, 6]
+                ]]
+            }
+        }],
+        title: {
+            text: "Sold evolution"
+        },
+        xAxis: {
+            type: "datetime",
+            dateTimeLabelFormats: {
+                month: "%e. %b",
+                year: "%Y"
+            }
+        },
+        yAxis: {
+            plotLines: [{
+                color: "orange",
+                width: 2,
+                value: 0.0
+            }, {
+                color: "red",
+                width: 2,
+                value: 0.0
+            }]
+        },
+        useHighStocks: true
+    };
+
     // Load categories, mainly to populate the pie chart.
     $scope.loadCategories = function() {
         $http.get("/api/categories", {
@@ -111,6 +165,27 @@ accountantApp.controller(
 
             // Note: expenses and revenues must be in the same order than in series[0].
             config.series[1].data = revenues.concat(expenses);
+
+            $scope.loadSolds();
+        });
+    };
+
+    $scope.loadSolds = function() {
+        $http.get("/api/solds", {
+            params: {
+                account: $scope.account.id,
+            }
+        }).success(function(data) {
+            var config = $scope.soldChartConfig;
+
+            config.series[0].data = [];
+
+            angular.forEach(data, function(entry) {
+                config.series[0].data.push([
+                    moment.utc(entry.operation_date).valueOf(),
+                    entry.open, entry.high, entry.low, entry.close
+                ]);
+            });
         });
     };
 
@@ -144,6 +219,8 @@ accountantApp.controller(
                 color: colors[3],
             }];
 
+            $scope.soldChartConfig.yAxis.plotLines[1].value = status.authorized_overdraft;
+
             $scope.loadCategories();
         });
     };

accountant/frontend/templates/index.html

@@ -20,10 +20,10 @@
 <!-- Chart row -->
 <div class="row">
   <!-- Sold evolution chart placeholder -->
-  <highchart id="entries-chart" config="entriesChartConfig" class="col-md-8"></highchart>
+  <highchart id="sold-chart" config="soldChartConfig" class="col-md-8"></highchart>
 
-  <!-- Expense category piechart -->
-  <highchart id="expense-categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart>
+  <!-- Category piechart -->
+  <highchart id="categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart>
 </div>
 
 <!-- Row with entry table -->

accountant/frontend/templates/layout.html

@@ -74,9 +74,6 @@
 
     <!-- Custom Javascript library for entries -->
     <script type="text/javascript" src="{{ url_for('frontend.static', filename='build/js/app.js') }}"></script>
-
-    <script type="text/javascript">
-    </script>
   </body>
 </html>