--- dao/DaoAdresseVedligehold/src/main/webapp/index.html	2016/01/24 21:48:55	2838
+++ dao/DaoAdresseVedligehold/src/main/webapp/index.html	2016/02/04 22:00:00	2923
@@ -6,6 +6,15 @@
 	<link rel="stylesheet" href="webjars/bootstrap/3.3.5/css/bootstrap.min.css" />
 	
 	<link rel="stylesheet" href="webjars/bootstrap-fileinput/4.2.7/css/fileinput.min.css" />
+	
+	<style>
+	
+@media (min-width: 1300px) {
+	.container {
+	    width: 1300px; /*default 1170px*/
+	}
+}
+	</style>
 
 <!--  use webjars for dependencies -->
 	<script src="webjars/jquery/2.1.4/jquery.js"></script>
@@ -19,7 +28,7 @@
 
 
 function loadTasks() {
-	$.get("TaskServlet", function(data) {
+	$.get("rest/tasks/list", function(data) {
 		//console.log(data);
 		
 		
@@ -41,13 +50,39 @@
 			
 			
 			html += "<div class='panel " + pclass + "'>";
-			html += "<div class='panel-heading'><h4 class='panel-title'>" + entry.description + "</h4></div>";
+			html += "<div class='panel-heading'>";
+			if (entry.state == "STATE_DONE" || entry.state == "STATE_ABORTED") {
+				html += "<button type='button' class='close removetask' aria-label='Close' taskid='" + entry.id+ "'><span aria-hidden='true'>&times;</span></button>";
+			}
+			html += "<h4 class='panel-title'>" + entry.description + "</h4>";
+			html += "</div>";
+			html += "  <div class='panel-body'>";
 
 			html += entry.detail;
 			
-			html += "<br/><div style='font-size: 8px; margin: 7px;'>" + entry.state + "</div>";
+			if (entry.state == "STATE_ABORTED")
+				html += "<br><div style='color: red'>" + entry.errorMessage + "</div>";
+				
+			if (entry.state == "STATE_RUNNING") {
+				if (entry.percentCompleted >= 0) {
+					var percent = entry.percentCompleted.toFixed(2);
+					html += "<div class='progress'>";
+					html += "<div class='progress-bar' role='progressbar' aria-valuenow='" + percent + "' aria-valuemin='0' aria-valuemax='100' style='width:" + percent + "%'> " ;
+					html +=	 percent + "%";
+					html +=	" </div>";
+					html += "</div>";
+				}
+			}
+			
+			var viewlog = "";
+			if (entry.state == "STATE_RUNNING" || entry.state == "STATE_DONE" || entry.state == "STATE_ABORTED") {
+				viewlog = "<span style='float: right'><a href='#' class='viewlog' taskid='" + entry.id+ "'>Log</a></span>";
+			}
 			
-			html += "</div>";
+			html += "  <div style='font-size: 8px; '>" + entry.state + viewlog + "</div>";
+			
+			html += "  </div>"; //panel-body
+			html += "</div>"; //panel
 			
 		});
 		if (html == "") {
@@ -73,8 +108,21 @@
 
 $(document).ready( function() {
 	loadTasks(); 
-	setInterval(loadTasks, 2500);
+	setInterval(loadTasks, 5000);
+	
+	
+	$(document).on('click', '.viewlog', function(event) { // Bind future elements
+		var taskid = $(this).attr('taskid');
+		$("#logview").load('rest/tasks/log/' + taskid);
+		
+	});
 	
+	$(document).on('click', '.removetask', function(event) { // Bind future elements
+		var taskid = $(this).attr('taskid');
+		$.get('rest/tasks/remove/' + taskid, function() {
+			loadTasks();
+		});		
+	});
 	
 	$("#file").fileinput({
 		//'showUpload':false, 
@@ -100,6 +148,21 @@
 		$('#file').fileinput('upload');
 	});
 	
+	
+	$("#afstandBtn").click( function(){
+		var dist = $("#afstand_distributor").val();
+		if (dist == "") {
+			alert("Du skal vælge distributør");
+			return;
+		}
+		
+		
+		$.get("rest/commands/distancecalculation/" + dist, function() {
+			loadTasks(); //Force reload of tasks immediately
+		} );
+		
+	});
+	
 });
 
 </script>	
@@ -112,7 +175,7 @@
     <h1>Dao Adresse Vedligehold</h1> 
   </div>
   <div id="body">
-    <div class="row">
+    <div class="row"> 
       <div class="col-sm-3" id="leftCol" >
       	<div class="panel panel-primary">
       		<div class="panel-heading">
@@ -126,14 +189,15 @@
       	</div>
       </div>
       
-      <div class="col-sm-6" id="center" >
-    	b
+      <div class="col-sm-6" id="center">
+      <pre id="logview">
+      </pre>
       </div>
       
       <div class="col-sm-3" id="rightCol" >
       	<div class="panel panel-primary">
       		<div class="panel-heading">
-    			<h3 class="panel-title">Actions</h3>
+    			<h3 class="panel-title">Upload File</h3>
   			</div>
   			<div class="panel-body">
   			
@@ -142,11 +206,9 @@
 			  <select class="form-control" id="distributor" name="distributor">
 			  	<option></option>
 			    <option>BK</option>
-			  <!-- 
 			    <option>DAO</option>
 			    <option>FD</option>
 			    <option>NS</option>
-			  --> 
 			  </select>
   
     		<label for="writeback">Write-back:</label>
@@ -166,11 +228,37 @@
     				
     			
   			</div>
-      	</div>
-      </div>
-    </div>
+      	</div> <!--  upload panel -->
+      	
+      	  <div class="panel panel-primary">
+      		<div class="panel-heading">
+    			<h3 class="panel-title">Afstand anden rute</h3>
+  			</div>
+  			<div class="panel-body">
+  			
+  			
+  			  <label for="distributor">Distributør:</label>
+			  <select class="form-control" id="afstand_distributor" name="afstand_distributor">
+			  	<option></option>
+			    <option>BK</option>
+			    <option>DAO</option>
+			  </select>
+			  <br>
+			  
+			  <button class="btn btn-primary" id="afstandBtn">Beregn</button>
+  
+			  
+			</div>
+		</div><!-- Afstand-andenrute panel -->
+			
+      	
+      	
+      </div><!-- rightcol -->
+    </div> <!-- row -->
       
-  </div>
+  </div><!-- body -->
+  
+  
 </div>