60 lines
1.3 KiB
JavaScript
60 lines
1.3 KiB
JavaScript
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
|
|
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)`
|
|
}
|
|
|
|
move(x, y) {
|
|
this.x = x
|
|
this.y = y
|
|
this.#update_pos()
|
|
}
|
|
|
|
resize(w, h) {
|
|
this.w = w
|
|
this.h = h
|
|
this.#update_pos()
|
|
}
|
|
|
|
rotate(d) {
|
|
this.d = d
|
|
this.#update_pos()
|
|
}
|
|
|
|
hide() {
|
|
this.element.style.display = "none"
|
|
}
|
|
|
|
show() {
|
|
this.element.style.display = "initial"
|
|
}
|
|
|
|
destroy() {
|
|
this.element.remove()
|
|
}
|
|
|
|
}
|