diff options
| author | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-04-25 16:01:14 +0200 |
|---|---|---|
| committer | Fabian Mastenbroek <mail.fabianm@gmail.com> | 2021-04-25 16:01:14 +0200 |
| commit | cd0b45627f0d8da8c8dc4edde223f3c36e9bcfbf (patch) | |
| tree | 6ae1681630a0e270c23804e6dbb3bd414ebe5d6e /opendc-web/opendc-web-ui/src/util | |
| parent | 128a1db017545597a5c035b7960eb3fd36b5f987 (diff) | |
build: Migrate to flat project structure
This change updates the project structure to become flattened.
Previously, the simulator, frontend and API each lived into their own
directory.
With this change, all modules of the project live in the top-level
directory of the repository. This should improve discoverability of
modules of the project.
Diffstat (limited to 'opendc-web/opendc-web-ui/src/util')
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/authorizations.js | 11 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/available-metrics.js | 67 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/colors.js | 29 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/date-time.js | 93 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/date-time.test.js | 35 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/sidebar-space.js | 2 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/state-utils.js | 6 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/tile-calculations.js | 255 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/timeline.js | 9 | ||||
| -rw-r--r-- | opendc-web/opendc-web-ui/src/util/unit-specifications.js | 102 |
10 files changed, 609 insertions, 0 deletions
diff --git a/opendc-web/opendc-web-ui/src/util/authorizations.js b/opendc-web/opendc-web-ui/src/util/authorizations.js new file mode 100644 index 00000000..4086b35d --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/authorizations.js @@ -0,0 +1,11 @@ +export const AUTH_ICON_MAP = { + OWN: 'home', + EDIT: 'pencil', + VIEW: 'eye', +} + +export const AUTH_DESCRIPTION_MAP = { + OWN: 'Own', + EDIT: 'Can Edit', + VIEW: 'Can View', +} diff --git a/opendc-web/opendc-web-ui/src/util/available-metrics.js b/opendc-web/opendc-web-ui/src/util/available-metrics.js new file mode 100644 index 00000000..807bc0c1 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/available-metrics.js @@ -0,0 +1,67 @@ +export const AVAILABLE_METRICS = [ + 'total_overcommitted_burst', + 'total_power_draw', + 'total_failure_vm_slices', + 'total_granted_burst', + 'total_interfered_burst', + 'total_requested_burst', + 'mean_cpu_usage', + 'mean_cpu_demand', + 'mean_num_deployed_images', + 'max_num_deployed_images', + 'total_vms_submitted', + 'total_vms_queued', + 'total_vms_finished', + 'total_vms_failed', +] + +export const METRIC_NAMES_SHORT = { + total_overcommitted_burst: 'Overcomm. CPU Cycles', + total_granted_burst: 'Granted CPU Cycles', + total_requested_burst: 'Requested CPU Cycles', + total_interfered_burst: 'Interfered CPU Cycles', + total_power_draw: 'Total Power Consumption', + mean_cpu_usage: 'Mean Host CPU Usage', + mean_cpu_demand: 'Mean Host CPU Demand', + mean_num_deployed_images: 'Mean Num. Deployed Images Per Host', + max_num_deployed_images: 'Max. Num. Deployed Images Per Host', + total_failure_vm_slices: 'Total Num. Failed VM Slices', + total_vms_submitted: 'Total Num. VMs Submitted', + total_vms_queued: 'Max. Num. VMs Queued', + total_vms_finished: 'Max. Num. VMs Finished', + total_vms_failed: 'Max. Num. VMs Failed', +} + +export const METRIC_NAMES = { + total_overcommitted_burst: 'Overcommitted CPU Cycles', + total_granted_burst: 'Granted CPU Cycles', + total_requested_burst: 'Requested CPU Cycles', + total_interfered_burst: 'Interfered CPU Cycles', + total_power_draw: 'Total Power Consumption', + mean_cpu_usage: 'Mean Host CPU Usage', + mean_cpu_demand: 'Mean Host CPU Demand', + mean_num_deployed_images: 'Mean Number of Deployed Images Per Host', + max_num_deployed_images: 'Maximum Number Deployed Images Per Host', + total_failure_vm_slices: 'Total Number Failed VM Slices', + total_vms_submitted: 'Total Number VMs Submitted', + total_vms_queued: 'Maximum Number VMs Queued', + total_vms_finished: 'Maximum Number VMs Finished', + total_vms_failed: 'Maximum Number VMs Failed', +} + +export const METRIC_UNITS = { + total_overcommitted_burst: 'MFLOP', + total_granted_burst: 'MFLOP', + total_requested_burst: 'MFLOP', + total_interfered_burst: 'MFLOP', + total_power_draw: 'Wh', + mean_cpu_usage: 'MHz', + mean_cpu_demand: 'MHz', + mean_num_deployed_images: 'VMs', + max_num_deployed_images: 'VMs', + total_failure_vm_slices: 'VM Slices', + total_vms_submitted: 'VMs', + total_vms_queued: 'VMs', + total_vms_finished: 'VMs', + total_vms_failed: 'VMs', +} diff --git a/opendc-web/opendc-web-ui/src/util/colors.js b/opendc-web/opendc-web-ui/src/util/colors.js new file mode 100644 index 00000000..34468503 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/colors.js @@ -0,0 +1,29 @@ +export const GRID_COLOR = 'rgba(0, 0, 0, 0.5)' +export const BACKDROP_COLOR = 'rgba(255, 255, 255, 1)' +export const WALL_COLOR = 'rgba(0, 0, 0, 1)' + +export const ROOM_DEFAULT_COLOR = 'rgba(150, 150, 150, 1)' +export const ROOM_IN_CONSTRUCTION_COLOR = 'rgba(51, 153, 255, 1)' +export const ROOM_HOVER_VALID_COLOR = 'rgba(51, 153, 255, 1)' +export const ROOM_HOVER_INVALID_COLOR = 'rgba(255, 102, 0, 1)' +export const ROOM_NAME_COLOR = 'rgba(245, 245, 245, 1)' +export const ROOM_TYPE_COLOR = 'rgba(245, 245, 245, 1)' + +export const TILE_PLUS_COLOR = 'rgba(0, 0, 0, 1)' + +export const OBJECT_BORDER_COLOR = 'rgba(0, 0, 0, 1)' + +export const RACK_BACKGROUND_COLOR = 'rgba(170, 170, 170, 1)' +export const RACK_SPACE_BAR_BACKGROUND_COLOR = 'rgba(222, 235, 247, 0.6)' +export const RACK_SPACE_BAR_FILL_COLOR = 'rgba(91, 155, 213, 0.7)' +export const RACK_ENERGY_BAR_BACKGROUND_COLOR = 'rgba(255, 242, 204, 0.6)' +export const RACK_ENERGY_BAR_FILL_COLOR = 'rgba(244, 215, 0, 0.7)' +export const COOLING_ITEM_BACKGROUND_COLOR = 'rgba(40, 50, 230, 1)' +export const PSU_BACKGROUND_COLOR = 'rgba(230, 50, 60, 1)' + +export const GRAYED_OUT_AREA_COLOR = 'rgba(0, 0, 0, 0.6)' + +export const SIM_LOW_COLOR = 'rgba(197, 224, 180, 1)' +export const SIM_MID_LOW_COLOR = 'rgba(255, 230, 153, 1)' +export const SIM_MID_HIGH_COLOR = 'rgba(248, 203, 173, 1)' +export const SIM_HIGH_COLOR = 'rgba(249, 165, 165, 1)' diff --git a/opendc-web/opendc-web-ui/src/util/date-time.js b/opendc-web/opendc-web-ui/src/util/date-time.js new file mode 100644 index 00000000..66efdf5b --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/date-time.js @@ -0,0 +1,93 @@ +/** + * Parses and formats the given date-time string representation. + * + * The format assumed is "YYYY-MM-DDTHH:MM:SS". + * + * @param dateTimeString A string expressing a date and a time, in the above mentioned format. + * @returns {string} A human-friendly string version of that date and time. + */ +export function parseAndFormatDateTime(dateTimeString) { + return formatDateTime(parseDateTime(dateTimeString)) +} + +/** + * Parses date-time string representations and returns a parsed object. + * + * The format assumed is "YYYY-MM-DDTHH:MM:SS". + * + * @param dateTimeString A string expressing a date and a time, in the above mentioned format. + * @returns {object} A Date object with the parsed date and time information as content. + */ +export function parseDateTime(dateTimeString) { + return new Date(dateTimeString + '.000Z') +} + +/** + * Serializes the given date and time value to a human-friendly string. + * + * @param dateTime An object representation of a date and time. + * @returns {string} A human-friendly string version of that date and time. + */ +export function formatDateTime(dateTime) { + let date + const currentDate = new Date() + + date = + addPaddingToTwo(dateTime.getDay()) + + '/' + + addPaddingToTwo(dateTime.getMonth()) + + '/' + + addPaddingToTwo(dateTime.getFullYear()) + + if (dateTime.getFullYear() === currentDate.getFullYear() && dateTime.getMonth() === currentDate.getMonth()) { + if (dateTime.getDate() === currentDate.getDate()) { + date = 'Today' + } else if (dateTime.getDate() === currentDate.getDate() - 1) { + date = 'Yesterday' + } + } + + return date + ', ' + addPaddingToTwo(dateTime.getHours()) + ':' + addPaddingToTwo(dateTime.getMinutes()) +} + +/** + * Formats the given number of seconds/ticks to a formatted time representation. + * + * @param seconds The number of seconds. + * @returns {string} A string representation of that amount of second, in the from of HH:MM:SS. + */ +export function convertSecondsToFormattedTime(seconds) { + if (seconds <= 0) { + return '0s' + } + + let hour = Math.floor(seconds / 3600) + let minute = Math.floor(seconds / 60) % 60 + let second = seconds % 60 + + hour = isNaN(hour) ? 0 : hour + minute = isNaN(minute) ? 0 : minute + second = isNaN(second) ? 0 : second + + if (hour === 0 && minute === 0) { + return second + 's' + } else if (hour === 0) { + return minute + 'm' + addPaddingToTwo(second) + 's' + } else { + return hour + 'h' + addPaddingToTwo(minute) + 'm' + addPaddingToTwo(second) + 's' + } +} + +/** + * Pads the given integer to have at least two digits. + * + * @param integer An integer to be padded. + * @returns {string} A string containing the padded integer. + */ +function addPaddingToTwo(integer) { + if (integer < 10) { + return '0' + integer.toString() + } else { + return integer.toString() + } +} diff --git a/opendc-web/opendc-web-ui/src/util/date-time.test.js b/opendc-web/opendc-web-ui/src/util/date-time.test.js new file mode 100644 index 00000000..3d95eba6 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/date-time.test.js @@ -0,0 +1,35 @@ +import { convertSecondsToFormattedTime, parseDateTime } from './date-time' + +describe('date-time parsing', () => { + it('reads components properly', () => { + const dateString = '2017-09-27T20:55:01' + const parsedDate = parseDateTime(dateString) + + expect(parsedDate.getUTCFullYear()).toEqual(2017) + expect(parsedDate.getUTCMonth()).toEqual(8) + expect(parsedDate.getUTCDate()).toEqual(27) + expect(parsedDate.getUTCHours()).toEqual(20) + expect(parsedDate.getUTCMinutes()).toEqual(55) + expect(parsedDate.getUTCSeconds()).toEqual(1) + }) +}) + +describe('tick formatting', () => { + it("returns '0s' for numbers <= 0", () => { + expect(convertSecondsToFormattedTime(-1)).toEqual('0s') + expect(convertSecondsToFormattedTime(0)).toEqual('0s') + }) + it('returns only seconds for values under a minute', () => { + expect(convertSecondsToFormattedTime(1)).toEqual('1s') + expect(convertSecondsToFormattedTime(59)).toEqual('59s') + }) + it('returns seconds and minutes for values under an hour', () => { + expect(convertSecondsToFormattedTime(60)).toEqual('1m00s') + expect(convertSecondsToFormattedTime(61)).toEqual('1m01s') + expect(convertSecondsToFormattedTime(3599)).toEqual('59m59s') + }) + it('returns full time for values over an hour', () => { + expect(convertSecondsToFormattedTime(3600)).toEqual('1h00m00s') + expect(convertSecondsToFormattedTime(3601)).toEqual('1h00m01s') + }) +}) diff --git a/opendc-web/opendc-web-ui/src/util/sidebar-space.js b/opendc-web/opendc-web-ui/src/util/sidebar-space.js new file mode 100644 index 00000000..ef09d40a --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/sidebar-space.js @@ -0,0 +1,2 @@ +export const isCollapsible = (location) => + location.pathname.indexOf('portfolios') === -1 && location.pathname.indexOf('scenarios') === -1 diff --git a/opendc-web/opendc-web-ui/src/util/state-utils.js b/opendc-web/opendc-web-ui/src/util/state-utils.js new file mode 100644 index 00000000..e5b695c3 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/state-utils.js @@ -0,0 +1,6 @@ +export const getState = (dispatch) => + new Promise((resolve) => { + dispatch((dispatch, getState) => { + resolve(getState()) + }) + }) diff --git a/opendc-web/opendc-web-ui/src/util/tile-calculations.js b/opendc-web/opendc-web-ui/src/util/tile-calculations.js new file mode 100644 index 00000000..764ae6ac --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/tile-calculations.js @@ -0,0 +1,255 @@ +export function deriveWallLocations(tiles) { + const { verticalWalls, horizontalWalls } = getWallSegments(tiles) + return mergeWallSegments(verticalWalls, horizontalWalls) +} + +function getWallSegments(tiles) { + const verticalWalls = {} + const horizontalWalls = {} + + tiles.forEach((tile) => { + const x = tile.positionX, + y = tile.positionY + + for (let dX = -1; dX <= 1; dX++) { + for (let dY = -1; dY <= 1; dY++) { + if (Math.abs(dX) === Math.abs(dY)) { + continue + } + + let doInsert = true + for (let tileIndex in tiles) { + if (tiles[tileIndex].positionX === x + dX && tiles[tileIndex].positionY === y + dY) { + doInsert = false + break + } + } + if (!doInsert) { + continue + } + + if (dX === -1) { + if (verticalWalls[x] === undefined) { + verticalWalls[x] = [] + } + if (verticalWalls[x].indexOf(y) === -1) { + verticalWalls[x].push(y) + } + } else if (dX === 1) { + if (verticalWalls[x + 1] === undefined) { + verticalWalls[x + 1] = [] + } + if (verticalWalls[x + 1].indexOf(y) === -1) { + verticalWalls[x + 1].push(y) + } + } else if (dY === -1) { + if (horizontalWalls[y] === undefined) { + horizontalWalls[y] = [] + } + if (horizontalWalls[y].indexOf(x) === -1) { + horizontalWalls[y].push(x) + } + } else if (dY === 1) { + if (horizontalWalls[y + 1] === undefined) { + horizontalWalls[y + 1] = [] + } + if (horizontalWalls[y + 1].indexOf(x) === -1) { + horizontalWalls[y + 1].push(x) + } + } + } + } + }) + + return { verticalWalls, horizontalWalls } +} + +function mergeWallSegments(vertical, horizontal) { + const result = [] + const walls = [vertical, horizontal] + + for (let i = 0; i < 2; i++) { + const wallList = walls[i] + for (let a in wallList) { + a = parseInt(a, 10) + + wallList[a].sort((a, b) => { + return a - b + }) + + let startPos = wallList[a][0] + const isHorizontal = i === 1 + + if (wallList[a].length === 1) { + const startPosX = isHorizontal ? startPos : a + const startPosY = isHorizontal ? a : startPos + result.push({ + startPosX, + startPosY, + isHorizontal, + length: 1, + }) + } else { + let consecutiveCount = 1 + for (let b = 0; b < wallList[a].length - 1; b++) { + if (b + 1 === wallList[a].length - 1) { + if (wallList[a][b + 1] - wallList[a][b] > 1) { + const startPosX = isHorizontal ? startPos : a + const startPosY = isHorizontal ? a : startPos + result.push({ + startPosX, + startPosY, + isHorizontal, + length: consecutiveCount, + }) + consecutiveCount = 0 + startPos = wallList[a][b + 1] + } + const startPosX = isHorizontal ? startPos : a + const startPosY = isHorizontal ? a : startPos + result.push({ + startPosX, + startPosY, + isHorizontal, + length: consecutiveCount + 1, + }) + break + } else if (wallList[a][b + 1] - wallList[a][b] > 1) { + const startPosX = isHorizontal ? startPos : a + const startPosY = isHorizontal ? a : startPos + result.push({ + startPosX, + startPosY, + isHorizontal, + length: consecutiveCount, + }) + startPos = wallList[a][b + 1] + consecutiveCount = 0 + } + consecutiveCount++ + } + } + } + } + + return result +} + +export function deriveValidNextTilePositions(rooms, selectedTiles) { + const result = [], + newPosition = { x: 0, y: 0 } + let isSurroundingTile + + selectedTiles.forEach((tile) => { + const x = tile.positionX + const y = tile.positionY + result.push({ x, y }) + + for (let dX = -1; dX <= 1; dX++) { + for (let dY = -1; dY <= 1; dY++) { + if (Math.abs(dX) === Math.abs(dY)) { + continue + } + + newPosition.x = x + dX + newPosition.y = y + dY + + isSurroundingTile = true + for (let index in selectedTiles) { + if ( + selectedTiles[index].positionX === newPosition.x && + selectedTiles[index].positionY === newPosition.y + ) { + isSurroundingTile = false + break + } + } + + if (isSurroundingTile && findPositionInRooms(rooms, newPosition.x, newPosition.y) === -1) { + result.push({ x: newPosition.x, y: newPosition.y }) + } + } + } + }) + + return result +} + +export function findPositionInPositions(positions, positionX, positionY) { + for (let i = 0; i < positions.length; i++) { + const position = positions[i] + if (positionX === position.x && positionY === position.y) { + return i + } + } + + return -1 +} + +export function findPositionInRooms(rooms, positionX, positionY) { + for (let i = 0; i < rooms.length; i++) { + const room = rooms[i] + if (findPositionInTiles(room.tiles, positionX, positionY) !== -1) { + return i + } + } + + return -1 +} + +function findPositionInTiles(tiles, positionX, positionY) { + let index = -1 + + for (let i = 0; i < tiles.length; i++) { + const tile = tiles[i] + if (positionX === tile.positionX && positionY === tile.positionY) { + index = i + break + } + } + + return index +} + +export function findTileWithPosition(tiles, positionX, positionY) { + for (let i = 0; i < tiles.length; i++) { + if (tiles[i].positionX === positionX && tiles[i].positionY === positionY) { + return tiles[i] + } + } + + return null +} + +export function calculateRoomListBounds(rooms) { + const min = { x: Number.MAX_VALUE, y: Number.MAX_VALUE } + const max = { x: -1, y: -1 } + + rooms.forEach((room) => { + room.tiles.forEach((tile) => { + if (tile.positionX < min.x) { + min.x = tile.positionX + } + if (tile.positionY < min.y) { + min.y = tile.positionY + } + + if (tile.positionX > max.x) { + max.x = tile.positionX + } + if (tile.positionY > max.y) { + max.y = tile.positionY + } + }) + }) + + max.x++ + max.y++ + + const center = { + x: min.x + (max.x - min.x) / 2.0, + y: min.y + (max.y - min.y) / 2.0, + } + + return { min, center, max } +} diff --git a/opendc-web/opendc-web-ui/src/util/timeline.js b/opendc-web/opendc-web-ui/src/util/timeline.js new file mode 100644 index 00000000..7c8a3ef0 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/timeline.js @@ -0,0 +1,9 @@ +export function convertTickToPercentage(tick, maxTick) { + if (maxTick === 0) { + return '0%' + } else if (tick > maxTick) { + return (maxTick / (maxTick + 1)) * 100 + '%' + } + + return (tick / (maxTick + 1)) * 100 + '%' +} diff --git a/opendc-web/opendc-web-ui/src/util/unit-specifications.js b/opendc-web/opendc-web-ui/src/util/unit-specifications.js new file mode 100644 index 00000000..28479edd --- /dev/null +++ b/opendc-web/opendc-web-ui/src/util/unit-specifications.js @@ -0,0 +1,102 @@ +export const CPU_UNITS = { + 'cpu-1': { + _id: 'cpu-1', + name: 'Intel i7 v6 6700k', + clockRateMhz: 4100, + numberOfCores: 4, + energyConsumptionW: 70, + }, + 'cpu-2': { + _id: 'cpu-2', + name: 'Intel i5 v6 6700k', + clockRateMhz: 3500, + numberOfCores: 2, + energyConsumptionW: 50, + }, + 'cpu-3': { + _id: 'cpu-3', + name: 'Intel® Xeon® E-2224G', + clockRateMhz: 3500, + numberOfCores: 4, + energyConsumptionW: 71, + }, + 'cpu-4': { + _id: 'cpu-4', + name: 'Intel® Xeon® E-2244G', + clockRateMhz: 3800, + numberOfCores: 8, + energyConsumptionW: 71, + }, + 'cpu-5': { + _id: 'cpu-5', + name: 'Intel® Xeon® E-2246G', + clockRateMhz: 3600, + numberOfCores: 12, + energyConsumptionW: 80, + }, +} + +export const GPU_UNITS = { + 'gpu-1': { + _id: 'gpu-1', + name: 'NVIDIA GTX 4 1080', + clockRateMhz: 1200, + numberOfCores: 200, + energyConsumptionW: 250, + }, + 'gpu-2': { + _id: 'gpu-2', + name: 'NVIDIA Tesla V100', + clockRateMhz: 1200, + numberOfCores: 5120, + energyConsumptionW: 250, + }, +} + +export const MEMORY_UNITS = { + 'memory-1': { + _id: 'memory-1', + name: 'Samsung PC DRAM K4A4G045WD', + speedMbPerS: 16000, + sizeMb: 4000, + energyConsumptionW: 10, + }, + 'memory-2': { + _id: 'memory-2', + name: 'Samsung PC DRAM M393A2K43BB1-CRC', + speedMbPerS: 2400, + sizeMb: 16000, + energyConsumptionW: 10, + }, + 'memory-3': { + _id: 'memory-3', + name: 'Crucial MTA18ASF4G72PDZ-3G2E1', + speedMbPerS: 3200, + sizeMb: 32000, + energyConsumptionW: 10, + }, + 'memory-4': { + _id: 'memory-4', + name: 'Crucial MTA9ASF2G72PZ-3G2E1', + speedMbPerS: 3200, + sizeMb: 16000, + energyConsumptionW: 10, + }, +} + +export const STORAGE_UNITS = { + 'storage-1': { + _id: 'storage-1', + name: 'Samsung EVO 2016 SATA III', + speedMbPerS: 6000, + sizeMb: 250000, + energyConsumptionW: 10, + }, + 'storage-2': { + _id: 'storage-2', + name: 'Western Digital MTA9ASF2G72PZ-3G2E1', + speedMbPerS: 6000, + sizeMb: 4000000, + energyConsumptionW: 10, + }, +} |
