burguillos.info/js-src/conquer/interface/node-view.ts

92 lines
3.2 KiB
TypeScript

import AbstractTopBarInterface from '@burguillosinfo/conquer/interface/abstract-top-bar-interface'
import Conquer from '@burguillosinfo/conquer'
import MapNode from '@burguillosinfo/conquer/map-node'
import ConquerUser from '@burguillosinfo/conquer/user'
export default class NodeView extends AbstractTopBarInterface {
private node: MapNode;
private user: ConquerUser;
private view: HTMLElement | null = null;
public getNode(): MapNode {
return this.node;
}
private getNodeNameH2(): HTMLElement {
const element = this.getMainNode().querySelector('h2.node-name');
if (!(element instanceof HTMLElement)) {
Conquer.fail('h2.node-name is not a H2 or does not exist.');
}
return element;
}
private getView(): HTMLElement {
if (this.view === null) {
const view = this.getNodeFromTemplateId('conquer-view-node-template')
this.view = view;
}
return this.view;
}
private getNodeDescriptionParagraph(): HTMLElement {
const element = this.getMainNode().querySelector('p.node-description');
if (!(element instanceof HTMLElement)) {
Conquer.fail('p.node-description is not a P or does not exist.');
}
return element;
}
constructor(node: MapNode) {
super()
this.node = node;
}
public async run() {
const user = await ConquerUser.getSelfUser();
if (user === null) {
this.runCallbacks('close');
return;
}
this.user = user;
const mainNode = this.getMainNode()
this.runCallbacks('update-nodes');
try {
this.node = await this.node.fetch();
} catch (error) {
this.runCallbacks('close');
}
mainNode.append(this.getView())
this.getNodeNameH2().innerText = this.node.getName();
this.getNodeDescriptionParagraph().innerText = this.node.getDescription()
+ "\n"
+ (this.node.isNear()
? 'Estas cerca y puedes interactuar con este sitio.'
: 'Estás demasiado lejos para hacer nada aquí.');
if (this.node.isNear()) {
await this.runIfNear();
}
this.getView().classList.remove('conquer-display-none')
mainNode.classList.remove('conquer-display-none')
}
private async runIfNear(): Promise<void> {
const team = await this.user.getTeam();
if (team === null) {
const paragraphNoTeam = document.createElement('p');
paragraphNoTeam.innerText = 'Parece que no has seleccionado equipo aun,'
+ ' pulsa el botón de seleccionar equipo para comenzar tu aventura,'
+ ' si quieres cambiar de equipo en el futuro puedes hacerlo sin problemas.';
this.getView().append(paragraphNoTeam);
}
const selectTeamButton = document.createElement('button');
selectTeamButton.innerText = 'Seleccionar equipo';
selectTeamButton.addEventListener('click', () => {
this.runCallbacks('open-select-team');
this.runCallbacks('close');
});
this.getView().append(selectTeamButton);
}
}