text and sprite implementation

frontend/js/menu_console/console_interface_classes.js

@@ -288,6 +288,82 @@ class Rectangle extends Shape{
     }
 }
 
+class Text extends Shape{
+    value;
+    font;
+
+    constructor(value, x,y, font, color) {
+        super();
+        this.value = value;
+        this.font = font;
+        this.x = x;
+        this.y = y;
+        this.color = color;
+    }
+
+    draw(ctx) {
+        ctx.font = this.font;
+        ctx.fillStyle = this.color;
+        ctx.fillText(this.value, this.x, this.y);
+    }
+
+    setValue(newValue) {
+        this.value = newValue;
+    }
+    getValue() {
+        return this.value;
+    }
+
+    getWidth(ctx) {
+        return ctx.measureText(this.value);
+    }
+    getCenterXFrom(ctx, x, maxWidth) {
+        let width = this.getWidth(ctx).width;
+        let a = x + (maxWidth / 1);     
+        return (a + (width / (this.value.length + 1)));
+    }
+}
+
+class Sprite extends Rectangle {
+    img;
+    src;
+
+    constructor(x,y,w,h,src) {
+        super(x,y,w,h,"green");
+        this.src = src;
+
+        this.img = new Image();
+        this.img.src = this.src;
+    }
+
+    draw(ctx) {
+        ctx.translate(this.originX, this.originY); 
+        ctx.rotate(this.rotation);
+        ctx.translate(-(this.originX), -(this.originY)); 
+
+        ctx.drawImage(this.img,this.startX,this.startY, this.width,this.height);
+
+        if("is_selected" in this) {
+            if(this.is_selected) {
+                this.draw_selection(ctx);
+            }
+            
+        }
+    }
+
+}
+
+
+
+
+
+
+
+
+
+
+
+
 class Circle  extends Shape{
     radius;
 }