forked from ckabalan/mict.spectralcoding.com
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
216 lines (215 loc) · 12.8 KB
/
index.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
203
204
205
206
207
208
209
210
211
212
213
214
215
216
<!doctype html>
<html lang="en">
<head>
<!-- Sorry, I know, privacy concerns. I just really want to know what my page views are... -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-R9J2M2C18Q"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-R9J2M2C18Q');
</script>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
<link rel="icon" href="img/checklist.svg" sizes="any" type="image/svg+xml">
<title>Melvor Idle Completionist Tool</title>
<meta name="description" content="The Melvor Idle Completionist Tool accepts a user's Melvor Idle Save Data Export and displays the remaining items, pets, and monsters needed to complete the game.">
<meta name="robots" content="index, follow" />
<style>
a:hover {
text-decoration:none;
}
.card-header {
padding-top: 0.375rem;
padding-right: 0.625rem;
padding-bottom: 0.375rem;
padding-left: 0.625rem;
}
.card-header .btn {
padding-top: 0.1875rem;
padding-right: 0.375rem;
padding-bottom: 0.1875rem;
padding-left: 0.375rem;
}
#missingTabContent {
padding-bottom: 0px !important;
}
#logo {
cursor: pointer !important;
}
.card-header {
cursor: pointer !important;
}
.table img {
width: 1.5rem;
height: 1.5rem;
margin-right: 0.3rem;
}
#tableItems .item-source img {
margin-left: 1.5rem;
}
.table th {
border-top: none;
padding-top: 0px;
}
td {
word-wrap:break-word;
}
#filterWrap {
width: 33%;
}
@media screen and (max-width: 576px) {
/* Make form-control be form-control-sm on screens where we shrink other items. */
.form-control {
height: calc(1.5em + .5rem + 2px);
padding: .25rem .5rem;
font-size: .875rem;
line-height: 1.5;
border-radius: .2rem;
}
}
</style>
</head>
<body class="bg-light">
<div class="container container-sm">
<div class="pb-3 text-center">
<img class="d-block mx-auto my-3" src="img/checklist.svg" alt="MICT Logo" height="150" id="logo" />
<h1>Melvor Idle Completionist Tool</h1>
</div>
<div class="form-group mb-2">
<label for="saveImport">Paste your Melvor Idle save export below...
<a class="text-secondary" target="_blank" href="#helpModal" data-toggle="modal" data-target="#helpModal">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-question-circle" viewBox="0 0 16 16">
<path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
<path d="M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z"/>
</svg>
</a>
</label>
<textarea class="form-control" id="saveImport" rows="3" spellcheck="false"></textarea>
</div>
<div class="alert alert-danger mb-1 py-1 px-2 d-none" role="alert" id="saveLoadAlert"></div>
<div id="missingWrapper" class="d-none">
<ul class="nav nav-tabs text-wrap" id="missingTab" role="tablist">
<li class="nav-item">
<a class="nav-link text-wrap active px-sm-3 py-sm-2 px-2 py-1" id="items-tab" data-toggle="tab" href="#tabItems" role="tab" aria-controls="tabItems" aria-selected="true">Items</a>
</li>
<li class="nav-item">
<a class="nav-link text-wrap px-sm-3 py-sm-2 px-2 py-1" id="pets-tab" data-toggle="tab" href="#tabPets" role="tab" aria-controls="tabPets" aria-selected="false">Pets</a>
</li>
<li class="nav-item">
<a class="nav-link text-wrap px-sm-3 py-sm-2 px-2 py-1" id="monsters-tab" data-toggle="tab" href="#tabMonsters" role="tab" aria-controls="tabMonsters" aria-selected="false">Monsters</a>
</li>
<li class="nav-item ml-auto" id="filterWrap">
<input type="text" class="form-control px-sm-3 py-sm-2 px-1 py-0" placeholder="Filter..." aria-label="Filter" id="filter">
</li>
</ul>
<div class="tab-content bg-white p-2 border-right border-bottom border-left mb-2" id="missingTabContent">
<div class="tab-pane fade show active" id="tabItems" role="tabpanel" aria-labelledby="items-tab">
<table class="table mb-0 table-sm" style="border-top:none;" id="tableItems">
<thead>
<tr>
<th scope="col" class="d-none d-sm-table-cell-none d-md-table-cell">ID</th>
<th scope="col">Item Name</th>
<th scope="col">Source</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="tab-pane fade" id="tabPets" role="tabpanel" aria-labelledby="pets-tab">
<table class="table mb-0 table-sm" style="border-top:none;" id="tablePets">
<thead>
<tr>
<th scope="col" class="d-none d-sm-table-cell-none d-md-table-cell">ID</th>
<th scope="col">Pet Name</th>
<th scope="col">Acquired From</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<div class="tab-pane fade" id="tabMonsters" role="tabpanel" aria-labelledby="monsters-tab">
<table class="table mb-0 table-sm" style="border-top:none;" id="tableMonsters">
<thead>
<tr>
<th scope="col" class="d-none d-sm-table-cell-none d-md-table-cell">ID</th>
<th scope="col">Monster Name</th>
<th scope="col">Zone</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
<div class="float-right mb-2">
<a class="text-secondary" href="https://github.com/ckabalan/mict.spectralcoding.com" target="_blank">Contribute</a> | <a class="text-secondary" href="https://github.com/ckabalan/mict.spectralcoding.com/issues" target="_blank">Feedback</a> | <a class="text-secondary" href="#creditsModal" data-toggle="modal" data-target="#creditsModal">Credits</a>
</div>
<div class="modal fade" id="helpModal" tabindex="-1" role="dialog" aria-labelledby="helpModalLongTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="helpModalLongTitle">How To Retrieve Save Data</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Melvor Idle makes your entire character's configuration (skills, masteries, etc) available as a convenient export. The Melvor Idle Completionist Tool uses this data export to determine what is necessary to complete the game. Instructions for retrieving your Save Export data is below.<br/>
<br/>
<ol>
<li>In Melvor Idle load your character</li>
<li>In the left sidebar select Settings near the bottom</li>
<li>Scroll to the bottom of the Settings page and click the "Import / Export Save" button</li>
<li>In the popup window click the "Export Save" button</li>
<li>Copy the newly generated content in the box below Export Save. This is your Save Export data</li>
<li>Paste the data into the large box on this tool's homepage</li>
</ol>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="creditsModal" tabindex="-1" role="dialog" aria-labelledby="creditsModalLongTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="creditsModalLongTitle">Melvor Idle Completionist Tool Credits</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Developed by <a href="https://www.caesarkabalan.com/" target="_blank">Caesar Kabalan</a> with help from <a href="https://github.com/ckabalan/mict.spectralcoding.com/graphs/contributors" target="_blank">GitHub Contributors</a>!<br/>
Special thanks to <a href="https://wiki.melvoridle.com/index.php/Malcs_(aka_MrFrux)" target="_blank">Malcs (aka MrFrux)</a> for making this awesome game! Support him <a href="https://www.patreon.com/melvoridle" target="_blank">here</a>.<br/>
<br/>
All contributions, even suggestions or bug reports, are welcome at:<br/>
<ul>
<li>GitHub: <a href="https://github.com/ckabalan/mict.spectralcoding.com" target="_blank">https://github.com/ckabalan/mict.spectralcoding.com</a></li>
<li>Discord: <a href="https://discordapp.com/users/178688021456093185" target="_blank">Dandelock#6912</a></li>
</ul>
All Melvor Idle assets and code are property of <a href="https://melvoridle.com" target="_blank">Melvor Idle</a> and Malcs.<br/>
Checklist icon made by <a href="https://www.flaticon.com/authors/freepik" target="_blank">Freepik</a> from <a href="https://www.flaticon.com/" target="_blank">Flaticon</a>.<br />
<br />
Using Melvor Idle <span id="gameDataVersion">UNKNOWN</span> dataset generated at <span id="gameDataGenerationDate">UNKNOWN</span>.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
<script src="js/pako.min.js"></script>
<script src="data/melvordata.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>