feat: add hp/pp bar everywhere

* Add a ComplexHPBar widget
* Use it on the CBS
* Add it on the character page
* Add it on the character widget

Fix #46

sonic-radiance.love/game/modules/gui/complexhpbar.lua

@@ -0,0 +1,85 @@
+local ComplexHPBar = Object:extend()
+
+local gui         = require "game.modules.gui"
+
+local VALUE_MARGIN = 11
+local HEIGHT = 7
+
+function ComplexHPBar:new(width)
+    self.width = width
+    self:setColorForeground(1, 1, 1)
+    self:setColorBackground(0, 0, 0)
+    self.background = self:createBack( "assets/gui/hpbar_back.png" )
+    self.foreground = self:createBack( "assets/gui/hpbar_fore.png" )
+end
+
+function ComplexHPBar:setColorForeground(r, g, b)
+    self.barcolor = {}
+    self.barcolor.r = r
+    self.barcolor.g = g
+    self.barcolor.b = b
+end
+
+function ComplexHPBar:setColorBackground(r, g, b)
+    self.backcolor = {}
+    self.backcolor.r = r
+    self.backcolor.g = g
+    self.backcolor.b = b
+end
+
+function ComplexHPBar:createBack( filepath )
+    local image = love.graphics.newImage( filepath )
+    local imageWidth, imageHeight = image:getDimensions()
+    local middleImageWidth = imageWidth - VALUE_MARGIN*2
+
+    local totalWidth = self.width + 8 -- On récupère la taille à partir de la base
+    local middleWidth = totalWidth - VALUE_MARGIN*2
+
+    local iteration = math.ceil((middleWidth) / (middleImageWidth))
+    local tilequad  = {}
+    tilequad[1]     = love.graphics.newQuad(0, 0, VALUE_MARGIN, imageHeight, imageWidth, imageHeight)
+    tilequad[2]     = love.graphics.newQuad(VALUE_MARGIN, 0, middleImageWidth, imageHeight, imageWidth, imageHeight)
+    tilequad[3]     = love.graphics.newQuad(imageWidth - VALUE_MARGIN, 0, VALUE_MARGIN, imageHeight, imageWidth, imageHeight)
+
+    local canvas1 = love.graphics.newCanvas(middleWidth, imageHeight)
+    love.graphics.setCanvas( canvas1 )
+    local combinedWidth = 0
+    for i = 1, iteration do
+        love.graphics.draw(image, tilequad[2], combinedWidth, 0)
+        combinedWidth = combinedWidth + middleImageWidth
+    end
+
+    local canvas2 = love.graphics.newCanvas(totalWidth, imageHeight)
+    love.graphics.setCanvas( canvas2 )
+    love.graphics.draw(image, tilequad[1], 0, 0)
+    love.graphics.draw(canvas1, VALUE_MARGIN, 0)
+    love.graphics.draw(image, tilequad[3], totalWidth - 11, 0)
+    love.graphics.setCanvas( )
+
+    local imagedata = canvas2:newImageData()
+    local texture   = love.graphics.newImage( imagedata )
+    imagedata:release()
+    canvas2:release()
+
+    return texture
+end
+
+function ComplexHPBar:draw(x, y, percent)
+    utils.graphics.resetColor()
+    love.graphics.draw(self.foreground, x, y)
+    love.graphics.setColor(self.backcolor.r, self.backcolor.g, self.backcolor.b, 1)
+    love.graphics.draw(self.background, x, y)
+    utils.graphics.resetColor()
+
+    love.graphics.setColor(self.barcolor.r, self.barcolor.g, self.barcolor.b, 1)
+    gui.drawBar(x + 4, y + 2, math.floor((self.width) * percent), HEIGHT)
+    utils.graphics.resetColor()
+end
+
+function ComplexHPBar:drawWithLabels(x, y, value, valuemax)
+    local percent = value / valuemax
+    self:draw(x, y, percent)
+    love.graphics.print(math.floor(value) .. "/" .. valuemax, x+10, y+2)
+end
+
+return ComplexHPBar

sonic-radiance.love/game/modules/gui/statusbar.lua

@@ -4,6 +4,7 @@ local TweenManager = require "game.modules.tweenmanager"
 local gui = require "game.modules.gui"
 
 local Emblem = require "game.modules.gui.emblem"
+local ComplexHPBar = require "game.modules.gui.complexhpbar"
 
 function StatusBar:new(abstract, scene)
   self.assets = scene.assets
@@ -15,6 +16,13 @@ function StatusBar:new(abstract, scene)
   self.pp = self.abstract.pp
   self.stats = self.abstract:getStats()
 
+  self.hpbar = ComplexHPBar(58)
+  self.ppbar = ComplexHPBar(58)
+  self.hpbar:setColorForeground(248/255, 160/255, 0, 1)
+  self.hpbar:setColorBackground(112/255, 0, 0)
+  self.ppbar:setColorForeground(0, 248/255, 248/255, 1)
+  self.ppbar:setColorBackground(0, 54/255, 229/255)
+
   self.tweens = TweenManager(self)
 end
 
@@ -42,18 +50,9 @@ self.assets.images["statusbar"]:draw(x, y)
 local hpmax = self.stats.hpmax
 local ppmax = self.stats.ppmax
 
