trying to fix alerts...

app.coffee

@@ -1,7 +1,7 @@
-todos = new Meteor.Collection "todos"
+notes = new Meteor.Collection "notes"
 
 if Meteor.isServer
-  #todos.insert { content: "Example" } unless todos.find().fetch().length > 0
+  #notes.insert { content: "Example" } unless notes.find().fetch().length > 0
   # Accounts
   ###
   Accounts.registerLoginHandler (req) ->
@@ -18,48 +18,55 @@ if Meteor.isServer
     loginExpirationInDays: 1
   }
 
-  Meteor.publish "todos", ->
-    todos.find( { userId: @userId } )
+  Meteor.publish "my-notes", ->
+    notes.find( { userId: @userId } ) unless not @userId
 
 if Meteor.isClient
-  Meteor.subscribe "todos"
+  Meteor.subscribe "my-notes"
   # Notes template
   Template.notes.notes = ->
-    todos.find().fetch()
+    notes.find().fetch()
   Template.notes.events {
     'click .delete': ->
-      todos.remove @_id
+      notes.remove @_id
   }
-  # Template for new notes
-  Template.adder.events {
-    'keypress #newNote': (e,template) ->
-      if e.keyCode is 13
-        console.log Meteor.userId()
-        todos.insert {
-          content: template.find('#newNote').value
-          userId: Meteor.userId()
-        }
-        template.find('#newNote').value = ""
-  }
-  # Auth template
+
+  # Auth
+  Template.auth.alerts = []
+  Template.auth.errCallback = (err) ->
+    Template.auth.alert { msg: err.reason }
+
+  Template.auth.alert = (add,remove) ->
+    if add then Template.auth.alerts.push add;
+    if remove
+      Template.auth.alerts.splice Template.auth.alerts.indexOf(remove), 1
+    Template.auth.alerts
+
   Template.auth.events {
+    'click .delete': (e,template) -> Template.auth.alert null, this
     'keypress .login': (e,template) ->
-      if e.keyCode is 13
-        # Login
-        mail = template.find('#mail').value; pass = template.find('#pass').value
-        Accounts.loginWithPassword mail, pass, (err) ->
-          if err then console.log err else console.log "OK"
+      mail = template.find('#mail').value; pass = template.find('#pass').value
+      if e.keyCode is 13 # Login
+        Meteor.loginWithPassword mail, pass, Template.auth.errCallback
+    # Login
     'click #login': (e,template) ->
       mail = template.find('#mail').value; pass = template.find('#pass').value
-      Meteor.loginWithPassword mail, pass, (err) ->
-        if err then console.log err else console.log "OK"
+      Meteor.loginWithPassword mail, pass, Template.auth.errCallback
+    # Register
     'click #register': (e,template) ->
       mail = template.find('#mail').value; pass = template.find('#pass').value
-      Accounts.createUser { email: mail, password: pass }, (err) ->
-        if err then console.log err else console.log "OK"
+      Accounts.createUser { email: mail, password: pass }, Template.auth.errCallback
   }
   # User Logged In
   Template.userInfo.events {
     'click #logout': (e,template) ->
       Meteor.logout()
+    'keypress #newNote': (e,template) ->
+      if e.keyCode is 13
+        notes.insert {
+          content: template.find('#newNote').value
+          userId: Meteor.userId()
+        }
+        template.find('#newNote').value = ""
   }
+  Template.userInfo.in = -> Meteor.user().emails[0].address

index.html

@@ -11,10 +11,9 @@
     </div>
     <div class="center-block" id="quicknotes">
       {{> notes}} {{#if currentUser}}
-      <div align="center">
-        {{> adder}} {{> userInfo}}
-      </div>
-      {{/if}} {{#unless currentUser}} {{> auth}} {{/unless}}
+      <div align="center"> {{> userInfo}} </div>
+      {{/if}}
+      {{#unless currentUser}} <div align="center">{{> auth}}</div>{{/unless}}
     </div>
   </div>
 </body>
@@ -22,31 +21,37 @@
 <template name="notes">
   <ul class="list-group">
     {{#each notes}}
-    <li class="list-group-item">
+    <li class="note list-group-item">
       {{content}}
-      <button type="button" class="btn btn-danger pull-right delete">
+      <!--<button type="button" class="btn btn-danger pull-right delete">
         <i class="fa fa-trash-o"></i>
-      </button>
+      </button>-->
+      <button type="button" class="delete close">&times;</button>
     </li>
     {{/each}}
   </ul>
 </template>
 
-<template name="adder">
-  <input type="text" id="newNote" class="form-control" placeholder="Add new note">
-</template>
-
 <template name="auth">
   <p align="center">
     Register a new Account or login
   </p>
+  {{#each alerts}}
+    <div class="alert alert-warning">
+      {{msg}}
+      <button type="button" class="delete close">&times;</button>
+    </div>
+  {{/each}}
   <input type="text" id="mail" class="form-control login" placeholder="Email">
-  <input type="text" id="pass" class="form-control login" placeholder="Password">
+  <input type="password" id="pass" class="form-control login" placeholder="Password">
   <br>
-  <button type="button" id="register" class="btn btn-info">Register</button>
-  <button type="button" id="login" class="btn btn-info">Login</button>
+  <p>Password must be at least 8 characters. Email must be a valid email</p>
+  <button type="button" id="register" class="btn-login btn btn-info">Register</button>
+  <button type="button" id="login" class="btn-login btn btn-info">Login</button>
 </template>
 
 <template name="userInfo">
+  <input type="text" id="newNote" class="form-control" placeholder="Add new note">
+  <p>Logged in as {{in}}</p>
   <button type="button" id="logout" class="btn btn-danger">Logout</button>
 </template>

style.css

@@ -15,6 +15,19 @@ input {
   max-width: 500px;
 }
 
+.delete {
+  margin-top: -2px;
+}
+
 #newNote {
   max-width: 250px;
+  margin-bottom: 10px;
+}
+
+#mail {
+  margin-bottom: 10px;
+}
+
+.btn-login {
+  width: 100px;
 }