-
Notifications
You must be signed in to change notification settings - Fork 5
/
nirnroute.html
148 lines (137 loc) · 6.6 KB
/
nirnroute.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
<!DOCTYPE html>
<html><head>
<meta charset="UTF-8"/>
<link rel="icon" type="image/png" href="./favicon.ico"/>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<link rel="stylesheet" type="text/css" href="css/guide.css"/>
<link rel="stylesheet" type="text/css" href="css/nirnroute.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nirnroute — Interactive Oblivion Checklist</title>
</head>
<body class="fullscreenBody">
<!-- begin topbar-->
<div id="topbar" class="topbar">
<nav id="topbarNav" class="topbarNav">
<div class="topbarSection icon leftBorder">
<a href="https://prclive.run/"><img src="./images/prcbanner.png" style="width: 90px;"></a>
<div class="topbarSublist">
<a href="https://www.twitch.tv/prclive" class="topbarSection">Twitch</a>
<a href="https://www.youtube.com/c/prclive" class="topbarSection">YouTube</a>
<a href="https://discord.gg/eudsps7" class="topbarSection">Discord</a>
<a href="https://github.com/MichaelEbert/OblivionProgressTracker" class="topbarSection">GitHub</a>
<a href="https://twitter.com/_prclive" class="topbarSection">Twitter</a>
</div>
</div>
<div class="topbarSection">
<a href="./speedrun-guide.html">Guide</a>
<div class="topbarSublist">
<a href="./speedrun-guide.html">Speedrun Guide</a>
<a href="./casual.html">Casual Guide</a>
<a href="./speedrun-archive.html">Archive</a>
</div>
</div>
<a href="./checklist.html" class="topbarSection">Checklist</a>
<div class="topbarSection">
<a href="./map.html">Map</a>
<div class="topbarSublist">
<a href="./nirnroute.html">Nirnroute</a>
</div>
</div>
<div class="topbarSection">
<a href="https://prclive.run/wiki/Oblivion:Tools/Resources">Wiki/Tools</a>
<div class="topbarSublist">
<a href="https://prclive.run/wiki/Main_Page">Wiki</a>
<a href="./tools/tools.html">Tools</a>
<a href="https://prclive.run/wiki/Oblivion:Glitches/Tech">Glitches</a>
<a href="https://prclive.run/wiki/Oblivion:Tools/Resources">Tools/Resources Directory</a>
</div>
</div>
<a href="./settings.html" class="topbarSection icon" style="font-size: 0.85em;" title="Settings">⚙️</a>
<div class="topbarSection"><span class="totalProgressPercent">0</span>%</div>
</nav>
</div>
<!-- end topbar-->
<div class="contentContainer">
<div id="mapColumn" class="mainPanel" style="width: 68%;">
<div class="mapContainerOuter">
<div class="mapContainer" id="mapContainer">
<div id="mapSettingsContainer" style="display:none">
<label title="Shows all Locations that need to be discovered."><input type="checkbox" name="icon_selection" id="button_Location" checked >Locations</label>
<label title="Shows where all Nirnroot are in the overworld."><input type="checkbox" name="icon_selection" id="button_Nirnroot"/>Nirnroots</label>
<label title="Shows where all Wayshrines are in the overworld."><input type="checkbox" name="icon_selection" id="button_Wayshrine"/>Wayshrines/Heaven Stones</label>
<label title="Shows gates that can be seen from each location."><input type="checkbox" name="icon_selection" id="button_NearbyGates"/>Nearby Gates</label>
<br/>
<label><input type="radio" name="tsp_selection" id="button_tspNone" title="The fastest way to visit each location"/>No TSP</label>
<label><input type="radio" name="tsp_selection" id="button_tspLocation" title="The fastest way to visit each location"/>Location TSP</label>
<label><input type="radio" name="tsp_selection" id="button_tspNirnroot" title="The fastest way to visit each nirnroot"/>Nirnroot TSP</label>
<br/>
<label><input type="checkbox" id="mapShowPrediscovered" class="autosetting">Show prediscovered locations</label>
<label><input type="checkbox" id="mapShowDistanceCheck" class="autosetting">Show distance between locations</label>
<label><input type="checkbox" id="mapShowFormId" class="autosetting">Show formID on map</label>
<label><input type="checkbox" id="mapShowNonGates" class="autosetting">Show non-gate locations</label>
</div>
<div id="wrapper_Map" class="mapWrapper">
<button id="showSettingsButton" style="position:absolute">Show Settings</button>
</div>
</div>
</div>
</div>
<div class="resizer" id="dragMe"></div>
<div class="sidePanel scrollablePanel">
<div id="sidebar" style="margin: 0.5em">
<!-- sidebar contains images n navigation n stuff.-->
<h1 id="nirnName">Nirnroot Title</h1> <span class= "h3" style="float:right">Nirnroots Found: <span id="overview_nirnroot" class="nirnroot">##</span></span>
<br/>
<button id="prevButton" title="left arrow">Prev</button><button id="nextButton" title="right arrow">Next</button> <label>Jump to <input type="number" id="nirnIdField"/></label>
<br/>
<span id="closeTo"></span>
<br/>
<span id="instructions"></span>
<h2>Far image</h2>
<a href="" id="farImageHyperlink"><img src="./data/minipages/in-game-placeholder.png" id="farImage" alt="far image"></a>
<h2>Close image</h2>
<a href="" id="closeImageHyperlink"><img src="./data/minipages/in-game-placeholder.png" id="closeImage" alt="close image"></a>
</div>
</div>
</div>
<script type="module">
//normally, we can't call module code from non-module code.
//exportNamespace appends everything to window, so it can be called like normal js code.
import exportNamespace from './js/module-shim.mjs'
import * as userdata from './js/userdata.mjs'
import * as obliviondata from './js/obliviondata.mjs'
import * as map from './js/map.mjs';
import * as point from './js/map/point.mjs';
import * as nirn from './js/nirnroute.mjs';
import * as sharing from './js/sharing.mjs';
import * as progress from './js/progressCalculation.mjs';
window.debug = userdata.loadCookie("debug");
var additionalSettingsShown = false;
window.showHideMapSettings = function(){
const mapSettingsContainer = document.getElementById("mapSettingsContainer");
const showHideButton = document.getElementById("showSettingsButton");
if(!additionalSettingsShown){
mapSettingsContainer.style.display = "unset";
showHideButton.innerText = "Hide Settings"
additionalSettingsShown = true;
}
else{
mapSettingsContainer.style.display = "none";
showHideButton.innerText = "Show Settings";
additionalSettingsShown = false;
}
};
(function(){
document.getElementById("showSettingsButton").addEventListener('click', showHideMapSettings);
obliviondata.loadJsonData().then(()=>{
userdata.loadProgressFromCookie();
nirn.init();
document.getElementById("mapShowPrediscovered").addEventListener('change',()=>{map.draw();});
progress.recalculateProgress();
sharing.initSharingFeature();
});
}).call(window);
</script>
<script src="dragging.js"></script>
</body>
</html>