-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathPathfinder.html
More file actions
122 lines (122 loc) · 4.8 KB
/
Pathfinder.html
File metadata and controls
122 lines (122 loc) · 4.8 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
<!DOCTYPE html><html class=''>
<head>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<meta charset='UTF-8'>
<meta name="robots" content="noindex">
<link rel = "icon" href = "icon.png" type="image/png" sizes="16x16">
<title>Pathfinder</title>
<style>
.body-font {
font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #fff;
/* font-size: 24px; */
}</style>
</head>
<body>
<script>
function random_bg_color() {
var x = Math.floor(Math.random() * 256);
var y = Math.floor(Math.random() * 256);
var z = Math.floor(Math.random() * 256);
var bgColor = "rgb(" + x + "," + y + "," + z + ")";
console.log(bgColor);
document.body.style.background = bgColor;
}
document.onload = random_bg_color();
document.body.addEventListener('click', function(e){
random_bg_color();
});
</script>
<div class="row">
<span class="col-sm-2"></span>
<span class="col-sm-8">
<div class="body-font" style="height: 100%; width: 100%;">
<h3 style="text-align: center;"><strong>Mission</strong></h1>
<p style="text-align: center;">
Due to the pandemic grocery stores have become extremely unsafe and its best to order things online.
However, not everyone can afford such luxuries. The Pathfinder project is for the people that need to
risk their lives to get supplies for survival.
</p>
</div>
</span>
<span class="col-sm-2"></span>
</div>
<div class="row">
<span class="col-sm-4"></span>
<span class="col-sm-4">
<form action="http://pathfinder.johnwack.com/cgi-bin/Pathfinder/Inventory.cgi">
<input type="hidden" name="Inventory" value="Inventory.txt">
<button type="submit" style="align-items: center; width: 100%; height: 100%; align-self: center; border-color: transparent; background-color: transparent;">
<image id="start" src="icon.png" style="width: 100%; height: 100%;"></image>
<h1 class="body-font"><strong>Pathfinder</strong><sup>α</sup></h1>
</button>
</form>
</span>
<span class="col-sm-4"></span>
</div>
<div class="row">
<span class="col-sm-6"></span>
</div>
<div class="row">
<span class="col-sm-2"></span>
<span class="col-sm-8" >
<div class="body-font">
<h3 style="text-align: center;"><strong>Solution</strong></h1>
<p style="text-align: center;">
An application that lets you fill your cart in like you would on Amazon
and then it would find the shortest path from the entrance, to all your items, to the exit.
This would minimize the time spent in the store thus decreasing the risk of infection.
</p>
</div>
</span>
<span class="col-sm-2"></span>
</div>
<div class="row">
<span class="col-sm-2"></span>
<span class="col-sm-8" >
<div class="body-font">
<h3 style="text-align: center;"><strong>Implementation</strong></h1>
<p style="text-align: center;">
Currently this program uses CGI to produce html pages to interact with a GUI.
I chose this approach as C++ is my strong suit and I learned CGI GUIs at Ohlone College.
I started off by writing a brute force algorithm that returns the shortest path after evaluating all routes.
I then optimized it so that once a the path being pursued exceeds the shortest path to the item, the path is abandoned.
This greatly improved the efficiency of the code.
</p>
</div>
</span>
<span class="col-sm-2"></span>
</div>
<div class="row">
<span class="col-sm-2"></span>
<span class="col-sm-8" >
<div class="body-font">
<h3 style="text-align: center;"><strong>Future Prospects</strong></h1>
<p style="text-align: center;">
I will keep working on this Project as I see its potential.
I hope to make the following changes:
</p>
<ul>
<li>Write a backend using NodeJS.</li>
<li>Completely rework the UI using React.</li>
<li>Rewrite the algorithm so that it uses loops instead of recursion in order to avoid stack overflow errors.</li>
<li>Get a more realistic map or partner with a store like walmart.</li>
<li>Refine the product and scale so that it can help millions of people.</li>
</ul>
</div>
</span>
<span class="col-sm-2"></span>
</div>
<div class="row">
<span class="col-sm-3"></span>
<span class="col-sm-6">
<p class="body-font">
<a href="#start">click the logo to begin, click here to go to the logo.</a>
</p>
</span>
<span class="col-sm-3"></span>
</div>
</body>
</html>