66 lines
2.1 KiB
JavaScript
66 lines
2.1 KiB
JavaScript
|
'use strict'
|
||
|
|
|
||
|
|
function Gage (name, limit, color) {
|
||
|
|
this.name = name
|
||
|
|
this.color = color
|
||
|
|
this.limit = limit
|
||
|
|
this.value = limit
|
||
|
|
this.value_element = null
|
||
|
|
this.event_element = null
|
||
|
|
this.element = document.createElement('div')
|
||
|
|
this.progress = new Progress(15, color)
|
||
|
|
|
||
|
|
this.show_limit = true
|
||
|
|
this.units = ''
|
||
|
|
|
||
|
|
this.start = function () {
|
||
|
|
this.install()
|
||
|
|
}
|
||
|
|
|
||
|
|
this.install = function () {
|
||
|
|
this.element.setAttribute('class', 'gage ' + this.name.toLowerCase())
|
||
|
|
|
||
|
|
this.value_element = document.createElement('span')
|
||
|
|
this.value_element.setAttribute('class', 'value')
|
||
|
|
this.value_element.innerHTML = this.value + '(' + this.limit + ')'
|
||
|
|
this.element.appendChild(this.value_element)
|
||
|
|
|
||
|
|
this.event_element = document.createElement('span')
|
||
|
|
this.event_element.setAttribute('class', 'event')
|
||
|
|
this.element.appendChild(this.event_element)
|
||
|
|
|
||
|
|
this.element.appendChild(this.progress.install())
|
||
|
|
|
||
|
|
return this.element
|
||
|
|
}
|
||
|
|
|
||
|
|
this.update = function (value) {
|
||
|
|
this.value = typeof value === 'number' ? value : this.value
|
||
|
|
if (this.value > this.limit) { this.value = this.limit }
|
||
|
|
if (this.value < 0) { this.value = 0 }
|
||
|
|
|
||
|
|
this.progress.update(this.value, this.limit)
|
||
|
|
|
||
|
|
if (this.name == 'Shield' && this.value == 0) {
|
||
|
|
this.value_element.innerHTML = "0<span class='unit'>DP</span>"
|
||
|
|
} else if (this.name == 'Shield' && this.limit == 25) {
|
||
|
|
this.value_element.innerHTML = this.value + "<span class='unit'>DP</span>"
|
||
|
|
} else {
|
||
|
|
this.value_element.innerHTML = this.show_limit ? this.value + ' < ' + this.limit + "<span class='unit'>" + this.units + '</span>' : this.value + " <span class='unit'>" + this.units + '</span>'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
this.add_event = function (value) {
|
||
|
|
this.event_element.innerHTML = "<span class='name'>" + value + '</span>'
|
||
|
|
this.event_element.style.marginTop = '5px'
|
||
|
|
this.event_element.style.opacity = '0'
|
||
|
|
setTimeout(() => {
|
||
|
|
this.event_element.style.marginTop = '0px'
|
||
|
|
this.event_element.style.opacity = 1
|
||
|
|
}, 250)
|
||
|
|
}
|
||
|
|
|
||
|
|
this.clear_event = function () {
|
||
|
|
this.event_element.innerHTML = ''
|
||
|
|
}
|
||
|
|
}
|