Add speech bubbles to creeps

src/scripts/actions.js

@@ -75,3 +75,30 @@ export function flash(container, color) {
 		g.endFill();
 	});
 }
+
+export function say(container, text) {
+	const textBubbleStyle = {
+		fontSize: S(5),
+	};
+
+	var text = new PIXI.Text(text, textBubbleStyle);
+
+	var bubble = new PIXI.Graphics();
+	bubble.beginFill(0xFFFFFF, 1);
+	bubble.drawRoundedRect(0, 0, text.width, text.height, 3);
+	bubble.endFill();
+
+	bubble.position.set(S(5) - (text.width / 2), 0);
+	text.position.set(S(5) - (text.width / 2), 0);
+
+	container.addChild(bubble);
+	container.addChild(text);
+
+	tween(TWEEN_DURATION, {}, v => {
+		if (v === 1) {
+			container.removeChild(text);
+			container.removeChild(bubble);
+			return;
+		}
+	});
+}

src/scripts/skins/original/creep.js

@@ -1,7 +1,7 @@
 
 import {S, SQUARE_SIZE, TWEEN_DURATION} from '../../const';
 import {tween, tweenRotation, interp} from '../../tween';
-import {actionLine, bump, flash} from '../../actions';
+import {actionLine, bump, flash, say} from '../../actions';
 
 export class CreepSkin {
 	constructor(creep) {
@@ -37,9 +37,6 @@ export class CreepSkin {
 					bump(this.g, g, obj, a);
 					break;
 
-				case 'say':
-					break;
-
 				case 'repair':
 				case 'build':
 				case 'upgradeController':
@@ -62,6 +59,13 @@ export class CreepSkin {
 			}
 		}
 
+		if("say" in obj.actionLog) {
+			obj.saying = obj.actionLog.saying;
+		}
+		if(obj.saying) {
+			say(this.g, obj.saying.message);
+		}
+
 		g.clear();
 		g.beginFill(0x222222);
 		g.drawCircle(S(5), S(5), S(5));