diff options
| author | Georgios Andreadis <g.andreadis@student.tudelft.nl> | 2017-09-21 15:10:15 +0200 |
|---|---|---|
| committer | Georgios Andreadis <g.andreadis@student.tudelft.nl> | 2017-09-23 10:06:04 +0200 |
| commit | 0439ccf76f9ccf68c7572deadf38d6a157c439e7 (patch) | |
| tree | e71d3ac9b2ab443d8c49342cc6c7708ba2a00788 /src/components | |
| parent | da861719c6433a1fc9346da958f0907e52d578ce (diff) | |
Implement last-simulated-tick and states fetching
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/sidebars/simulation/TaskComponent.js | 6 | ||||
| -rw-r--r-- | src/components/sidebars/simulation/TraceComponent.js | 13 | ||||
| -rw-r--r-- | src/components/timeline/TimelineControlsComponent.js | 4 |
3 files changed, 13 insertions, 10 deletions
diff --git a/src/components/sidebars/simulation/TaskComponent.js b/src/components/sidebars/simulation/TaskComponent.js index 9a26e720..c02d0a4b 100644 --- a/src/components/sidebars/simulation/TaskComponent.js +++ b/src/components/sidebars/simulation/TaskComponent.js @@ -5,16 +5,16 @@ const TaskComponent = ({task, flopsLeft}) => { let stateInfo; if (flopsLeft === task.totalFlopCount) { - stateInfo = <p><span className="fa fa-hourglass-half"/>Waiting</p>; + stateInfo = <p><span className="fa fa-hourglass-half mr-2"/>Waiting</p>; } else if (flopsLeft > 0) { stateInfo = ( <p> - <span className="fa fa-refresh"/> + <span className="fa fa-refresh mr-2"/> Running ({task.totalFlopCount - flopsLeft} / {task.totalFlopCount} FLOPS) </p> ); } else { - stateInfo = <p><span className="fa fa-check"/>Completed</p>; + stateInfo = <p><span className="fa fa-check mr-2"/>Completed</p>; } return ( diff --git a/src/components/sidebars/simulation/TraceComponent.js b/src/components/sidebars/simulation/TraceComponent.js index 498fe5bf..ffb470ba 100644 --- a/src/components/sidebars/simulation/TraceComponent.js +++ b/src/components/sidebars/simulation/TraceComponent.js @@ -5,11 +5,14 @@ const TraceComponent = ({jobs}) => ( <div> <h3>Trace</h3> {jobs.map(job => ( - <ul className="list-group" key={job.id}> - {job.taskIds.map(taskId => ( - <TaskContainer taskId={taskId} key={taskId}/> - ))} - </ul> + <div key={job.id}> + <h4>Job: {job.name}</h4> + <ul className="list-group"> + {job.taskIds.map(taskId => ( + <TaskContainer taskId={taskId} key={taskId}/> + ))} + </ul> + </div> ))} </div> ); diff --git a/src/components/timeline/TimelineControlsComponent.js b/src/components/timeline/TimelineControlsComponent.js index 3f37c3bc..2e093583 100644 --- a/src/components/timeline/TimelineControlsComponent.js +++ b/src/components/timeline/TimelineControlsComponent.js @@ -5,10 +5,10 @@ function getXPercentage(tick, maxTick) { if (maxTick === 0) { return "0%"; } else if (tick > maxTick) { - return "100%"; + return ((maxTick / (maxTick + 1)) * 100) + "%"; } - return (tick / maxTick) + "%"; + return ((tick / (maxTick + 1)) * 100) + "%"; } const TimelineControlsComponent = ({currentTick, lastSimulatedTick, sectionTicks}) => ( |