Index: imaps-frontend/src/scripts/rendered_shapes/RenderedEntrance.js
===================================================================
--- imaps-frontend/src/scripts/rendered_shapes/RenderedEntrance.js	(revision 79a03170cdde4e801d12257ee86723774970427b)
+++ imaps-frontend/src/scripts/rendered_shapes/RenderedEntrance.js	(revision d56544918790c0c3bc50f2f0a98c99f3d2988ccf)
@@ -1,44 +1,37 @@
-import RenderedMapShape from "../base/RenderedMapShape.js";
-import {_registerNode} from "konva/lib/Global";
-import RenderedRoom from "./RenderedRoom.js";
+import RenderedMapShape from "./RenderedMapShape.js";
 
-export default class RenderedEntrance extends RenderedMapShape {
-  constructor(attrs, scaleX, scaleY) {
-    super({
-      x: attrs.x,
-      y: attrs.y,
-      width: attrs.width,
-      height: attrs.height,
-      fill: "#7fef83",
-      stroke: "black",
-      strokeWidth: 1,
-      draggable: false,
-      rotation: attrs.rotation,
-      cornerRadius: 3,
-      zIndex: 0,
-    });
+export default class RenderedEntrance extends RenderedMapShape{
+    constructor(attrs,scaleX,scaleY){
+        super({
+            x: attrs.x,
+            y: attrs.y,
+            width: attrs.width * scaleX,
+            height: attrs.height * scaleY,
+            fill: '#1c3cff',
+            stroke: 'black',
+            strokeWidth: 1,
+            draggable: false,
+            rotation: attrs.rotation,
+            cornerRadius:3,
+            zIndex: 0
+        });
 
-    this.info.name = attrs.obj_name;
-    this.info.description = attrs.description;
-    this.info.isMainEntrance = attrs.is_main_entrance;
+        this.info.name = attrs.obj_name;
+        this.info.description = attrs.description;
+        
+    
+        this.on("mouseenter",() => {
+        console.log("HOVER ROOM IN", this.x());
+        console.log(this.info.name,"NAME");
+        this.stroke('purple');
+        })
+        this.on("mouseleave", () => {
+            console.log("HOVER ROOM OUT");
+            this.opacity(1);
+            this.stroke('black')
 
-    this.floorNum = attrs.floor_num
+        })
 
-    this.class = "Entrance";
-
-    console.log("ATTRS VIEW:  " + attrs)
-
-    this.on("mouseenter", () => {
-      this.stroke("purple");
-    });
-    this.on("mouseleave", () => {
-      this.opacity(1);
-      this.stroke("black");
-    });
-
-    //this.initText();
-  }
+        this.initText()
+    }
 }
-
-RenderedEntrance.prototype.className = "RenderedEntrance";
-_registerNode(RenderedEntrance);
Index: imaps-frontend/src/scripts/rendered_shapes/RenderedMapShape.js
===================================================================
--- imaps-frontend/src/scripts/rendered_shapes/RenderedMapShape.js	(revision d56544918790c0c3bc50f2f0a98c99f3d2988ccf)
+++ imaps-frontend/src/scripts/rendered_shapes/RenderedMapShape.js	(revision d56544918790c0c3bc50f2f0a98c99f3d2988ccf)
@@ -0,0 +1,45 @@
+import Konva from "konva";
+
+export default class RenderedMapShape extends Konva.Rect{
+    constructor(config){
+        if (new.target === RenderedMapShape) {
+            throw new Error("Cannot instantiate abstract class RenderedMapShape directly.");
+          }
+
+          super(config);
+
+          this.info = {
+            name: "",
+            description: "",
+          }
+          this.infoText = null;
+          this.textOffsetX = 0;
+          this.textOffsetY = 0;
+    }
+
+    initText() {
+      this.infoText = new Konva.Text({
+        x: this.x() + this.textOffsetX,
+        y: this.y() + this.textOffsetY,
+        text: this.info.name || "no name",
+        fontSize: 12,
+        fontFamily: 'Verdana',
+        fill: 'black',
+      });
+    }
+  
+    updateTextPosition() {
+      if(this.infoText){
+        this.infoText.x(this.x() + this.textOffsetX);
+        this.infoText.y(this.y() + this.textOffsetY);
+      }
+    }
+  
+    displayName(layer) {
+        if(this.infoText != null){
+            layer.add(this.infoText);
+        }
+
+    }
+    
+}
Index: imaps-frontend/src/scripts/rendered_shapes/RenderedRoom.js
===================================================================
--- imaps-frontend/src/scripts/rendered_shapes/RenderedRoom.js	(revision 79a03170cdde4e801d12257ee86723774970427b)
+++ imaps-frontend/src/scripts/rendered_shapes/RenderedRoom.js	(revision d56544918790c0c3bc50f2f0a98c99f3d2988ccf)
@@ -1,62 +1,41 @@
-import RenderedMapShape from "../base/RenderedMapShape.js";
-import {_registerNode} from "konva/lib/Global";
+import RenderedMapShape from "./RenderedMapShape.js";
 
-export default class RenderedRoom extends RenderedMapShape {
-  constructor(attrs, scaleX, scaleY) {
-    super({
-      x: attrs.x,
-      y: attrs.y,
-      width: attrs.width,
-      height: attrs.height,
-      fill: "#A2D9FF",
-      stroke: "black",
-      strokeWidth: 1,
-      draggable: false,
-      rotation: attrs.rotation,
-      cornerRadius: 3
-    });
+export default class RenderedRoom extends RenderedMapShape{
+    constructor(attrs,scaleX,scaleY){
+        super({
+            x: attrs.x,
+            y: attrs.y,
+            width: attrs.width * scaleX,
+            height: attrs.height * scaleY,
+            fill: 'white',
+            stroke: 'black',
+            strokeWidth: 1,
+            draggable: false,
+            rotation: attrs.rotation,
+            cornerRadius:3,
+            zIndex: 0
+        });
 
-    console.info("FNUM RENDER:",attrs.floor_num)
+        this.info.name = attrs.obj_name;
+        this.info.description = attrs.description;
 
-    this.floorNum = attrs.floor_num
+        this.textOffsetX = -50
+        
+    
+        this.on("mouseenter",() => {
+        console.log("HOVER ROOM IN", this.x());
+        console.log(this.info.name,"NAME");
+        this.opacity(0.7);
+        this.fill("pink");
+        })
+        this.on("mouseleave", () => {
+            console.log("HOVER ROOM OUT");
+            this.opacity(1);
+            this.fill("white");
+        })
 
-    this.info.name = attrs.obj_name;
-    this.info.type = attrs.room_type;
-    this.info.description = attrs.description;
-    this.class = "Room";
-    this.textOffsetX = -50;
+        this.initText()
+    }
 
-    this.eventName = "openRoomInfoPanel"
-
-    this.on("mouseenter", () => {
-      console.log(this.info.name, "NAME");
-      this.fill("#65c3f8");
-    });
-    this.on("mouseleave", () => {
-      this.fill("#A2D9FF");
-    });
-
-
-
-    // searched(){
-    //   this.fill("#b92d39")
-    // }
-    // unsearched(){
-    //   this.fill("#A2D9FF");
-    // }
-
-    // console.log("ATTRS: " + attrs);
-
-    this.initText();
-  }
-  highlight(){
-    this.fill("rgba(29,238,78,0.49)");
-    this.strokeWidth(2)
-  }
-  unHighlight(){
-    this.fill("#A2D9FF");
-    this.strokeWidth(1);
-  }
+   
 }
-RenderedRoom.prototype.className = "RenderedRoom";
-_registerNode(RenderedRoom);
Index: imaps-frontend/src/scripts/rendered_shapes/RenderedStairs.js
===================================================================
--- imaps-frontend/src/scripts/rendered_shapes/RenderedStairs.js	(revision 79a03170cdde4e801d12257ee86723774970427b)
+++ 	(revision )
@@ -1,43 +1,0 @@
-import RenderedMapShape from "../base/RenderedMapShape.js";
-import Stairs from "../shapes/Stairs.js";
-import {_registerNode} from "konva/lib/Global";
-import Konva from "konva";
-export default class RenderedStairs extends RenderedMapShape{
-    constructor(attrs,scaleX,scaleY) {
-        super({
-            x: attrs.x,
-            y: attrs.y,
-            width: attrs.width ,
-            height: attrs.height,
-            fill: "rgb(199,190,133)",
-            stroke: "rgb(16,15,15)",
-            strokeWidth: 1,
-            name: "mapObj",
-            rotation: attrs.rotation,
-        });
-
-
-        this.floorNum = attrs.floor_num;
-        this.info.name = attrs.obj_name;
-        //this.initText()
-    }
-
-
-
-
-    _sceneFunc(context, shape) {
-        const { width, height} = this.attrs;
-
-        let steps = 5;
-        let offset = 10;
-        context.beginPath()
-        for(let i = 0; i < steps; i++){
-            context.rect((-offset) * i,(offset * 0.6) * i,width * 0.86,height/2)
-            context.fillStrokeShape(shape);
-        }
-        context.closePath()
-    }
-}
-
-RenderedStairs.prototype.className = "RenderedStairs";
-_registerNode(RenderedStairs);
Index: imaps-frontend/src/scripts/rendered_shapes/RenderedWall.js
===================================================================
--- imaps-frontend/src/scripts/rendered_shapes/RenderedWall.js	(revision 79a03170cdde4e801d12257ee86723774970427b)
+++ imaps-frontend/src/scripts/rendered_shapes/RenderedWall.js	(revision d56544918790c0c3bc50f2f0a98c99f3d2988ccf)
@@ -1,4 +1,3 @@
-import RenderedMapShape from "../base/RenderedMapShape.js";
-import {_registerNode} from "konva/lib/Global";
+import RenderedMapShape from "./RenderedMapShape.js";
 
 export default class RenderedWall extends RenderedMapShape{
@@ -7,7 +6,7 @@
             x: attrs.x,
             y: attrs.y,
-            width: attrs.width,
-            height: attrs.height,
-            fill: '#4B4B4B',
+            width: attrs.width * scaleX,
+            height: attrs.height * scaleY,
+            fill: 'grey',
             stroke: 'black',
             strokeWidth: 1,
@@ -19,5 +18,2 @@
     }
 }
-
-RenderedWall.prototype.className = "RenderedWall";
-_registerNode(RenderedWall);
