-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathascendancyResearch.html
202 lines (183 loc) · 8.75 KB
/
ascendancyResearch.html
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
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<html>
<head>
<title>Ascendancy Research</title>
<link href="ascendancyResearch.css" rel="stylesheet">
</head>
<body onload="refreshRequirements()">
<script type="text/javascript" src="ascendancyDependancy.json"></script>
<script type="text/javascript" src="ascendancyResearch.js"></script>
<script type="text/javascript">
var text = ascendancyDependancyData.replace(/'/g, '"');
//alert(text);
var ascendancyDependancy = JSON.parse(text);
//alert(ascendancyDependancy["Superconductivity"]["requires"]);
var graph = new Graph(ascendancyDependancy);
//graph.printGraph();
//console.log("-- Results for Interplanetary Exploration:");
//console.log(graph.bfs("Interplanetary Exploration"));
//console.log(graph.getResearchForItem("Nanomanipulator"));
//console.log(graph.bfs("Nanofocusing"));
var myResults = document.getElementById("results")
var research_completed = [];
// TODO: Add a box that lists researched items
// Allow click to remove or button to purge
function researched(row){
row.classList.toggle("researched")
var clicked_research = row.cells[0].innerHTML
if(research_completed.includes(clicked_research)) {
var index = research_completed.indexOf(clicked_research);
console.log("removing " + research_completed[index]);
research_completed.splice(index, 1);
} else {
research_completed.push(row.cells[0].innerHTML);
}
// Build researched box
var htmlCode = [];
htmlCode.push("<b>Completed research:</b><hr /><table>");
for (i = 0; i < research_completed.length; i++) {
var researched_item = "<tr class=\"researched\" onclick=\"researched(this)\"><td>" + research_completed[i] + "</td></tr>";
htmlCode.push(researched_item);
}
htmlCode.push("</table>");
var researched_box = document.getElementById("researched");
researched_box.innerHTML = htmlCode.join('');
refreshRequirements();
}
function logslider(position) {
/* https://stackoverflow.com/questions/846221/logarithmic-slider */
// position will be between 0 and 100
var minp = 1;
var maxp = 1000;
// The result should be between 1 an 2000
var minv = Math.log(1);
var maxv = Math.log(2000);
// calculate adjustment factor
var scale = (maxv-minv) / (maxp-minp);
return Math.ceil(Math.exp(minv + scale*(position-minp)));
}
function refreshRequirements(){
var search_research_box = document.getElementById("search_research");
var results_box = document.getElementById("results");
// Single quotes need to be escaped
var results = graph.bfs(search_research_box.value, research_completed);
if(typeof results[0] === "undefined"){
results_box.innerHTML = "";
return "";
}
var total_days = 0;
var htmlCode = [];
var slider = document.getElementById("slider_bar");
var slider_value = logslider(parseInt(slider.value));
htmlCode.push("<b>Required research for " + search_research_box.value + ":</b><hr />");
htmlCode.push("<table><tr><th>Research Name</th><th>Days</th><th>Items Enabled</th></tr>");
for (i = 0; i < results.length; i++)
{
//console.log(i + " " + results[i]);
//if(typeof results[i] !== 'undefined'){
total_days = total_days + parseInt(results[i]["days"]);
scaled_days = Math.ceil(results[i]["days"]/slider_value);
var already_researched = research_completed.includes(results[i]["name"])
var row = "<tr id=\"row" + i + "\" onclick=\"researched(this)\" " + ( already_researched ? "class=\"researched\"" : "") + ">" +
"<td>" + results[i]["name"] + "</td>" +
"<td>" + scaled_days + "</td>" +
"<td>" + results[i]["items"] + "</td></tr>"
htmlCode.push(row);
//}
}
htmlCode.push("</table>");
var scaled_total_days = Math.ceil(total_days/slider_value);
results_box.innerHTML = htmlCode.join('').replace('</b>',' (' + scaled_total_days + ' total days)');
}
function researchRequirement(e){
// User clicked on the research requirement
// Copy it to the search_research box and find results
if(e.value == "") return;
refreshRequirements();
}
function applyHighlight(row){
var highlighted = document.getElementsByClassName("highlighted");
for(var i = 0; i < highlighted.length; i++)
{
highlighted.item(i).classList.toggle("highlighted");
}
row.classList.toggle("highlighted");
}
function selectItem(item){
// User clicked on a suggestion
// Insert it into the item search box and find results
var search_item_box = document.getElementById("search_item");
var research_box = document.getElementById("search_research");
search_item_box.value = item.innerHTML;
applyHighlight(item);
research_box.value = graph.getResearchForItem(item.innerHTML);
researchRequirement(research_box);
}
function selectResearch(research){
// User clicked on a suggestion
// Insert it into the item search box and find results
var search_item_box = document.getElementById("search_item");
var research_box = document.getElementById("search_research");
search_item_box = "";
applyHighlight(research);
research_box.value = research.innerHTML;
researchRequirement(research_box);
}
function onItemChanged(e){
// null out associated research requirement
var itemRequires = document.getElementById("search_research");
itemRequires.value = "";
if(e.value == "") return;
// get relevant items
var myOptions = document.getElementById("options_list");
var similarItems = graph.getSimilarItems(e.value);
var htmlCode = [];
htmlCode.push("<b>Similar items (click one):</b><span style=\"float:right; border:1px solid black; padding:2px; margin:-2px; cursor: pointer;\" onclick=\"this.parentElement.style.display='none'\">X</span><hr />");
for (i = 0; i < similarItems.length; i++)
{
htmlCode.push("<span class=\"clickable\" id=\"" + i + "\" onclick=\"selectItem(this)\">" + similarItems[i] + "</span><br />")
}
myOptions.innerHTML = (htmlCode).join('');
myOptions.style.backgroundColor = 'green';
myOptions.style.display = 'block';
}
function onResearchChanged(e){
// null out associated research requirement
var item = document.getElementById("search_item");
item.value = "";
if(e.value == "") return;
// get relevant items
var myOptions = document.getElementById("options_list");
var similarResearch = graph.getSimilarResearch(e.value);
var htmlCode = [];
htmlCode.push("<b>Similar research (click one):</b><span style=\"float:right; border:1px solid black; padding:2px; margin:-2px; cursor: pointer;\" onclick=\"this.parentElement.style.display='none'\">X</span><hr />");
for (i = 0; i < similarResearch.length; i++)
{
htmlCode.push("<span class=\"clickable\" id=\"" + i + "\" onclick=\"selectResearch(this)\">" + similarResearch[i] + "</span><br />")
}
myOptions.innerHTML = (htmlCode).join('');
myOptions.style.backgroundColor = 'blue';
myOptions.style.display = 'block';
}
</script>
<div id="header"><h1>Ascendancy Research Requirements</h1></div>
<div><span style="float:right; border:1px solid white; padding:2px; margin:-2px; cursor: pointer;" onclick="this.parentElement.style.display='none'">X</span>
<p><a href="https://en.wikipedia.org/wiki/Ascendancy_(video_game)" title="Ascendancy on Wikipedia">Ascendancy</a> is a turn-based strategy PC game from the 1990s. One aspect of the game is incremental research. This tool lets the user search for items or research fields and provides the required fields to enable the desired item. Enter a desired item or research field in one of the text fields below.</p><p>Requirements data courtesy of the <a href="https://www.b-sting.nl/ascendancy/research-list.html" title="research list at Ascendancy: The Manual">Ascendancy Manual at b-sting.nl</a>. As of this writing, Ascendancy is not available for purchase at Good Old Games, but <a href="https://www.gog.com/wishlist/games/ascendancy" title="Ascendancy at GoG">a wishlist entry is posted at the GoG forum</a>.</p>
</div>
<div id="input" style="display: block;width:100%;margin-top:50px;"><hr />
<form name="mapper">
<input type="text" name="search_item" id="search_item" onkeyup="onItemChanged(this)" onfocus="this.select()" value="item" title="Enter an item name here">
<input type="text" name="search_research" id="search_research" onclick="researchRequirement(this)" onkeyup="onResearchChanged(this)" onfocus="this.select()" value="research" title="Enter an research field name here"><br />
<hr />
</form>
</div>
<div class="slidecontainer">
<input type="range" min="1" max="1000" value="1" class="slider" id="slider_bar" oninput="refreshRequirements()" title="Scaling factor for day counts">
</div>
<div id="options_list" style="float:left; border:1px solid black; padding:10px;display: block;">
</div>
<div id="results" style="float:left; border:1px solid black;padding:10px;display: block;">
</div>
<div id="researched" style="float:left; border:1px solid black;padding:10px;display: block;">
</div>
</body>
</html>