Make site accessible without JavaScript

html_generator.php

@@ -54,9 +54,10 @@
 				"		<td>" . $content["description"] . "</td>" . PHP_EOL .
 				"		<td class=\"td_users\">" . $content["active_users"] . "</td>" . PHP_EOL .
 				"		<td><a href=\"" . $content["preview_link"] . "\">" . $content["preview_link"] . "</a></td>" . PHP_EOL .
-				"		<td class=\"td_join_url\">" . substr($content["join_link"], 0, 32) . "..." . PHP_EOL .
+				/*"		<td class=\"td_join_url\">" . substr($content["join_link"], 0, 32) . "..." . PHP_EOL .
 				"			<button class=\"copy_button\" onclick=\"copyToClipboard('" . $content["join_link"] . "')\">Copy</button>" . PHP_EOL .
-				"		</td>" . PHP_EOL .
+				"		</td>" . PHP_EOL .*/
+				"		<td class=\"td_join_url\"><a href=\"" . $content["join_link"] . "\">" . $content["join_link"] . "</a></td>" . PHP_EOL .
 				"	</tr>" . PHP_EOL;
 			$table_lines[] = $line;
 		}

output/script.js

@@ -2,6 +2,18 @@ function onLoad(timestamp) {
 	setLastChecked(timestamp);
 	hideBadCommunities();
 	sortTable(2); // 2 == Name
+	createJoinLinkButtons();
+}
+
+function createJoinLinkButtons() {
+	elements = document.getElementsByClassName("td_join_url");
+	Array.from(elements).forEach((td_element) => {
+		a_href = td_element.getElementsByTagName('a')[0]; // get first (only) <a> element
+		join_link = a_href.getAttribute("href"); // get link
+		button_content = join_link.substring(0, 30) + "...<button class=\"copy_button\" onclick=\"copyToClipboard('" + join_link + "')\">Copy</button>";
+
+		td_element.innerHTML = button_content;
+	});
 }
 
 function hideBadCommunities() {

output/styles.css

@@ -11,7 +11,10 @@
 .td_users        { text-align: right; }
 #th_preview      { width:19%; }
 #th_join_url     { width:17%; }
-.td_join_url     { font-family: monospace; }
+.td_join_url     {
+    font-family: monospace;
+    white-space: nowrap;
+}
 
 .copy_button     {  }