Angular demo

laracasts · Dec 17, 2013 · d00a4bb · d00a4bb
1 parent b1a39ea
commit d00a4bb
Show file tree

Hide file tree

Showing 7 changed files with 123 additions and 200 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,4 +3,5 @@
 composer.phar
 composer.lock
 .DS_Store
-Thumbs.db
+Thumbs.db
+.idea/
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
diff --git a/app/database/migrations/2013_12_17_154848_create_todos_table.php b/app/database/migrations/2013_12_17_154848_create_todos_table.php
@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+
+class CreateTodosTable extends Migration {
+
+	/**
+	 * Run the migrations.
+	 *
+	 * @return void
+	 */
+	public function up()
+	{
+		Schema::create('todos', function(Blueprint $table) {
+			$table->increments('id');
+			$table->text('body');
+			$table->boolean('completed');
+			$table->timestamps();
+		});
+	}
+
+
+	/**
+	 * Reverse the migrations.
+	 *
+	 * @return void
+	 */
+	public function down()
+	{
+		Schema::drop('todos');
+	}
+
+}
diff --git a/app/models/Todo.php b/app/models/Todo.php
@@ -0,0 +1,10 @@
+<?php
+
+class Todo extends Eloquent {
+	protected $guarded = []; // just for demo
+
+    public function getCompletedAttribute($value)
+    {
+        return (boolean) $value;
+    }
+}
diff --git a/app/routes.php b/app/routes.php
@@ -1,17 +1,18 @@
 <?php
 
-/*
-|--------------------------------------------------------------------------
-| Application Routes
-|--------------------------------------------------------------------------
-|
-| Here is where you can register all of the routes for an application.
-| It's a breeze. Simply tell Laravel the URIs it should respond to
-| and give it the Closure to execute when that URI is requested.
-|
-*/
-
 Route::get('/', function()
 {
-	return View::make('hello');
-});
+    return View::make('index');
+});
+
+Route::get('todos', function()
+{
+    return Todo::all();
+});
+
+Route::post('todos', function()
+{
+    return Todo::create(Input::all());
+});
+
+
diff --git a/app/views/index.php b/app/views/index.php
@@ -0,0 +1,35 @@
+<!doctype html>
+<html lang="en" ng-app>
+<head>
+    <meta charset="UTF-8">
+    <title>Angular Training</title>
+    <style>
+        small { font-size: .8em; color: grey; }
+    </style>
+</head>
+
+<body ng-controller="TodosController">
+
+    <h1>
+        Todos
+        <small ng-if="remaining()">({{ remaining() }} remaining)</small>
+    </h1>
+
+    <input type="text" placeholder="Filter todos" ng-model="search">
+
+    <ul>
+        <li ng-repeat="todo in todos | filter:search">
+            <input type="checkbox" ng-model="todo.completed">
+            {{ todo.body }}
+        </li>
+    </ul>
+
+    <form ng-submit="addTodo()">
+        <input type="text" placeholder="Add new task" ng-model="newTodoText">
+        <button type="submit">Add Task</button>
+    </form>
+
+    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
+    <script src="/js/main.js"></script>
+</body>
+</html>
diff --git a/public/js/main.js b/public/js/main.js
@@ -0,0 +1,28 @@
+function TodosController($scope, $http) {
+
+    $http.get('/todos').success(function(todos) {
+        $scope.todos = todos;
+    });
+
+    $scope.remaining = function() {
+        var count = 0;
+
+        angular.forEach($scope.todos, function(todo) {
+            count += todo.completed ? 0 : 1;
+        });
+
+        return count;
+    }
+
+    $scope.addTodo = function() {
+        var todo = {
+            body: $scope.newTodoText,
+            completed: false
+        };
+
+        $scope.todos.push(todo);
+
+        $http.post('todos', todo);
+    };
+
+}