Julia Herron - wip

app.js

@@ -0,0 +1,55 @@
+var fideligard = angular.module('fideligard', ['ui.router', 'ngMaterial']);
+
+fideligard.config(function($stateProvider, $urlRouterProvider) {
+
+  $urlRouterProvider.otherwise('dashboard');
+
+  $stateProvider
+  .state('fideligard',
+    { url: '/',
+      templateUrl: 'dashboard.html',
+      controller: 'DashboardCtrl'
+  })
+  .state('fideligard.dashboard', {
+    url: 'dashboard',
+    views: {
+      'datepicker': {
+        templateUrl: 'templates/datepicker.html',
+        controller: 'DatePickerCtrl'
+      },
+      'stocks': {
+        templateUrl: 'templates/stocks.html',
+        controller: 'StocksCtrl'
+      }
+    }
+  })
+  .state('fideligard.dashboard.trade', {
+    url: '/trade?symbol?price?date',
+    views: {
+      '@fideligard': {
+        controller: 'TradeCtrl',
+        templateUrl: 'templates/trade.html'        
+      }
+    }
+  })
+  .state('fideligard.dashboard.transactions', {
+    url: '/transactions',
+    views: {
+      '@fideligard': {
+        templateUrl: "templates/transactions.html",
+        controller: "TransactionsCtrl"
+      }
+    }
+
+  })
+
+
+
+});
+
+
+
+// debug
+fideligard.run(function($rootScope){
+  $rootScope.$on("$stateChangeError", console.log.bind(console));
+});

controllers/dashboard_controller.js

@@ -0,0 +1,5 @@
+fideligard.controller('DashboardCtrl', ['$scope', function($scope) {
+
+
+
+}]);

controllers/datepicker_controller.js

@@ -0,0 +1,29 @@
+fideligard.controller('DatePickerCtrl', ['$scope', 'DatePickerService', function($scope, DatePickerService) {
+
+
+  $scope.date = DatePickerService.date;
+
+  $scope.msToString = function(ms) {
+    var d = new Date();
+    d.setTime(ms);
+    $scope.dateString = d;
+    DatePickerService.dateString = $scope.dateString;
+    DatePickerService.date = $scope.date;
+  };
+
+
+
+  $scope.dateString = DatePickerService.dateString;
+
+  $scope.stringToMs = function(string, formIsValid) {
+    if (formIsValid) {
+      var d = new Date(string);
+      $scope.date = d.getTime();
+      DatePickerService.date = $scope.date;
+      DatePickerService.dateString = $scope.dateString;
+    }
+  };
+
+
+
+}]);

controllers/stocks_controller.js

@@ -0,0 +1,23 @@
+fideligard.controller('StocksCtrl', ['$scope', 'StocksService', 'DatePickerService', function($scope, StocksService, DatePickerService) {
+
+  $scope.stocks = StocksService.constructStocks();
+
+
+  $scope.date = String(DatePickerService.date);
+
+
+  $scope.$watch(function() {
+      return DatePickerService.date;
+    },
+    function(newValue) {
+      $scope.date = newValue;
+      console.log("stocks controller date was changed to: "+ $scope.date)
+    });
+
+
+  $scope.filterByName = "";
+  $scope.sortType = ""
+  $scope.sortReverse = false;
+
+
+}]);

controllers/trade_controller.js

@@ -0,0 +1,68 @@
+fideligard.controller('TradeCtrl', ['$scope', '$stateParams', 'DatePickerService', 'TradeService', 'StocksService', 'TransactionsService', function($scope, $stateParams, DatePickerService, TradeService, StocksService, TransactionsService) {
+
+
+  $scope.date = DatePickerService.date
+
+
+  $scope.cashAvailable = 1000000;
+
+
+  $scope.orderIsValid;
+
+
+  $scope.validOrder = function() {
+    // can't sell what you don't own
+
+    // can't buy more than you have cash available for
+    if ($scope.getTotalCost() > $scope.cashAvailable) {
+      $scope.orderIsValid = false;
+      // console.log($scope.orderIsValid)
+      $scope.errorMessage = "You don't have enough money for that trade.";
+      return "INVALID";
+    } else {
+      $scope.orderIsValid = true;
+      $scope.errorMessage = undefined;
+      // console.log($scope.orderIsValid)
+      return "VALID";
+    }
+
+  };
+
+
+  $scope.availableStocks = StocksService.stockSymbols;
+
+
+  $scope.symbol = $stateParams.symbol;
+  $scope.transactionType = "buy";
+  $scope.quantity = 1;
+  $scope.price = $stateParams.price;
+  $scope.getTotalCost = function() {
+    return TradeService.calculateCost($scope.price, $scope.quantity);
+  };
+
+
+
+  $scope.trade = {};
+
+
+  $scope.createTransaction = function(formIsValid) {
+    if (formIsValid && $scope.orderIsValid) {
+      console.log("Create transaction!");
+      var newTransaction = {
+        date: $scope.date,
+        symbol: $scope.symbol,
+        transactionType: $scope.transactionType,
+        quantity: $scope.quantity,
+        price: $scope.price
+      };
+      console.log(newTransaction);
+      TransactionsService.transactions.push(newTransaction);
+      console.log(TransactionsService.transactions)
+    } else {
+      console.log("no good")
+    }
+  }
+
+
+
+}]);

controllers/transactions_controller.js

@@ -0,0 +1,10 @@
+fideligard.controller('TransactionsCtrl', ['$scope', 'TransactionsService', function($scope, TransactionsService){
+
+
+  $scope.transactions = TransactionsService.transactions;
+
+  $scope.filterByName = '';
+
+
+
+}])

