Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Refactored to factories and controllers

  • Loading branch information...
commit f41575773d7f5a55bffaa8bb3493d974538e83eb 1 parent d3c9fb8
@mrako authored
View
2  bower.json
@@ -3,7 +3,7 @@
"version": "0.0.0",
"directory": "public/",
"dependencies": {
- "angular": "latest",
+ "angular": "1.0.8",
"angular-xeditable": "latest",
"bootstrap": "latest",
"fontawesome": "latest"
View
8 public/index.html
@@ -8,8 +8,8 @@
<title>Todo App</title>
- <link rel="stylesheet" href="/components/bootstrap/dist/css/bootstrap.min.css" />
- <link rel="stylesheet" href="/components/fontawesome/dist/css/font-awesome.min.css" />
+ <link rel="stylesheet" href="/components/bootstrap/dist/css/bootstrap.css" />
+ <link rel="stylesheet" href="/components/fontawesome/css/font-awesome.css" />
<link href="/components/angular-xeditable/dist/css/xeditable.css" rel="stylesheet">
@@ -33,10 +33,12 @@ <h3 class="text-muted">Todo App</h3>
</div>
- <script src="/js/angular.min.js"></script>
+ <script src="/components/angular/angular.min.js"></script>
<script src="/components/angular-xeditable/dist/js/xeditable.js"></script>
+ <script src="/js/controllers/todo_controller.js"></script>
+ <script src="/js/services/todo_factory.js"></script>
<script src="/js/app.js"></script>
</body>
</html>
View
98 public/js/app.js
@@ -1,4 +1,4 @@
-var todoApp = angular.module('todoApp', ["xeditable"]);
+var todoApp = angular.module('todoApp', ['TodoController', 'TodoFactory', 'xeditable']);
todoApp.run(function(editableOptions) {
editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
@@ -9,101 +9,9 @@ todoApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/todos', {
- templateUrl: 'templates/todos.html',
- controller: 'todosController'
+ templateUrl: 'templates/todos.html'
}).
otherwise({
redirectTo: '/todos'
- });;
+ });
}]);
-
-
-// SERVICE FOR API CALLS =======================================================
-todoApp.factory('Todos', function ($http) {
- return {
- list : function() {
- return $http.get('/api/todos');
- },
- get : function(id) {
- return $http.get('/api/todos/' + id);
- },
- create : function(data) {
- return $http.post('/api/todos', data);
- },
- update : function(id, data) {
- return $http.put('/api/todos/' + id, data);
- },
- delete : function(id) {
- return $http.delete('/api/todos/' + id);
- }
- }
-});
-
-todoApp.controller('todosController', function($scope, $http, Todos) {
- $scope.formData = {};
- $scope.submit = "Create";
- $scope.loading = true;
-
- // GET =====================================================================
- Todos.list()
- .success(function(data) {
- $scope.todos = data;
- $scope.loading = false;
- });
-
- // CREATE AND SAVE =========================================================
- $scope.save = function() {
- $scope.loading = true;
-
- if ($scope.formData._id == undefined) {
- Todos.create($scope.formData)
- .success(function(data) {
- $scope.todos = data;
- });
- } else {
- Todos.update($scope.formData._id, $scope.formData)
- .success(function(data) {
- $scope.todos = data;
- });
- }
-
- $scope.loading = false;
- $scope.formData = {};
- $scope.submit = "Create";
- };
-
- // CREATE ==================================================================
- $scope.edit = function (id) {
- Todos.get(id)
- .success(function(data) {
- $scope.formData = data;
- $scope.submit = "Save";
- $scope.loading = false;
- });
- };
-
- // UPDATE ==================================================================
- $scope.update = function(todo) {
- $scope.updateData(todo, todo.text)
- };
-
- $scope.updateData = function(todo, data) {
- $scope.loading = true;
-
- Todos.update(todo._id, {done: todo.done, text: data})
- .success(function(data) {
- $scope.todos = data;
- });
- };
-
- // DELETE ==================================================================
- $scope.delete = function(id) {
- $scope.loading = true;
-
- Todos.delete(id)
- .success(function(data) {
- $scope.loading = false;
- $scope.todos = data;
- });
- };
-});
View
69 public/js/controllers/todo_controller.js
@@ -0,0 +1,69 @@
+angular.module('TodoController', [])
+ .controller('todoController', function($scope, $http, Todo) {
+ $scope.formData = {};
+ $scope.submit = "Create";
+ $scope.loading = true;
+
+ // GET =====================================================================
+ Todo.list()
+ .success(function(data) {
+ $scope.todos = data;
+ $scope.loading = false;
+ });
+
+ // CREATE AND SAVE =========================================================
+ $scope.save = function() {
+ $scope.loading = true;
+
+ if ($scope.formData._id == undefined) {
+ Todo.create($scope.formData)
+ .success(function(data) {
+ $scope.todos = data;
+ });
+ } else {
+ Todo.update($scope.formData._id, $scope.formData)
+ .success(function(data) {
+ $scope.todos = data;
+ });
+ }
+
+ $scope.loading = false;
+ $scope.formData = {};
+ $scope.submit = "Create";
+ };
+
+ // CREATE ==================================================================
+ $scope.edit = function (id) {
+ Todo.get(id)
+ .success(function(data) {
+ $scope.formData = data;
+ $scope.submit = "Save";
+ $scope.loading = false;
+ });
+ };
+
+ // UPDATE ==================================================================
+ $scope.update = function(todo) {
+ $scope.updateData(todo, todo.text)
+ };
+
+ $scope.updateData = function(todo, data) {
+ $scope.loading = true;
+
+ Todo.update(todo._id, {done: todo.done, text: data})
+ .success(function(data) {
+ $scope.todos = data;
+ });
+ };
+
+ // DELETE ==================================================================
+ $scope.delete = function(id) {
+ $scope.loading = true;
+
+ Todo.delete(id)
+ .success(function(data) {
+ $scope.loading = false;
+ $scope.todos = data;
+ });
+ };
+ });
View
21 public/js/services/todo_factory.js
@@ -0,0 +1,21 @@
+// SERVICE FOR API CALLS =======================================================
+angular.module('TodoFactory', [])
+ .factory('Todo', function ($http) {
+ return {
+ list : function() {
+ return $http.get('/api/todos');
+ },
+ get : function(id) {
+ return $http.get('/api/todos/' + id);
+ },
+ create : function(data) {
+ return $http.post('/api/todos', data);
+ },
+ update : function(id, data) {
+ return $http.put('/api/todos/' + id, data);
+ },
+ delete : function(id) {
+ return $http.delete('/api/todos/' + id);
+ }
+ }
+ });
View
2  public/templates/todos.html
@@ -1,4 +1,4 @@
-<div ng-controller="todosController">
+<div ng-controller="todoController">
<div class="jumbotron">
<h3>You currently have <ng-pluralize count="todos.length" when="{'0': 'no todos', '1': '1 todo', 'other': '{} todos'}" /></h3>
Please sign in to comment.
Something went wrong with that request. Please try again.