Skip to content

Commit

Permalink
First commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@RhythmDeolus
RhythmDeolus committed Mar 7, 2023
0 parents commit 141c82f
Show file tree
Hide file tree
Showing 11 changed files with 1,404 additions and 0 deletions.
4 changes: 4 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
.vscode/
__pycache__
input.txt
main.py
41 changes: 41 additions & 0 deletions App.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
from input import *
from output import *
from scheduling_algos import *
from inputparser import *
import eel

eel.init("web")

class Result:
def __init__(self) -> None:
self.name = "hehe"

@eel.expose
def rand_python():
return Result()

@eel.expose
def get_algo_names_python():
return {
"First Come First Served": "firstComeFirstServed",
"Round Robin": "roundRobin",
"Shortest Job First": "shortestJobFirst",
"Longest Job First": "longestJobFirst",
"Shortest Remaing Time First": "shortestRemainingTimeFirst",
"Longest Remaing Time First": "longestRemainingTimeFirst",
"Priority Based (Non-Premitive)": "priorityBased_NP",
"Priority Based (Premitive)": "priorityBased_P"
}

@eel.expose
def calculate_scheduling_python(input, func):
parser = InputParser.getParser()
inp = parser.parse(input)
possibles = globals().copy()
possibles.update(locals())
method = possibles.get(func)
output : Output = method(inp)
output.printOutput()
return output.Objectify()

eel.start("index.html")
Binary file added Web/chronometers.ico
Binary file not shown.
103 changes: 103 additions & 0 deletions Web/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="./chronometers.ico">
<link rel="stylesheet" href="./style.css">
<title>Job Scheduler</title>
</head>
<body>
<div class="hero is-success p-5">
<div class="columns is-vcentered">
<h1 class="title column ">Job Scheduler</h1>
</div>
</div>
<div class="hero has-text-centered has-background-light p-10" id="input">
<div class="columns is-variable is-8 p-5">
<div class="column columns is-vertical ">
<div class="column columns field">
<label for="algo-type" class="column m-auto label">Select Algorithm</label>
<div class="control column m-auto">
<div class="select">
<select name="algo-type" id="algo-type" class="input">
</select>
</div>
</div>
</div>
<div class="column">
<form id="inputform" class="columns is-vertical">
<div class="column field columns">
<label for="time_quantum" class="label column m-auto">Time Quantum</label>
<div class="control column m-auto">
<input type="text" name="time_quantum" autocomplete="off" id="time_quantum" pattern="[0-9]" class="input">
</div>
</div>
<div class="column columns">
<div class="column">
<input type="submit" value="Calculate" class="button **islarge is-rounded is-success">
</div>
</div>
</form>
</div>
</div>
<div class="column">
<form id="entry" class="columns is-vertical">
<div class="column columns field">
<label for="p-name" class="column label is-half">Process Name</label>
<div class="control m-auto-column">
<input type="text" name="p-name" autocomplete="off" id="p-name" pattern="[a-z]+" class="input" required>
</div>
</div>
<div class="column columns field">
<label for="p-at" class="column label is-half">Arrival Time</label>
<div class="control m-auto-column">
<input type="text" name="p-at" id="p-at" autocomplete="off" pattern="[0-9]+" class="input" required>
</div>
</div>
<div class="column columns field">
<label for="p-bt" class="column label is-half">Burst Time</label>
<div class="control m-auto-column">
<input type="text" name="p-bt" id="p-bt" autocomplete="off" pattern="[0-9]+" class="input" required>
</div>
</div>
<div class="column columns field">
<label for="p-pri" class="column label is-half">Priority</label>
<div class="control m-auto-column">
<input type="text" name="p-pri" id="p-pri" autocomplete="off" pattern="[0-9]" class="input" required>
</div>
</div>
<div class="column columns">
<div class="column">
<input class="button **is-large is-success is-rounded**" type="submit" value="Add Process">
</div>
</div>
</form>
</div>
</div>
</div>
<div id="output" class="hero has-text-centered" >
<table id="outtable" class="table is-bordered has-text-centered">
<tr>
<th>Process Name</th>
<th>Priority</th>
<th>Arival Time</th>
<th>Burst Time</th>
<th>Completion Time</th>
<th>Turnaround Time</th>
<th>Waiting Time</th>
<th>Response Time</th>
</tr>
</table>
<div>
<div class="is-size-3 is-uppercase has-text-weight-medium">Gantt Chart</div>
<div id="chart">
<canvas></canvas>
</div>
</div>
</div>
<script type="text/javascript" src="/eel.js"></script>
<script src="./main.js"></script>
</body>
</html>
184 changes: 184 additions & 0 deletions Web/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,184 @@
// console.log("hello");
document.body.onload = function() {
let elem = document.getElementById('algo-type');
// console.log(elem);
eel.get_algo_names_python()((result) => {
// console.log(result)
Object.keys(result).forEach(element => {
let d = document.createElement('option');
d.value = result[element];
d.innerText = element;
elem.appendChild(d);
});
});
let form = document.getElementById('entry');
form.addEventListener('submit', validate, false)
form = document.getElementById("inputform");
form.addEventListener('submit', validateCalculation, false)
// debugger;
}

processes = {}

