Refactored project to use require.js to separate out modules more cleanly.

This commit is contained in:
Clinton Alexander 2016-07-08 14:42:57 +01:00
parent 3a614478ba
commit a147385255
11 changed files with 248 additions and 221 deletions

View File

@ -0,0 +1,3 @@
{
"directory": "js/bower_components"
}

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html ng-app="irsViewer"> <html>
<head> <head>
<!-- Standard Meta --> <!-- Standard Meta -->
<meta charset="utf-8"/> <meta charset="utf-8"/>
@ -10,7 +10,7 @@
<title>IRS Demo Viewer</title> <title>IRS Demo Viewer</title>
<link rel="stylesheet" type="text/css" href="semantic/semantic.css"> <link rel="stylesheet" type="text/css" href="semantic/semantic.css">
<script data-main="js/require-config" src="bower_components/requirejs/require.js"></script> <script data-main="js/require-config" src="js/bower_components/requirejs/require.js"></script>
</head> </head>
<body ng-controller="HomeController"> <body ng-controller="HomeController">
<div class="ui inverted menu"> <div class="ui inverted menu">

View File

@ -1,9 +1,45 @@
"use strict" "use strict"
function test() { let Deal = function(dealViewModel) {
console.log("TESTING"); let now = new Date();
} let tradeId = `T${now.getUTCFullYear()}-${now.getUTCMonth()}-${now.getUTCDate()}.${now.getUTCHours()}:${now.getUTCMinutes()}:${now.getUTCSeconds()}:${now.getUTCMilliseconds()}`
this.toJson = () => {
let fixedLeg = {};
let floatingLeg = {};
let common = {};
_.assign(fixedLeg, dealViewModel.fixedLeg);
_.assign(floatingLeg, dealViewModel.floatingLeg);
_.assign(common, dealViewModel.common);
_.assign(fixedLeg.fixedRate, fixedRateViewModel);
fixedLeg.fixedRate = Number(fixedLeg.fixedRate) / 100;
common.tradeID = tradeId;
fixedLeg.effectiveDate = formatDateForNode(fixedLeg.effectiveDate);
fixedLeg.terminationDate = formatDateForNode(fixedLeg.terminationDate);
fixedLeg.fixedRate = { ratioUnit: { value: fixedLeg.fixedRate } };
fixedLeg.dayCountBasisDay = dayCountBasisLookup[fixedLeg.dayCountBasis].day;
fixedLeg.dayCountBasisYear = dayCountBasisLookup[fixedLeg.dayCountBasis].year;
delete fixedLeg.dayCountBasis;
floatingLeg.effectiveDate = formatDateForNode(floatingLeg.effectiveDate);
floatingLeg.terminationDate = formatDateForNode(floatingLeg.terminationDate);
floatingLeg.dayCountBasisDay = dayCountBasisLookup[floatingLeg.dayCountBasis].day;
floatingLeg.dayCountBasisYear = dayCountBasisLookup[floatingLeg.dayCountBasis].year;
delete floatingLeg.dayCountBasis;
let json = {
fixedLeg: fixedLeg,
floatingLeg: floatingLeg,
calculation: calculationModel,
common: common
}
return json;
};
};
define([], () => { define([], () => {
return test; return Deal;
}) })

View File

