├── README.md
├── app.js
├── index.html
└── style.css


/README.md:
--------------------------------------------------------------------------------
1 | # cpu-scheduling-sim
2 | CPU Scheduling Simulator
3 | 
4 | This application is built for my OS mini project. I'll continue developing this application which will include bug fixes and new features.
5 | 


--------------------------------------------------------------------------------
/app.js:
--------------------------------------------------------------------------------
  1 | $(document).ready(
  2 |     function(){
  3 | 
  4 |         $(".form-group-time-quantum").hide();
  5 | 
  6 |         // Show hide RR time quantum
  7 |         $('#algorithmSelector').on('change', function(){
  8 |             if(this.value === 'optRR') {
  9 |                 $(".form-group-time-quantum").show(1000);
 10 |             } else {
 11 |                 $(".form-group-time-quantum").hide(1000);
 12 |             }
 13 |         });
 14 | 
 15 | 
 16 |         var processList = [];
 17 | 
 18 |         $('#btnAddProcess').on('click', function(){
 19 |             var processID = $('#processID');
 20 |             var arrivalTime = $('#arrivalTime');
 21 |             var burstTime = $('#burstTime');
 22 | 
 23 |             if(processID.val() === '' || arrivalTime.val() === '' || burstTime.val() === ''){
 24 |                 processID.addClass('is-invalid');
 25 |                 arrivalTime.addClass('is-invalid');
 26 |                 burstTime.addClass('is-invalid');
 27 |                 return;
 28 |             }
 29 | 
 30 |             var process = {
 31 |                 processID: parseInt(processID.val(), 10),
 32 |                 arrivalTime: parseInt(arrivalTime.val(), 10),
 33 |                 burstTime: parseInt(burstTime.val(), 10)
 34 |             }
 35 | 
 36 |             processList.push(process);
 37 |             
 38 |             $('#tblProcessList > tbody:last-child').append(
 39 |                 `<tr>
 40 |                     <td id="tdProcessID">${processID.val()}</td>
 41 |                     <td id="tdArrivalTime">${arrivalTime.val()}</td>
 42 |                     <td id="tdBurstTime">${burstTime.val()}</td>
 43 |                 </tr>`
 44 |             );
 45 | 
 46 |             processID.val('');
 47 |             arrivalTime.val('');
 48 |             burstTime.val('');
 49 |         });
 50 | 
 51 |         $('#btnCalculate').on('click', function(){
 52 | 
 53 |             if (processList.length == 0) {
 54 |                 alert('Please insert some processes');
 55 |                 return;
 56 |             }
 57 | 
 58 |             var selectedAlgo = $('#algorithmSelector').children('option:selected').val();
 59 | 
 60 |             if (selectedAlgo === 'optFCFS') {
 61 |                 firstComeFirstServed();
 62 |             }
 63 | 
 64 |             if (selectedAlgo === 'optSJF') {
 65 |                 shortestJobFirst();
 66 |             }
 67 | 
 68 |             if (selectedAlgo === 'optSRTF') {
 69 |                 shortestRemainingTimeFirst();
 70 |             }
 71 | 
 72 |             if (selectedAlgo === 'optRR') {
 73 |                 roundRobin();
 74 |             }
 75 |         });
 76 | 
 77 |         function firstComeFirstServed(){
 78 |             var time = 0;
 79 |             var queue = [];
 80 |             var completedList = [];
 81 | 
 82 |             while (processList.length > 0 || queue.length > 0) {
 83 |                 while (queue.length == 0) {
 84 |                     time++;
 85 |                     addToQueue();
 86 |                 }
 87 | 
 88 |                 // Dequeue from queue and run the process.
 89 |                 process = queue.shift();
 90 |                 for(var i = 0; i < process.burstTime; i++){
 91 |                     time++
 92 |                     addToQueue();
 93 |                 }   
 94 |                 process.completedTime = time;
 95 |                 process.turnAroundTime = process.completedTime - process.arrivalTime;
 96 |                 process.waitingTime = process.turnAroundTime - process.burstTime;
 97 |                 completedList.push(process);
 98 |             }
 99 | 
100 |             function addToQueue() {
101 |                 for(var i = 0; i < processList.length; i++) {
102 |                     if(time >= processList[i].arrivalTime) {
103 |                         var process = {
104 |                             processID: processList[i].processID, 
105 |                             arrivalTime: processList[i].arrivalTime, 
106 |                             burstTime: processList[i].burstTime
107 |                         }
108 |                         processList.splice(i, 1);
109 |                         queue.push(process);
110 |                     }
111 |                 }
112 |             }
113 | 
114 |             // Bind table data
115 |             $.each(completedList, function(key, process){
116 |                 $('#tblResults > tbody:last-child').append(
117 |                     `<tr>
118 |                         <td id="tdProcessID">${process.processID}</td>
119 |                         <td id="tdArrivalTime">${process.arrivalTime}</td>
120 |                         <td id="tdBurstTime">${process.burstTime}</td>
121 |                         <td id="tdBurstTime">${process.completedTime}</td>
122 |                         <td id="tdBurstTime">${process.waitingTime}</td>
123 |                         <td id="tdBurstTime">${process.turnAroundTime}</td>
124 |                     </tr>`
125 |                 );
126 |             });
127 | 
128 |             // Get average
129 |             var avgTurnaroundTime = 0;
130 |             var avgWaitingTime = 0;
131 |             var maxCompletedTime = 0;
132 | 
133 |             $.each(completedList, function(key, process){
134 |                 if (process.completedTime > maxCompletedTime) {
135 |                     maxCompletedTime = process.completedTime;
136 |                 }
137 |                 avgTurnaroundTime = avgTurnaroundTime + process.turnAroundTime;
138 |                 avgWaitingTime = avgWaitingTime + process.waitingTime;
139 |             });
140 | 
141 |             $('#avgTurnaroundTime').val( avgTurnaroundTime / completedList.length );
142 |             $('#avgWaitingTime').val( avgWaitingTime / completedList.length );
143 |             $('#throughput').val(completedList.length / maxCompletedTime);
144 |         }
145 | 
146 |         function shortestJobFirst(){
147 |             var completedList = [];
148 |             var time = 0;
149 |             var queue = [];
150 | 
151 |             while (processList.length>0 || queue.length>0) {
152 |                 addToQueue();
153 |                 while (queue.length==0) {                
154 |                     time++;
155 |                     addToQueue();
156 |                 }
157 |                 processToRun = selectProcess();
158 |                 for (var i = 0; i < processToRun.burstTime; i++) {
159 |                     time++;
160 |                     addToQueue();
161 |                 }
162 |                 processToRun.processID = processToRun.processID;
163 |                 processToRun.arrivalTime = processToRun.arrivalTime;
164 |                 processToRun.burstTime = processToRun.burstTime;
165 |                 processToRun.completedTime = time;
166 |                 processToRun.turnAroundTime = processToRun.completedTime - processToRun.arrivalTime;
167 |                 processToRun.waitingTime = processToRun.turnAroundTime - processToRun.burstTime;
168 |                 completedList.push(processToRun);
169 |             }
170 |             function addToQueue() {
171 |                 for(var i = 0; i < processList.length; i++) {
172 |                     if(processList[i].arrivalTime === time) {
173 |                         var process = {
174 |                             processID: processList[i].processID, 
175 |                             arrivalTime: processList[i].arrivalTime, 
176 |                             burstTime: processList[i].burstTime
177 |                         }
178 |                         processList.splice(i, 1);
179 |                         queue.push(process);
180 |                     }
181 |                 }
182 |             }
183 |             function selectProcess() {
184 |                 if (queue.length!=0) {
185 |                     queue.sort(function(a, b){
186 |                         if (a.burstTime > b.burstTime) {
187 |                             return 1;
188 |                         } else {
189 |                             return -1;
190 |                         }
191 |                     });
192 |                 }
193 |                 var process = queue.shift();
194 |                 return process;
195 |             }
196 | 
197 |             // Bind table data
198 |             $.each(completedList, function(key, process){
199 |                 $('#tblResults > tbody:last-child').append(
200 |                     `<tr>
201 |                         <td id="tdProcessID">${process.processID}</td>
202 |                         <td id="tdArrivalTime">${process.arrivalTime}</td>
203 |                         <td id="tdBurstTime">${process.burstTime}</td>
204 |                         <td id="tdBurstTime">${process.completedTime}</td>
205 |                         <td id="tdBurstTime">${process.waitingTime}</td>
206 |                         <td id="tdBurstTime">${process.turnAroundTime}</td>
207 |                     </tr>`
208 |                 );
209 |             });
210 | 
211 |             // Get average
212 |             var avgTurnaroundTime = 0;
213 |             var avgWaitingTime = 0;
214 |             var maxCompletedTime = 0;
215 |             var throughput = 0;
216 | 
217 |             $.each(completedList, function(key, process){
218 |                 if (process.completedTime > maxCompletedTime) {
219 |                     maxCompletedTime = process.completedTime;
220 |                 }
221 |                 avgTurnaroundTime = avgTurnaroundTime + process.turnAroundTime;
222 |                 avgWaitingTime = avgWaitingTime + process.waitingTime;
223 |             });
224 | 
225 |             $('#avgTurnaroundTime').val( avgTurnaroundTime / completedList.length );
226 |             $('#avgWaitingTime').val( avgWaitingTime / completedList.length );
227 |             $('#throughput').val(completedList.length / maxCompletedTime);
228 |         }
229 | 
230 |         function shortestRemainingTimeFirst() {
231 |             var completedList = [];
232 |             var time = 0;
233 |             var queue = [];
234 |             
235 |             while ( processList.length>0 || queue.length>0 ) {
236 |                 addToQueue();
237 |                 while (queue.length==0) {                
238 |                     time++;
239 |                     addToQueue();
240 |                 }
241 |              selectProcessForSRTF();
242 |              runSRTF();
243 |             }
244 | 
245 |             function addToQueue() {
246 |                 for(var i = 0; i < processList.length; i++) {
247 |                     if(processList[i].arrivalTime === time) {
248 |                         var process = {
249 |                             processID: processList[i].processID, 
250 |                             arrivalTime: processList[i].arrivalTime, 
251 |                             burstTime: processList[i].burstTime
252 |                         }
253 |                         processList.splice(i, 1);
254 |                         queue.push(process);
255 |                     }
256 |                 }
257 |             }
258 |             function selectProcessForSRTF() {
259 |                 if (queue.length != 0) {
260 |                     queue.sort(function(a, b){
261 |                         if (a.burstTime > b.burstTime) {
262 |                             return 1;
263 |                         } else {
264 |                             return -1;
265 |                         }
266 |                     });
267 |                     if (queue[0].burstTime == 1) {
268 |                         process = queue.shift();
269 |                         process.completedTime = time + 1;
270 |                         completedList.push(process);
271 | 
272 |                     } else if(queue[0].burstTime > 1){
273 |                         process = queue[0];
274 |                         queue[0].burstTime = process.burstTime - 1;
275 |                     }
276 |                 }
277 |             }
278 |             function runSRTF() {
279 |                 time++;
280 |                 addToQueue();
281 |             }
282 | 
283 |             // Fetch table data
284 |             var TableData = [];
285 |             $('#tblProcessList tr').each(function(row, tr) {
286 |                 TableData[row] = {
287 |                     "processID": parseInt($(tr).find('td:eq(0)').text()),
288 |                     "arrivalTime": parseInt($(tr).find('td:eq(1)').text()),
289 |                     "burstTime": parseInt($(tr).find('td:eq(2)').text())
290 |                 }
291 |             });
292 | 
293 |             // Remove header row
294 |             TableData.splice(0, 1);
295 |             
296 |             // Reset burst time
297 |             TableData.forEach(pInTable => {
298 |                 completedList.forEach(pInCompleted => {
299 |                     if (pInTable.processID == pInCompleted.processID) {
300 |                         pInCompleted.burstTime = pInTable.burstTime;
301 |                         pInCompleted.turnAroundTime = pInCompleted.completedTime - pInCompleted.arrivalTime;
302 |                         pInCompleted.waitingTime = pInCompleted.turnAroundTime - pInCompleted.burstTime;
303 |                     }
304 |                 });
305 |             });
306 | 
307 |             // Bind table data
308 |             $.each(completedList, function(key, process){
309 |                 $('#tblResults > tbody:last-child').append(
310 |                     `<tr>
311 |                         <td id="tdProcessID">${process.processID}</td>
312 |                         <td id="tdArrivalTime">${process.arrivalTime}</td>
313 |                         <td id="tdBurstTime">${process.burstTime}</td>
314 |                         <td id="tdBurstTime">${process.completedTime}</td>
315 |                         <td id="tdBurstTime">${process.waitingTime}</td>
316 |                         <td id="tdBurstTime">${process.turnAroundTime}</td>
317 |                     </tr>`
318 |                 );
319 |             });
320 | 
321 |             // Get average
322 |             var avgTurnaroundTime = 0;
323 |             var avgWaitingTime = 0;
324 |             var maxCompletedTime = 0;
325 |             var throughput = 0;
326 | 
327 |             $.each(completedList, function(key, process){
328 |                 if (process.completedTime > maxCompletedTime) {
329 |                     maxCompletedTime = process.completedTime;
330 |                 }
331 |                 avgTurnaroundTime = avgTurnaroundTime + process.turnAroundTime;
332 |                 avgWaitingTime = avgWaitingTime + process.waitingTime;
333 |             });
334 | 
335 |             $('#avgTurnaroundTime').val( avgTurnaroundTime / completedList.length );
336 |             $('#avgWaitingTime').val( avgWaitingTime / completedList.length );
337 |             $('#throughput').val(completedList.length / maxCompletedTime);
338 |         }
339 | 
340 |         function roundRobin() {
341 |             var timeQuantum = $('#timeQuantum');
342 |             var timeQuantumVal= parseInt(timeQuantum.val(), 10);
343 |             if(timeQuantum.val() ==''){
344 |                 alert('Please enter time quantum');
345 |                 timeQuantum.addClass('is-invalid');
346 |                 return;
347 |             }
348 |             var completedList = [];
349 |             var time = 0;
350 |             var queue = [];
351 |             
352 |             while (processList.length > 0 || queue.length > 0) {
353 |                 addToQueue();
354 |                 while (queue.length == 0) {               
355 |                     time++;
356 |                     addToQueue();
357 |                 }
358 |                 selectProcessForRR();
359 |             }
360 | 
361 |             function addToQueue() {
362 |                 for(var i = 0; i < processList.length; i++) {
363 |                     if(processList[i].arrivalTime === time) {
364 |                         var process = {
365 |                             processID: processList[i].processID, 
366 |                             arrivalTime: processList[i].arrivalTime, 
367 |                             burstTime: processList[i].burstTime
368 |                         }
369 |                         processList.splice(i, 1);
370 |                         queue.push(process);
371 |                     }
372 |                 }
373 |             }
374 |             function selectProcessForRR() {
375 |                 if (queue.length!=0) {
376 |                     queue.sort(function(a, b){
377 |                         if (a.burstTime > b.burstTime) {
378 |                             return 1;
379 |                         } else {
380 |                             return -1;
381 |                         }
382 |                     });
383 |                                                 
384 |                     if (queue[0].burstTime < timeQuantumVal) {
385 |                         process = queue.shift();
386 |                         process.completedTime = time + process.burstTime;
387 |                             
388 |                         for (var index = 0; index < process.burstTime; index++) {
389 |                             time++;
390 |                             addToQueue(); 
391 |                         }
392 |                         completedList.push(process);
393 | 
394 |                     }
395 |                     else if(queue[0].burstTime == timeQuantumVal){
396 |                         process = queue.shift();
397 |                         process.completedTime = time + timeQuantumVal;
398 |                         completedList.push(process);
399 | 
400 |                         for (var index = 0; index < timeQuantumVal; index++) {
401 |                             time++;
402 |                             addToQueue();   
403 |                         }
404 |                     }  
405 |                     else if(queue[0].burstTime > timeQuantumVal){
406 |                         process = queue[0];
407 |                         queue[0].burstTime = process.burstTime - timeQuantumVal;
408 | 
409 |                         for (var index = 0; index < timeQuantumVal; index++) {
410 |                             time++;
411 |                             addToQueue();
412 |                         }
413 |                     }   
414 |                 }
415 |             }
416 | 
417 |             // Fetch initial table data
418 |             var TableData = [];
419 |             $('#tblProcessList tr').each(function(row, tr) {
420 |                 TableData[row] = {
421 |                     "processID": parseInt($(tr).find('td:eq(0)').text()),
422 |                     "arrivalTime": parseInt($(tr).find('td:eq(1)').text()),
423 |                     "burstTime": parseInt($(tr).find('td:eq(2)').text())
424 |                 }
425 |             });
426 | 
427 |             // Remove table header row
428 |             TableData.splice(0, 1);
429 |             
430 |             // Reset burst time from original input table.
431 |             TableData.forEach(pInTable => {
432 |                 completedList.forEach(pInCompleted => {
433 |                     if (pInTable.processID==pInCompleted.processID) {
434 |                         pInCompleted.burstTime= pInTable.burstTime;
435 |                         pInCompleted.turnAroundTime = pInCompleted.completedTime - pInCompleted.arrivalTime;
436 |                         pInCompleted.waitingTime = pInCompleted.turnAroundTime - pInCompleted.burstTime;
437 |                     }
438 |                 });
439 |             });
440 | 
441 |             // Bind table data
442 |             $.each(completedList, function(key, process){
443 |                 $('#tblResults > tbody:last-child').append(
444 |                     `<tr>
445 |                         <td id="tdProcessID">${process.processID}</td>
446 |                         <td id="tdArrivalTime">${process.arrivalTime}</td>
447 |                         <td id="tdBurstTime">${process.burstTime}</td>
448 |                         <td id="tdBurstTime">${process.completedTime}</td>
449 |                         <td id="tdBurstTime">${process.waitingTime}</td>
450 |                         <td id="tdBurstTime">${process.turnAroundTime}</td>
451 |                     </tr>`
452 |                 );
453 |             });
454 |                 
455 |             // Get average
456 |             var totalTurnaroundTime = 0;
457 |             var totalWaitingTime = 0;
458 |             var maxCompletedTime = 0;
459 | 
460 |             $.each(completedList, function(key, process){
461 |                 if (process.completedTime > maxCompletedTime) {
462 |                     maxCompletedTime = process.completedTime;
463 |                 }
464 |                 totalTurnaroundTime = totalTurnaroundTime + process.turnAroundTime;
465 |                 totalWaitingTime = totalWaitingTime + process.waitingTime;
466 |             });
467 | 
468 |             $('#avgTurnaroundTime').val( totalTurnaroundTime / completedList.length );
469 |             $('#avgWaitingTime').val( totalWaitingTime / completedList.length );
470 |             $('#throughput').val(completedList.length / maxCompletedTime);
471 |             
472 |         }    
473 |     }
474 | );


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!DOCTYPE html>
  2 | <html lang="en">
  3 | <head>
  4 |     <meta charset="UTF-8">
  5 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6 |     <title>CPU Scheduling Simulator</title>
  7 |     <link rel="stylesheet" href="style.css">
  8 |     <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
  9 |     <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
 10 |     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
 11 |     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
 12 |     <link rel="stylesheet" href="style.css">
 13 |     <script src="app.js" type="text/javascript"></script>
 14 | </head>
 15 | <body>
 16 |     <header>
 17 |         <nav class="navbar navbar-light bg-light">
 18 |             <span class="navbar-text">
 19 |                 CPU Scheduling Simulator
 20 |             </span>
 21 |         </nav>
 22 |     </header>
 23 |     <div class="container">
 24 |         
 25 |         <div class="row mb-5 pt-3" id="main">
 26 |             <div class="col-9 process-list-container">
 27 |                 <table class="table table-bordered" id="tblProcessList">
 28 |                     <thead>
 29 |                         <tr>
 30 |                             
 31 |                             <th scope="col">Process ID</th>
 32 |                             <th scope="col">Arrival Time</th>
 33 |                             <th scope="col">Burst Time</th>
 34 |                         </tr>
 35 |                     </thead>
 36 |                     <tbody>
 37 |                         
 38 |                     </tbody>
 39 |                 </table>
 40 |                 <div class="row">
 41 |                     <div class="col">
 42 |                         <input class="form-control mb-2" type="number" min="0" id="processID" placeholder="Process ID" required>
 43 |                     </div>
 44 |                     <div class="col">
 45 |                         <input class="form-control mb-2" type="number" min="0" id="arrivalTime" placeholder="Arrival Time">
 46 |                     </div>
 47 |                     <div class="col">
 48 |                         <input class="form-control mb-2" type="number" min="0" id="burstTime" placeholder="Burst Time">
 49 |                     </div>
 50 |                     <div class="col">
 51 |                         <button class="btn btn-primary" id="btnAddProcess">Add Process</button>
 52 |                     </div>
 53 |                 </div>
 54 |             </div>
 55 |             <div class="col-3 border border-primary p-3 mb-2">
 56 |                 <div class="form">
 57 |                     <div class="form-group">
 58 |                         <label for="algorithmSelector">Select Scheduling Method</label>
 59 |                         <select class="form-control" id="algorithmSelector">
 60 |                             <option value="optFCFS">First Come First Served</option>
 61 |                             <option value="optSJF">Shortest Job First</option>
 62 |                             <option value="optSRTF">Shortest Remaining Time First</option>
 63 |                             <option value="optRR">Round Robin</option>
 64 |                         </select>
 65 |                     </div>
 66 |                     <div class="form-group form-group-time-quantum">
 67 |                         <label class="mt-1  ">Time Quantum :</label>
 68 |                         <input class="form-control mb-2" type="number" min="0" max="9" id="timeQuantum" >
 69 |                     </div>
 70 |                     <div class="form-group">
 71 |                         <button class="btn btn-primary" id="btnCalculate">Calculate</button>
 72 |                     </div>
 73 |                 </div>
 74 |             </div>
 75 |         </div>
 76 |         <div class="row border-primary">
 77 |             <div class="col-md-9">
 78 |                 <table class="table table-bordered" id="tblResults">
 79 |                     <thead>
 80 |                         <tr>
 81 |                             <th scope="col">Process ID</th>
 82 |                             <th scope="col">Arrival Time</th>
 83 |                             <th scope="col">Burst Time</th>
 84 |                             <th scope="col">Completed Time</th>
 85 |                             <th scope="col">Waiting Time</th>
 86 |                             <th scope="col">Turnaround Time</th>
 87 |                         </tr>
 88 |                     </thead>
 89 |                     <tbody> 
 90 |                     </tbody>
 91 |                 </table>
 92 |             </div>
 93 |             <div class="col-md-3 border border-primary p-3 mb-2">
 94 |                 <div class="form">
 95 |                     <div class="form-group">
 96 |                         <label for="avgTurnaroundTime">Average Turnaround Time</label>
 97 |                         <input class="form-control" id="avgTurnaroundTime" type="number" placeholder="0" disabled>
 98 |                     </div>
 99 |                     <div class="form-group">
