const getFontHeight = font => {
    const parent = document.createElement("span")
    parent.appendChild(document.createTextNode("height"))
    document.body.appendChild(parent)
    parent.style.cssText = "font: " + font + "; white-space: nowrap; display: inline;"
    
    const height = parent.offsetHeight
    
    document.body.removeChild(parent)
    return height
}

const drawText = (ctx, text, x, y, w, h, lineHeight, skip = 0) => {
    let line = ''
    let _x = x
    let _y = y
    
    const words = text.split(' ')
    
    const index = words.findIndex((word, i) => {
        if (i < skip) return false
        
        const testLine = `${line}${word} `
        const testWidth = ctx.measureText(testLine).width
        
        if (testWidth > w) {
            ctx.fillText(line, _x, _y)
            line = `${word} `
            _x += lineHeight
            
            if (_x > h) return true
        } else {
            line = testLine
        }
        
        return false
    })
    
    ctx.fillText(line, _x, _y)
    
    return index === -1 ? words.length : index + 1
}
