+ headline

+ autostart column + thumbnail
freefair · Jun 4, 2019 · c38ece9 · c38ece9
1 parent 09fe0ef
commit c38ece9
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/src/main/resources/root/css/app.css b/src/main/resources/root/css/app.css
@@ -1,3 +1,6 @@
 .url-col {
     word-break: break-all;
+}
+.table-column td {
+    vertical-align: middle!important;
 }
diff --git a/src/main/resources/root/index.html b/src/main/resources/root/index.html
@@ -14,6 +14,7 @@
 </head>
 <body>
 <div class="container">
+	<h1 style="text-align: center; margin-top: 2em">Scheduled Screenshots</h1>
 	<nav class="nav nav-pills justify-content-end">
 		<a class="text-sm-center nav-link" data-toggle="modal" data-target="#newModal" href="#">
 			New <i class="fa fa-plus"></i>
@@ -37,10 +38,11 @@
 	<table class="table" id="main-table">
 		<thead>
 		<tr>
-			<th scope="col">#</th>
+			<th scope="col">Screenshot-ID</th>
 			<th scope="col">Url</th>
 			<th scope="col">Auth</th>
 			<th scope="col">Interval</th>
+			<th scope="col">Autostart</th>
 			<th scope="col"></th>
 		</tr>
 		</thead>

diff --git a/src/main/resources/root/js/app.js b/src/main/resources/root/js/app.js
@@ -93,12 +93,15 @@ $(document).ready(function () {
 			$("#main-table tbody tr").remove();
 			$(".tooltip").remove();
 			data.forEach(function(screenshot) {
-				var $tr = $("<tr />");
+				var $tr = $("<tr class='table-column' />");
 				var id = $("<td scope='col'/>");
 				var idA = $("<a />");
-				idA.attr("href", "/screenshot/" + screenshot.id + "/image");
+				var imageLink = "/screenshot/" + screenshot.id + "/image";
+				idA.attr("href", imageLink);
 				idA.attr("target", "_blank");
-				idA.text(screenshot.id);
+				var idI = $("<img style='height: 50px; width: auto;' />");
+				idI.attr('src', imageLink);
+				idA.append(idI);
 				id.append(idA);
 				$tr.append(id);
 				var url = $("<td scope='col' class='url-col'/>");
@@ -110,6 +113,13 @@ $(document).ready(function () {
 				var interval = $("<td scope='col'/>");
 				interval.text(screenshot.intervalSeconds);
 				$tr.append(interval);
+				var autostart = $("<td scope='col'/>");
+				if(screenshot.autostart === true) {
+					autostart.append($("<i class='fa fa-check'/>"));
+				} else {
+					autostart.append($("<i class='fa fa-times'/>"));
+				}
+				$tr.append(autostart);
 				var actions = $("<td scope='col'/>");
 				createButtons(actions, screenshot);
 				$tr.append(actions);