week3 homework

erols · erols · commit b4fd955eb699 · 2016-10-11T08:23:41.000+02:00
diff --git a/week3-homework.md b/week3-homework.md
diff --git a/week3/index.html b/week3/index.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title>week 3 homework</title>
+</head>
+<body>
+	<h3>My TO DO List</h3>
+	<span id="get_list_button" class="button">Get To Dos</span>
+	<div id="todo_list"></div>
+	<span id="remove_all_button" class="button">Remove All</span>
+	<h4>Add To Do</h4>
+	<input type="text" name="New To DO" id="add_todo"><span id="add_todo_button" class="button">Add</span>
+	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
+	<script type="text/javascript">
+		// add js here
+		$(document).ready(function(){
+			var buttonCSS = {
+    			"outline-style": "solid",
+    			"outline-color": "purple",
+    			"outline-width": "1px",
+    			"color": "orange",
+    			"font-family": "sans-serif",
+    			"background-color": "green"
+			};
+    		$("#get_list_button").click(function(){
+        		console.log("get list clicked");
+        		$.ajax({
+        			url: "http://localhost:8080/todos",
+        			method: "GET",
+        			success: showTodos
+        		})
+        	});
+    		$("#remove_all_button").click(function(){
+        		console.log("remove all clicked");
+        		$.ajax({
+        			url: "http://localhost:8080/todos",
+        			method: "DELETE",
+        			success: showTodos
+        		})
+        	});
+    		$("#add_todo_button").click(function(){
+        		console.log("add todo clicked")
+        		console.log("add this todo: " + $("#add_todo").val())
+        		$.ajax({
+        			url: "http://localhost:8080/todos",
+        			method: "POST",
+        			data: $("#add_todo").val(),
+        			processData: false,
+        			success: showTodos
+        		})
+        	});
+        	$(".button").css(buttonCSS);
+			
+			function showTodos(data, status) {
+				$("#todo_list").empty();
+				$.each(data, function (i, val) {
+					$("#todo_list").append(i + " " + val + " <span id='todo" + i + "'>Remove<br>");
+					$("#todo" + i).css(buttonCSS);
+		    		$("#todo" + i).click(function(){
+		    			$.ajax({
+		    				url: "http://localhost:8080/todos/" + i,
+		    				method: "DELETE",
+		    				success: showTodos
+		    			})
+		        	});
+				});
+			}
+    	});
+	</script>
+</body>
+</html>
diff --git a/week3/index.js b/week3/index.js
@@ -0,0 +1,39 @@
+var fs = require('fs');
+var http = require('http');
+
+var port = 8080;
+var server = http.createServer(handleRequest);
+
+function handleRequest (req, res) {
+	// console.log(req.url);
+	switch (req.url) {
+		case '/':
+			fs.readFile(__dirname + '/index.html', 'utf-8', function (error, data) {
+				if (error) {
+					res.writeHead(500);
+					res.write('Could not open file');
+				} else {
+					res.writeHead(200, {'Content-Type': 'text/html'});
+					res.write(data);
+				}
+				res.end();
+			});			
+			console.log('root');
+			break;
+		default :
+			console.log("url: " + req.url + ", method: " + req.method);
+			res.writeHead(200, {'Content-Type': 'application/json'});
+			// res.write('{"1":"make tea","2":"do dishes","3":"go shopping"}');
+			// res.write('{}');
+			res.end();
+	}
+}
+
+server.listen(port, function (error) {
+	if (error) {
+		console.log(error);
+	} else {
+		console.log('listening on port 8080');
+	}
+
+});
diff --git a/week3/week3-homework.md b/week3/week3-homework.md
@@ -0,0 +1,24 @@
+# Node JS Class
+
+## Homework Week 3
+
+### Create Node JS server that:
+
+- Listens on port 8080
+
+- Responds to these endpoints:
+	- GET /todos/
+		- Returns list of todos
+	- POST /todos/
+		- add a todo to the list and return the new list
+	- DELETE /todos/`<todo index>`
+		- remove a todo and return the new list
+	- DELETE /todos/
+		- clear all the todos from the list
+### Notes:
+
+A front-end html page that makes the correct calls and displays the results is supplied. 
+
+Don't edit the html page. If you find en error in the page please let me know straight away so I can fix it for everyone.
+
+I have supplied a skeleton index.js that serves the home page at http://localhost:8080/. You can build on it or create your own.
