form is displayed as overlay

3 files changed, 27 insertions, 58 deletions

diff --git a/js/cctv-control.js b/js/cctv-control.js
index c0c7bbd..c0318a0 100644
--- a/js/cctv-control.js
+++ b/js/cctv-control.js
@@ -30,10 +30,13 @@ function initReady(fn)	{
 
 //change currently displayed camera to the one in cam variable
 function changeCam()	{
+	
+	document.getElementById('form').style.visibility = "hidden";
+	
 	var display = document.getElementById('screen');
 	if (cam <= 7 && cam >= 0)	{
 			camDisplay = cam + 1;
-			display.innerHTML = '<p class="camnumber">' + camDisplay + '</p>';
+			display.innerHTML = '<p class="camNumber">' + camDisplay + '</p>';
 			display.innerHTML += '<img id="camImage" src="http://' + camHost + '/cam/' + cam + '/stream.mjpeg" />';
 	}
 	else	{
@@ -86,12 +89,31 @@ function saveImage()	{
 			};
 			
 			fileReader.readAsDataURL(blob);
+			showImage();
 		}
 	}, false);
 
 	xhr.send();
 }
 
+function showImage()	{
+
+	//load snapshot from localstorage an display in background
+	var display1 = document.getElementById("camImage"),
+	    display2 = document.getElementById("formImage"),
+	    stor = localStorage.getItem("snapShot");
+
+	if (stor)       {
+		display1.setAttribute("src", stor);
+		display2.setAttribute("src", stor);
+	}
+
+	//make form visible
+	document.getElementById("form").style.visibility = 'visible';
+}
+
+
+
 function keyDown(event)	{
 
 	switch(event.keyCode)	{
@@ -141,7 +163,6 @@ function keyDown(event)	{
 			break;
 		case 13: //enter
 			saveImage();
-			window.location = "http://127.0.0.1/form.html";
 			break;
 	}	
 }
diff --git a/js/cctv-control.js.bak b/js/cctv-control.js.bak
deleted file mode 100644
index 7a12dce..0000000
--- a/js/cctv-control.js.bak
+++ /dev/null
@@ -1,55 +0,0 @@
-var cam;
-
-function keyDown(event)	{
-	if (event.keyCode == 49)	{
-		var display = document.getElementById('screen');
-		cam = 0;
-		display.innerHTML = '<img src="http://172.22.80.56:8080/cam/0/stream.mjpeg" />'
-		}
-
-	if (event.keyCode == 50)	{
-		var display = document.getElementById('screen');
-		cam = 1;
-		display.innerHTML = '<img src="http://172.22.80.56:8080/cam/1/stream.mjpeg" />'
-		}
-
-	if (event.keyCode == 51)	{
-		var display = document.getElementById('screen');
-		cam = 2;
-		display.innerHTML = '<img src="http://172.22.80.56:8080/cam/2/stream.mjpeg" />'
-		}
-
-	if (event.keyCode == 52)	{
-		var display = document.getElementById('screen');
-		display.innerHTML = '<img src="testbild-4.png" />'
-		}
-
-	if (event.keyCode == 37)	{
-		var request = new XMLHttpRequest();
-		request.open("get", "http://172.22.80.56:8080/cam/" + cam + "/control/left", false);
-		request.send();
-		return false;
-	}
-
-	if (event.keyCode == 38)	{
-		var request = new XMLHttpRequest();
-		request.open("get", "http://172.22.80.56:8080/cam/" + cam +"/control/up", false);
-		request.send();
-		return false;
-	
-	}
-	if (event.keyCode == 39)	{
-		var request = new XMLHttpRequest();
-		request.open("get", "http://172.22.80.56:8080/cam/" + cam  +"/control/right", false);
-		request.send();
-		return false;
-	}
-	if (event.keyCode == 40)	{
-		var request = new XMLHttpRequest();
-		request.open("get", "http://172.22.80.56:8080/cam/" + cam +"/control/down", false);
-		request.send();
-		return false;
-	
-	}
-
-}
diff --git a/js/load-local-storage.js b/js/load-local-storage.js
index b3c26e8..7306a58 100644
--- a/js/load-local-storage.js
+++ b/js/load-local-storage.js
@@ -28,10 +28,13 @@ function initReady(fn)  {
 function loadImg()	{
 	
 	var display = document.getElementById("storImage"),
-	    stor = localStorage.getItem("snapShot")
+	    body = document.getElementById("formBackground"),
+	    stor = localStorage.getItem("snapShot");
 	
 	if (stor)	{
 		display.setAttribute("src", stor);
+		document.body.style.background="#f3f3f3 url('"+ stor + "') no-repeat";
+		display.setAttribute("src", stor);
 	}