-local bar1 = math.floor((self.hp/self.stats.hpmax)*58)
-local bar2 = math.floor((self.pp/self.stats.ppmax)*58)
-
-love.graphics.setColor(248/255, 160/255, 0, 1)
-gui.drawBar(x+10, y+11, bar1, 7)
-love.graphics.setColor(0, 248/255, 248/255, 1)
-gui.drawBar(x+22, y+23, bar2, 7)
-utils.graphics.resetColor()
-
 self.assets.fonts["hudnbrs_small"]:set()
-love.graphics.print(math.floor(self.hp) .. "/" .. hpmax, x+16, y+11)
+self.hpbar:drawWithLabels(x +  6, y +  9, self.hp, hpmax)
-love.graphics.print(math.floor(self.pp) .. "/" .. ppmax, x+32, y+23)
+self.ppbar:drawWithLabels(x + 18, y + 21, self.pp, ppmax)
 
 local lvl = self.abstract.level
 

sonic-radiance.love/scenes/overworld/screens/mainmenu/character/basicpage.lua

@@ -4,12 +4,23 @@ local menu = require "game.modules.menus.fancy"
 local gui = require "game.modules.gui"
 local const = require "scenes.overworld.screens.mainmenu.const"
 
+local ComplexHPBar = require "game.modules.gui.complexhpbar"
+
+local HPBAR_SIZE = 80
+
 function BasicPage:new(view, character)
   self.view = view
   self.character = game.characters.list[character]
 
   self.statBox = gui.newTextBox("assets/gui/dialogbox.png", const.CHARPAGESIZE, 48+8)
   self.nameBox = gui.newTextBox("assets/gui/dialogbox.png", const.CHARPAGESIZE, 40)
+
+  self.hpbar = ComplexHPBar(HPBAR_SIZE)
+  self.ppbar = ComplexHPBar(HPBAR_SIZE)
+  self.hpbar:setColorForeground(248/255, 160/255, 0, 1)
+  self.hpbar:setColorBackground(112/255, 0, 0)
+  self.ppbar:setColorForeground(0, 248/255, 248/255, 1)
+  self.ppbar:setColorBackground(0, 54/255, 229/255)
 end
 
 function BasicPage:getMenuWidgets()
@@ -22,6 +33,7 @@ end
 
 function BasicPage:draw()
   self:drawIdentity(const.X, const.Y)
+  self:drawHPPP(const.X, const.Y + 48)
   self:drawLevel(const.X, 100)
   self:drawStats(const.X, 160)
   --self:drawWeakStrong(const.X, 160)
@@ -35,6 +47,13 @@ function BasicPage:drawIdentity(x, y)
   self.view.scene.assets.fonts["small"]:draw(identityString, x + 6, y + 4, -1, "left")
 end
 
+function BasicPage:drawHPPP(x, y)
+  self.view.scene.assets.fonts["hudnbrs_small"]:set()
+  self.hpbar:drawWithLabels(x, y - 4, self.character.hp, self.character.stats.hpmax)
+  local xx = x + const.CHARPAGESIZE - HPBAR_SIZE - 7
+  self.ppbar:drawWithLabels(xx, y - 4, self.character.pp, self.character.stats.ppmax)
+end
+
 function BasicPage:drawLevel(x, y)
   local levelString = "Level: " .. self.character.level .. "\n"
   local levelString = levelString .. "Current exp: " .. self.character.exp .. "\n"

sonic-radiance.love/scenes/overworld/screens/mainmenu/pause.lua

@@ -1,8 +1,7 @@
 local ParentScreen = require "scenes.overworld.screens.parent"
 local PauseScreen = ParentScreen:extend()
 
-local ListBox = require "core.modules.menusystem.listbox"
+local ComplexHPBar = require "game.modules.gui.complexhpbar"
-local Widget  = require "core.modules.menusystem.widgets"
 
 local Emblem = require "game.modules.gui.emblem"
 
@@ -78,6 +77,13 @@ function CharacterWidget:new(scene, name)
   self.emblem = Emblem(game.characters.list[name], scene)
   self.font2 = scene.assets.fonts["hudnbrs_small"]
   CharacterWidget.super.new(self, scene, "character")
+
+  self.hpbar = ComplexHPBar(88)
+  self.ppbar = ComplexHPBar(88)
+  self.hpbar:setColorForeground(248/255, 160/255, 0, 1)
+  self.hpbar:setColorBackground(112/255, 0, 0)
+  self.ppbar:setColorForeground(0, 248/255, 248/255, 1)
+  self.ppbar:setColorBackground(0, 54/255, 229/255)
 end
 
 function CharacterWidget:drawCanvas()
@@ -93,11 +99,18 @@ function CharacterWidget:drawCanvas()
   self.font2:print(character.level, xLvl + 19, yLvl, "left")
   local expString = character.exp .. "/" .. character.exp_next
   self.font2:print(expString, xLvl + 19, yLvl + 10, "left")
-  --text, x, y, limit, align
 end
 
 function CharacterWidget:draw(x, y)
+  local character = game.characters.list[self.charName]
   self.emblem:draw(x, y+6)
+
+  local xDebut = x + 52
+  local yDebut = y + 15
+  self.scene.assets.fonts["hudnbrs_small"]:set()
+  self.hpbar:drawWithLabels(xDebut + 53, yDebut, character.hp, character.stats.hpmax)
+  self.ppbar:drawWithLabels(xDebut + 64, yDebut + 11, character.pp, character.stats.ppmax)
+
   if self.canvas.texture ~= nil then
     love.graphics.draw(self.canvas.texture, x - self.ox, y - self.oy)
   end