function getRow(...args) {
let tr = document.createElement('tr');
// console.log("here")
let i = 0;
while (i < 8) {
let td = document.createElement('td');
td.innerText = i < args.length? args[i]: "";
tr.appendChild(td);
i++;
}
let td = document.createElement('td');
let button = document.createElement('button');
button.classList.add('button', '**is-large', 'is-success', 'is-rounded')
button.onclick = (e) => {
delete processes[tr.children[0].innerText];
tr.parentElement.removeChild(tr);
}
button.value = 'x';
button.innerText = 'x';
td.appendChild(button);
tr.classList.add('active')
tr.appendChild(td);
return tr;
}

function validate(e) {
e.preventDefault()
e.returnValue = false;
// debugger;
let elem = document.getElementById('outtable');
let data = new FormData(e.target);
let p = {};
let name = data.get('p-name');
p['priority'] = data.get('p-pri');
p['arrival_time'] = data.get('p-at');
p['burst_time'] = data.get('p-bt');
if (! (name in processes)) {
processes[name] = p;
let tr = getRow(name, p['priority'], p['arrival_time'], p['burst_time'])
p['row'] = tr;
// let tr = document.createElement('tr');
elem.appendChild(tr);
} else {
let tr = getRow(name, p['priority'], p['arrival_time'], p['burst_time'])
// console.log(processes[name].row);
elem.insertBefore(tr, processes[name].row)
elem.removeChild(processes[name].row)
p['row'] = tr;
processes[name] = p;
}
// console.log("hmmm")
// debugger;

return false;
}

function validateCalculation(e) {
e.preventDefault();
e.returnValue = false;
calculateScheduling()
return false;
}

function calculateScheduling() {
let s = "True "

let tq = document.getElementById('time_quantum').value
if (Number(tq) == NaN) {
s += "False\n"
} else {
s += tq + '\n';
}

Object.keys(processes).forEach(key1 => {
let obj = processes[key1]
s += [key1, obj.priority, obj.arrival_time, 'c' + obj.burst_time].join(" ")
s += '\n'
})
s =s.slice(0,-1);

let sel = document.getElementById('algo-type');

eel.calculate_scheduling_python(s, sel.value)(function (result) {
drawGChart(result['gant_chart']);
// console.log(result);
setRows(4, result['ct_list'])
setRows(5, result['tat_list'])
setRows(6, result['wt_list'])
setRows(7, result['rt_list'])
})
}

function setRows(num, ct_list) {
// debugger;
let table = document.getElementById('outtable');
for (key in ct_list) {
for (l of table.children) {
if (l.children[0].innerText == key) {
l.children[num].innerText = ct_list[key]
}
}
}
}

colorMap = new Map()

function getColor(name) {
if (colorMap.has(name)) return colorMap.get(name)
rint = Math.floor(Math.random() * 360);
let val;
if (name === null) val = [`#000000`, 'black']
else val = [`hsl(${rint}, 90%, 50%)`, `hsl(${rint}, 90%, 20%)`]
colorMap.set(name, val)
return val
}

function drawGChart(chart) {
let can_elem = document.querySelector('#chart > canvas');
can_elem.height = can_elem.parentElement.clientHeight;
can_elem.width = can_elem.parentElement.clientWidth;
let ctx = can_elem.getContext('2d');
// console.log(ctx.fillStyle)
ctx.fillStyle = "white";
ctx.fillRect(0, 0, can_elem.width, can_elem.height);
let pos = [50, 50];
for (key in chart) {
let box_size_x = 60
let box_size_y = 60
x = chart[key]
// console.log(pos)
colr = getColor(x[1])
ctx.fillStyle = colr[0];
// console.log('HSL: ', colr)
ctx.font = "30px Arial";
let dim = ctx.measureText(x[1])
// console.log(x[1])
// console.log( pos[0] + (box_size_x-dim.width) / 2, pos[1] + box_size_y/2 )
if (x[1] != null) {
// console.log("Box size: ", box_size_x);
// console.log("Dimension Text: ", dim.width);
if (dim.width > box_size_x) box_size_x = dim.width;
// console.log("Box size: ", box_size_x);
// console.log("Dimension Text: ", dim.width);
ctx.textBaseline = "center";
ctx.fillRect(pos[0], pos[1], box_size_x, box_size_y)
ctx.fillStyle = colr[1]
ctx.fillText(x[1], pos[0] + (box_size_x-dim.width) / 2, pos[1] + (box_size_y)/2)
} else {
ctx.fillRect(pos[0], pos[1], box_size_x, box_size_y);
}
ctx.beginPath();
ctx.rect(pos[0], pos[1], box_size_x, box_size_y);
ctx.stroke();
ctx.closePath();
ctx.font = "20px Arial";
ctx.fillStyle = "black";
ctx.fillText(x[0], pos[0], pos[1] + box_size_y + 25)
ctx.fillText(x[2], pos[0] + box_size_x, pos[1] + box_size_y + 25)
// ctx.fillText("hello", 0 , 0)
pos[0] += box_size_x;
}
}
36 changes: 36 additions & 0 deletions Web/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
@import "https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css";
.columns.is-vertical {
flex-direction: column;
}
.slide {
animation-duration: 3s;
animation-name: slidein;
}
@keyframes slidein {
from {
margin-left: 100%;
width: 300%;
}

to {
margin-left: 0%;
width: 100%;
}
}
/* h1 {
text-align: center;
}
#outtable {
border: solid 1px black;
width: 100%;
}
#outtable td, th {
border: solid 1px black;
}
#chart {
width: 100%;
height: auto;
} */
Loading

0 comments on commit 141c82f

Please sign in to comment.