90 lines
3.2 KiB
TypeScript
90 lines
3.2 KiB
TypeScript
import Conquer from '@burguillosinfo/conquer'
|
|
import ConquerUser from '@burguillosinfo/conquer/user'
|
|
import AbstractTopBarInterface from '@burguillosinfo/conquer/interface/abstract-top-bar-interface'
|
|
import MapNode from '@burguillosinfo/conquer/map-node'
|
|
import ConquerTeam from '@burguillosinfo/conquer/team';
|
|
|
|
export default class SelectTeamUI extends AbstractTopBarInterface {
|
|
private node: MapNode;
|
|
private user: ConquerUser;
|
|
private form: HTMLElement | null = null;
|
|
|
|
constructor(node: MapNode) {
|
|
super();
|
|
this.node = node;
|
|
}
|
|
|
|
public async run(): Promise<void> {
|
|
const user = await ConquerUser.getSelfUser()
|
|
if (user === null) {
|
|
this.runCallbacks('close')
|
|
return
|
|
}
|
|
this.user = user
|
|
await this.populateTeams();
|
|
this.getForm().classList.remove('conquer-display-none');
|
|
this.getMainNode().append(this.getForm());
|
|
this.getMainNode().classList.remove('conquer-display-none');
|
|
}
|
|
|
|
private async populateTeams() {
|
|
const teams = await ConquerTeam.getTeams();
|
|
for (const team of teams) {
|
|
this.populateTeam(team);
|
|
}
|
|
}
|
|
|
|
private populateTeam(team: ConquerTeam) {
|
|
const teamDiv = this.getNodeFromTemplateId('conquer-team-to-select-template')
|
|
const nameParagraph = teamDiv.querySelector('p.conquer-name');
|
|
const descriptionParagraph = teamDiv.querySelector('p.conquer-description');
|
|
const submit = teamDiv.querySelector('button.conquer-submit');
|
|
if (!(nameParagraph instanceof HTMLParagraphElement)
|
|
|| !(descriptionParagraph instanceof HTMLParagraphElement)
|
|
|| !(submit instanceof HTMLButtonElement)) {
|
|
Conquer.fail('Select team name inclusive or description container are not correctly defined in template.');
|
|
}
|
|
nameParagraph.innerText = team.getName();
|
|
descriptionParagraph.innerText = team.getDescription();
|
|
nameParagraph.style.color = team.getColor();
|
|
submit.addEventListener('click', async () => {
|
|
this.onSelectTeam(team);
|
|
});
|
|
this.getForm().append(teamDiv);
|
|
}
|
|
|
|
private async onSelectTeam(team: ConquerTeam) {
|
|
const urlTeam = new URL('/conquer/user/team',
|
|
window.location.protocol + '//'
|
|
+ window.location.hostname + ':'
|
|
+ window.location.port);
|
|
const response = await fetch(urlTeam, {
|
|
method: 'POST',
|
|
body: JSON.stringify({
|
|
team: team.getUUID(),
|
|
node: this.node.getUUID(),
|
|
}),
|
|
});
|
|
let responseBody;
|
|
try {
|
|
responseBody = await response.json();
|
|
if (response.status !== 200) {
|
|
console.error(responseBody.error);
|
|
return;
|
|
}
|
|
this.runCallbacks('update-nodes');
|
|
this.runCallbacks('close')
|
|
} catch (error) {
|
|
console.error('Error parsing json', error);
|
|
}
|
|
}
|
|
|
|
private getForm(): HTMLElement {
|
|
if (this.form === null) {
|
|
const form = this.getNodeFromTemplateId('conquer-select-team-list-template')
|
|
this.form = form;
|
|
}
|
|
return this.form;
|
|
}
|
|
}
|