Add initial js popup

2 files changed, 56 insertions, 0 deletions

diff --git a/data/script.js b/data/script.js
new file mode 100644
index 0000000..8ed1aa8
--- /dev/null
+++ b/data/script.js
@@ -0,0 +1,29 @@
+$(document).ready (function () {
+	$('#algo').DataTable ({
+		paging: false,
+		"columnDefs": [],
+	});
+	$('#algo tr').click (function () {
+		var data = $(this).data ('proto');
+		$('#popup h2').text (data.name);
+		$('#popup .subtitle').text (data.longname);
+		$('#popup .year').text (data.year);
+		$('#popup .description').text (data.description);
+
+		$('#popup').fadeIn ('normal');
+		$('#background').fadeIn ('normal');
+	});
+	/* hide popup window */
+	function hide () {
+		$('#popup').fadeOut ('normal');
+		$('#background').fadeOut ('normal');
+	}
+	$('#background').click (function () {
+		hide ();
+	});
+	$(document).keyup (function (e) {
+		if (e.keyCode == 27) {
+			hide ();
+		}
+	});
+});
diff --git a/data/style.css b/data/style.css
new file mode 100644
index 0000000..81b9190
--- /dev/null
+++ b/data/style.css
@@ -0,0 +1,27 @@
+td.features ul {
+	list-style-type: none;
+	margin: 0;
+	padding: 0;
+}
+
+#popup {
+	display: none;
+	position: fixed;
+	background-color: #fff;
+	top: 25%;
+	left: 25%;
+	width: 50%;
+	padding: 2em;
+}
+
+#background {
+	display: none;
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	background-color: #000;
+	opacity: 0.5;
+}
+