local gfx = love.graphics

filteredSystem("drawRectangles", { position = T.XyPair, drawAsRectangle = { size = T.XyPair } }, function(e, _, _)
    gfx.fillRect(e.position.x, e.position.y, e.drawAsRectangle.size.x, e.drawAsRectangle.size.y)
end)

filteredSystem("drawSprites", { position = T.XyPair, drawAsSprite = T.pd_image }, function(e)
    if e.position.y < Camera.pan.y - 240 or e.position.y > Camera.pan.y + 480 then
        return
    end
    e.drawAsSprite:draw(e.position.x, e.position.y)
end)

local margin = 8

filteredSystem(
    "drawText",
    { position = T.XyPair, drawAsText = { text = T.str, style = Maybe(T.str), font = Maybe(T.pd_font) } },
    function(e)
        local font = gfx.getFont() -- e.drawAsText.font or AshevilleSans14Bold
        local textHeight = font:getHeight()
        local textWidth = font:getWidth(e.drawAsText.text)

        local bgLeftEdge = e.position.x - margin - textWidth / 2
        local bgTopEdge = e.position.y - 2
        local bgWidth, bgHeight = textWidth + (margin * 2), textHeight + 2

        if e.drawAsText.style == TextStyle.Inverted then
            gfx.setColor(0, 0, 0)
            gfx.rectangle("fill", bgLeftEdge, bgTopEdge, textWidth + margin, textHeight + 2)
            gfx.setColor(1, 1, 1)
        elseif e.drawAsText.style == TextStyle.Bordered then
            gfx.setColor(1, 1, 1)
            gfx.rectangle("fill", bgLeftEdge, bgTopEdge, bgWidth, bgHeight)

            gfx.setColor(0, 0, 0)
            gfx.drawRect("line", bgLeftEdge, bgTopEdge, bgWidth, bgHeight)
        end

        gfx.print(e.drawAsText.text, bgLeftEdge + margin, bgTopEdge + margin)
    end
)