@@ -1,3 +1,4 @@
+
 
 var url="http://localhost:3000/api/";
 angular.module('thoughtsApp', [])
@@ -5,6 +6,7 @@ .controller('ThoughtsController', function(
         $scope,
         $http
     ) {
+
     var thoughtsList = this;
     if(window.sessionStorage.getItem('thoughtsToken'))
     {
@@ -13,6 +15,11 @@ }else{
         $scope.userLogged=false;
     }
 
+    $scope.availableAvatars=[
+        "img/icons/animals/cat.png",
+        "img/icons/animals/crab.png",
+        "img/icons/animals/toucan.png"
+    ];
     $http({
         method : "GET",
         url : url + "thoughts"
@@ -21,10 +28,35 @@ thoughtsList.thoughts = response.data;
     }, function myError(response) {
         $scope.myWelcome = response.statusText;
     });
+
 
     thoughtsList.addTodo = function() {
       todoList.todos.push({text:todoList.todoText, done:false});
       todoList.todoText = '';
+    };
+
+    $scope.signin = function(){
+        ActivateLoadBar();
+
+        var obj = {
+            username: $scope.username,
+            password: $scope.password,
+            description: $scope.description,
+            mail: $scope.mail,
+            avatar: $scope.avatar
+        };
+        $http({
+            method : "POST",
+            url : url + "users",
+            data: obj
+        }).then(function mySucces(response) {
+                toastr.success("Signed in, now login");
+                setTimeout(function(){
+                    window.location="login.html";
+                }, 1000);
+        }, function myError(response) {
+            toastr.error(response.statusText);
+        });
     };
 
     $scope.login = function(){

@@ -9,7 +9,7 @@ <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>
 
       <!--Let browser know website is optimized for mobile-->
       <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-      <title>Thoughts - new thought</title>
+      <title>Thoughts - login</title>
 
       <!-- ANGULAR -->
       <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

@@ -24,8 +24,8 @@ <li><a ng-click="logout()"><i class='material-icons'>power_settings_new</i></a></li>
 
             </ul>
             <ul class='right' ng-hide="userLogged">
-
-                <li><a href='login.html'><i class='material-icons'>input</i></a></li>
+                <li><a href='signup.html'><i class='material-icons'>person_pin</i></a></li>
+                <li><a href='login.html'><i class='material-icons'>vpn_key</i></a></li>
 
 
             </ul>

@@ -0,0 +1,75 @@
+
+  <!DOCTYPE html>
+  <html ng-app="thoughtsApp">
+    <head>
+      <!--Import Google Icon Font-->
+      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+      <!--Import materialize.css-->
+      <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>
+
+      <!--Let browser know website is optimized for mobile-->
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+      <title>Thoughts - signup</title>
+
+      <!-- ANGULAR -->
+      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
+    </head>
+
+    <body ng-controller="ThoughtsController">
+
+        <div ng-include="'menu.htm'"></div>
+
+        <div class="container">
+            <div class="row">
+                <div class="input-field col s12">
+                  <input ng-model="username" id="username" type="text" class="validate">
+                  <label for="username">Username</label>
+                </div>
+            </div>
+            <div class="row">
+                <div class="input-field col s12">
+                  <input ng-model="password" id="password" type="password" class="validate">
+                  <label for="password">Password</label>
+                </div>
+            </div>
+            <div class="row">
+                <div class="input-field col s12">
+                  <input ng-model="description" id="description" type="text" class="validate">
+                  <label for="description">Description</label>
+                </div>
+            </div>
+            <div class="row">
+                <div class="input-field col s6">
+                  <input ng-model="mail" id="mail" type="email" class="validate">
+                  <label for="mail">Mail</label>
+                </div>
+                <div class="input-field col s6">
+                  <input ng-model="avatar" id="avatar" type="email" class="validate">
+                  <label for="avatar">Avatar</label>
+                </div>
+            </div>
+
+            <a href="index.html" class="waves-effect waves-light btn red lighten-2 ">Cancel</a>
+            <a ng-click="signin()" class="waves-effect waves-light btn indigo lighten-2 right">Login</a>
+
+        </div>
+
+
+
+
+
+
+
+
+      <!--Import jQuery before materialize.js-->
+      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
+      <script type="text/javascript" src="js/materialize.min.js"></script>
+
+      <script src="jslib/toastr.js"></script>
+      <link type="text/css" rel="stylesheet" href="jslib/toastr.css"/>
+
+      <script src="controllers.js"></script>
+
+
+    </body>
+  </html>

@@ -0,0 +1,59 @@
+
+  <!DOCTYPE html>
+  <html ng-app="thoughtsApp">
+    <head>
+      <!--Import Google Icon Font-->
+      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+      <!--Import materialize.css-->
+      <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>
+
+      <!--Let browser know website is optimized for mobile-->
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+      <title>Thoughts</title>
+
+      <!-- ANGULAR -->
+      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
+    </head>
+
+    <body ng-controller="ThoughtsController as thoughtsList">
+
+        <div ng-include="'menu.htm'"></div>
+
+        <div class="container">
+
+            <div>
+                <ul class="collection">
+                    <li class="collection-item avatar" ng-repeat="thought in thoughtsList.thoughts | orderBy: '-time'">
+                        <img ng-src="img/icons/animals/{{thought.avatar}}.png" class="circle">
+                        <a ng-href="user.html?={{thought.username}}" class="title">
+                            {{thought.username}}
+                        </a>
+                        <div class="chip">{{thought.time | date:'HH:mm'}}</div>
+                        <p>{{thought.content}}</p>
+                        <a href="#!" class="secondary-content"><i class="material-icons indigo-text text-lighten-2">grade</i></a>
+
+                    </li>
+                </ul>
+            </div>
+
+        </div>
+
+
+
+
+
+
+
+
+      <!--Import jQuery before materialize.js-->
+      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
+      <script type="text/javascript" src="js/materialize.min.js"></script>
+
+      <script src="jslib/toastr.js"></script>
+      <link type="text/css" rel="stylesheet" href="jslib/toastr.css"/>
+
+      <script src="controllers.js"></script>
+
+
+    </body>
+  </html>