New blood bags (#3961)

# About the pull request

Since we're putting so much emphasis on blood bags lately, I figured I
might as well do my part as spriter and add actual _labels_ to the
things so you can tell what they are at a glance. Also overhauled the
system to use overlays and underlays instead of the cursed
`full/half/empty` thing that it had going beforehand.

# Explain why it's good for the game

You now no longer have to manually inspect blood bags to tell what type
they are! Rejoice.

# Testing Photographs and Procedure
<img width="251" alt="image"
src="https://github.com/cmss13-devs/cmss13/assets/55491249/c4424ec3-bfe6-4d58-8915-595b468a7606">

_Blood bags in action. Sort of. Yes, they actually change color now._

<img width="571" alt="image"
src="https://github.com/cmss13-devs/cmss13/assets/55491249/3b478c65-54b9-4321-bf02-dcfacaf1ad23">

_Icon states! Also sprinkled in some yet-unused labels for future
use(TM). AB types are here, too, because I forgot they weren't in the
game._
# Changelog

:cl: nauticall
imageadd: Resprited blood bags to look nicer and use proper a proper
overlay/underlay system. Their types are also now distinguishable at a
glance.
code: Reworked the way blood bag sprites work behind the scenes to use
the overlay/underlay system.
/:cl:

code/game/objects/items/reagent_containers/blood_pack.dm

@@ -2,10 +2,10 @@
 #define BLOOD_BAG_TAKING 0
 
 /obj/item/reagent_container/blood
-	name = "BloodPack"
-	desc = "Contains blood used for transfusion."
+	name = "blood pack"
+	desc = "A blood pack. Contains fluids, typically used for transfusions."
 	icon = 'icons/obj/items/bloodpack.dmi'
-	icon_state = "empty"
+	icon_state = "bloodpack"
 	volume = 300
 	matter = list("plastic" = 500)
 	flags_atom = CAN_BE_SYRINGED
@@ -20,7 +20,7 @@
 /obj/item/reagent_container/blood/Initialize()
 	. = ..()
 	if(blood_type != null)
-		name = "BloodPack [blood_type]"
+		name = "[blood_type] blood pack"
 		reagents.add_reagent("blood", initial(volume), list("viruses" = null, "blood_type" = blood_type, "resistances" = null))
 		update_icon()
 
@@ -29,10 +29,26 @@
 
 /obj/item/reagent_container/blood/update_icon()
 	var/percent = round((reagents.total_volume / volume) * 100)
-	switch(percent)
-		if(0 to 9) icon_state = "empty"
-		if(10 to 50) icon_state = "half"
-		if(51 to INFINITY) icon_state = "full"
+	overlays = null
+	underlays = null
+
+	if(blood_type)
+		overlays += image('icons/obj/items/bloodpack.dmi', src, blood_type)
+
+	if(reagents && reagents.total_volume)
+		var/image/filling = image('icons/obj/items/reagentfillings.dmi', src, "[icon_state]10")
+
+		switch(percent)
+			if(1 to 9) filling.icon_state = "[icon_state]5"
+			if(10 to 19) filling.icon_state = "[icon_state]10"
+			if(20 to 39) filling.icon_state = "[icon_state]25"
+			if(40 to 64) filling.icon_state = "[icon_state]50"
+			if(65 to 79) filling.icon_state = "[icon_state]75"
+			if(80 to 90) filling.icon_state = "[icon_state]80"
+			if(91 to INFINITY) filling.icon_state = "[icon_state]100"
+
+		filling.color = mix_color_from_reagents(reagents.reagent_list)
+		underlays += filling
 
 /obj/item/reagent_container/blood/proc/update_beam()
 	if(current_beam)
@@ -132,7 +148,7 @@
 	connected_to.visible_message("[src] breaks free of [connected_to]!", "[src] is pulled out of you!")
 	connected_to.apply_damage(3, BRUTE, pick("r_arm", "l_arm"))
 	if(connected_to.pain.feels_pain)
-		connected_to.emote("scream")
+		connected_to.emote("pain")
 	connected_to.active_transfusions -= src
 	connected_to.base_pixel_x = 0
 	connected_to = null
@@ -173,9 +189,8 @@
 	blood_type = "O-"
 
 /obj/item/reagent_container/blood/empty
-	name = "Empty BloodPack"
-	desc = "Seems pretty useless... Maybe if there were a way to fill it?"
-	icon_state = "empty"
+	name = "empty blood pack"
+	desc = "An empty blood pack. Sorry, vampires, no luck here."
 
 #undef BLOOD_BAG_INJECTING
 #undef BLOOD_BAG_TAKING