diff --git a/main.php b/main.php
index 86839f2..313f594 100644
--- a/main.php
+++ b/main.php
@@ -1,5 +1,4 @@
 <?php
-// todo: action onclick to loading screen
 // todo: cleanup repacker
 // todo: cleanup cache
 // todo: cleanup db
diff --git a/templates/body.html b/templates/body.html
index 4f32f60..fceea1b 100644
--- a/templates/body.html
+++ b/templates/body.html
@@ -1,4 +1,4 @@
+<!-- https://github.com/Thayol/OsuOptimizerPHP -->
 <body id="body">
 {{ CONTENT }}
-<!-- https://github.com/Thayol/OsuOptimizerPHP -->
 </body>
\ No newline at end of file
diff --git a/templates/loading-screen.html b/templates/loading-screen.html
new file mode 100644
index 0000000..62ff64f
--- /dev/null
+++ b/templates/loading-screen.html
@@ -0,0 +1,77 @@
+<div class="loader">Loading...</div>
+<h1 style="text-align:center;">Working...</h1>
+
+<!-- Loading animation by Luke Haas https://github.com/lukehaas/css-loaders -->
+<style>
+.loader {
+  color: #FF9800;
+  color: #448AFF;
+  color: #FFFFFF;
+  font-size: 100pt;
+  text-indent: -9999em;
+  overflow: hidden;
+  width: 1em;
+  height: 1em;
+  border-radius: 50%;
+  margin: 72px auto;
+  position: relative;
+  -webkit-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-animation: load6 2s infinite ease;
+  animation: load6 2s infinite ease;
+}
+
+@-webkit-keyframes load6 {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+  5%,
+  95% {
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+  10%,
+  59% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
+  }
+  20% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
+  }
+  38% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+}
+@keyframes load6 {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+  5%,
+  95% {
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+  10%,
+  59% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
+  }
+  20% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
+  }
+  38% {
+    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/templates/main-browser-template-mapset.html b/templates/main-browser-template-mapset.html
index 0679eda..2c58065 100644
--- a/templates/main-browser-template-mapset.html
+++ b/templates/main-browser-template-mapset.html
@@ -2,5 +2,5 @@
 	<details class="mapset">
 		\{\{ MAP_DIFFICULTIES \}\}
 	</details>
-	↑ <a href="./?repack&key=\{\{ MAPSET_KEY \}\}">[ REPACK ]</a> ↑
+	↑ <a href="./?repack&key=\{\{ MAPSET_KEY \}\}" target="_blank">[ REPACK ]</a> ↑
 </div>
\ No newline at end of file
diff --git a/templates/main-option.html b/templates/main-option.html
index b139624..bf741c3 100644
--- a/templates/main-option.html
+++ b/templates/main-option.html
@@ -1,5 +1,5 @@
 <div class="option">
 	<p class="option-title"><b>{{ MAIN_OPTION_NAME }}</b> <i>{{ MAIN_OPTION_NAME_NOTE }}</i></p>
 	<p class="option-description">{{ MAIN_OPTION_DESCRIPTION }}</p>
-	<p class="option-link-spacer"><br /></p><p class="option-link">{{ MAIN_OPTION_LINK_NOTE }}<a href="{{ MAIN_OPTION_LINK }}">[ {{ MAIN_OPTION_BUTTON }} ]</a></p>
+	<p class="option-link-spacer"><br /></p><p class="option-link">{{ MAIN_OPTION_LINK_NOTE }}<a onclick="displayLoading()" href="{{ MAIN_OPTION_LINK }}">[ {{ MAIN_OPTION_BUTTON }} ]</a></p>
 </div>
\ No newline at end of file
diff --git a/templates/main-options-script.js b/templates/main-options-script.js
new file mode 100644
index 0000000..39a50d3
--- /dev/null
+++ b/templates/main-options-script.js
@@ -0,0 +1,15 @@
+var loadingContent = "Loading...";
+var xmlhttp = new XMLHttpRequest();
+xmlhttp.onreadystatechange = function() {
+	if (this.readyState == 4 && this.status == 200) {
+		loadingContent = this.responseText;
+	}
+};
+
+xmlhttp.open("GET", "templates/loading-screen.html", true);
+xmlhttp.send();
+
+function displayLoading() {
+	document.getElementById("options").style.display = "none";
+	document.getElementById("loader").innerHTML = loadingContent;
+}
\ No newline at end of file
diff --git a/templates/main.html b/templates/main.html
index b8b1383..1471166 100644
--- a/templates/main.html
+++ b/templates/main.html
@@ -1,7 +1,7 @@
 <div class="main-container">
 	<h1>osu! optimizer (PHP)</h1>
 	<h3>Version 0.1 by Thayol</h3>
-	<a href="https://github.com/Thayol/OsuOptimizerPHP"><p>[ GitHub ]</p></a>
+	<p><a href="https://github.com/Thayol/OsuOptimizerPHP">[ GitHub ]</a></p>
 	<div class="main-item">
 		<h2>Stats</h2>
 		<h3>
@@ -13,7 +13,9 @@
 	</div>
 	<div class="main-item">
 		<h2>Actions</h2>
-		<div class="options">{{ MAIN_OPTIONS }}</div>
+		<div id="options" class="options">{{ MAIN_OPTIONS }}</div>
+		<div id="loader"></div>
+		<script>{{ MAIN_OPTIONS_SCRIPT }}</script>
 	</div>
 	<div class="main-item">
 		<h2 id="a">Browser</h2>
