50 lines
1.6 KiB
JavaScript
50 lines
1.6 KiB
JavaScript
|
import { ctx } from './canvas'
|
||
|
|
||
|
class Debugging {
|
||
|
draw (vp, world, fps) {
|
||
|
let p = vp.chunkIn(world.chunkSize * world.tileSize)
|
||
|
ctx.fillStyle = '#fff'
|
||
|
ctx.fillText(fps + ' fps', 4, 16)
|
||
|
ctx.fillText('cam-in-chunk (x: ' + p.x + '; y: ' + p.y + ')', 4, 32)
|
||
|
ctx.fillText('loaded ' + world.chunks.length, 4, 48)
|
||
|
ctx.fillText('drawn ' + world._lastDrawCount, 4, 64)
|
||
|
ctx.fillText('updates ' + world._lastUpdateCount, 4, 80)
|
||
|
}
|
||
|
|
||
|
createSliders (obj, args, fn) {
|
||
|
let overlay = document.createElement('div')
|
||
|
overlay.style = 'color:#fff;position:absolute;top:15px;right:15px;background-color:hsla(0,0%,47%,0.5);padding:10px;display:flex;flex-direction:column;'
|
||
|
|
||
|
for (let a in args) {
|
||
|
let min = args[a][0]
|
||
|
let max = args[a][1]
|
||
|
let step = args[a][2]
|
||
|
let div = document.createElement('div')
|
||
|
div.style = 'display:flex;flex-direction:row;'
|
||
|
let name = document.createElement('span')
|
||
|
let value = document.createElement('value')
|
||
|
let slider = document.createElement('input')
|
||
|
slider.style = 'flex-grow:1;'
|
||
|
slider.type = 'range'
|
||
|
slider.min = min
|
||
|
slider.max = max
|
||
|
slider.step = step
|
||
|
slider.value = obj[a]
|
||
|
name.innerHTML = a
|
||
|
value.innerHTML = obj[a]
|
||
|
slider.addEventListener('input', function (e) {
|
||
|
obj[a] = parseFloat(slider.value)
|
||
|
value.innerHTML = slider.value
|
||
|
fn(a, slider.value)
|
||
|
})
|
||
|
div.appendChild(name)
|
||
|
div.appendChild(slider)
|
||
|
div.appendChild(value)
|
||
|
overlay.appendChild(div)
|
||
|
}
|
||
|
document.body.appendChild(overlay)
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export default new Debugging()
|