OK now this script was like a dream come true when I finally got it to work...
AlbertFish basically stepped up as my scripting mentor and
made me think and helped me learn RUBY on a higher level...

THANKS AGAIN ' /A|L|3|=|R7T <')))><'

INSTRUCTIONS:
Copy and Paste above the Main Script in your RPG MAKER XP script database.

Code:

################################################################################
#                            The HP & SP HUD!
#                                  V 0.8
#                 
#                        by gameface101 & albertfish
#
#
# requires: 4 graphic files!
# 'heart' and 'heart container'
# 'star' and 'star container'
#
#
module GF
# Fade Position must match super position
GFH_X = 220
# Fade Position must match super position
GFH_Y = 420
# Allow HUD opaque if the hero is on top of the HUD.
GFH_FADE = true
end
#########################################################################[CLASS]
class Window_HeartsH < Window_Base#----------------------------=[in game window]
  def initialize#-------------------------------------------------=[define load]
  super (210, 404, 360, 100)#-------------=[x,y window position x,y window size]
    self.contents = Bitmap.new(width - 32, height - 32)#-----------------=[keep]
    refresh#---------------------------------------------=[call refresh command]
    self.opacity = 0#------------------------------------=[window skin opacity]
  end#---------------------------------------------------------=[end definition]
 
########################################################################[UPDATE]
  def update#---------------------------------------------------=[define update]
      super#------------------------------------------=[update the super window]
      if GF::GFH_FADE == true
    x = ($game_player.real_x - $game_map.display_x) / 4
    y = ($game_player.real_y - $game_map.display_y) / 4
    hud_size_x = 360
    hud_size_y = 100
    oc_range_x = hud_size_x + GF::GFH_X
    oc_range_y = hud_size_y + GF::GFH_Y
      if x < oc_range_x and x > GF::GFH_X - 5 and
        y > GF::GFH_Y - 15 and y < oc_range_y
      self.contents_opacity -= 10 if  self.contents_opacity > 120
      else
      self.contents_opacity += 10 if  self.contents_opacity < 255
      end
    end
    refresh#---------------------------------------------=[call refresh command]
  end#---------------------------------------------------------=[end definition]

#######################################################################[REFRESH] 
  def refresh#-------------------------------------------------=[define refresh]
    self.contents.clear#-----------------------------------------=[clear bitmap]
    draw_star#---------------------------------------------=[call to draw_heart]
    draw_heart#---------------------------------------------=[call to draw_star]
  end#---------------------------------------------------------=[end definition]
 
####################################################################[DRAW STARS] 
  def draw_star#---------------------------------------------=[define draw_star]
    x = 17 #----------------------------------------------=[draw x coordinates]
    y = 12 #----------------------------------------------=[draw y coordinates]
#===============================================================================
#    x = 52 if $game_party.actors[0].maxhp > 7000#-------------------=[vertical]
#    y = 52 if $game_party.actors[0].maxhp > 7000#-=[drop star bar to make room]
    for i in 0...($game_party.actors[0].maxsp + 99) / 100#----------=[for loop]
#===============================================================================

    if i < $game_party.actors[0].sp / 100#-----------------------=[condition 1]
#=========================================================[Draw a complete star]
    bitmap = RPG::Cache.picture("star")#------------------=[locate/store image]
    src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#--------=[image box]
    self.contents.blt(x, y, bitmap, src_rect)#--------------------=[edit v 0.4]
#===============================================================================

    elsif i < ($game_party.actors[0].sp + 99) / 100#--------------=[condition 2]
#================================================[DRAW A PARTIAL STAR CONTAINER]
    bitmap = RPG::Cache.picture("star container")#-----=[variable 'bitmap' store image]
    src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#-----=[image box]
    self.contents.blt(x, y, bitmap, src_rect)#------------------=[edit v 0.4]   
    sp = ($game_party.actors[0].sp+99)/100*100#--------------=[edit v 0.4]
    amount = 100 - (sp - $game_party.actors[0].sp)#----=[edit v 0.4]
    amount = amount * bitmap.height / 100#----=[edit v 0.4]
    amount = 24 - amount
    src_rect = Rect.new(0, amount, bitmap.width, bitmap.height- amount)#=[edit v 0.4]
    self.contents.blt(x, y + amount, bitmap, src_rect)#---=[edit v 0.4]
    src_rect = Rect.new(0, 0, bitmap.width, amount)#---------------=[image box]
#==========================================================[DRAW A PARTIAL STAR]   
    sp = ($game_party.actors[0].sp+99)/100*100#--------------=[SP?]
    amount = 100 - (sp - $game_party.actors[0].sp)#----=[edit v 0.4]
  amount = amount * bitmap.height / 100#----=[edit v 0.4]
  amount = 24 - amount#------------------------------------------=[fill/drain]

    bitmap = RPG::Cache.picture("star")#--------=[variable 'bitmap' store image]
  src_rect = Rect.new(0, amount, bitmap.width, bitmap.height- amount)#----=[edit v 0.4]
    self.contents.blt(x, y + amount, bitmap, src_rect)#-----------=[edit v 0.4]
  src_rect = Rect.new(0, 0, bitmap.width, amount)#----------------=[image box]
#===============================================================================
     
    else#---------------------------------------------------------=[condition 3]
