78 lines
2.2 KiB
TypeScript
78 lines
2.2 KiB
TypeScript
import { BaseView } from "../BaseView"
|
|
import { UIBuilder } from "./UIBuilder"
|
|
import { UIContainer } from "./UIContainer"
|
|
import { UIGraphics } from "./UIGraphics"
|
|
import { UIText } from "./UIText"
|
|
import { UITools } from "./UITools"
|
|
|
|
/**
|
|
* Decorated background for dynamic sized content (such as tooltips)
|
|
*/
|
|
export class UIBackground {
|
|
private graphics: UIGraphics
|
|
x = 0
|
|
y = 0
|
|
width = 0
|
|
height = 0
|
|
|
|
constructor(readonly view: BaseView, readonly parent: UIContainer, readonly border = 6) {
|
|
this.graphics = new UIBuilder(view, parent).graphics("background", 0, 0, false);
|
|
}
|
|
|
|
/**
|
|
* Draw a background around a content
|
|
*/
|
|
drawAround(content: UIContainer | Phaser.GameObjects.Text, border = 6): [number, number] {
|
|
if (content.parentContainer === this.parent) {
|
|
this.adaptToContent(content);
|
|
return [this.width, this.height];
|
|
} else {
|
|
console.error("Cannot draw background with different parents", content, this);
|
|
return [0, 0];
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Adapt the background to cover a given content
|
|
*/
|
|
adaptToContent(content: UIContainer | UIText): void {
|
|
if (content.parentContainer != this.graphics.parentContainer) {
|
|
console.error("Content and background should have the same parent container");
|
|
return;
|
|
}
|
|
|
|
let bounds = UITools.getBounds(content);
|
|
|
|
let x = bounds.x - this.graphics.parentContainer.x - this.border;
|
|
let y = bounds.y - this.graphics.parentContainer.y - this.border;
|
|
let width = bounds.width + 2 * this.border;
|
|
let height = bounds.height + 2 * this.border;
|
|
|
|
if (x != this.x || y != this.y || width != this.width || height != this.height) {
|
|
this.graphics.clear();
|
|
this.graphics.lineStyle(2, 0x6690a4);
|
|
this.graphics.fillStyle(0x162730);
|
|
this.graphics.fillRect(x, y, width, height);
|
|
this.graphics.strokeRect(x, y, width, height);
|
|
this.graphics.setVisible(true);
|
|
|
|
this.x = x;
|
|
this.y = y;
|
|
this.width = width;
|
|
this.height = height;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Remove the drawn background
|
|
*/
|
|
clear(): void {
|
|
this.graphics.setVisible(false);
|
|
this.graphics.clear();
|
|
this.x = 0;
|
|
this.y = 0;
|
|
this.width = 0;
|
|
this.height = 0;
|
|
}
|
|
}
|