Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
262 lines (228 loc) · 20.4 KB
/
Copy pathindex.html
File metadata and controls
262 lines (228 loc) · 20.4 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
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
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>LM2 Rank Calculator</title>
<meta name="description" content="Calculates your rank for Luigi's Mansion 2: Dark Moon.">
<meta name="author" content="blueYOSHMIN">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" sizes="72x72" href="./logo/transparent-72px.png" />
<link rel="icon" sizes="32x32" href="./logo/32px.png" />
<link rel="icon" sizes="16x16" href="./logo/16px.png" />
<link rel="manifest" href="manifest.json" />
<!-- Apple specific icons: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html -->
<link rel="apple-touch-icon" sizes="152x152" href="./logo/152px.png">
<link rel="apple-touch-icon" sizes="167x167" href="./logo/167px.png">
<link rel="apple-touch-icon" sizes="180x180" href="./logo/180px.png">
<link rel="apple-touch-icon" href="./logo/120px.png" />
<!-- Apple exclusive tags: https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes" /> <!-- Apparently deprecated but Apple still mentions it on their website???? I dunno? I'm still keeping it? -->
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no">
<!-- OpenGraph data: https://ogp.me/ -->
<meta property="og:title" content="Luigi's Mansion 2: Rank Calculator" />
<meta property="og:description" content="Calculates your rank for Luigi's Mansion 2: Dark Moon." />
<meta property="og:type" content="games" />
<meta property="og:url" content="lm2rank.yoshmin.com" />
<meta property="og:image" content="https://lm2rank.yoshmin.com/logo/thumbnail.png" />
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="LM2 Rank Calculator" />
<meta name="twitter:description" content="Calculates your rank for Luigi's Mansion 2: Dark Moon." />
<meta name="twitter:image" content="https://lm2rank.yoshmin.com/logo/thumbnail.png">
<!-- Mastodon stuff -->
<!--a rel="me" href="https://wetdry.world/@blueYOSHMIN">Mastodon</a-->
<meta name="fediverse:creator" content="@blueYOSHMIN@wetdry.world">
<link href="./css/style.css" rel="stylesheet" />
<link href="./css/luigiInput.css" rel="stylesheet" />
<link href="./css/progressBar.css" rel="stylesheet" />
<link href="./css/navbar.css" rel="stylesheet" />
<link href="./css/levelSelect.css" rel="stylesheet" />
<script type="text/javascript" defer src="./script.js"></script>
<style type="text/css"> /* In here to avoid chaining resources, meaning the browser doesn't have to download style.css and *then* the font. */
@font-face {
font-family: "Ad Lib";
font-display: block;
src:
/*local("Ad Lib"), /* Fuck if I know, it's on my computer and the browser doesn't ever use it, that's why I added the file here in the first place */
url("./Adlib.ttf") format("opentype");
}
</style>
</head>
<body>
<div id="backgroundElement"> <div id="siteContainer"> <div id="contentContainer">
<noscript><div id="noscript">
<span></span><span></span><span></span><span></span>
<b>NOTE:</b> This site requires JavaScript to work properly. You can still look at each level's goal scores but the calculator will not work. <br /> <br />
Also note that this site uses zero dependecies, zero analytics/ad-stuff or whatnot. This site <i>is</i> hosted on Github but the site itself does not use anything.
</div></noscript>
<main>
<img src="./img/time.png" class="scoreIcons" alt="" /> <span>Clear Time: <luigi-input type="number" id="timeH" min="0" value="0"></luigi-input>:<luigi-input type="number" id="timeMin" min="0" max="60" pad="2" value="0"></luigi-input>:<luigi-input type="number" id="timeS" min="0" max="60" pad="2" value="0"></luigi-input> </span> <br />
<img src="./img/ghosts.png" class="scoreIcons" alt="" /> <span>Ghosts Captured: <luigi-input type="number" id="ghostsCaptured" min="0" value="0"></luigi-input> </span> <br />
<img src="./img/health.png" class="scoreIcons" alt="" /> <span>Health lost: <luigi-input type="number" id="healthLost" min="0" value="0"></luigi-input> </span> <br />
<img src="./img/treasure.png" class="scoreIcons" alt="" /> <span>Collected Treasure: <luigi-input type="number" id="collectedTreasure" min="0" value="0"></luigi-input> </span> <br />
<br /><br />
<div id="progressIndicators">
<span id="bronzeIndicator" class="rankIndicators">
<img class="rankIndicatorIcons" src="./img/bronze.png" alt="Bronze/1-Star icon" /> <br />
<luigi-input type="number" id="bronzeGoal" value="-1000" aria-label="bronze goal score" disabled></luigi-input> <br />
<span class="rankIndicatorArrow"></span>
</span>
<span id="silverIndicator" class="rankIndicators">
<img class="rankIndicatorIcons" src="./img/silver.png" alt="Silver/2-Star icon" /> <br />
<luigi-input type="number" id="silverGoal" value="0" aria-label="silver goal score"></luigi-input> <br />
<span class="rankIndicatorArrow"></span>
</span>
<span id="goldIndicator" class="rankIndicators">
<img class="rankIndicatorIcons" src="./img/gold.png" alt="Gold/3-Star icon" /> <br />
<luigi-input type="number" id="goldGoal" value="1000" aria-label="gold goal score"></luigi-input> <br />
<span class="rankIndicatorArrow"></span>
</span>
</div>
<div id="progressContainer"><div id="progressBarContainer"><div id="progressBar"></div></div></div>
<div id="finalScoreContainer">
<div id="finalScoreDisplay">
<span id="finalScoreArrow" class="rankIndicatorArrow"></span>
<span id="totalScoreText">Score:</span>
<luigi-input type="number" id="finalScore" value="435" aria-label="your score" disabled></luigi-input>
</div>
</div>
<!--div id="result"> <img src="./img/ghosts.png" class="scoreIcons" /> <span id="ghostsResult" class="resultItem">6</span> x 120 + <img src="./img/treasure.png" class="scoreIcons" /> <span id="treasureResult" class="resultItem">556</span>G - <img src="./img/time.png" class="scoreIcons" /><span id="timeSResult" class="resultItem">721</span>s - <img src="./img/health.png" class="scoreIcons" /><span id="healthResult" class="resultItem">20</span> x 6 = <span id="scoreResult">435</span> </div> <br /><br /-->
<button class="calcButton" onclick="rankCalc();">Calculate!</button>
<br /><br /><br />
<div id="navbar">
<span class="navbar_selected" tabindex="0" onclick="selectNavbarEntry(this.getAttribute('data-navbarentry'));" data-navbarentry="levelSelect">Levels</span>
<span tabindex="0" onclick="selectNavbarEntry(this.getAttribute('data-navbarentry'));" data-navbarentry="explanation">Tips</span>
<span tabindex="0" onclick="selectNavbarEntry(this.getAttribute('data-navbarentry'));" data-navbarentry="credits" >Credits</span>
</div>
<div id="levelSelectContainer">
<div> <!-- -G on the bonus levels stands for "Ghost" -->
<span>
<div data-level="A-1" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>A-1</span> <span class="levelSelect_scoreContainer"><span> 0</span>|<span>1000</span></span> </div>
<div data-level="A-2" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>A-2</span> <span class="levelSelect_scoreContainer"><span> 600</span>|<span>2000</span></span> </div>
<div data-level="A-3" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>A-3</span> <span class="levelSelect_scoreContainer"><span> -200</span>|<span> 800</span></span> </div>
<div data-level="A-4" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>A-4</span> <span class="levelSelect_scoreContainer"><span> 200</span>|<span>1400</span></span> </div>
<div data-level="A-5" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>A-5</span> <span class="levelSelect_scoreContainer"><span> 0</span>|<span>1000</span></span> </div>
<div data-level="A-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>A-<img src="./img/levelBoss_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span>-1000</span>|<span>-200</span></span> </div>
<div data-level="A-G" class="levelSelect_level levelSelect_Bonus" tabindex="0" onclick="selectLevel(this)">
<span>A-<img src="./img/levelBonus_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 1500</span>|<span>2400</span></span> </div>
</span>
<span>
<div data-level="B-1" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>B-1</span> <span class="levelSelect_scoreContainer"><span> 500</span>|<span>1400</span></span> </div>
<div data-level="B-2" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>B-2</span> <span class="levelSelect_scoreContainer"><span> 1000</span>|<span>2200</span></span> </div>
<div data-level="B-3" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>B-3</span> <span class="levelSelect_scoreContainer"><span> -600</span>|<span> 600</span></span> </div>
<div data-level="B-4" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>B-4</span> <span class="levelSelect_scoreContainer"><span> 400</span>|<span>1600</span></span> </div>
<div data-level="B-5" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>B-5</span> <span class="levelSelect_scoreContainer"><span> 200</span>|<span>1400</span></span> </div>
<div data-level="B-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>B-<img src="./img/levelBoss_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> -500</span>|<span>-200</span></span> </div>
<div data-level="B-G" class="levelSelect_level levelSelect_Bonus" tabindex="0" onclick="selectLevel(this)">
<span>B-<img src="./img/levelBonus_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 600</span>|<span>1400</span></span> </div>
</span>
<span>
<div data-level="C-1" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>C-1</span> <span class="levelSelect_scoreContainer"><span> 600</span>|<span>2000</span></span> </div>
<div data-level="C-2" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>C-2</span> <span class="levelSelect_scoreContainer"><span> 1200</span>|<span>2800</span></span> </div>
<div data-level="C-3" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>C-3</span> <span class="levelSelect_scoreContainer"><span> 600</span>|<span>1400</span></span> </div>
<div data-level="C-4" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>C-4</span> <span class="levelSelect_scoreContainer"><span> 0</span>|<span> 400</span></span> </div>
<div data-level="C-5" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>C-5</span> <span class="levelSelect_scoreContainer"><span> 1600</span>|<span>3200</span></span> </div>
<div data-level="C-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>C-<img src="./img/levelBoss_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 1600</span>|<span>2200</span></span> </div>
<div data-level="C-G" class="levelSelect_level levelSelect_Bonus" tabindex="0" onclick="selectLevel(this)">
<span>C-<img src="./img/levelBonus_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 1400</span>|<span>2200</span></span> </div>
</span>
<span>
<div data-level="D-1" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>D-1</span> <span class="levelSelect_scoreContainer"><span> 1200</span>|<span>2200</span></span> </div>
<div data-level="D-2" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>D-2</span> <span class="levelSelect_scoreContainer"><span> 200</span>|<span>1400</span></span> </div>
<div data-level="D-3" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>D-3</span> <span class="levelSelect_scoreContainer"><span> 0</span>|<span>1200</span></span> </div>
<div data-level="D-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>D-<img src="./img/levelBoss_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> -400</span>|<span>-100</span></span> </div>
<div data-level="D-G" class="levelSelect_level levelSelect_Bonus" tabindex="0" onclick="selectLevel(this)">
<span>D-<img src="./img/levelBonus_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 1200</span>|<span>2000</span></span> </div>
</span>
<span>
<div data-level="E-1" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>E-1</span> <span class="levelSelect_scoreContainer"><span> 600</span>|<span>2200</span></span> </div>
<div data-level="E-2" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>E-2</span> <span class="levelSelect_scoreContainer"><span> 1200</span>|<span>2800</span></span> </div>
<div data-level="E-3" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>E-3</span> <span class="levelSelect_scoreContainer"><span> -400</span>|<span>1400</span></span> </div>
<div data-level="E-4" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>E-4</span> <span class="levelSelect_scoreContainer"><span>-1000</span>|<span>-200</span></span> </div>
<div data-level="E-5" class="levelSelect_level" tabindex="0" onclick="selectLevel(this)">
<span>E-5</span> <span class="levelSelect_scoreContainer"><span> 4000</span>|<span>7000</span></span> </div>
<div data-level="E-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>E-<img src="./img/levelBoss_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> -800</span>|<span>-200</span></span> </div>
<div data-level="E-G" class="levelSelect_level levelSelect_Bonus" tabindex="0" onclick="selectLevel(this)">
<span>E-<img src="./img/levelBonus_blue.png" /></span></span><span class="levelSelect_scoreContainer"><span> 1400</span>|<span>2200</span></span> </div>
</span>
<span>
<div data-level="F-B" class="levelSelect_level levelSelect_Boss" tabindex="0" onclick="selectLevel(this)">
<span>Final</span> <span class="levelSelect_scoreContainer"><span>-1400</span>|<span>-200</span></span> </div>
</span>
</div>
</div>
<div id="explanationContainer">
<!-- Not using <p> tags because they're utterly worthless with a list inside them as they always forcefully end before the list. -->
The formula for calculating the rank is as follows: <br />
<code>Captured Ghosts x 120 + Collected Treasure - Time in Seconds - Health Lost * 6</code><br /><br />
This means:
<ul style="margin-top: 0px; margin-bottom: 10px;">
<li>A ghost is worth 2 minutes</li>
<li>One gold coin is worth 1 second, a note 5 seconds and a gold bar 20 seconds</li>
<li>You have to be 6s faster to make up for each lost health point</li>
</ul><br /><br />
The strategy to get a 3-star rank usually comes down to getting some gold, being fast and capturing ghosts in the ideal way.<br /><br />
Capturing multiple ghosts at once gives an additional gold bar for each ghost.<br />Capturing a ghost with a surge gives the following:
<ul style="margin: 0px;">
<li>A <span class="lvl1Surge">level 1 surge</span> drops 3 coins</li>
<li>A <span class="lvl2Surge">level 2 surge</span> drops a gold bar</li>
<li>A <span class="lvl3Surge">level 3 surge</span> drops 3 whole gold bars</li>
</ul>
So the goal is to always capture multiple ghosts at once and to capture them with a surge.<br />Greenies can barely be captured with a <span class="lvl2Surge">level 2 surge</span>, all other ghosts can be captured with a <span class="lvl3Surge">level 3 surge</span>.<br /><br />
Knowing gold locations tends to not be too important, you usually only need to get the obvious gold locations on the way and look up whether the level has Gold Greenies (<a href="https://www.mariowiki.com/Gold_Greenie#Locations" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Mariowiki list</a>) or a Bonus Challenge (<a href="https://www.mariowiki.com/Bonus_challenge_(Luigi%27s_Mansion:_Dark_Moon)" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Mariowiki list</a>) as those give a lot of points.<br /><br />
Catching a boo usually doesn't matter either way, they give roughly enough coins to make up the time spent on catching them. Get them if you need them, otherwise ignore them.<br />
Gems on the other hand are a de-facto waste as they don't give any points. You can still get them if you need them though, most levels are lenient enough for that.
</div>
</main>
<footer>
<div id="creditsContainer">
<ul>
<li>Hosted on <a href="https://github.com/blueYOSHI9000/LM2-Rank-Calculator" target="_blank" rel="me" referrerpolicy="no-referrer">Github</a></li>
<li>Created by blueYOSHMIN
<ul>
<li>Mastodon: <a rel="me" referrerpolicy="no-referrer" href="https://wetdry.world/@blueYOSHMIN">@blueYOSHMIN@wetdry.world</a></li>
<li>Bluesky: <a href="https://bsky.app/profile/yoshmin.com" target="_blank" rel="me" referrerpolicy="no-referrer">@yoshmin.com</a></li>
</ul>
</li>
</ul>
<ul>
<li>Score calculations & list of score requirements: posted on <a href="https://www.reddit.com/r/LuigisMansion/comments/1cp0ah6/comment/l3om03i/" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">reddit by u/RealDhranios</a></li>
<li>(Logo-) Background image: Next-Level Games & Nintendo, archived by <a href="https://www.mariowiki.com/File:GloomymansionLMDM.jpg" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Mariowiki</a> (<a href="https://www.mariowiki.com/File:Lmdmart9.jpg" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Logo background</a>)</li>
<li>Sprites: ripped by CHEMI6DER & DogToon64; <a href="https://www.spriters-resource.com/3ds/luigismansion2/sheet/122133/" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Sheet 1</a>, <a href="https://www.spriters-resource.com/3ds/luigismansion2/sheet/122134/" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Sheet 2</a>, <a href="https://www.spriters-resource.com/3ds/luigismansion2/sheet/122136/" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Sheet 3</a></li>
<li>Adlib font: gotten from <a href="https://www.fontspace.com/adlib-font-f157" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">fontspace</a>, originally made by Freeman Craw for ATF</li>
<li>LM-styled buttons & look: by Temani Afif on <a href="https://stackoverflow.com/questions/59813538/css-custom-shape-with-irregular-rectangle-and-border" target="_blank" rel="noreferrer" referrerpolicy="no-referrer">Stackoverflow</a></li>
</ul>
</div>
</footer>
</div></div></div>
</body>