100 |                         <label for="avgTurnaroundTime">Average Waiting Time</label>
101 |                         <input class="form-control" id="avgWaitingTime" type="number" placeholder="0" disabled>
102 |                     </div>
103 |                     <div class="form-group">
104 |                         <label for="avgTurnaroundTime">Throughput</label>
105 |                         <input class="form-control" id="throughput" type="number" placeholder="0" disabled>
106 |                     </div>
107 |                 </div>
108 |             </div>
109 |         </div>
110 |     </div>
111 |     <footer class="page-footer bg-light p-2 mt-5">
112 | 
113 |         
114 |         <div class="footer-copyright text-center py-3">
115 |            <span>
116 |                Copyright &copy; Hirusha Cooray | 
117 |                <a target="_blank" href="https://github.com/hirushacooray/cpu-scheduling-sim">View Source on Github</a>
118 |            </span>
119 |         </div>
120 |     
121 |     </footer>
122 |     <script>
123 |         function isFacebookApp() {
124 |             var ua = navigator.userAgent || navigator.vendor || window.opera;
125 |             return (ua.indexOf("FBAN") > -1) || (ua.indexOf("FBAV") > -1);
126 |         }
127 | 
128 |         function openInBrowser(target, browserScheme) {
129 |             var ifc = document.createElement("div");
130 |             ifc.innerHTML = `<iframe src='${browserScheme}${target}' style='width:0;height:0;border:0; border:none;visibility: hidden;'></iframe>`;
131 |             document.body.appendChild(ifc);
132 |         }
133 |         if(isFacebookApp()){
134 |             // your action here if user using Facebook in-app browser
135 |             // alert('Are you using Facebook Browser? To get better experience, try press [...] and Open the blog in Chrome or Safari. Thank you!');
136 |             openInBrowser(window.location.href, "googlechrome://navigate?url=");
137 |         }
138 |     </script>
139 |     
140 | </body>
141 | </html>


--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | .buttonAlgo{
2 |     border-radius: 15px !important; 
3 |     width: 70px;
4 | }
5 | 
6 | #timeQuantum{
7 |   width: 80px;
8 | }


--------------------------------------------------------------------------------