dashboard.html

@@ -0,0 +1,43 @@
+<nav class="navbar navbar-default">
+  <div class="container-fluid">
+    <div class="navbar-header">
+      <a class="navbar-brand" href="#" class="text-center">Fideligard Historical Portfolio Simulator</a>
+    </div>
+    </div>
+  </div>
+</nav>
+
+<div class='padding-top'>
+  <div class="container">
+    <div class="row">
+
+      <div class="col-xs-5">
+        <div ui-view="stocks"></div>
+      </div>
+
+      <div class="col-xs-7">
+        <div ui-view='datepicker'></div>
+
+        <!-- portfolio / trade / transactions -->
+        <div class="panel panel-default">
+          <div class="panel-heading form-inline">
+          <div class="form-group">
+            <select class="pull-right form-control">
+              <option href='#/dashboard/transactions' value="">Transactions</option>
+              <option ui-sref='' value="">Portfolio</option>
+            </select>
+            </div>
+          </div>
+
+          <div class="panel-body">
+            <ui-view></ui-view>
+          </div>
+        </div>
+
+      </div>
+
+
+
+    </div>
+  </div>
+</div>

directives/stock_directive.js

@@ -0,0 +1,12 @@
+fideligard.directive('stockRow', function() {
+  return {
+    templateUrl: 'directives/templates/stockDirective.html',
+    restrict: 'AE',
+    scope:
+    {
+      stock: "=",
+      stockDate: "=",
+      stockData: "="
+    }
+  }
+});

directives/templates/stockDirective.html

@@ -0,0 +1,6 @@
+<td>{{ stockData.symbol}}</td>
+<td>{{ stockData.price | currency }}</td>
+<td>{{ stockData.one_day | currency  }}</td>
+<td>{{ stockData.seven_day | currency  }}</td>
+<td>{{ stockData.thirty_day | currency  }}</td>
+<td><a class='btn btn-default' ui-sref='fideligard.dashboard.trade({symbol: stockData.symbol, price: stockData.price, date: stockDate})'>Trade</a> </td>

index.html

@@ -0,0 +1,52 @@
+<html lang="en" ng-app="fideligard">
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <!-- Angular Material style sheet -->
+  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
+
+<!-- bootstrap styles -->
+<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
+
+</head>
+<body ng-cloak>
+
+
+  <ui-view></ui-view>
+
+
+  <!-- Angular Material requires Angular.js Libraries -->
+  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
+  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.min.js"></script>
+  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.min.js"></script>
+  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-messages.min.js"></script>
+
+
+  <!-- minified angular-ui-bootstrap -->
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.5/ui-bootstrap-tpls.min.js"></script>
+
+  <!-- ui-router -->
+  <script src = "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script>
+
+  <!-- Angular Material Library -->
+  <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
+
+
+  <!-- our application files  -->
+  <script type="text/javascript" src="app.js"></script>
+  <!-- controllers -->
+  <script type="text/javascript" src="controllers/dashboard_controller.js"></script>
+  <script type="text/javascript" src="controllers/datepicker_controller.js"></script>
+  <script type="text/javascript" src="controllers/stocks_controller.js"></script>
+  <script type="text/javascript" src="controllers/trade_controller.js"></script>
+  <script type="text/javascript" src="controllers/transactions_controller.js"></script>
+  <!-- directives -->
+  <script type="text/javascript" src="directives/stock_directive.js"></script>
+  <!-- services -->
+  <script type="text/javascript" src="services/datepicker_service.js"></script>
+  <script type="text/javascript" src="services/stocks_service.js"></script>
+  <script type="text/javascript" src="services/trade_service.js"></script>
+  <script type="text/javascript" src="services/transactions_service.js"></script>
+
+
+</body>
+</html>

prepwork

@@ -0,0 +1,71 @@
+TODO:
+
+missing days should not be blank, they should be the previous day's value
+
+
+===================
+API
+
+- use 'resolve' object to load as much data as we can, or spread out over a couple calls
+
+
+http://query.yahooapis.com/v1/public/yql?q=%20select%20*%20from%20yahoo.finance.historicaldata%20where%20symbol%20=%20%22AAPL%22%20and%20startDate%20=%20%222014-01-01%22%20and%20endDate%20=%20%222014-12-31%22%20&format=json%20&diagnostics=true%20&env=store://datatables.org/alltableswithkeys%20&callback=
+
+- query for AAPL stock through Yahoo API:
+    http://query.yahooapis.com/v1/public/yql?q=
+    select * from   yahoo.finance.historicaldata
+             where  symbol    = "AAPL"
+             and    startDate = "2014-12-21"
+             and    endDate   = "2014-01-01"
+    &format=json
+    &diagnostics=true
+    &env=store://datatables.org/alltableswithkeys
+    &callback=
+
+
+
+things to keep in mind:
+- some stocks publish close prices on the weekends and holidays while others do not
+
+===========
+DATEPICKER
+
+- global controller that makes date available everywhere
+
+
+===========
+CONTROLLERS
+
+StocksCtrl
+TradeCtrl
+PortfolioCtrl
+
+
+
+===========
+ROUTES
+
+root = dashboard
+stocks & datepicker (always on the screen)
+
+'dashboard' {
+  views: {
+    'stocks':...
+    'datePicker':...
+    '':...
+  }
+}
+
+stocks: index
+trade: create
+portfolio
+
+
+===========
+DIRECTIVES
+
+portfolioRow
+stockRow
+transactionRow
+
+