App now loaded via requirejs.

This commit is contained in:
Clinton Alexander 2016-07-08 11:36:29 +01:00
parent ef4273e0d0
commit dc0658f56e
5 changed files with 192 additions and 146 deletions

View File

@ -18,6 +18,7 @@
"angular-route": "^1.5.7", "angular-route": "^1.5.7",
"lodash": "^4.13.1", "lodash": "^4.13.1",
"angular-fcsa-number": "^1.5.3", "angular-fcsa-number": "^1.5.3",
"jquery.maskedinput": "^1.4.1" "jquery.maskedinput": "^1.4.1",
"requirejs": "^2.2.0"
} }
} }

View File

@ -10,14 +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 src="bower_components/jquery/dist/jquery.js"></script> <script data-main="js/require-config" src="bower_components/requirejs/require.js"></script>
<script src="bower_components/lodash/lodash.js"></script>
<script src="semantic/semantic.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="bower_components/angular-fcsa-number/src/fcsaNumber.js"></script>
<script src="bower_components/jquery.maskedinput/dist/jquery.maskedinput.js"></script>
<script src="js/app.js"></script>
</head> </head>
<body ng-controller="HomeController"> <body ng-controller="HomeController">
<div class="ui inverted menu"> <div class="ui inverted menu">

View File

@ -0,0 +1,9 @@
"use strict"
function test() {
console.log("TESTING");
}
define([], () => {
return test;
})

View File

@ -174,163 +174,176 @@ let Deal = function(dealViewModel) {
}; };
}; };
let irsViewer = angular.module('irsViewer', ['ngRoute', 'fcsa-number']) define([
.config(($routeProvider, $locationProvider) => { 'angular',
$routeProvider 'angularRoute',
.when('/', { 'jquery',
controller: 'HomeController', 'fcsaNumber',
templateUrl: 'view/home.html' 'semantic',
}) 'maskedInput',
.when('/deal/:dealId', { 'lodash',
controller: 'DealController', 'js/Deal'
templateUrl: 'view/deal.html' ],
}) (angular, angularRoute, $, fcsaNumber, semantic, maskedInput, _, Deal) => {
.when('/party/:partyId', { let irsViewer = angular.module('irsViewer', ['ngRoute', 'fcsa-number'])
templateUrl: 'view/party.html' .config(($routeProvider, $locationProvider) => {
}) $routeProvider
.when('/create-deal', { .when('/', {
controller: 'CreateDealController', controller: 'HomeController',
templateUrl: 'view/create-deal.html' templateUrl: 'view/home.html'
}) })
.otherwise({redirectTo: '/'}); .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) => { let nodeService = irsViewer.factory('nodeService', ($http) => {
return new (function() { return new (function() {
let date = new Date(2016, 0, 1, 0, 0, 0); let date = new Date(2016, 0, 1, 0, 0, 0);
let curLoading = {}; let curLoading = {};
let load = (type, promise) => { let load = (type, promise) => {
curLoading[type] = true; curLoading[type] = true;
return promise.then((arg) => { return promise.then((arg) => {
curLoading[type] = false; curLoading[type] = false;
return arg; return arg;
}, (arg) => { }, (arg) => {
curLoading[type] = false; curLoading[type] = false;
throw arg; 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); 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.getDeals = () => { this.getDate = () => {
return load('deals', $http.get('http://localhost:31338/api/irs/deals')).then((resp) => { return load('date', $http.get('http://localhost:31338/api/irs/demodate')).then((resp) => {
return resp.data; 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.getDeal = (dealId) => { this.updateDate = (type) => {
return load('deal' + dealId, $http.get('http://localhost:31338/api/irs/deals/' + dealId)).then((resp) => { let newDate = date;
// Do some data modification to simplify the model switch(type) {
let deal = resp.data; case "year":
deal.fixedLeg.fixedRate.value = (deal.fixedLeg.fixedRate.ratioUnit.value * 100).toString().slice(0, 6); newDate.setFullYear(date.getFullYear() + 1);
console.log(deal); break;
return deal;
});
};
this.getDateModel = (date) => { case "month":
return { newDate.setMonth(date.getMonth() + 1);
"year": date.getFullYear(), break;
"month": date.getMonth() + 1, // JS uses 0 based months
"day": date.getDate() case "day":
newDate.setDate(date.getDate() + 1);
break;
}
return changeDateOnNode(newDate);
}; };
}
this.isLoading = () => { this.getDeals = () => {
return _.reduce(Object.keys(curLoading), (last, key) => { return load('deals', $http.get('http://localhost:31338/api/irs/deals')).then((resp) => {
return (last || curLoading[key]); return resp.data;
}, false); });
} };
this.newDeal = () => { this.getDeal = (dealId) => {
return dealViewModel; 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.createDeal = (deal) => { this.getDateModel = (date) => {
return load('create-deal', $http.post('http://localhost:31338/api/irs/deals', deal.toJson())) return {
.then((resp) => { "year": date.getFullYear(),
return deal.tradeId; "month": date.getMonth() + 1, // JS uses 0 based months
}, (resp) => { "day": date.getDate()
throw resp; };
}) }
}
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() { function initSemanticUi() {
$('.ui.accordion').accordion(); $('.ui.accordion').accordion();
$('.ui.dropdown').dropdown(); $('.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; irsViewer.controller('HomeController', function HomeController($http, $scope, nodeService) {
$scope.infoMsg = ""; let handleHttpFail = (resp) => {
$scope.errorText = ""; console.log(resp.data)
$scope.date = { "year": "...", "month": "...", "day": "..." }; $scope.httpError = resp.data
$scope.updateDate = (type) => { nodeService.updateDate(type).then((newDate) => {$scope.date = newDate}, handleHttpFail); }; }
$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});
});
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,30 @@
'use strict';
require.config({
paths: {
angular: 'bower_components/angular/angular',
angularRoute: 'bower_components/angular-route/angular-route',
fcsaNumber: 'bower_components/angular-fcsa-number/src/fcsaNumber',
jquery: 'bower_components/jquery/dist/jquery',
semantic: 'semantic/semantic',
lodash: 'bower_components/lodash/lodash',
maskedInput: 'bower_components/jquery.maskedinput/dist/jquery.maskedinput'
},
shim: {
'angular' : {'exports' : 'angular'},
'angularRoute': ['angular'],
'fcsaNumber': ['angular'],
'semantic': ['jquery'],
'maskedInput': ['jquery']
},
priority: [
"angular"
],
deps: [],
callback: null,
baseUrl: '',
});
require(['angular', 'js/app'], (angular, app) => {
var $html = angular.element(document.getElementsByTagName('html')[0])
});