@ -134,217 +134,14 @@ let dayCountBasisLookup = {
} }
} }
let Deal = function(dealViewModel) {
let now = new Date();
let tradeId = `T${now.getUTCFullYear()}-${now.getUTCMonth()}-${now.getUTCDate()}.${now.getUTCHours()}:${now.getUTCMinutes()}:${now.getUTCSeconds()}:${now.getUTCMilliseconds()}`
this.toJson = () => {
let fixedLeg = {};
let floatingLeg = {};
let common = {};
_.assign(fixedLeg, dealViewModel.fixedLeg);
_.assign(floatingLeg, dealViewModel.floatingLeg);
_.assign(common, dealViewModel.common);
_.assign(fixedLeg.fixedRate, fixedRateViewModel);
fixedLeg.fixedRate = Number(fixedLeg.fixedRate) / 100;
common.tradeID = tradeId;
fixedLeg.effectiveDate = formatDateForNode(fixedLeg.effectiveDate);
fixedLeg.terminationDate = formatDateForNode(fixedLeg.terminationDate);
fixedLeg.fixedRate = { ratioUnit: { value: fixedLeg.fixedRate } };
fixedLeg.dayCountBasisDay = dayCountBasisLookup[fixedLeg.dayCountBasis].day;
fixedLeg.dayCountBasisYear = dayCountBasisLookup[fixedLeg.dayCountBasis].year;
delete fixedLeg.dayCountBasis;
floatingLeg.effectiveDate = formatDateForNode(floatingLeg.effectiveDate);
floatingLeg.terminationDate = formatDateForNode(floatingLeg.terminationDate);
floatingLeg.dayCountBasisDay = dayCountBasisLookup[floatingLeg.dayCountBasis].day;
floatingLeg.dayCountBasisYear = dayCountBasisLookup[floatingLeg.dayCountBasis].year;
delete floatingLeg.dayCountBasis;
let json = {
fixedLeg: fixedLeg,
floatingLeg: floatingLeg,
calculation: calculationModel,
common: common
}
return json;
};
};
define([ define([
'angular', 'angular',
'angularRoute', 'angularRoute',
'jquery', 'jquery',
'fcsaNumber', 'fcsaNumber',
'semantic', 'semantic'
'maskedInput',
'lodash',
'js/Deal'
], ],
(angular, angularRoute, $, fcsaNumber, semantic, maskedInput, _, Deal) => { (angular, angularRoute, $, fcsaNumber, semantic) => {
Deal() angular.module('irsViewer', ['ngRoute', 'fcsa-number']);
let irsViewer = angular.module('irsViewer', ['ngRoute', 'fcsa-number']) requirejs(['routes']);
.config(($routeProvider, $locationProvider) => {
$routeProvider
.when('/', {
controller: 'HomeController',
templateUrl: 'view/home.html'
})
.when('/deal/:dealId', {
controller: 'DealController',
templateUrl: 'view/deal.html'
})
.when('/party/:partyId', {
templateUrl: 'view/party.html'
})
.when('/create-deal', {
controller: 'CreateDealController',
templateUrl: 'view/create-deal.html'
})
.otherwise({redirectTo: '/'});
});
let nodeService = irsViewer.factory('nodeService', ($http) => {
return new (function() {
let date = new Date(2016, 0, 1, 0, 0, 0);
let curLoading = {};
let load = (type, promise) => {
curLoading[type] = true;
return promise.then((arg) => {
curLoading[type] = false;
return arg;
}, (arg) => {
curLoading[type] = false;
throw arg;
});
}
let changeDateOnNode = (newDate) => {
const dateStr = formatDateForNode(newDate)
return load('date', $http.put('http://localhost:31338/api/irs/demodate', "\"" + dateStr + "\"")).then((resp) => {
date = newDate;
return this.getDateModel(date);
});
}
this.getDate = () => {
return load('date', $http.get('http://localhost:31338/api/irs/demodate')).then((resp) => {
const parts = resp.data.split("-");
date = new Date(parts[0], parts[1] - 1, parts[2]); // JS uses 0 based months
return this.getDateModel(date);
});
}
this.updateDate = (type) => {
let newDate = date;
switch(type) {
case "year":
newDate.setFullYear(date.getFullYear() + 1);
break;
case "month":
newDate.setMonth(date.getMonth() + 1);
break;
case "day":
newDate.setDate(date.getDate() + 1);
break;
}
return changeDateOnNode(newDate);
};
this.getDeals = () => {
return load('deals', $http.get('http://localhost:31338/api/irs/deals')).then((resp) => {
return resp.data;
});
};
this.getDeal = (dealId) => {
return load('deal' + dealId, $http.get('http://localhost:31338/api/irs/deals/' + dealId)).then((resp) => {
// Do some data modification to simplify the model
let deal = resp.data;
deal.fixedLeg.fixedRate.value = (deal.fixedLeg.fixedRate.ratioUnit.value * 100).toString().slice(0, 6);
console.log(deal);
return deal;
});
};
this.getDateModel = (date) => {
return {
"year": date.getFullYear(),
"month": date.getMonth() + 1, // JS uses 0 based months
"day": date.getDate()
};
}
this.isLoading = () => {
return _.reduce(Object.keys(curLoading), (last, key) => {
return (last || curLoading[key]);
}, false);
}
this.newDeal = () => {
return dealViewModel;
}
this.createDeal = (deal) => {
return load('create-deal', $http.post('http://localhost:31338/api/irs/deals', deal.toJson()))
.then((resp) => {
return deal.tradeId;
}, (resp) => {
throw resp;
})
}
});
});
function initSemanticUi() {
$('.ui.accordion').accordion();
$('.ui.dropdown').dropdown();
}
irsViewer.controller('HomeController', function HomeController($http, $scope, nodeService) {
let handleHttpFail = (resp) => {
console.log(resp.data)
$scope.httpError = resp.data
}
$scope.isLoading = nodeService.isLoading;
$scope.infoMsg = "";
$scope.errorText = "";
$scope.date = { "year": "...", "month": "...", "day": "..." };
$scope.updateDate = (type) => { nodeService.updateDate(type).then((newDate) => {$scope.date = newDate}, handleHttpFail); };
nodeService.getDate().then((date) => $scope.date = date);
nodeService.getDeals().then((deals) => $scope.deals = deals);
});
irsViewer.controller('DealController', function DealController($http, $scope, $routeParams, nodeService) {
initSemanticUi();
$scope.isLoading = nodeService.isLoading;
nodeService.getDeal($routeParams.dealId).then((deal) => $scope.deal = deal);
});
irsViewer.controller('CreateDealController', function CreateDealController($http, $scope, $location, nodeService) {
initSemanticUi();
$scope.isLoading = nodeService.isLoading;
$scope.deal = nodeService.newDeal();
$scope.createDeal = () => {
nodeService.createDeal(new Deal($scope.deal))
.then((tradeId) => $location.path('#/deal/' + tradeId), (resp) => {
$scope.formError = resp.data;
});
};
$('input.percent').mask("9.999999%", {placeholder: "", autoclear: false});
});
}); });