#==============================================================[Draw empty star]
    bitmap = RPG::Cache.picture("star container")#-----=[variable 'bitmap' store image]
    src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#-------=[edit v 0.4]
    self.contents.blt(x, y, bitmap, src_rect)#---------------------=[edit v 0.4]
    end#-------------------------------------------------------=[end definition]
    # if the player has 11 stars go back to the left side of the screen and go down one row. This is so you get two rows of stars (zelda style)
    x, y = 4, 78 if i == 11 #-------------------------------=[?]
    x += 26 #---------------------------------------=[space icons evenly?] # shift x position so that the icon does not overlap.
    end#----------------------------------=[end 1st box] # end of for loop
  end#---------------------------------=[end 2nd box] # end of if statement
################################################################################
 
###################################################################[DRAW HEARTS]
  def draw_heart#-------------------------------------------=[define draw_heart]
    x = 4 #------------------------------------------------=[draw x coordinates]
    y = 0#------------------------------------------------=[draw y coordinates]
   
    for i in 0...($game_party.actors[0].maxhp + 99) / 100#-----------=[new edit]
     
      if i < $game_party.actors[0].hp / 100#-------------------------=[new edit]
#===============================================================[complete heart]
 bitmap = RPG::Cache.picture("heart")#store the image in the variable 'bitmap'
 src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#----------=[edit v 0.4]
 self.contents.blt(x, y, bitmap, src_rect)#------------------------=[edit v 0.4]
#===============================================================================

    elsif i < ($game_party.actors[0].hp + 99) / 100
#=================================================[DRAW PARTIAL HEART CONTAINER]   
      bitmap = RPG::Cache.picture("heart container")#-----=[variable 'bitmap' store image]
      src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#-----=[edit v 0.4]
      self.contents.blt(x, y, bitmap, src_rect)#------------------=[edit v 0.4]
     
    hp = ($game_party.actors[0].hp+99)/100*100#--------------=[edit v 0.4]
    amount = 100 - (hp - $game_party.actors[0].hp)#----=[edit v 0.4]
    amount = amount * bitmap.height / 100#----=[edit v 0.4]
    amount = 24 - amount
#----------------------------------------------------------=[DRAW PARTIAL HEART]
  bitmap = RPG::Cache.picture("heart")#--------=[variable 'bitmap' store image]   
    src_rect = Rect.new(0, amount, bitmap.width, bitmap.height- amount)#----=[edit v 0.4] 
  self.contents.blt(x, y + amount, bitmap, src_rect)#---=[edit v 0.4]
    src_rect = Rect.new(0, 0, bitmap.width, amount)#---=[edit v 0.4]
    hp = ($game_party.actors[0].hp+99)/100*100#--------------=[edit v 0.4]
    amount = 100 - (hp - $game_party.actors[0].hp)#----=[edit v 0.4]
  amount = amount * bitmap.height / 100#----=[edit v 0.4]
    amount = 24 - amount#----------------------------=[fill/drain-top to bottom]

#-----------------------------------------------------------=[DRAW BOTH BITMAPS]   
    src_rect = Rect.new(0, amount, bitmap.width, bitmap.height- amount)#----=[?]
    self.contents.blt(x, y + amount, bitmap, src_rect)#---=[?]
    src_rect = Rect.new(0, 0, bitmap.width, amount)#---=[?]
#===============================================================================

      else
#=========================================================[DRAW HEART CONTAINER]
 bitmap = RPG::Cache.picture("heart container")#store the image in the variable 'bitmap'

 src_rect = Rect.new(0, 0, bitmap.width, bitmap.height)#-------------------=[?]

 self.contents.blt(x, y, bitmap, src_rect)#--------------------------------=[?]
      end#-----------------------------------------------------=[end definition]
      x, y = 4, 26 if i == 11#---------------------------------=[refer to above]
      x += 26 #------------------------------------------------=[refer to above]
    end#---------------------------------------------------------=[end for loop]
  end#-------------------------------------------------------=[end if statement]
end#--------------------------------------------------=[end class Window_Hearts]
################################################################################


###############################################################[SCENE_MAP ALIAS]
class Scene_Map#----------------------------------------=[Map Screen Processing]
  alias gf101_hshpsph_hud_main main#---------------------------=[alias gface101]
  def main#-----------------------------------------------=[define main process]
    @hud_windowh = Window_HeartsH.new#------------------------=[call hud window]
    @hud_windowh.visible = $game_switches[401]#----------------=[display switch]
    gf101_hshpsph_hud_main#-----------------------------------=[call with alias]
    @hud_windowh.dispose#------------------------------=[gets rid of the window]
  end#---------------------------------------------------------=[end definition]
  alias gf101_hshpsph_hud_update update#------------------------[aliased update]
  def update#---------------------------------------------------=[define update]
    @hud_windowh.update#------------------------------------------=[call update]
    @hud_windowh.visible = $game_switches[401]#----------------=[display switch]
    gf101_hshpsph_hud_update#---------------------------------=[call with alias]
  end#---------------------------------------------------------=[end definition]
end#---------------------------------------------------------------=[end it all]

GRAPHICS REQUIRED:
copy the following graphics to your pictures folder:

Heart
Heart container:
Star
Star container:



Zelda eat your hearts out! ~(G/A\/\/\|E|F/A\(C|=

say, this new HUD Moghunter shared was very close to what I was aiming for with the hearts and stars script early on,
http://www.atelier-rgss.com/RGSS/Menu/XP_Menu16.html

going to study the code, maybe dust off a newer version

Ahh, good old hearts script. I remember this one . Waiting to see your newer version of this script.

HA! Albertfish!!! sup eh? how could I forget making this with you...
Your support fueled inspiration to make this site ^,^

yeah, somewhere down the line we gotta add the animations to the containers disappearing or reappearing ~ lol!

looking forward to more of your scripts