-
Notifications
You must be signed in to change notification settings - Fork 9
/
crisis-center.js
138 lines (107 loc) · 3.46 KB
/
crisis-center.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
"use strict";
angular.module('crisis-center', [])
.service('crisisService', CrisisService)
.component('crisisCenter', {
template: '<h2>Crisis Center</h2><ng-outlet></ng-outlet>',
$routeConfig: [
{path:'/', name: 'CrisisList', component: 'crisisList', useAsDefault: true},
{path:'/:id', name: 'CrisisDetail', component: 'crisisDetail'}
]
})
.component('crisisList', {
template:
'<ul>\n' +
' <li ng-repeat="crisis in $ctrl.crises"\n' +
' ng-class="{ selected: $ctrl.isSelected(crisis) }"\n' +
' ng-click="$ctrl.onSelect(crisis)">\n' +
// ' >' +
// ' <a ng-link="[\'CrisisDetail\', { id: crisis.id }]">\n' +
' <span class="badge">{{crisis.id}}</span> {{crisis.name}}\n' +
// ' </a>' +
' </li>\n' +
'</ul>\n',
bindings: { $router: '<' },
controller: CrisisListComponent,
$canActivate: function($nextInstruction, $prevInstruction) {
console.log('$canActivate', arguments);
}
})
.component('crisisDetail', {
templateUrl: 'app/crisisDetail.html',
bindings: { $router: '<' },
controller: CrisisDetailComponent
});
function CrisisService($q) {
var crisesPromise = $q.when([
{id: 1, name: 'Princess Held Captive'},
{id: 2, name: 'Dragon Burning Cities'},
{id: 3, name: 'Giant Asteroid Heading For Earth'},
{id: 4, name: 'Release Deadline Looms'}
]);
this.getCrises = function() {
return crisesPromise;
};
this.getCrisis = function(id) {
return crisesPromise.then(function(crises) {
for(var i=0; i<crises.length; i++) {
if ( crises[i].id == id) return crises[i];
}
});
};
}
function CrisisListComponent(crisisService) {
var selectedId = null;
var ctrl = this;
this.$routerOnActivate = function(next) {
console.log('$routerOnActivate', this, arguments);
// Load up the crises for this view
crisisService.getCrises().then(function(crises) {
ctrl.crises = crises;
selectedId = next.params.id;
});
};
this.isSelected = function(crisis) {
return (crisis.id == selectedId);
};
this.onSelect = function(crisis) {
this.$router.navigate(['CrisisDetail', { id: crisis.id }]);
};
};
function CrisisDetailComponent(crisisService, dialogService) {
var ctrl = this;
this.$routerOnActivate = function(next) {
// Get the crisis identified by the route parameter
var id = next.params.id;
crisisService.getCrisis(id).then(function(crisis) {
if (crisis) {
ctrl.editName = crisis.name;
ctrl.crisis = crisis;
} else { // id not found
ctrl.gotoCrises();
}
});
};
this.$routerCanDeactivate = function() {
// Allow synchronous navigation (`true`) if no crisis or the crisis is unchanged.
if (!this.crisis || this.crisis.name === this.editName) {
return true;
}
// Otherwise ask the user with the dialog service and return its
// promise which resolves to true or false when the user decides
return dialogService.confirm('Discard changes?');
};
this.cancel = function() {
ctrl.editName = ctrl.crisis.name;
ctrl.gotoCrises();
};
this.save = function() {
ctrl.crisis.name = ctrl.editName;
ctrl.gotoCrises();
};
this.gotoCrises = function() {
var crisisId = ctrl.crisis && ctrl.crisis.id;
// Pass along the hero id if available
// so that the CrisisListComponent can select that hero.
this.$router.navigate(['CrisisList', {id: crisisId}]);
};
}