View File

@ -0,0 +1,23 @@
'use strict';
define([
'angular',
'maskedInput',
'utils/semantic',
'services/NodeApi',
'Deal'
], (angular, maskedInput, semantic, nodeApi, Deal) => {
angular.module('irsViewer').controller('CreateDealController', function CreateDealController($http, $scope, $location, nodeService) {
semantic.init();
$scope.isLoading = nodeService.isLoading;
$scope.deal = nodeService.newDeal();
$scope.createDeal = () => {
nodeService.createDeal(new Deal($scope.deal))
.then((tradeId) => $location.path('#/deal/' + tradeId), (resp) => {
$scope.formError = resp.data;
});
};
$('input.percent').mask("9.999999%", {placeholder: "", autoclear: false});
});
});

View File

@ -0,0 +1,11 @@
'use strict';
define(['angular', 'utils/semantic', 'services/NodeApi'], (angular, semantic, nodeApi) => {
angular.module('irsViewer').controller('DealController', function DealController($http, $scope, $routeParams, nodeService) {
semantic.init();
$scope.isLoading = nodeService.isLoading;
nodeService.getDeal($routeParams.dealId).then((deal) => $scope.deal = deal);
});
});

View File

@ -0,0 +1,19 @@
'use strict';
define(['angular', 'services/NodeApi'], (angular, nodeApi) => {
angular.module('irsViewer').controller('HomeController', function HomeController($http, $scope, nodeService) {
let handleHttpFail = (resp) => {
console.log(resp.data)
$scope.httpError = resp.data
}
$scope.isLoading = nodeService.isLoading;
$scope.infoMsg = "";
$scope.errorText = "";
$scope.date = { "year": "...", "month": "...", "day": "..." };
$scope.updateDate = (type) => { nodeService.updateDate(type).then((newDate) => {$scope.date = newDate}, handleHttpFail); };
nodeService.getDate().then((date) => $scope.date = date);
nodeService.getDeals().then((deals) => $scope.deals = deals);
});
})

View File

