<!DOCTYPE html>
<html ng-app="myApp">
<head>
<style>
BODY { font-size: 2em;}
</style>
<script data-require="angular.js@1.4.0" data-semver="1.4.0" src="https://code.angularjs.org/1.4.0/angular.js"></script>
<script src="app.js"></script>
<script src="app-settings.js"></script>
<script src="app-title.js"></script>
<script src="current-time.service.js"></script>
<script src="current-time2.service.js"></script>
<script src="main.controller.js"></script>
<script src="square.service.js"></script>
<script src="unicorn-launcher.js"></script>
</head>
<body ng-controller='MainController'>
<h1>{{ appTitle }}</h1>
<div>
<div>square of 5: <strong>{{ squareSample }}</strong></div>
<div>currentTime: <strong>{{ currentTime | date: 'HH:mm:ss' }}</strong></div>
<div>currentTime2: <strong>{{ currentTime2.value | date: 'HH:mm:ss' }}</strong></div>
<div>unicornLauncher launchedCount : <strong>{{ unicornLauncher.launchedCount }}</strong></div>
<div>unicornLauncher useTinfoilShielding: <strong>{{ unicornLauncher.useTinfoilShielding }}</strong></div>
</div>
</body>
</html>
angular.module('myApp', []);
angular.module('myApp')
.controller('MainController', [
'$scope',
'appTitle',
'squareService',
'currentTimeService',
'currentTime2Service',
'unicornLauncher',
function (
$scope,
appTitle,
squareService,
currentTimeService,
currentTime2Service,
unicornLauncher) {
$scope.appTitle = appTitle;
$scope.squareSample = squareService.square(5);
$scope.currentTime = currentTimeService.currentTime;
$scope.currentTime2 = currentTime2Service.currentTime;
unicornLauncher.launch();
unicornLauncher.launch();
$scope.unicornLauncher = unicornLauncher;
}
]);
angular.module('myApp')
.value('appTitle', 'My Angular Application');
angular.module('myApp')
.constant('appSettings', {
useTinfoilShielding: true
});
angular.module('myApp')
.service('squareService', function() {
this.square = function(value) {
return value * value;
};
});
angular.module('myApp')
.service('currentTimeService', ['$timeout', function($timeout) {
var self = this;
this.currentTime = new Date();
tick();
function tick() {
$timeout(function() {
self.currentTime = new Date();
tick();
}, 1000);
}
}]);
angular.module('myApp')
.service('currentTime2Service', ['$timeout', function($timeout) {
var self = this;
this.currentTime = {
value: new Date()
};
tick();
function tick() {
$timeout(function() {
self.currentTime.value = new Date();
tick();
}, 1000);
}
}]);
function UnicornLauncher(useTinfoilShielding) {
this.launchedCount = 0;
this.useTinfoilShielding = useTinfoilShielding;
this.launch = function() {
this.launchedCount++;
}
}
angular.module('myApp')
.provider('unicornLauncher', function UnicornLauncherProvider() {
var useTinfoilShielding = false;
this.useTinfoilShielding = function(value) {
useTinfoilShielding = !!value;
};
this.$get = function unicornLauncherFactory() {
return new UnicornLauncher(useTinfoilShielding);
};
})
.config(['unicornLauncherProvider', 'appSettings', function(unicornLauncherProvider, appSettings) {
unicornLauncherProvider.useTinfoilShielding(appSettings.useTinfoilShielding);
}]);