reverted UIElementRenderer

src/Wolfie2D/Rendering/CanvasRendering/UIElementRenderer.ts

@@ -15,7 +15,7 @@ export default class UIElementRenderer {
     protected scene: Scene;
     protected ctx: CanvasRenderingContext2D;
 
-    constructor(ctx: CanvasRenderingContext2D){
+    constructor(ctx: CanvasRenderingContext2D) {
         this.resourceManager = ResourceManager.getInstance();
         this.ctx = ctx;
     }
@@ -33,9 +33,48 @@ export default class UIElementRenderer {
      * @param label The label to render
      */
     renderLabel(label: Label): void {
-        // If the size is unassigned (by the user or automatically) assign it
+        // // If the size is unassigned (by the user or automatically) assign it
-        label.handleInitialSizing(this.ctx);
+        // label.handleInitialSizing(this.ctx);
 
+        // // Grab the global alpha so we can adjust it for this render
+        // let previousAlpha = this.ctx.globalAlpha;
+
+        // // Get the font and text position in label
+        // this.ctx.font = label.getFontString();
+        // let offset = label.calculateTextOffset(this.ctx);
+
+        // // Stroke and fill a rounded rect and give it text
+        // this.ctx.globalAlpha = label.backgroundColor.a;
+        // this.ctx.fillStyle = label.calculateBackgroundColor().toStringRGBA();
+        // this.ctx.fillRoundedRect(-label.size.x/2, -label.size.y/2,
+        // 	label.size.x, label.size.y, label.borderRadius);
+
+        // this.ctx.strokeStyle = label.calculateBorderColor().toStringRGBA();
+        // this.ctx.globalAlpha = label.borderColor.a;
+        // this.ctx.lineWidth = label.borderWidth;
+        // this.ctx.strokeRoundedRect(-label.size.x/2, -label.size.y/2,
+        // 	label.size.x, label.size.y, label.borderRadius);
+
+        // this.ctx.fillStyle = label.calculateTextColor();
+        // this.ctx.globalAlpha = label.textColor.a;
+        // this.ctx.fillText(label.text, offset.x - label.size.x/2, offset.y - label.size.y/2);
+
+        // this.ctx.globalAlpha = previousAlpha;
+        // If the size is unassigned (by the user or automatically) assign it
+        let lines = label.text.split('\n');
+        let tempText = label.text;
+        if (lines.length > 1) {
+            let max = 0;
+            let maxLengthIndex = 0;
+            for (let i = 0; i < lines.length; i++) {
+                if (lines[i].length > max) {
+                    max = lines[i].length;
+                    maxLengthIndex = i;
+                }
+            }
+            label.text = lines[maxLengthIndex];
+        }
+        label.handleInitialSizing(this.ctx);
         // Grab the global alpha so we can adjust it for this render
         let previousAlpha = this.ctx.globalAlpha;
 
@@ -46,20 +85,29 @@ export default class UIElementRenderer {
         // Stroke and fill a rounded rect and give it text
         this.ctx.globalAlpha = label.backgroundColor.a;
         this.ctx.fillStyle = label.calculateBackgroundColor().toStringRGBA();
-		this.ctx.fillRoundedRect(-label.size.x/2, -label.size.y/2,
+        this.ctx.fillRoundedRect(-label.size.x / 2, -label.size.y / 2,
             label.size.x, label.size.y, label.borderRadius);
 
         this.ctx.strokeStyle = label.calculateBorderColor().toStringRGBA();
         this.ctx.globalAlpha = label.borderColor.a;
         this.ctx.lineWidth = label.borderWidth;
-		this.ctx.strokeRoundedRect(-label.size.x/2, -label.size.y/2,
+        this.ctx.strokeRoundedRect(-label.size.x / 2, -label.size.y / 2,
-			label.size.x, label.size.y, label.borderRadius);
+            label.size.x, label.size.y + ((lines.length - 1) * label.fontSize), label.borderRadius);
 
         this.ctx.fillStyle = label.calculateTextColor();
         this.ctx.globalAlpha = label.textColor.a;
-		this.ctx.fillText(label.text, offset.x - label.size.x/2, offset.y - label.size.y/2);
+        if (lines.length === 1) {
-	
+            this.ctx.fillText(label.text, offset.x - label.size.x / 2, (offset.y - label.size.y / 2));
+        } else {
+            for (let i = 0; i < lines.length; i++) {
+                let additionalY = i * (label.size.y / 2 + (label.fontSize === 40 ? 20 : 10));
+                label.text = lines[i];
+                offset = label.calculateTextOffset(this.ctx);
+                this.ctx.fillText(lines[i], (offset.x - label.size.x / 2), (offset.y - label.size.y / 2 + additionalY));
+            }
+        }
         this.ctx.globalAlpha = previousAlpha;
+        label.text = tempText;
     }
 
     /**
@@ -84,15 +132,15 @@ export default class UIElementRenderer {
 
         // Draw the slider
         this.ctx.fillStyle = slider.sliderColor.toString();
-		this.ctx.fillRoundedRect(-sliderSize.x/2, -sliderSize.y/2,
+        this.ctx.fillRoundedRect(-sliderSize.x / 2, -sliderSize.y / 2,
             sliderSize.x, sliderSize.y, slider.borderRadius);
 
         // Calculate the nib size and position
-        let x = MathUtils.lerp(-slider.size.x/2, slider.size.x/2, slider.getValue());
+        let x = MathUtils.lerp(-slider.size.x / 2, slider.size.x / 2, slider.getValue());
 
         // Draw the nib
         this.ctx.fillStyle = slider.nibColor.toString();
-		this.ctx.fillRoundedRect(x-slider.nibSize.x/2, -slider.nibSize.y/2,
+        this.ctx.fillRoundedRect(x - slider.nibSize.x / 2, -slider.nibSize.y / 2,
             slider.nibSize.x, slider.nibSize.y, slider.borderRadius);
 
         // Reset the alpha
@@ -105,19 +153,19 @@ export default class UIElementRenderer {
      */
     renderTextInput(textInput: TextInput): void {
         // Show a cursor sometimes
-        if(textInput.focused && textInput.cursorCounter % 60 > 30){
+        if (textInput.focused && textInput.cursorCounter % 60 > 30) {
             textInput.text += "|";
         }
 
         this.renderLabel(textInput);
 
-        if(textInput.focused){
+        if (textInput.focused) {
-            if(textInput.cursorCounter % 60 > 30){
+            if (textInput.cursorCounter % 60 > 30) {
                 textInput.text = textInput.text.substring(0, textInput.text.length - 1);
             }
 
             textInput.cursorCounter += 1;
-            if(textInput.cursorCounter >= 60){
+            if (textInput.cursorCounter >= 60) {
                 textInput.cursorCounter = 0;
             }
         }

src/shattered_sword/Scenes/GameLevel.ts

@@ -495,6 +495,9 @@ export default class GameLevel extends Scene {
         //enemy.position.set(tilePos.x*32, tilePos.y*32);
         enemy.position.copy(tilePos);
         enemy.scale.set(2, 2);
+        //TODO - add custom collision shape for each enemy in an option variable 
+        //enemy.addPhysics(aiOptions.size.clone());
+
         enemy.addPhysics(new AABB(Vec2.ZERO, new Vec2(16, 25)));
         enemy.colliderOffset.set(0, 6);
         enemy.addAI(EnemyAI, aiOptions); //TODO - add individual enemy AI
@@ -517,9 +520,11 @@ export default class GameLevel extends Scene {
                         tilemap: "Main",
                         //actions:actions,
                         goal: Statuses.REACHED_GOAL,
+                        //TODO - test Add collision shape for each enemy type
+                        //size: new AABB(Vec2.ZERO, new Vec2(16, 25))
                     })
                     break;
-                case "snake":
+                case "snake":       //snake enemies drop from sky("trees")? or could just be very abundant
                     this.addEnemy("snake", enemy.position.scale(32), {
                         player: this.player,
                         health: 100,
@@ -528,7 +533,7 @@ export default class GameLevel extends Scene {
                         goal: Statuses.REACHED_GOAL,
                     })
                     break;
-                case "tiger":
+                case "tiger":       //tiger can be miniboss for now? 
                     this.addEnemy("tiger", enemy.position.scale(32), {
                         player: this.player,
                         health: 100,