working on services

Chris Sevilleja · Chris Sevilleja · commit 43f111b11932 · 2013-12-08T21:50:56.000-08:00
diff --git a/public/core.js b/public/core.js
diff --git a/public/index.html b/public/index.html
@@ -20,11 +20,14 @@
 
 	<!-- SPELLS -->
 	<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script><!-- load jquery -->
-	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script><!-- load angular -->
-	<script src="core.js"></script>
+	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script><!-- load angular 1.2.4 -->
+
+	<script src="js/controllers/main.js"></script> <!-- load up our controller -->
+	<script src="js/services/todos.js"></script> <!-- load our todo service -->
+	<script src="js/core.js"></script> <!-- load our main application -->
 
 </head>
-<!-- SET THE CONTROLLER AND GET ALL TODOS WITH INITIALIZE FUNCTION -->
+<!-- SET THE CONTROLLER -->
 <body ng-controller="mainController">
 	<div class="container">
 
diff --git a/public/js/controllers/main.js b/public/js/controllers/main.js
@@ -0,0 +1,43 @@
+angular.module('todoController', [])
+
+	// inject the Todo service factory into our controller
+	.controller('mainController', function($scope, $http, Todos) {
+		$scope.formData = {};
+
+		// GET =====================================================================
+		// when landing on the page, get all todos and show them
+		// use the service to get all the todos
+		Todos.get()
+			.success(function(data) {
+				$scope.todos = data;
+			});
+
+		// CREATE ==================================================================
+		// when submitting the add form, send the text to the node API
+		$scope.createTodo = function() {
+
+			// validate the formData to make sure that something is there
+			// if form is empty, nothing will happen
+			if (!$.isEmptyObject($scope.formData)) {
+
+				// call the create function from our service (returns a promise object)
+				Todos.create($scope.formData)
+
+					// if successful creation, call our get function to get all the new todos
+					.success(function(data) {
+						$scope.formData = {}; // clear the form so our user is ready to enter another
+						$scope.todos = data; // assign our new list of todos
+					});
+			}
+		};
+
+		// DELETE ==================================================================
+		// delete a todo after checking it
+		$scope.deleteTodo = function(id) {
+			Todos.delete(id)
+				// if successful creation, call our get function to get all the new todos
+				.success(function(data) {
+					$scope.todos = data; // assign our new list of todos
+				});
+		};
+	});
diff --git a/public/js/core.js b/public/js/core.js
@@ -0,0 +1 @@
+angular.module('scotchTodo', ['todoController', 'todoService']);
diff --git a/public/js/services/todos.js b/public/js/services/todos.js
@@ -0,0 +1,17 @@
+angular.module('todoService', [])
+
+	// super simple service
+	// each function returns a promise object 
+	.factory('Todos', function($http) {
+		return {
+			get : function() {
+				return $http.get('/api/todos');
+			},
+			create : function(todoData) {
+				return $http.post('/api/todos', todoData);
+			},
+			delete : function(id) {
+				return $http.delete('/api/todos/' + id);
+			}
+		}
+	});

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+angular.module('scotchTodo', ['todoController', 'todoService']);`