Skip to content

Instantly share code, notes, and snippets.

@EncodeTheCode
Created June 16, 2026 22:25
Show Gist options
  • Select an option

  • Save EncodeTheCode/9e46551c9de68de42d3065e44dadd257 to your computer and use it in GitHub Desktop.

Select an option

Save EncodeTheCode/9e46551c9de68de42d3065e44dadd257 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GTA III 100% Mission Checklist</title>
<style>
body{
background:#1b1b1b;
color:#fff;
font-family:Arial,Helvetica,sans-serif;
margin:20px;
}
h1{
text-align:center;
}
table{
width:100%;
border-collapse:collapse;
margin-bottom:30px;
}
th,td{
border:1px solid #555;
padding:8px;
vertical-align:top;
}
th{
text-align:left;
font-size:20px;
}
.portland th{background:#2e8b57;}
.staunton th{background:#1e90ff;}
.shoreside th{background:#8a2be2;}
.luigi{color:#7CFC00;font-weight:bold;}
.joey{color:#FFD700;font-weight:bold;}
.toni{color:#FF6347;font-weight:bold;}
.salvatore{color:#DC143C;font-weight:bold;}
.eightball{color:#C0C0C0;font-weight:bold;}
.elburro{color:#FFA500;font-weight:bold;}
.marty{color:#FF69B4;font-weight:bold;}
.asuka{color:#40E0D0;font-weight:bold;}
.kenji{color:#00FF7F;font-weight:bold;}
.ray{color:#87CEFA;font-weight:bold;}
.donald{color:#FFD700;font-weight:bold;}
.catalina{color:#FF1493;font-weight:bold;}
.courtney{color:#BA55D3;font-weight:bold;}
.dice{color:#00FFFF;font-weight:bold;}
ul{
margin:0;
padding-left:20px;
}
li{
margin:4px 0;
line-height:1.35;
}
label{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:12px;
cursor:pointer;
}
.mission-text{
flex:1;
}
.points{
flex:0 0 auto;
padding:2px 8px;
border:1px solid #666;
border-radius:999px;
font-size:12px;
white-space:nowrap;
background:#111;
}
input[type="checkbox"]{
width:18px;
height:18px;
margin-top:2px;
accent-color:#7CFC00;
}
li.completed .mission-text{
text-decoration:line-through;
opacity:.7;
}
li.completed .points{
opacity:.75;
}
.note{
margin:-18px 0 18px;
font-size:14px;
color:#cfcfcf;
text-align:center;
}
.summary{
position:sticky;
top:0;
z-index:10;
background:#111;
border:1px solid #555;
border-radius:12px;
padding:14px 16px;
margin-bottom:18px;
box-shadow:0 4px 16px rgba(0,0,0,.35);
}
.summary-row{
display:flex;
flex-wrap:wrap;
gap:12px 18px;
align-items:center;
justify-content:space-between;
}
.summary strong{
font-size:18px;
}
.bar{
width:100%;
height:14px;
background:#333;
border-radius:999px;
overflow:hidden;
margin-top:10px;
border:1px solid #555;
}
.bar > div{
height:100%;
width:0%;
background:linear-gradient(90deg,#2e8b57,#1e90ff,#8a2be2);
}
.small{
color:#d8d8d8;
font-size:13px;
}
.subhead{
text-align:center;
margin:4px 0 18px;
color:#ddd;
}
code{
background:#111;
border:1px solid #444;
padding:2px 6px;
border-radius:6px;
color:#fff;
}
.controls{
display:flex;
gap:10px;
justify-content:center;
flex-wrap:wrap;
margin:0 0 16px;
}
button{
border:1px solid #555;
background:#111;
color:#fff;
padding:10px 14px;
border-radius:10px;
font-weight:bold;
cursor:pointer;
}
button:hover{
background:#1a1a1a;
}
button:active{
transform:translateY(1px);
}
</style>
</head>
<body>
<h1>GTA III - 100% Mission Checklist by Island</h1>
<div class="subhead">Story, phone, and 100% objectives arranged in the same dark table style, with weighted tick boxes that total <code>154</code> in-game completion points.</div>
<div class="controls">
<button type="button" id="saveResetBtn">Reset all checkboxes</button>
<button type="button" id="saveMissionsBtn">Mark only mission checkboxes</button>
</div>
<div class="summary" id="summary">
<div class="summary-row">
<strong id="summaryText">0 / 154 points</strong>
<span class="small" id="summaryPercent">0.000000% exact · 0.00% rounded up</span>
</div>
<div class="bar" aria-hidden="true"><div id="barFill"></div></div>
<div class="small" id="summaryCounts" style="margin-top:8px;">0 checked / 120 total tick boxes</div>
</div>
<table class="portland">
<tr>
<th colspan="2">🟩 PORTLAND</th>
</tr>
<tr>
<td class="luigi">L - Luigi</td>
<td>
<ul>
<li><label><span class="mission-text">Give Me Liberty <span class="points">0 pts</span></span><input type="checkbox" data-points="0"></label></li>
<li><label><span class="mission-text">Luigi's Girls <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Don't Spank Ma Bitch Up <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Drive Misty For Me <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Pump-Action Pimp <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">The Fuzz Ball <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="joey">J - Joey</td>
<td>
<ul>
<li><label><span class="mission-text">Mike Lips Last Lunch <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Farewell 'Chunky' Lee Chong <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Van Heist <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Cipriani's Chauffeur <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Dead Skunk in the Trunk <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">The Getaway <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="toni">T - Toni</td>
<td>
<ul>
<li><label><span class="mission-text">Taking Out the Laundry <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">The Pick Up <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Salvatore's Called a Meeting <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Triads and Tribulations <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Blow Fish <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="salvatore">S - Salvatore</td>
<td>
<ul>
<li><label><span class="mission-text">Chaperone <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Cutting the Grass <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Bomb Da Base: Act I <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Last Requests <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="eightball">8 - 8-Ball</td>
<td>
<ul>
<li><label><span class="mission-text">Bomb Da Base: Act II <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="marty">M - Marty Chonks</td>
<td>
<ul>
<li><label><span class="mission-text">The Crook <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">The Thieves <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">The Wife <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Her Lover <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="elburro">B - El Burro</td>
<td>
<ul>
<li><label><span class="mission-text">Turismo <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">I Scream, You Scream <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Trial by Fire <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Big'n'Veiny <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>100% Side Missions</b></td>
<td>
<ul>
<li><label><span class="mission-text">Patriot Playground <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Diablo Destruction <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Mafia Massacre <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Import/Export (Portland Harbor + Emergency Crane) <span class="points">23 pts</span></span><input type="checkbox" data-points="23"></label></li>
</ul>
</td>
</tr>
</table>
<table class="staunton">
<tr>
<th colspan="2">🟦 STAUNTON ISLAND</th>
</tr>
<tr>
<td class="asuka">A - Asuka</td>
<td>
<ul>
<li><label><span class="mission-text">Sayonara Salvatore <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Under Surveillance <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Paparazzi Purge <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Payday For Ray <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Two-Faced Tanner <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Bait <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Espresso-2-Go! <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">S.A.M. <span class="points">0 pts</span></span><input type="checkbox" data-points="0"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="kenji">K - Kenji</td>
<td>
<ul>
<li><label><span class="mission-text">Kanbu Bust-Out <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Grand Theft Auto <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Deal Steal <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Shima <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Smack Down <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="ray">R - Ray</td>
<td>
<ul>
<li><label><span class="mission-text">Silence the Sneak <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Arms Shortage <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Evidence Dash <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Gone Fishing <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Plaster Blaster <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="donald">D - Donald Love</td>
<td>
<ul>
<li><label><span class="mission-text">Liberator <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Waka-Gashira Wipeout! <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">A Drop in the Ocean <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Grand Theft Aero <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Escort Service <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Decoy <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Love's Disappearance <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="catalina">C - Catalina</td>
<td>
<ul>
<li><label><span class="mission-text">Ransom <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="courtney">C - King Courtney</td>
<td>
<ul>
<li><label><span class="mission-text">Bling-Bling Scramble <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Uz-I Rider <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Gangcar Round-Up <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Kingdom Come <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>100% Side Missions</b></td>
<td>
<ul>
<li><label><span class="mission-text">A Ride in the Park <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Multistorey Mayhem <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Casino Calamity <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
</table>
<table class="shoreside">
<tr>
<th colspan="2">🟪 SHORESIDE VALE</th>
</tr>
<tr>
<td class="ray">R - Ray</td>
<td>
<ul>
<li><label><span class="mission-text">Marked Man <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="catalina">C - Catalina</td>
<td>
<ul>
<li><label><span class="mission-text">The Exchange <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td class="dice">D - D-Ice</td>
<td>
<ul>
<li><label><span class="mission-text">Uz-I Money <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Toyminator <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Rigged to Blow <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Bullion Run <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Rumble <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>100% Side Missions</b></td>
<td>
<ul>
<li><label><span class="mission-text">Gripped! <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Rumpo Rampage <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Import/Export (Shoreside Vale Garage) <span class="points">16 pts</span></span><input type="checkbox" data-points="16"></label></li>
</ul>
</td>
</tr>
</table>
<table class="portland">
<tr>
<th colspan="2">🟩 OTHER 100% OBJECTIVES</th>
</tr>
<tr>
<td><b>Off-Road</b></td>
<td>
<ul>
<li><label><span class="mission-text">Patriot Playground <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Multistorey Mayhem <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">A Ride in the Park <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Gripped! <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>RC Missions</b></td>
<td>
<ul>
<li><label><span class="mission-text">Diablo Destruction <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Mafia Massacre <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Casino Calamity <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Rumpo Rampage <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>Rampages</b></td>
<td>
<ul>
<li><label><span class="mission-text">Complete all 20 Rampages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>Hidden Packages</b></td>
<td>
<ul>
<li><label><span class="mission-text">Collect 10 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 20 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 30 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 40 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 50 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 60 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 70 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 80 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 90 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Collect 100 Hidden Packages <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>Unique Stunt Jumps</b></td>
<td>
<ul>
<li><label><span class="mission-text">Jump 1 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 2 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 3 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 4 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 5 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 6 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 7 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 8 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 9 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 10 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 11 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 12 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 13 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 14 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 15 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 16 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 17 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 18 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 19 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Jump 20 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>Vehicle Sub-Missions</b></td>
<td>
<ul>
<li><label><span class="mission-text">Taxi Driver (100 fares) <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Paramedic: Rescue 36 patients <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Paramedic: Rescue 78 patients <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Paramedic: Complete Level 12 <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Firefighter: 60 fires total <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 10 criminals in Portland <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 20 criminals in Portland <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 10 criminals on Staunton Island <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 20 criminals on Staunton Island <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 10 criminals in Shoreside Vale <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
<li><label><span class="mission-text">Vigilante: 20 criminals in Shoreside Vale <span class="points">1 pt</span></span><input type="checkbox" data-points="1"></label></li>
</ul>
</td>
</tr>
<tr>
<td><b>Import / Export</b></td>
<td>
<ul>
<li><label><span class="mission-text">Portland Harbor garage (industrial and commercial vehicles) <span class="points">16 pts</span></span><input type="checkbox" data-points="16"></label></li>
<li><label><span class="mission-text">Portland Harbor crane (emergency vehicles) <span class="points">7 pts</span></span><input type="checkbox" data-points="7"></label></li>
<li><label><span class="mission-text">Shoreside Vale garage (suburban and personal vehicles) <span class="points">16 pts</span></span><input type="checkbox" data-points="16"></label></li>
</ul>
</td>
</tr>
</table>
<p class="note">The total is based on GTA III's 154-point completion model. The game awards <code>0.6493506494%</code> per point, and the stats screen rounds up the displayed value.</p>
<script>
(function () {
const TOTAL_POINTS = 154;
const STORAGE_KEY = 'gta3_de_100_progress_v2';
const allCheckboxes = Array.from(document.querySelectorAll('input[type="checkbox"]'));
const missionCheckboxes = Array.from(document.querySelectorAll('table:not(.extras) input[type="checkbox"]'));
const summaryText = document.getElementById('summaryText');
const summaryPercent = document.getElementById('summaryPercent');
const summaryCounts = document.getElementById('summaryCounts');
const barFill = document.getElementById('barFill');
const resetBtn = document.getElementById('saveResetBtn');
const missionsBtn = document.getElementById('saveMissionsBtn');
function setCompletedClass(cb) {
const li = cb.closest('li');
if (li) li.classList.toggle('completed', cb.checked);
}
function saveState() {
try {
const state = allCheckboxes.map(cb => !!cb.checked);
localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
} catch (err) {
console.warn('Could not save checklist state.', err);
}
}
function loadState() {
try {
const raw = localStorage.getItem(STORAGE_KEY);
if (!raw) return;
const state = JSON.parse(raw);
if (!Array.isArray(state)) return;
allCheckboxes.forEach((cb, index) => {
cb.checked = !!state[index];
});
} catch (err) {
console.warn('Could not restore checklist state.', err);
}
}
function recalc() {
let points = 0;
let checked = 0;
for (const cb of allCheckboxes) {
if (cb.checked) {
checked += 1;
points += Number(cb.dataset.points || 0);
}
setCompletedClass(cb);
}
const exactPercent = (points / TOTAL_POINTS) * 100;
const displayPercent = points === 0 ? 0 : Math.min(100, Math.ceil(exactPercent));
summaryText.textContent = `${points} / ${TOTAL_POINTS} points`;
summaryPercent.textContent = `${exactPercent.toFixed(6)}% exact · ${displayPercent.toFixed(0)}% rounded up`;
summaryCounts.textContent = `${checked} checked / ${allCheckboxes.length} total tick boxes`;
barFill.style.width = `${Math.min(100, exactPercent)}%`;
saveState();
}
allCheckboxes.forEach(cb => {
cb.addEventListener('change', recalc);
});
resetBtn?.addEventListener('click', () => {
allCheckboxes.forEach(cb => {
cb.checked = false;
setCompletedClass(cb);
});
recalc();
});
missionsBtn?.addEventListener('click', () => {
allCheckboxes.forEach(cb => {
cb.checked = false;
});
missionCheckboxes.forEach(cb => {
cb.checked = true;
});
allCheckboxes.forEach(setCompletedClass);
recalc();
});
loadState();
recalc();
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment