tuxman/client/js/gfx/sprite.js

68 lines
1.5 KiB
JavaScript
Raw Normal View History

2023-06-14 01:18:01 +00:00
export class Sprite {
constructor(image_src, map) {
this.element = document.createElement("img")
this.element.src = image_src
this.element.className = "sprite"
document.getElementById("container").appendChild(this.element)
this.map = map
this.x = 0
this.y = 0
this.w = 1
this.h = 1
2023-06-15 03:22:26 +00:00
this.z = 1
2023-06-14 01:18:01 +00:00
this.d = 0
this.hide()
}
#update_pos() {
let width = 100 / this.map.width * this.w
let height = 100 / this.map.height * this.h
let left = 100 / this.map.width * (this.x + (1 - this.w) / 2)
let top = 100 / this.map.height * (this.y + (1 - this.h) / 2)
this.element.style.width = `${width}%`
this.element.style.height = `${height}%`
this.element.style.left = `${left}%`
this.element.style.top = `${top}%`
this.element.style.transform = `rotate(${this.d}deg)`
2023-06-15 03:22:26 +00:00
this.element.style.zIndex = `${this.z}`
2023-06-14 01:18:01 +00:00
}
move(x, y) {
this.x = x
this.y = y
this.#update_pos()
}
resize(w, h) {
this.w = w
this.h = h
this.#update_pos()
}
2023-06-15 03:22:26 +00:00
layer(z) {
this.z = z
this.#update_pos()
}
2023-06-14 01:18:01 +00:00
rotate(d) {
this.d = d
this.#update_pos()
}
hide() {
this.element.style.display = "none"
}
show() {
this.element.style.display = "initial"
}
destroy() {
this.element.remove()
}
}