forked from philipithomas/Queue_Simulator
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
127 lines (119 loc) · 5.61 KB
/
index.html
File metadata and controls
127 lines (119 loc) · 5.61 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Queue Simulator</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A tool for understanding customer ">
<meta name="author" content="Philip I. Thomas">
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<link href="custom/custom.css" rel="stylesheet">
<!-- Fav and touch icons -->
<link rel="shortcut icon" href="favicon.ico">
</head>
<body>
<div class="container">
<div class="row">
<div class="span3">
<div id="sidebar">
<div class="well">
<em>How many terminals do you need?</em>
<h3>Queue Simulator</h3>
<!-- Form -->
<div>Max Terminals:</div>
<input type="text" id="max_terminals" value="10" />
<div>Average Customers per Hour:</div>
<input type="text" id="arrival_input" value="60" />
<div>Average Terminal Service Time (Minutes):</div>
<input type="text" id="service_input" value="3.5" />
<div>Goal Customer Processing Time (Minutes):</div>
<input type="text" id="goal_service" value="5" />
<div class="btn btn-block btn-primary" id="simulate">Simulate</div>
<div href="#myModal" role="button" class="btn btn-block btn-info" data-toggle="modal">About
</div>
<div class="btn btn-block" id="reset">Reset</div>
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">About</h3>
</div>
<div class="modal-body">
<p>This program allows informed scheduling decisions about how many terminals to provision based on anticipated customer load. Based on input of number of customers expected in an hour and on how long, on average, it takes a terminal to process a customer, and the maximum time you want a customer to spend from when they enter the line to when they have finished at a terminal, the application recommends how many terminals to provision. </p>
<p>This data is applicable to situations where all customers form a single line for multiple terminals. Queues are simulated as <a href="https://en.wikipedia.org/wiki/M/M/c_queue">M/M/c queues</a>, meaning that the model assumes that customer arrivals are a Poisson process, and that service times are exponentially distributed. It also assumes that customers are served in the order they arrive.</p>
<h4>Terms:</h4>
<dl>
<dt>Average Customers per Hour</dt>
<dd>How many people are anticipated to join the queue during the hour.</dd>
<dt>Average Terminal Service Time</dt>
<dd>How long it takes a terminal to process somebody out.</dd>
<dt>Goal Customer Processing Time</dt>
<dd>The goal time it takes for a customer to finish being processed after they enter the queue.</dd>
<dt>Average Queue Length</dt>
<dd>The average number of customers in line, excluding those at a terminal.</dd>
<dt>Average Processing Time</dt>
<dd>How long, on average, it takes a customer from entering line to leaving the terminal.</dd>
<dt>Terminal Utilisation</dt>
<dd>Percentage of the time a terminal is busy.</dd>
</dl>
<a class="btn btn-block btn-inverse" href="https://github.com/philipithomas/Queue_Simulator">View original GitHub repo</a>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
</div>
</div>
</div>
<div class="span9">
<div id="output" class="hide">
<div>
<h2>Results<span id="rec_outer" class="hidden">: <span id="recommendation"></span> Terminals Recommended</span></h2>
<small><span id="arrival_display"></span> customers per hour with <span id="service_display"></span> minute service</small>
</div>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Number of Terminals</th>
<th>Average Queue Length</th>
<th>Average Processing Time <small>(minutes)</small></th>
<th>Terminal Utilisation</th>
<th></th>
</tr>
</thead>
<tbody id="results-tbody">
</tbody>
</table>
<template id="result-row-template">
<tr>
<td class="count"></td>
<td class="queue-length"></td>
<td class="processing-time"></td>
<td class="terminal-utilisation"></td>
<td><a href="#" role="button" class="btn btn-primary data-modal-trigger"
data-toggle="modal">Data</a>
<div class="data-modal modal hide fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×</button>
<h3 class="modal-label">Data</h3>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
</div>
</div>
</td>
</tr>
</template>
</div>
</div>
</div>
</div>
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<script src="custom/queue.js"></script>
</body>
</html>