@ -6,7 +6,7 @@ require.config({
angularRoute: 'bower_components/angular-route/angular-route', angularRoute: 'bower_components/angular-route/angular-route',
fcsaNumber: 'bower_components/angular-fcsa-number/src/fcsaNumber', fcsaNumber: 'bower_components/angular-fcsa-number/src/fcsaNumber',
jquery: 'bower_components/jquery/dist/jquery', jquery: 'bower_components/jquery/dist/jquery',
semantic: 'semantic/semantic', semantic: '/semantic/semantic',
lodash: 'bower_components/lodash/lodash', lodash: 'bower_components/lodash/lodash',
maskedInput: 'bower_components/jquery.maskedinput/dist/jquery.maskedinput' maskedInput: 'bower_components/jquery.maskedinput/dist/jquery.maskedinput'
}, },
@ -22,13 +22,9 @@ require.config({
], ],
deps: [], deps: [],
callback: null, callback: null,
baseUrl: '', baseUrl: 'js',
}); });
require(['angular', 'js/app'], (angular, app) => { require(['angular', 'app'], (angular, app) => {
var $html = angular.element(document.getElementsByTagName('html')[0])
angular.element().ready(function() {
// bootstrap the app manually
angular.bootstrap(document, ['irsViewer']);
});
}); });

View File

@ -0,0 +1,33 @@
'use strict';
define([
'angular',
'controllers/Home',
'controllers/Deal',
'controllers/CreateDeal'
], (angular) => {
angular.module('irsViewer').config(($routeProvider, $locationProvider) => {
$routeProvider
.when('/', {
controller: 'HomeController',
templateUrl: 'view/home.html'
})
.when('/deal/:dealId', {
controller: 'DealController',
templateUrl: 'view/deal.html'
})
.when('/party/:partyId', {
templateUrl: 'view/party.html'
})
.when('/create-deal', {
controller: 'CreateDealController',
templateUrl: 'view/create-deal.html'
})
.otherwise({redirectTo: '/'});
});
angular.element().ready(function() {
// bootstrap the app manually
angular.bootstrap(document, ['irsViewer']);
});
});

View File

@ -0,0 +1,99 @@
'use strict';
define(['angular', 'lodash'], (angular, _) => {
angular.module('irsViewer').factory('nodeService', ($http) => {
return new (function() {
let date = new Date(2016, 0, 1, 0, 0, 0);
let curLoading = {};
let load = (type, promise) => {
curLoading[type] = true;
return promise.then((arg) => {
curLoading[type] = false;
return arg;
}, (arg) => {
curLoading[type] = false;
throw arg;
});
}
let changeDateOnNode = (newDate) => {
const dateStr = formatDateForNode(newDate)
return load('date', $http.put('http://localhost:31338/api/irs/demodate', "\"" + dateStr + "\"")).then((resp) => {
date = newDate;
return this.getDateModel(date);
});
}
this.getDate = () => {
return load('date', $http.get('http://localhost:31338/api/irs/demodate')).then((resp) => {
const parts = resp.data.split("-");
date = new Date(parts[0], parts[1] - 1, parts[2]); // JS uses 0 based months
return this.getDateModel(date);
});
}
this.updateDate = (type) => {
let newDate = date;
switch(type) {
case "year":
newDate.setFullYear(date.getFullYear() + 1);
break;
case "month":
newDate.setMonth(date.getMonth() + 1);
break;
case "day":
newDate.setDate(date.getDate() + 1);
break;
}
return changeDateOnNode(newDate);
};
this.getDeals = () => {
return load('deals', $http.get('http://localhost:31338/api/irs/deals')).then((resp) => {
return resp.data;
});
};
this.getDeal = (dealId) => {
return load('deal' + dealId, $http.get('http://localhost:31338/api/irs/deals/' + dealId)).then((resp) => {
// Do some data modification to simplify the model
let deal = resp.data;
deal.fixedLeg.fixedRate.value = (deal.fixedLeg.fixedRate.ratioUnit.value * 100).toString().slice(0, 6);
console.log(deal);
return deal;
});
};
this.getDateModel = (date) => {
return {
"year": date.getFullYear(),
"month": date.getMonth() + 1, // JS uses 0 based months
"day": date.getDate()
};
}
this.isLoading = () => {
return _.reduce(Object.keys(curLoading), (last, key) => {
return (last || curLoading[key]);
}, false);
}
this.newDeal = () => {
return dealViewModel;
}
this.createDeal = (deal) => {
return load('create-deal', $http.post('http://localhost:31338/api/irs/deals', deal.toJson()))
.then((resp) => {
return deal.tradeId;
}, (resp) => {
throw resp;
})
}
});
});
});

View File

@ -0,0 +1,10 @@
'use strict';
define(['jquery', 'semantic'], ($, semantic) => {
return {
init: () => {
$('.ui.accordion').accordion();
$('.ui.dropdown').dropdown();
}
};
});