Skip to content

Commit 3aa694c

Browse files
vbakkevbakke
committed
Ensure correct load order, using promises
1 parent 2246ca0 commit 3aa694c

1 file changed

Lines changed: 141 additions & 131 deletions

File tree

‎src/app/component/circular-heatmap/circular-heatmap.component.ts‎

Lines changed: 141 additions & 131 deletions
Original file line numberDiff line numberDiff line change
@@ -66,135 +66,139 @@ export class CircularHeatmapComponent implements OnInit {
6666
}
6767

6868
ngOnInit(): void {
69-
this.LoadMaturityLevels();
70-
this.LoadTeamsFromMetaYaml();
71-
this.LoadMaturityDataFromGeneratedYaml();
69+
// Ensure that Levels and Teams load before MaturityData
70+
// using promises, since ngOnInit does not support async/await
71+
this.LoadMaturityLevels()
72+
.then(() => this.LoadTeamsFromMetaYaml())
73+
.then(() => this.LoadMaturityDataFromGeneratedYaml());
7274
}
7375

7476
@ViewChildren(MatChip) chips!: QueryList<MatChip>;
7577
matChipsArray: MatChip[] = [];
7678

7779
private LoadMaturityDataFromGeneratedYaml() {
78-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml Fetch');
79-
this.yaml.setURI('./assets/YAML/generated/generated.yaml');
80-
81-
this.yaml.getJson().subscribe(data => {
82-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml Downloaded');
83-
this.YamlObject = data;
84-
var allDimensionNames = Object.keys(this.YamlObject);
85-
var totalTeamsImplemented: number = 0;
86-
var totalActivityTeams: number = 0;
87-
88-
this.AddSegmentLabels(allDimensionNames);
89-
90-
for (var l = 0; l < this.maxLevelOfActivities; l++) {
91-
for (var d = 0; d < allDimensionNames.length; d++) {
92-
var allSubDimensionInThisDimension = Object.keys(
93-
this.YamlObject[allDimensionNames[d]]
94-
);
95-
for (var s = 0; s < allSubDimensionInThisDimension.length; s++) {
96-
var allActivityInThisSubDimension = Object.keys(
97-
this.YamlObject[allDimensionNames[d]][
98-
allSubDimensionInThisDimension[s]
99-
]
80+
return new Promise<void>((resolve, reject) => {
81+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml Fetch');
82+
this.yaml.setURI('./assets/YAML/generated/generated.yaml');
83+
84+
this.yaml.getJson().subscribe(data => {
85+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml Downloaded');
86+
this.YamlObject = data;
87+
var allDimensionNames = Object.keys(this.YamlObject);
88+
var totalTeamsImplemented: number = 0;
89+
var totalActivityTeams: number = 0;
90+
91+
this.AddSegmentLabels(allDimensionNames);
92+
93+
for (var l = 0; l < this.maxLevelOfActivities; l++) {
94+
for (var d = 0; d < allDimensionNames.length; d++) {
95+
var allSubDimensionInThisDimension = Object.keys(
96+
this.YamlObject[allDimensionNames[d]]
10097
);
101-
var level = 'Level ' + (l + 1);
102-
var activity: activitySchema[] = [];
103-
var activityCompletionStatus: number = -1;
104-
105-
for (var a = 0; a < allActivityInThisSubDimension.length; a++) {
106-
try {
107-
var uuid =
108-
this.YamlObject[allDimensionNames[d]][
109-
allSubDimensionInThisDimension[s]
110-
][allActivityInThisSubDimension[a]]['uuid'];
111-
112-
var lvlOfCurrentActivity =
113-
this.YamlObject[allDimensionNames[d]][
114-
allSubDimensionInThisDimension[s]
115-
][allActivityInThisSubDimension[a]]['level'];
116-
117-
if (lvlOfCurrentActivity == l + 1) {
118-
var nameOfActivity: string = allActivityInThisSubDimension[a];
119-
var teamStatus: { [key: string]: boolean } = {};
120-
const teams = this.teamList;
121-
122-
totalActivityTeams += 1;
123-
124-
teams.forEach((singleTeam: any) => {
125-
teamStatus[singleTeam] = false;
126-
});
127-
128-
var teamsImplemented: any =
98+
for (var s = 0; s < allSubDimensionInThisDimension.length; s++) {
99+
var allActivityInThisSubDimension = Object.keys(
100+
this.YamlObject[allDimensionNames[d]][
101+
allSubDimensionInThisDimension[s]
102+
]
103+
);
104+
var level = 'Level ' + (l + 1);
105+
var activity: activitySchema[] = [];
106+
var activityCompletionStatus: number = -1;
107+
108+
for (var a = 0; a < allActivityInThisSubDimension.length; a++) {
109+
try {
110+
var uuid =
129111
this.YamlObject[allDimensionNames[d]][
130112
allSubDimensionInThisDimension[s]
131-
][allActivityInThisSubDimension[a]]['teamsImplemented'];
132-
133-
if (teamsImplemented) {
134-
teamStatus = teamsImplemented;
135-
}
136-
137-
var localStorageData = this.getFromBrowserState();
113+
][allActivityInThisSubDimension[a]]['uuid'];
138114

139-
if (localStorageData != null && localStorageData.length > 0) {
115+
var lvlOfCurrentActivity =
140116
this.YamlObject[allDimensionNames[d]][
141117
allSubDimensionInThisDimension[s]
142-
][allActivityInThisSubDimension[a]]['teamsImplemented'] =
143-
this.getTeamImplementedFromJson(
144-
localStorageData,
145-
allActivityInThisSubDimension[a]
146-
);
147-
}
118+
][allActivityInThisSubDimension[a]]['level'];
119+
120+
if (lvlOfCurrentActivity == l + 1) {
121+
var nameOfActivity: string = allActivityInThisSubDimension[a];
122+
var teamStatus: { [key: string]: boolean } = {};
123+
const teams = this.teamList;
148124

149-
(
150-
Object.keys(teamStatus) as (keyof typeof teamStatus)[]
151-
).forEach((key, index) => {
152125
totalActivityTeams += 1;
153-
if (teamStatus[key] === true) {
154-
totalTeamsImplemented += 1;
126+
127+
teams.forEach((singleTeam: any) => {
128+
teamStatus[singleTeam] = false;
129+
});
130+
131+
var teamsImplemented: any =
132+
this.YamlObject[allDimensionNames[d]][
133+
allSubDimensionInThisDimension[s]
134+
][allActivityInThisSubDimension[a]]['teamsImplemented'];
135+
136+
if (teamsImplemented) {
137+
teamStatus = teamsImplemented;
155138
}
156-
});
157139

158-
activity.push({
159-
uuid: uuid,
160-
activityName: nameOfActivity,
161-
teamsImplemented: teamStatus,
162-
});
163-
}
140+
var localStorageData = this.getFromBrowserState();
141+
142+
if (localStorageData != null && localStorageData.length > 0) {
143+
this.YamlObject[allDimensionNames[d]][
144+
allSubDimensionInThisDimension[s]
145+
][allActivityInThisSubDimension[a]]['teamsImplemented'] =
146+
this.getTeamImplementedFromJson(
147+
localStorageData,
148+
allActivityInThisSubDimension[a]
149+
);
150+
}
151+
152+
(
153+
Object.keys(teamStatus) as (keyof typeof teamStatus)[]
154+
).forEach((key, index) => {
155+
totalActivityTeams += 1;
156+
if (teamStatus[key] === true) {
157+
totalTeamsImplemented += 1;
158+
}
159+
});
160+
161+
activity.push({
162+
uuid: uuid,
163+
activityName: nameOfActivity,
164+
teamsImplemented: teamStatus,
165+
});
166+
}
164167

165-
if (totalActivityTeams > 0) {
166-
activityCompletionStatus =
167-
totalTeamsImplemented / totalActivityTeams;
168+
if (totalActivityTeams > 0) {
169+
activityCompletionStatus =
170+
totalTeamsImplemented / totalActivityTeams;
171+
}
172+
} catch {
173+
console.log('level for activity does not exist');
168174
}
169-
} catch {
170-
console.log('level for activity does not exist');
171175
}
172-
}
173176

174-
var cardSchemaData: cardSchema = {
175-
Dimension: allDimensionNames[d],
176-
SubDimension: allSubDimensionInThisDimension[s],
177-
Level: level,
178-
'Done%': activityCompletionStatus,
179-
Activity: activity,
180-
};
177+
var cardSchemaData: cardSchema = {
178+
Dimension: allDimensionNames[d],
179+
SubDimension: allSubDimensionInThisDimension[s],
180+
Level: level,
181+
'Done%': activityCompletionStatus,
182+
Activity: activity,
183+
};
181184

182-
this.ALL_CARD_DATA.push(cardSchemaData);
185+
this.ALL_CARD_DATA.push(cardSchemaData);
186+
}
183187
}
184188
}
185-
}
186-
187-
console.log('ALL CARD DATA', this.ALL_CARD_DATA);
188-
this.loadState();
189-
this.loadCircularHeatMap(
190-
this.ALL_CARD_DATA,
191-
'#chart',
192-
this.radial_labels,
193-
this.segment_labels
194-
);
195-
this.noActivitytoGrey();
196-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml End');
197189

190+
console.log('ALL CARD DATA', this.ALL_CARD_DATA);
191+
this.loadState();
192+
this.loadCircularHeatMap(
193+
this.ALL_CARD_DATA,
194+
'#chart',
195+
this.radial_labels,
196+
this.segment_labels
197+
);
198+
this.noActivitytoGrey();
199+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityDataFromGeneratedYaml End');
200+
resolve();
201+
});
198202
});
199203
}
200204

@@ -229,35 +233,41 @@ export class CircularHeatmapComponent implements OnInit {
229233
}
230234

231235
private LoadTeamsFromMetaYaml() {
232-
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml Fetch');
233-
this.yaml.setURI('./assets/YAML/meta.yaml');
234-
this.yaml.getJson().subscribe(data => { setTimeout((data) => {
235-
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml Downloaded');
236-
this.YamlObject = data;
237-
238-
this.teamList = this.YamlObject['teams'];
239-
this.teamGroups = this.YamlObject['teamGroups'];
240-
this.teamVisible = [...this.teamList];
241-
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml End');
242-
}, 500, data)}); // Delay Teams by half a second
236+
return new Promise<void>((resolve, reject) => {
237+
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml Fetch');
238+
this.yaml.setURI('./assets/YAML/meta.yaml');
239+
this.yaml.getJson().subscribe(data => { setTimeout((data) => {
240+
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml Downloaded');
241+
this.YamlObject = data;
242+
243+
this.teamList = this.YamlObject['teams'];
244+
this.teamGroups = this.YamlObject['teamGroups'];
245+
this.teamVisible = [...this.teamList];
246+
console.log((performance.now()/1000).toFixed(3) + 's: LoadTeamsFromMetaYaml End');
247+
resolve(); // Resolve the promise, and allow the next Load to run
248+
}, 500, data)}); // Delay Teams by half a second
249+
});
243250
}
244251

245252
private LoadMaturityLevels() {
246-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels Fetch');
247-
this.yaml.setURI('./assets/YAML/meta.yaml');
248-
// Function sets column header
249-
this.yaml.getJson().subscribe(data => { setTimeout((data) => {
250-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels Downloaded');
251-
this.YamlObject = data;
252-
253-
// Levels header
254-
for (let x in this.YamlObject['strings']['en']['maturity_levels']) {
255-
var y = parseInt(x) + 1;
256-
this.radial_labels.push('Level ' + y);
257-
this.maxLevelOfActivities = y;
258-
}
259-
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels End');
260-
}, 700, data)}); // Delay meta data even more than half a second. This order may happen on flaky network
253+
return new Promise<void>((resolve, reject) => {
254+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels Fetch');
255+
this.yaml.setURI('./assets/YAML/meta.yaml');
256+
// Function sets column header
257+
this.yaml.getJson().subscribe(data => { setTimeout((data) => {
258+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels Downloaded');
259+
this.YamlObject = data;
260+
261+
// Levels header
262+
for (let x in this.YamlObject['strings']['en']['maturity_levels']) {
263+
var y = parseInt(x) + 1;
264+
this.radial_labels.push('Level ' + y);
265+
this.maxLevelOfActivities = y;
266+
}
267+
console.log((performance.now()/1000).toFixed(3) + 's: LoadMaturityLevels End');
268+
resolve(); // Resolve the promise, and allow the next Load to run
269+
}, 700, data)}); // Delay meta data even more than half a second. This order may happen on flaky network
270+
});
261271
}
262272

263273
toggleTeamGroupSelection(chip: MatChip) {

0 commit comments

Comments
 (0)