Remove old frontend

4 files changed, 0 insertions, 1088 deletions

diff --git a/src/scripts/controllers/modes/building.ts b/src/scripts/controllers/modes/building.ts
deleted file mode 100644
index 217f5935..00000000
--- a/src/scripts/controllers/modes/building.ts
+++ /dev/null
@@ -1,113 +0,0 @@
-import {InteractionMode, MapController} from "../mapcontroller";
-import {MapView} from "../../views/mapview";
-import * as $ from "jquery";
-
-
-/**
- * Class responsible for handling building mode interactions.
- */
-export class BuildingModeController {
-    public newRoomId: number;
-
-    private mapController: MapController;
-    private mapView: MapView;
-
-
-    constructor(mapController: MapController) {
-        this.mapController = mapController;
-        this.mapView = this.mapController.mapView;
-    }
-
-    /**
-     * Connects all DOM event listeners to their respective element targets.
-     */
-    public setupEventListeners() {
-        const resetConstructionButtons = () => {
-            this.mapController.interactionMode = InteractionMode.DEFAULT;
-            this.mapView.hoverLayer.setHoverTileVisibility(false);
-            $("#room-construction").text("Construct new room");
-            $("#room-construction-cancel").slideToggle(300);
-        };
-
-        // Room construction button
-        $("#room-construction").on("click", (event: JQueryEventObject) => {
-            if (this.mapController.interactionMode === InteractionMode.DEFAULT) {
-                this.mapController.interactionMode = InteractionMode.SELECT_ROOM;
-                this.mapView.hoverLayer.setHoverTileVisibility(true);
-                this.mapController.api.addRoomToDatacenter(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id).then((room: IRoom) => {
-                    this.newRoomId = room.id;
-                });
-                $(event.target).text("Finalize room");
-                $("#room-construction-cancel").slideToggle(300);
-            } else if (this.mapController.interactionMode === InteractionMode.SELECT_ROOM) {
-                resetConstructionButtons();
-                this.finalizeRoom();
-            }
-        });
-
-        // Cancel button for room construction
-        $("#room-construction-cancel").on("click", () => {
-            resetConstructionButtons();
-            this.cancelRoomConstruction();
-        });
-    }
-
-    /**
-     * Cancels room construction and deletes the temporary room created previously.
-     */
-    public cancelRoomConstruction() {
-        this.mapController.api.deleteRoom(this.mapView.simulation.id,
-            this.mapView.currentDatacenter.id, this.newRoomId).then(() => {
-            this.mapView.roomLayer.cancelRoomConstruction();
-        });
-    }
-
-    /**
-     * Finalizes room construction by triggering a redraw of the room layer with the new room added.
-     */
-    public finalizeRoom() {
-        this.mapController.api.getRoom(this.mapView.simulation.id,
-            this.mapView.currentDatacenter.id, this.newRoomId).then((room: IRoom) => {
-            this.mapView.roomLayer.finalizeRoom(room);
-        });
-    }
-
-    /**
-     * Adds a newly selected tile to the list of selected tiles.
-     *
-     * @param position The new tile position to be added
-     */
-    public addSelectedTile(position: IGridPosition): void {
-        const tile = {
-            id: -1,
-            roomId: this.newRoomId,
-            position: {x: position.x, y: position.y}
-        };
-        this.mapController.api.addTileToRoom(this.mapView.simulation.id,
-            this.mapView.currentDatacenter.id, this.newRoomId, tile).then((tile: ITile) => {
-            this.mapView.roomLayer.addSelectedTile(tile);
-        });
-    }
-
-    /**
-     * Removes a previously selected tile.
-     *
-     * @param position The position of the tile to be removed
-     */
-    public removeSelectedTile(position: IGridPosition): void {
-        let objectIndex = -1;
-
-        for (let i = 0; i < this.mapView.roomLayer.selectedTileObjects.length; i++) {
-            const tile = this.mapView.roomLayer.selectedTileObjects[i];
-            if (tile.position.x === position.x && tile.position.y === position.y) {
-                objectIndex = i;
-            }
-        }
-        this.mapController.api.deleteTile(this.mapView.simulation.id,
-            this.mapView.currentDatacenter.id, this.newRoomId,
-            this.mapView.roomLayer.selectedTileObjects[objectIndex].tileObject.id).then(() => {
-            this.mapView.roomLayer.removeSelectedTile(position, objectIndex);
-        });
-    }
-}
diff --git a/src/scripts/controllers/modes/node.ts b/src/scripts/controllers/modes/node.ts
deleted file mode 100644
index cef61bba..00000000
--- a/src/scripts/controllers/modes/node.ts
+++ /dev/null
@@ -1,297 +0,0 @@
-import {MapController, AppMode, InteractionLevel} from "../mapcontroller";
-import {MapView} from "../../views/mapview";
-import * as $ from "jquery";
-
-
-/**
- * Class responsible for rendering node mode and handling UI interactions within it.
- */
-export class NodeModeController {
-    public currentMachine: IMachine;
-
-    private mapController: MapController;
-    private mapView: MapView;
-
-
-    constructor(mapController: MapController) {
-        this.mapController = mapController;
-        this.mapView = this.mapController.mapView;
-
-        this.loadAddDropdowns();
-    }
-
-    /**
-     * Moves the UI model into node mode.
-     *
-     * @param machine The machine that was selected in rack mode
-     */
-    public enterMode(machine: IMachine): void {
-        this.currentMachine = machine;
-        this.populateUnitLists();
-        $("#node-menu").removeClass("hidden");
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromRackToNode();
-        }
-    }
-
-    /**
-     * Performs cleanup and closing actions before allowing transferal to rack mode.
-     */
-    public goToObjectMode(): void {
-        $("#node-menu").addClass("hidden");
-        $(".node-element-overlay").addClass("hidden");
-        this.currentMachine = undefined;
-        this.mapController.interactionLevel = InteractionLevel.OBJECT;
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromNodeToRack();
-        }
-    }
-
-    /**
-     * Connects all DOM event listeners to their respective element targets.
-     */
-    public setupEventListeners(): void {
-        const nodeMenu = $("#node-menu");
-
-        nodeMenu.find(".panel-group").on("click", ".remove-unit", (event: JQueryEventObject) => {
-            MapController.showConfirmDeleteDialog("unit", () => {
-                const index = $(event.target).closest(".panel").index();
-
-                if (index === -1) {
-                    return;
-                }
-
-                const closestTabPane = $(event.target).closest(".panel-group");
-
-                let objectList, idList;
-                if (closestTabPane.is("#cpu-accordion")) {
-                    objectList = this.currentMachine.cpus;
-                    idList = this.currentMachine.cpuIds;
-                } else if (closestTabPane.is("#gpu-accordion")) {
-                    objectList = this.currentMachine.gpus;
-                    idList = this.currentMachine.gpuIds;
-                } else if (closestTabPane.is("#memory-accordion")) {
-                    objectList = this.currentMachine.memories;
-                    idList = this.currentMachine.memoryIds;
-                } else if (closestTabPane.is("#storage-accordion")) {
-                    objectList = this.currentMachine.storages;
-                    idList = this.currentMachine.storageIds;
-                }
-
-                idList.splice(idList.indexOf(objectList[index]).id, 1);
-                objectList.splice(index, 1);
-
-                this.mapController.api.updateMachine(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id, this.currentMachine).then(
-                    () => {
-                        this.populateUnitLists();
-                        this.mapController.objectModeController.updateNodeComponentOverlays();
-                    });
-            });
-        });
-
-        nodeMenu.find(".add-unit").on("click", (event: JQueryEventObject) => {
-            const dropdown = $(event.target).closest(".input-group-btn").siblings("select").first();
-
-            const closestTabPane = $(event.target).closest(".input-group").siblings(".panel-group").first();
-            let objectList, idList, typePlural;
-            if (closestTabPane.is("#cpu-accordion")) {
-                objectList = this.currentMachine.cpus;
-                idList = this.currentMachine.cpuIds;
-                typePlural = "cpus";
-            } else if (closestTabPane.is("#gpu-accordion")) {
-                objectList = this.currentMachine.gpus;
-                idList = this.currentMachine.gpuIds;
-                typePlural = "gpus";
-            } else if (closestTabPane.is("#memory-accordion")) {
-                objectList = this.currentMachine.memories;
-                idList = this.currentMachine.memoryIds;
-                typePlural = "memories";
-            } else if (closestTabPane.is("#storage-accordion")) {
-                objectList = this.currentMachine.storages;
-                idList = this.currentMachine.storageIds;
-                typePlural = "storages";
-            }
-
-            if (idList.length + 1 > 4) {
-                this.mapController.showInfoBalloon("Machine has only 4 slots", "warning");
-                return;
-            }
-
-            const id = parseInt(dropdown.val());
-            idList.push(id);
-            this.mapController.api.getSpecificationOfType(typePlural, id).then((spec: INodeUnit) => {
-                objectList.push(spec);
-
-                this.mapController.api.updateMachine(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id, this.currentMachine).then(
-                    () => {
-                        this.populateUnitLists();
-                        this.mapController.objectModeController.updateNodeComponentOverlays();
-                    });
-            });
-        });
-    }
-
-    /**
-     * Populates the "add" dropdowns with all available unit options.
-     */
-    private loadAddDropdowns(): void {
-        const unitTypes = [
-            "cpus", "gpus", "memories", "storages"
-        ];
-        const dropdowns = [
-            $("#add-cpu-form").find("select"),
-            $("#add-gpu-form").find("select"),
-            $("#add-memory-form").find("select"),
-            $("#add-storage-form").find("select"),
-        ];
-
-        unitTypes.forEach((type: string, index: number) => {
-            this.mapController.api.getAllSpecificationsOfType(type).then((data: any) => {
-                data.forEach((option: INodeUnit) => {
-                    dropdowns[index].append($("<option>").val(option.id).text(option.manufacturer + " " + option.family +
-                        " " + option.model + " (" + option.generation + ")"));
-                });
-            });
-        });
-    }
-
-    /**
-     * Generates and inserts dynamically HTML code concerning all units of a machine.
-     */
-    private populateUnitLists(): void {
-        // Contains the skeleton of a unit element and inserts the given data into it
-        const generatePanel = (type: string, index: number, list: any, specSection: string): string => {
-            return '<div class="panel panel-default">' +
-                '  <div class="panel-heading">' +
-                '    <h4 class="panel-title">' +
-                '      <a class="glyphicon glyphicon-remove remove-unit" href="javascript:void(0)"></a>' +
-                '      <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#' + type + '-accordion"' +
-                '         href="#' + type + '-' + index + '">' +
-                list[index].manufacturer + ' ' + list[index].family + ' ' + list[index].model +
-                '      </a>' +
-                '    </h4>' +
-                '  </div>' +
-                '  <div id="' + type + '-' + index + '" class="panel-collapse collapse">' +
-                '    <table class="spec-table">' +
-                '      <tbody>' +
-                specSection +
-                '      </tbody>' +
-                '    </table>' +
-                '  </div>' +
-                '</div>';
-        };
-
-        // Generates the structure of the specification list of a processing unit
-        const generateProcessingUnitHtml = (element: IProcessingUnit) => {
-            return '        <tr>' +
-                '          <td class="glyphicon glyphicon-tasks"></td>' +
-                '          <td>Number of Cores</td>' +
-                '          <td>' + element.numberOfCores + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-dashboard"></td>' +
-                '          <td>Clockspeed (MHz)</td>' +
-                '          <td>' + element.clockRateMhz + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-flash"></td>' +
-                '          <td>Energy Consumption (W)</td>' +
-                '          <td>' + element.energyConsumptionW + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-alert"></td>' +
-                '          <td>Failure Rate (%)</td>' +
-                '          <td>' + element.failureModel.rate + '</td>' +
-                '        </tr>';
-        };
-
-        // Generates the structure of the spec list of a storage unit
-        const generateStorageUnitHtml = (element: IStorageUnit) => {
-            return '        <tr>' +
-                '          <td class="glyphicon glyphicon-floppy-disk"></td>' +
-                '          <td>Size (Mb)</td>' +
-                '          <td>' + element.sizeMb + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-dashboard"></td>' +
-                '          <td>Speed (Mb/s)</td>' +
-                '          <td>' + element.speedMbPerS + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-flash"></td>' +
-                '          <td>Energy Consumption (W)</td>' +
-                '          <td>' + element.energyConsumptionW + '</td>' +
-                '        </tr>' +
-                '        <tr>' +
-                '          <td class="glyphicon glyphicon-alert"></td>' +
-                '          <td>Failure Rate (%)</td>' +
-                '          <td>' + element.failureModel.rate + '</td>' +
-                '        </tr>';
-        };
-
-        // Inserts a "No units" message into the container of the given unit type
-        const addNoUnitsMessage = (type: string) => {
-            $("#" + type + "-accordion").append("<p>There are currently no units present here. " +
-                "<em>Add some with the dropdown below!</em></p>");
-        };
-
-        let container = $("#cpu-accordion");
-        container.children().remove(".panel");
-        container.children().remove("p");
-
-        if (this.currentMachine.cpus.length === 0) {
-            addNoUnitsMessage("cpu");
-        } else {
-            this.currentMachine.cpus.forEach((element: ICPU, i: number) => {
-                const specSection = generateProcessingUnitHtml(element);
-                const content = generatePanel("cpu", i, this.currentMachine.cpus, specSection);
-                container.append(content);
-            });
-        }
-
-        container = $("#gpu-accordion");
-        container.children().remove(".panel");
-        container.children().remove("p");
-        if (this.currentMachine.gpus.length === 0) {
-            addNoUnitsMessage("gpu");
-        } else {
-            this.currentMachine.gpus.forEach((element: IGPU, i: number) => {
-                const specSection = generateProcessingUnitHtml(element);
-                const content = generatePanel("gpu", i, this.currentMachine.gpus, specSection);
-                container.append(content);
-            });
-        }
-
-        container = $("#memory-accordion");
-        container.children().remove(".panel");
-        container.children().remove("p");
-        if (this.currentMachine.memories.length === 0) {
-            addNoUnitsMessage("memory");
-        } else {
-            this.currentMachine.memories.forEach((element: IMemory, i: number) => {
-                const specSection = generateStorageUnitHtml(element);
-                const content = generatePanel("memory", i, this.currentMachine.memories, specSection);
-                container.append(content);
-            });
-        }
-
-        container = $("#storage-accordion");
-        container.children().remove(".panel");
-        container.children().remove("p");
-        if (this.currentMachine.storages.length === 0) {
-            addNoUnitsMessage("storage");
-        } else {
-            this.currentMachine.storages.forEach((element: IMemory, i: number) => {
-                const specSection = generateStorageUnitHtml(element);
-                const content = generatePanel("storage", i, this.currentMachine.storages, specSection);
-                container.append(content);
-            });
-        }
-    }
-}
diff --git a/src/scripts/controllers/modes/object.ts b/src/scripts/controllers/modes/object.ts
deleted file mode 100644
index bc358d71..00000000
--- a/src/scripts/controllers/modes/object.ts
+++ /dev/null
@@ -1,296 +0,0 @@
-import {AppMode, InteractionLevel, MapController} from "../mapcontroller";
-import {MapView} from "../../views/mapview";
-import * as $ from "jquery";
-
-
-/**
- * Class responsible for rendering object mode and handling its UI interactions.
- */
-export class ObjectModeController {
-    public currentObject: IDCObject;
-    public objectType: string;
-    public currentRack: IRack;
-    public currentPSU: IPSU;
-    public currentCoolingItem: ICoolingItem;
-    public currentObjectTile: ITile;
-
-    private mapController: MapController;
-    private mapView: MapView;
-
-
-    constructor(mapController: MapController) {
-        this.mapController = mapController;
-        this.mapView = this.mapController.mapView;
-    }
-
-    /**
-     * Performs the necessary setup actions and enters object mode.
-     *
-     * @param tile A reference to the tile containing the rack that was selected.
-     */
-    public enterMode(tile: ITile) {
-        this.currentObjectTile = tile;
-        this.mapView.grayLayer.currentObjectTile = tile;
-        this.currentObject = tile.object;
-        this.objectType = tile.objectType;
-
-        // Show the corresponding sub-menu of object mode
-        $(".object-sub-menu").hide();
-
-        switch (this.objectType) {
-            case "RACK":
-                $("#rack-sub-menu").show();
-                this.currentRack = <IRack>this.currentObject;
-                $("#rack-name-input").val(this.currentRack.name);
-                this.populateNodeList();
-
-                break;
-
-            case "PSU":
-                $("#psu-sub-menu").show();
-                this.currentPSU = <IPSU>this.currentObject;
-
-                break;
-
-            case "COOLING_ITEM":
-                $("#cooling-item-sub-menu").show();
-                this.currentCoolingItem = <ICoolingItem>this.currentObject;
-
-                break;
-        }
-
-        this.mapView.grayLayer.drawRackLevel();
-        MapController.hideAndShowMenus("#object-menu");
-        this.scrollToBottom();
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromRoomToRack();
-        }
-    }
-
-    /**
-     * Leaves object mode and transfers to room mode.
-     */
-    public goToRoomMode() {
-        this.mapController.interactionLevel = InteractionLevel.ROOM;
-        this.mapView.grayLayer.hideRackLevel();
-        MapController.hideAndShowMenus("#room-menu");
-        this.mapController.roomModeController.enterMode(this.mapController.roomModeController.currentRoom);
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromRackToRoom();
-        }
-    }
-
-    /**
-     * Connects all DOM event listeners to their respective element targets.
-     */
-    public setupEventListeners() {
-        // Handler for saving a new rack name
-        $("#rack-name-save").on("click", () => {
-            this.currentRack.name = $("#rack-name-input").text();
-            this.mapController.api.updateRack(this.mapView.simulation.id,
-                this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                this.mapController.objectModeController.currentObjectTile.id, this.currentRack).then(
-                () => {
-                    this.mapController.showInfoBalloon("Rack name saved", "info");
-                });
-        });
-
-        const nodeListContainer = $(".node-list-container");
-
-        // Handler for the 'add' button of each machine slot of the rack
-        nodeListContainer.on("click", ".add-node", (event: JQueryEventObject) => {
-            // Convert the DOM element index to a JS array index
-            const index = this.currentRack.machines.length - $(event.target).closest(".node-element").index() - 1;
-
-            // Insert an empty machine at the selected position
-            this.mapController.api.addMachineToRack(this.mapView.simulation.id,
-                this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                this.mapController.objectModeController.currentObjectTile.id, {
-                    id: -1,
-                    rackId: this.currentRack.id,
-                    position: index,
-                    tags: [],
-                    cpuIds: [],
-                    gpuIds: [],
-                    memoryIds: [],
-                    storageIds: []
-                }).then((data: IMachine) => {
-                this.currentRack.machines[index] = data;
-                this.populateNodeList();
-                this.mapView.dcObjectLayer.draw();
-            });
-
-            event.stopPropagation();
-        });
-
-        // Handler for the 'remove' button of each machine slot of the rack
-        nodeListContainer.on("click", ".remove-node", (event: JQueryEventObject) => {
-            const target = $(event.target);
-            MapController.showConfirmDeleteDialog("machine", () => {
-                // Convert the DOM element index to a JS array index
-                const index = this.currentRack.machines.length - target.closest(".node-element").index() - 1;
-
-                this.mapController.api.deleteMachine(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id,
-                    index).then(() => {
-                    this.currentRack.machines[index] = null;
-                    this.populateNodeList();
-                    this.mapView.dcObjectLayer.draw();
-                });
-            });
-            event.stopPropagation();
-        });
-
-        // Handler for every node element, triggering node mode
-        nodeListContainer.on("click", ".node-element", (event: JQueryEventObject) => {
-            const domIndex = $(event.target).closest(".node-element").index();
-            const index = this.currentRack.machines.length - domIndex - 1;
-            const machine = this.currentRack.machines[index];
-
-            if (machine != null) {
-                this.mapController.interactionLevel = InteractionLevel.NODE;
-
-                // Gray out the other nodes
-                $(event.target).closest(".node-list-container").children(".node-element").each((nodeIndex: number, element: Element) => {
-                    if (nodeIndex !== domIndex) {
-                        $(element).children(".node-element-overlay").removeClass("hidden");
-                    } else {
-                        $(element).children(".node-element-overlay").addClass("hidden");
-                    }
-                });
-
-                this.mapController.nodeModeController.enterMode(machine);
-            }
-        });
-
-        // Handler for rack deletion button
-        $("#rack-deletion").on("click", () => {
-            MapController.showConfirmDeleteDialog("rack", () => {
-                this.mapController.api.deleteRack(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id).then(() => {
-                    this.currentObjectTile.object = undefined;
-                    this.currentObjectTile.objectType = undefined;
-                    this.currentObjectTile.objectId = undefined;
-                    this.mapView.redrawMap();
-                    this.goToRoomMode();
-                });
-            });
-        });
-
-        // Handler for PSU deletion button
-        $("#psu-deletion").on("click", () => {
-            MapController.showConfirmDeleteDialog("PSU", () => {
-                this.mapController.api.deletePSU(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id).then(() => {
-                    this.mapView.redrawMap();
-                    this.goToRoomMode();
-                });
-                this.currentObjectTile.object = undefined;
-                this.currentObjectTile.objectType = undefined;
-                this.currentObjectTile.objectId = undefined;
-            });
-        });
-
-        // Handler for Cooling Item deletion button
-        $("#cooling-item-deletion").on("click", () => {
-            MapController.showConfirmDeleteDialog("cooling item", () => {
-                this.mapController.api.deleteCoolingItem(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.mapController.roomModeController.currentRoom.id,
-                    this.mapController.objectModeController.currentObjectTile.id).then(() => {
-                    this.mapView.redrawMap();
-                    this.goToRoomMode();
-                });
-                this.currentObjectTile.object = undefined;
-                this.currentObjectTile.objectType = undefined;
-                this.currentObjectTile.objectId = undefined;
-            });
-        });
-    }
-
-    public updateNodeComponentOverlays(): void {
-        if (this.currentRack === undefined || this.currentRack.machines === undefined) {
-            return;
-        }
-
-        for (let i = 0; i < this.currentRack.machines.length; i++) {
-            if (this.currentRack.machines[i] === null) {
-                continue;
-            }
-
-            const container = this.mapController.appMode === AppMode.CONSTRUCTION ? ".construction" : ".simulation";
-            const element = $(container + " .node-element").eq(this.currentRack.machines.length - i - 1);
-            if (this.currentRack.machines[i].cpus.length !== 0) {
-                element.find(".overlay-cpu").addClass("hidden");
-            } else {
-                element.find(".overlay-cpu").removeClass("hidden");
-            }
-            if (this.currentRack.machines[i].gpus.length !== 0) {
-                element.find(".overlay-gpu").addClass("hidden");
-            } else {
-                element.find(".overlay-gpu").removeClass("hidden");
-            }
-            if (this.currentRack.machines[i].memories.length !== 0) {
-                element.find(".overlay-memory").addClass("hidden");
-            } else {
-                element.find(".overlay-memory").removeClass("hidden");
-            }
-            if (this.currentRack.machines[i].storages.length !== 0) {
-                element.find(".overlay-storage").addClass("hidden");
-            } else {
-                element.find(".overlay-storage").removeClass("hidden");
-            }
-        }
-    }
-
-    /**
-     * Dynamically generates and inserts HTML code for every node in the current rack.
-     */
-    private populateNodeList(): void {
-        const container = $(".node-list-container");
-
-        // Remove any previously present node elements
-        container.children().remove(".node-element");
-
-        for (let i = 0; i < this.currentRack.machines.length; i++) {
-            // Depending on whether the current machine slot is filled, allow removing or adding a new machine by adding
-            // the appropriate button next to the machine slot
-            const type = (this.currentRack.machines[i] == null ? "glyphicon-plus add-node" : "glyphicon-remove remove-node");
-            let content =
-                '<div class="node-element" data-id="' + (this.currentRack.machines[i] === null ?
-                    "" : this.currentRack.machines[i].id) + '">' +
-                '  <div class="node-element-overlay hidden"></div>' +
-                '  <a class="node-element-btn glyphicon ' + type + '" href="javascript:void(0)"></a>' +
-                '  <div class="node-element-number">' + (i + 1) + '</div>';
-            if (this.currentRack.machines[i] !== null) {
-                content +=
-                    '<div class="node-element-content">' +
-                    '  <img src="img/app/node-cpu.png">' +
-                    '  <img src="img/app/node-gpu.png">' +
-                    '  <img src="img/app/node-memory.png">' +
-                    '  <img src="img/app/node-storage.png">' +
-                    '  <img src="img/app/node-network.png">' +
-                    '  <div class="icon-overlay overlay-cpu hidden"></div>' +
-                    '  <div class="icon-overlay overlay-gpu hidden"></div>' +
-                    '  <div class="icon-overlay overlay-memory hidden"></div>' +
-                    '  <div class="icon-overlay overlay-storage hidden"></div>' +
-                    '  <div class="icon-overlay overlay-network"></div>' +
-                    '</div>';
-            }
-            content += '</div>';
-            // Insert the generated machine slot into the DOM
-            container.prepend(content);
-        }
-
-        this.updateNodeComponentOverlays();
-    }
-
-    private scrollToBottom(): void {
-        const scrollContainer = $('.node-list-container');
-        scrollContainer.scrollTop(scrollContainer[0].scrollHeight);
-    }
-}
diff --git a/src/scripts/controllers/modes/room.ts b/src/scripts/controllers/modes/room.ts
deleted file mode 100644
index dc7f4a41..00000000
--- a/src/scripts/controllers/modes/room.ts
+++ /dev/null
@@ -1,382 +0,0 @@
-import {Util} from "../../util";
-import {AppMode, InteractionLevel, MapController} from "../mapcontroller";
-import {MapView} from "../../views/mapview";
-import * as $ from "jquery";
-
-
-export enum RoomInteractionMode {
-    DEFAULT,
-    ADD_RACK,
-    ADD_PSU,
-    ADD_COOLING_ITEM
-}
-
-
-export class RoomModeController {
-    public currentRoom: IRoom;
-    public roomInteractionMode: RoomInteractionMode;
-
-    private mapController: MapController;
-    private mapView: MapView;
-    private roomTypes: string[];
-    private roomTypeMap: IRoomTypeMap;
-    private availablePSUs: IPSU[];
-    private availableCoolingItems: ICoolingItem[];
-
-
-    constructor(mapController: MapController) {
-        this.mapController = mapController;
-        this.mapView = this.mapController.mapView;
-
-        this.mapController.api.getAllRoomTypes().then((roomTypes: string[]) => {
-            this.roomTypes = roomTypes;
-            this.roomTypeMap = {};
-
-            this.roomTypes.forEach((type: string) => {
-                this.mapController.api.getAllowedObjectsByRoomType(type).then((objects: string[]) => {
-                    this.roomTypeMap[type] = objects;
-                });
-            });
-
-            this.populateRoomTypeDropdown();
-        });
-
-        // this.mapController.api.getAllPSUSpecs().then((specs: IPSU[]) => {
-        //     this.availablePSUs = specs;
-        // });
-        //
-        // this.mapController.api.getAllCoolingItemSpecs().then((specs: ICoolingItem[]) => {
-        //     this.availableCoolingItems = specs;
-        // });
-
-        this.roomInteractionMode = RoomInteractionMode.DEFAULT;
-    }
-
-    public enterMode(room: IRoom) {
-        this.currentRoom = room;
-        this.roomInteractionMode = RoomInteractionMode.DEFAULT;
-
-        this.mapView.roomTextLayer.setVisibility(false);
-
-        this.mapView.zoomInOnRoom(this.currentRoom);
-        $("#room-name-input").val(this.currentRoom.name);
-        MapController.hideAndShowMenus("#room-menu");
-
-        // Pre-select the type of the current room in the dropdown
-        const roomTypeDropdown = $("#roomtype-select");
-        roomTypeDropdown.find('option').prop("selected", "false");
-        const roomTypeIndex = this.roomTypes.indexOf(this.currentRoom.roomType);
-        if (roomTypeIndex !== -1) {
-            roomTypeDropdown.find('option[value="' + roomTypeIndex + '"]').prop("selected", "true");
-        } else {
-            roomTypeDropdown.val([]);
-        }
-
-        this.populateAllowedObjectTypes();
-
-        this.mapView.roomLayer.setClickable(false);
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromBuildingToRoom();
-        }
-    }
-
-    public goToBuildingMode() {
-        this.mapController.interactionLevel = InteractionLevel.BUILDING;
-
-        if (this.roomInteractionMode !== RoomInteractionMode.DEFAULT) {
-            this.roomInteractionMode = RoomInteractionMode.DEFAULT;
-            this.mapView.hoverLayer.setHoverItemVisibility(false);
-            $("#add-rack-btn").attr("data-active", "false");
-            $("#add-psu-btn").attr("data-active", "false");
-            $("#add-cooling-item-btn").attr("data-active", "false");
-        }
-
-        this.mapView.roomTextLayer.setVisibility(true);
-
-        this.mapView.zoomOutOnDC();
-        MapController.hideAndShowMenus("#building-menu");
-
-        this.mapView.roomLayer.setClickable(true);
-
-        if (this.mapController.appMode === AppMode.SIMULATION) {
-            this.mapController.simulationController.transitionFromRoomToBuilding();
-        }
-    }
-
-    public setupEventListeners(): void {
-        // Component buttons
-        const addRackBtn = $("#add-rack-btn");
-        const addPSUBtn = $("#add-psu-btn");
-        const addCoolingItemBtn = $("#add-cooling-item-btn");
-
-        const roomTypeDropdown = $("#roomtype-select");
-
-        addRackBtn.on("click", () => {
-            this.handleItemClick("RACK");
-        });
-        addPSUBtn.on("click", () => {
-            this.handleItemClick("PSU");
-        });
-        addCoolingItemBtn.on("click", () => {
-            this.handleItemClick("COOLING_ITEM");
-        });
-
-        // Handler for saving a new room name
-        $("#room-name-save").on("click", () => {
-            this.currentRoom.name = $("#room-name-input").text();
-            this.mapController.api.updateRoom(this.mapView.simulation.id,
-                this.mapView.currentDatacenter.id, this.currentRoom).then(() => {
-                this.mapView.roomTextLayer.draw();
-                this.mapController.showInfoBalloon("Room name saved", "info");
-            });
-        });
-
-        // Handler for room deletion button
-        $("#room-deletion").on("click", () => {
-            MapController.showConfirmDeleteDialog("room", () => {
-                this.mapController.api.deleteRoom(this.mapView.simulation.id,
-                    this.mapView.currentDatacenter.id, this.currentRoom.id).then(() => {
-                    const roomIndex = this.mapView.currentDatacenter.rooms.indexOf(this.currentRoom);
-                    this.mapView.currentDatacenter.rooms.splice(roomIndex, 1);
-
-                    this.mapView.redrawMap();
-                    this.goToBuildingMode();
-                });
-            });
-        });
-
-        // Handler for the room type dropdown component
-        roomTypeDropdown.on("change", () => {
-            const newRoomType = this.roomTypes[roomTypeDropdown.val()];
-            if (!this.checkRoomTypeLegality(newRoomType)) {
-                roomTypeDropdown.val(this.roomTypes.indexOf(this.currentRoom.roomType));
-                this.mapController.showInfoBalloon("Room type couldn't be changed, illegal objects", "warning");
-                return;
-            }
-
-            this.currentRoom.roomType = newRoomType;
-            this.mapController.api.updateRoom(this.mapView.simulation.id,
-                this.mapView.currentDatacenter.id, this.currentRoom).then(() => {
-                this.populateAllowedObjectTypes();
-                this.mapView.roomTextLayer.draw();
-                this.mapController.showInfoBalloon("Room type changed", "info");
-            });
-        });
-    }
-
-    public handleCanvasMouseClick(gridPos: IGridPosition): void {
-        if (this.roomInteractionMode === RoomInteractionMode.DEFAULT) {
-            const tileIndex = Util.tileListPositionIndexOf(this.currentRoom.tiles, gridPos);
-
-            if (tileIndex !== -1) {
-                const tile = this.currentRoom.tiles[tileIndex];
-
-                if (tile.object !== undefined) {
-                    this.mapController.interactionLevel = InteractionLevel.OBJECT;
-                    this.mapController.objectModeController.enterMode(tile);
-                }
-            } else {
-                this.goToBuildingMode();
-            }
-        } else if (this.roomInteractionMode === RoomInteractionMode.ADD_RACK) {
-            this.addObject(this.mapView.hoverLayer.hoverTilePosition, "RACK");
-
-        } else if (this.roomInteractionMode === RoomInteractionMode.ADD_PSU) {
-            this.addObject(this.mapView.hoverLayer.hoverTilePosition, "PSU");
-
-        } else if (this.roomInteractionMode === RoomInteractionMode.ADD_COOLING_ITEM) {
-            this.addObject(this.mapView.hoverLayer.hoverTilePosition, "COOLING_ITEM");
-
-        }
-    }
-
-    private handleItemClick(type: string): void {
-        const addRackBtn = $("#add-rack-btn");
-        const addPSUBtn = $("#add-psu-btn");
-        const addCoolingItemBtn = $("#add-cooling-item-btn");
-        const allObjectContainers = $(".dc-component-container");
-        const objectTypes = [
-            {
-                type: "RACK",
-                mode: RoomInteractionMode.ADD_RACK,
-                btn: addRackBtn
-            },
-            {
-                type: "PSU",
-                mode: RoomInteractionMode.ADD_PSU,
-                btn: addPSUBtn
-            },
-            {
-                type: "COOLING_ITEM",
-                mode: RoomInteractionMode.ADD_COOLING_ITEM,
-                btn: addCoolingItemBtn
-            }
-        ];
-
-        allObjectContainers.attr("data-active", "false");
-
-        if (this.roomInteractionMode === RoomInteractionMode.DEFAULT) {
-            this.mapView.hoverLayer.setHoverItemVisibility(true, type);
-
-            if (type === "RACK") {
-                this.roomInteractionMode = RoomInteractionMode.ADD_RACK;
-                addRackBtn.attr("data-active", "true");
-            } else if (type === "PSU") {
-                this.roomInteractionMode = RoomInteractionMode.ADD_PSU;
-                addPSUBtn.attr("data-active", "true");
-            } else if (type === "COOLING_ITEM") {
-                this.roomInteractionMode = RoomInteractionMode.ADD_COOLING_ITEM;
-                addCoolingItemBtn.attr("data-active", "true");
-            }
-
-            return;
-        }
-
-        let changed = false;
-        objectTypes.forEach((objectType: any, index: number) => {
-            if (this.roomInteractionMode === objectType.mode) {
-                if (changed) {
-                    return;
-                }
-                if (type === objectType.type) {
-                    this.roomInteractionMode = RoomInteractionMode.DEFAULT;
-                    this.mapView.hoverLayer.setHoverItemVisibility(false);
-                    objectType.btn.attr("data-active", "false");
-                } else {
-                    objectTypes.forEach((otherObjectType, otherIndex: number) => {
-                        if (index !== otherIndex) {
-                            if (type === otherObjectType.type) {
-                                this.mapView.hoverLayer.setHoverItemVisibility(true, type);
-                                otherObjectType.btn.attr("data-active", "true");
-                                this.roomInteractionMode = otherObjectType.mode;
-                            }
-                        }
-                    });
-                }
-                changed = true;
-            }
-        });
-    }
-
-    private addObject(position: IGridPosition, type: string): void {
-        if (!this.mapView.roomLayer.checkHoverTileValidity(position)) {
-            return;
-        }
-
-        const tileList = this.mapView.mapController.roomModeController.currentRoom.tiles;
-
-        for (let i = 0; i < tileList.length; i++) {
-            if (tileList[i].position.x === position.x && tileList[i].position.y === position.y) {
-                if (type === "RACK") {
-                    this.mapController.api.addRack(this.mapView.simulation.id,
-                        this.mapView.currentDatacenter.id, this.currentRoom.id, tileList[i].id, {
-                            id: -1,
-                            objectType: "RACK",
-                            name: "",
-                            capacity: 42,
-                            powerCapacityW: 5000
-                        }).then((rack: IRack) => {
-                        tileList[i].object = rack;
-                        tileList[i].objectId = rack.id;
-                        tileList[i].objectType = type;
-                        this.mapView.dcObjectLayer.populateObjectList();
-                        this.mapView.dcObjectLayer.draw();
-
-                        this.mapView.updateScene = true;
-                    });
-                } else if (type === "PSU") {
-                    this.mapController.api.addPSU(this.mapView.simulation.id,
-                        this.mapView.currentDatacenter.id, this.currentRoom.id, tileList[i].id, this.availablePSUs[0])
-                        .then((psu: IPSU) => {
-                            tileList[i].object = psu;
-                            tileList[i].objectId = psu.id;
-                            tileList[i].objectType = type;
-                            this.mapView.dcObjectLayer.populateObjectList();
-                            this.mapView.dcObjectLayer.draw();
-
-                            this.mapView.updateScene = true;
-                        });
-                } else if (type === "COOLING_ITEM") {
-                    this.mapController.api.addCoolingItem(this.mapView.simulation.id,
-                        this.mapView.currentDatacenter.id, this.currentRoom.id, tileList[i].id,
-                        this.availableCoolingItems[0]).then((coolingItem: ICoolingItem) => {
-                        tileList[i].object = coolingItem;
-                        tileList[i].objectId = coolingItem.id;
-                        tileList[i].objectType = type;
-                        this.mapView.dcObjectLayer.populateObjectList();
-                        this.mapView.dcObjectLayer.draw();
-
-                        this.mapView.updateScene = true;
-                    });
-                }
-
-                break;
-            }
-        }
-    }
-
-    /**
-     * Populates the room-type dropdown element with all available room types
-     */
-    private populateRoomTypeDropdown(): void {
-        const dropdown = $("#roomtype-select");
-
-        this.roomTypes.forEach((type: string, index: number) => {
-            dropdown.append($('<option>').text(Util.toSentenceCase(type)).val(index));
-        });
-    }
-
-    /**
-     * Loads all object types that are allowed in the current room into the menu.
-     */
-    private populateAllowedObjectTypes(): void {
-        const addObjectsLabel = $("#add-objects-label");
-        const noObjectsInfo = $("#no-objects-info");
-        const allowedObjectTypes = this.roomTypeMap[this.currentRoom.roomType];
-
-        $(".dc-component-container").addClass("hidden");
-
-        if (allowedObjectTypes === undefined || allowedObjectTypes === null || allowedObjectTypes.length === 0) {
-            addObjectsLabel.addClass("hidden");
-            noObjectsInfo.removeClass("hidden");
-
-            return;
-        }
-
-        addObjectsLabel.removeClass("hidden");
-        noObjectsInfo.addClass("hidden");
-        allowedObjectTypes.forEach((type: string) => {
-            switch (type) {
-                case "RACK":
-                    $("#add-rack-btn").removeClass("hidden");
-                    break;
-                case "PSU":
-                    $("#add-psu-btn").removeClass("hidden");
-                    break;
-                case "COOLING_ITEM":
-                    $("#add-cooling-item-btn").removeClass("hidden");
-                    break;
-            }
-        });
-    }
-
-    /**
-     * Checks whether a given room type can be assigned to the current room based on units already present.
-     *
-     * @param newRoomType The new room type to be validated
-     * @returns {boolean} Whether it is allowed to change the room's type to the new type
-     */
-    private checkRoomTypeLegality(newRoomType: string): boolean {
-        let legality = true;
-
-        this.currentRoom.tiles.forEach((tile: ITile) => {
-            if (tile.objectType !== undefined && tile.objectType !== null && tile.objectType !== "" &&
-                this.roomTypeMap[newRoomType].indexOf(tile.objectType) === -1) {
-                legality = false;
-            }
-        });
-
-        return legality;
-    }
-}