Skip to content
Permalink
Browse files

Separated the constants into their own file.

Added settings page
Added support for calling the API layer in the settings page.
Added support for calling the API using Adal and Azure AD authentication.

Blog Post: Dev Diary S01E06
  • Loading branch information...
SimonDoy committed May 15, 2016
1 parent bf2686f commit 42abaa221690de371b4cfd1bd5aa42591e8fd51a
Showing with 145 additions and 11 deletions.
  1. +10 −5 app/app.js
  2. +9 −0 app/common/constants.js
  3. +16 −0 app/controllers/settingsController.js
  4. +4 −1 app/index.html
  5. +68 −5 app/services/configurationService.js
  6. +38 −0 app/views/settings.html
@@ -2,10 +2,10 @@

var invoiceFormApp = angular.module('itspInvoiceFormApp',
[
'ngRoute', 'invoiceControllersModule', 'dataModelService', 'AdalAngular', 'configurationServiceModule'
'ngRoute', 'invoiceControllersModule', 'dataModelService', 'AdalAngular', 'applicationConstantsModule', 'configurationServiceModule', 'settingsController'
]);

var appStart = function($routeProvider, $httpProvider, adalProvider, applicationConstants) {
var appStart = function($routeProvider, $httpProvider, adalProvider, applicationConstants, configurationServiceProvider) {

$routeProvider.when('/invoices/add', {
templateUrl:'/app/views/add-invoice.html',
@@ -15,6 +15,10 @@ var appStart = function($routeProvider, $httpProvider, adalProvider, application
templateUrl:'/app/views/list-invoices.html',
controller: 'listInvoicesController',
requireADLogin: false
}).when('/settings', {
templateUrl:'/app/views/settings.html',
controller: 'settingsController',
requireADLogin: true
}).otherwise({
redirectTo: '/invoices'
});
@@ -23,14 +27,15 @@ var appStart = function($routeProvider, $httpProvider, adalProvider, application
var clientId=applicationConstants.clientId;
var tenantName=applicationConstants.tenantName;
var endPoints=applicationConstants.endPoints;
var apiUrl = applicationConstants.apiUrl;


configurationServiceProvider.init(apiUrl, tenantName, clientId, endPoints);

adalProvider.init({
instance: instance,
tenant: tenantName,
clientId: clientId,
endPoints: endPoints,
endpoints: endPoints,
anonymousEndpoints:{},
extraQueryParameter: 'nux=1',
cacheLocation: 'localStorage', // enable this for IE, as sessionStorage does not work for localhost.
@@ -40,4 +45,4 @@ var appStart = function($routeProvider, $httpProvider, adalProvider, application
};


invoiceFormApp.config(['$routeProvider', '$httpProvider', 'adalAuthenticationServiceProvider', 'applicationConstants', appStart]);
invoiceFormApp.config(['$routeProvider', '$httpProvider', 'adalAuthenticationServiceProvider', 'applicationConstants', 'configurationServiceProvider', appStart]);
@@ -0,0 +1,9 @@
'use strict'
var constantsModule = angular.module('applicationConstantsModule', []);
constantsModule.constant('applicationConstants', {
'clientId':'7c27b6a6-1bb8-43c0-9b92-2eee2264cc71',
'tenantName':'ithinksharepoint.com',
'instance':'https://login.microsoftonline.com/',
'endPoints': {'https://itsp365invoiceformappapitest.azurewebsites.net/api':'https://ithinksharepoint.com/Itsp365.InvoiceFormApp.Api.Mark2'},
'apiUrl': 'https://itsp365invoiceformappapitest.azurewebsites.net/api'
});
@@ -0,0 +1,16 @@
'use strict';
var settingsControllerModule = angular.module('settingsController', ['configurationServiceModule']);

settingsControllerModule.controller('settingsController', ['$scope','$http','$routeParams','configurationService','adalAuthenticationService', function ($scope, $http, $routeParams, configurationService, adalService) {
$scope.userInfo = adalService.userInfo;

$scope.apiConfig={};
$http({
method:'GET',
url: configurationService.settings.apiUrl + "/configuration"
}).then(function processConfigurationResponse(response){
$scope.apiConfig=response.data;
}, function processError(response){
alert(response);
});
}]);
@@ -13,6 +13,7 @@
<ul class="nav navbar-nav">
<li><a class="btn primary" href="#">Home</a></li>
<li><a class="btn primary" href="#/invoices/add" title="Create Invoice">New Invoice</a></li>
<li><a class="btn primary" href="#/settings" title="Settings">Settings</a></li>
</ul>
</div>
</nav>
@@ -27,11 +28,13 @@
<script src="/bower_components/adal-angular/dist/adal.min.js"></script>
<script src="/bower_components/adal-angular/dist/adal-angular.min.js"></script>


<script src="/app/common/constants.js"></script>
<script src="/app/controllers/invoiceControllers.js"></script>
<script src="/app/controllers/settingsController.js"></script>
<script src="/app/services/dataModelService.js"></script>
<script src="/app/services/configurationService.js"></script>


<script src="/app/app.js"></script>


@@ -1,9 +1,72 @@
'use strict'
var configurationService = angular.module('configurationServiceModule', []);
configurationService.constant('applicationConstants', {
'clientId':'7c27b6a6-1bb8-43c0-9b92-2eee2264cc71',
'tenantName':'ithinksharepoint.com',
'instance':'https://login.microsoftonline.com/',
'endPoints': {},

configurationService.service('configurationService',[]);
configurationService.provider('configurationService', function configurationServiceProvider(){

this.endPoints=null;
this.clientId=null;
this.apiUrl=null;
this.tenantName=null;
this.hasInternetConnection=function(){
return true;
}
this.init=function(apiUrl, tenantName, clientId, endPoints)
{
this.apiUrl=apiUrl;
this.tenantName=tenantName;
this.clientId=clientId
this.endPoints=endPoints;


}

this.load=function(){
var promise = $q.defer();

};


this.$get = [function initialiseConfigurationService(){
var configurationServiceInstance=new configurationSettings();
configurationServiceInstance.settings.apiUrl=this.apiUrl;
configurationServiceInstance.settings.adalSettings.clientId=this.clientId;
configurationServiceInstance.settings.adalSettings.tenant=this.tenantName;
configurationServiceInstance.settings.adalSettings.endPoints=this.endPoints;
return configurationServiceInstance;
}];



});



function configurationSettings()
{
this.settings={};
this.settings.siteUrl="";
this.settings.apiUrl="";
this.settings.logoUrl="https://blog.ithinksharepoint.com/logo.png";
this.settings.adalSettings={};
this.settings.adalSettings.instance="";
this.settings.adalSettings.tenant="";
this.settings.adalSettings.clientId="";
this.settings.adalSettings.applicationId="";
this.settings.adalSettings.endPoints="";


this.vatRate=20;

this.currency="£";

this.unitTypes = [
{name: 'once'},
{name: 'hour'},
{name: 'day'}
];


};


@@ -0,0 +1,38 @@
<section>
<h1> Settings </h1>
<h2> Login Information </h2>

<p class="form-control">
Username: {{userInfo.userName}}
</p>
<p class="form-control">
Profile: <br/>
<ul>
<li ng-repeat="profileItem in userInfo.profile">{{profileItem}}</li>
</ul>
</p>

</section>
<section>
<h2>Api Settings</h2>
<p>
{{apiConfig}}
</p>
</section>

<section>
<h2>Application Information</h2>
<p>
{{applicationInformation}}
</p>
</section>

<section>
<h2>Additional Settings</h2>
</section>


<section>
<h2>Installation Information</h2>
<a class="btn" href="#/installation" title="Show Installation Information">Installation Status</a>
</section>

0 comments on commit 42abaa2

Please sign in to comment.
You can’t perform that action at this time.