API service

app.rb

@@ -35,10 +35,10 @@ class LedgerRbApp < Sinatra::Base
 
   get '/api/ledger/register/?' do
     param :period, String, default: nil
-    param :category, String, required: true
+    param :categories, String, required: true
 
-    { key: params[ :category ],
+    { key: params[ :categories ],
-      values: Ledger.register( params[ :period ], params[ :category ] ) }
+      values: Ledger.register( params[ :period ], params[ :categories ] ) }
       .to_json
   end
 

public/app/index.html

@@ -51,6 +51,7 @@
   <!-- APP -->
   <script src="/js/app.js"></script>
   <script src="/js/state.js"></script>
+  <script src="/js/services/API.js"></script>
   <script src="/js/controllers/AppCtrl.js"></script>
   <script src="/js/controllers/NavbarCtrl.js"></script>
   <script src="/js/controllers/BalanceCtrl.js"></script>

public/app/js/controllers/BalanceCtrl.js

@@ -1,6 +1,7 @@
 app.controller( 'BalanceCtrl',
-		[ '$scope', '$http', '$filter', 'ngTableParams',
+		[ '$scope', '$filter', 'ngTableParams', 'API',
-		  function ( $scope, $http, $filter, ngTableParams ) {
+		  function ( $scope, $filter, ngTableParams, API ) {
+		      console.log(API)
 		      $scope.xFunction = function () {
 			  return function ( d ) {
 			      return d.account;
@@ -101,12 +102,8 @@ app.controller( 'BalanceCtrl',
 			  };
 
 			  _($scope.balance.buckets).each( function( bucket ) {
-			      $http.get( '/api/ledger/balance', {
+			      API.balance( { period: period,
-				  params: {
+					     categories: bucket.categories } )
-				      period: period,
-				      categories: bucket.categories
-				  }
-			      } )
 				  .then( function ( response ) {
 				      bucket.data = _.chain( response.data )
 					  .map( function( account ) {
@@ -119,12 +116,8 @@ app.controller( 'BalanceCtrl',
 					  .value();
 				      _( bucket.data ).each(
 					  function ( account ) {
-					      $http.get( '/api/ledger/register', {
+					      API.register( { period: period,
-						  params: {
+							      categories: account.account } )
-						      period: period,
-						      category: account.account
-						  }
-					      } )
 						  .then( function ( response ) {
 						      $scope.balance.details[ account.account ] = response.data;
 						  } );
@@ -152,7 +145,7 @@ app.controller( 'BalanceCtrl',
 			  $scope.period_offset = $scope.dates_salaries.length - 1;
 		      };
 
-		      $http.get( '/api/ledger/dates_salaries' )
+		      API.dates_salaries()
 			  .then( function ( response ) {
 			      $scope.dates_salaries = response.data;
 
@@ -165,5 +158,11 @@ app.controller( 'BalanceCtrl',
 			      } );
 
 			  } );
+		      API.accounts()
+			  .then( function ( response ) {
+			      $scope.accounts = response.data.map( function( account_ary ) {
+				  return account_ary.join( ':' );
+			      } );
+			  } );
 		  }
 		] );

public/app/js/services/API.js

@@ -0,0 +1,29 @@
+app.service( 'API',
+	     [ '$http',
+	       function( $http ) {
+		   this.balance = function( params ) {
+		       return $http.get( '/api/ledger/balance', {
+			   params: {
+			       period: params.period,
+			       categories: params.categories
+			   }
+		       } );
+		   };
+
+		   this.register = function( params ) {
+		       return $http.get( '/api/ledger/register', {
+			   params: {
+			       period: params.period,
+			       categories: params.categories
+			   }
+		       } );
+		   };
+
+		   this.dates_salaries = function(  ) {
+		       return $http.get( '/api/ledger/dates_salaries' );
+		   };
+
+		   this.accounts = function(  ) {
+		       return $http.get( '/api/ledger/accounts' );
+		   };
+	       } ] );

public/app/js/templates/balance.tpl.html

@@ -5,7 +5,6 @@
       <h2>
 	From {{from_date | date:'longDate'}} <span data-ng-if="to_date">to {{to_date | date:'longDate'}}</span>
       </h2>
-    </material-toolbar>
       <div layout="horizontal" layout-align="center center" layout-padding>
 	<material-button class="material-theme-green"
 			 data-ng-click="before()"
@@ -16,7 +15,11 @@
 	<material-button class="material-theme-green"
 			 data-ng-click="after()"
 			 data-ng-class="{'disabled': period_offset == dates_salaries.length}">next</material-button>
+
+	<select data-ng-model="accounts.selected"
+		data-ng-options="account for account in accounts"></select>
       </div>
+    </material-toolbar>
     <material-toolbar>
       <h2 class="balance" data-ng-class="{'negative': balance.buckets[1].total - balance.buckets[0].total < 0, 'positive': balance.buckets[1].total - balance.buckets[0].total > 0}">
 	Balance: {{( balance.buckets[1].total - balance.buckets[0].total ) | number:2}} €