pushing messages into a div

10 files changed, 95 insertions, 32 deletions

diff --git a/public/js/index.js b/public/js/index.js
index 6e171fc..f46c1ac 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -5,6 +5,7 @@ var app = (function(){
     user.init()
     
     app.router = new SiteRouter ()
+    app.view = null
 
     $(window).on("focus", app.focus)
     $(window).on("blur", app.blur)
@@ -21,4 +22,6 @@ var app = (function(){
   }
   
   document.addEventListener('DOMContentLoaded', app.init)  
+  
+  return app
 })()
diff --git a/public/js/lib/views/index.js b/public/js/lib/views/index.js
index d5ec35d..a333b45 100644
--- a/public/js/lib/views/index.js
+++ b/public/js/lib/views/index.js
@@ -1,9 +1,9 @@
+var lobby, room
+
 var SiteRouter = Router.extend({
+
 	el: "body",
 	
-	events: {
-	},
-	
 	routes: {
 		"/":           'lobby',
 		"/v/:name":    'room',
@@ -11,7 +11,7 @@ var SiteRouter = Router.extend({
 	
 	initialize: function(){
 		if (! user.username) {
-		  $("#login").show()
+		  app.view = new LoginView()
 		}
 		else {
       this.route()
@@ -19,11 +19,12 @@ var SiteRouter = Router.extend({
   },
   
   lobby: function(){
-    this.view = new LobbyView ()
+    lobby = app.view = new LobbyView ()
   },
   
   room: function(name){
-    this.view = new RoomView (name)
+  console.log("hi")
+    room = app.view = new RoomView (name)
   },
 
 })
\ No newline at end of file
diff --git a/public/js/lib/views/lobby/index.js b/public/js/lib/views/lobby/lobby.js
index 0306445..6821436 100644
--- a/public/js/lib/views/lobby/index.js
+++ b/public/js/lib/views/lobby/lobby.js
@@ -1,17 +1,23 @@
 var LobbyView = View.extend({
 
+  el: "#lobby",
+
   events: {
-    "form submit": "join"
+    "submit form": "join"
   },
   
   initialize: function(){
     this.$createRoom = this.$("#create-room")
   },
   
-  join: function(){
+  join: function(e){
+    console.log("hwat")
+    e && e.preventDefault()
     var name = this.$createRoom.sanitizeName()
+    console.log("name")
+    
     if (! name) { return }
     window.location.href = "/v/" + name
   }
   
-})
\ No newline at end of file
+})
diff --git a/public/js/lib/views/login.js b/public/js/lib/views/login.js
index 325d22d..280f051 100644
--- a/public/js/lib/views/login.js
+++ b/public/js/lib/views/login.js
@@ -1,12 +1,16 @@
 var LoginView = View.extend({
+
   el: "#login",
   
   events: { 
-    "form submit": "save",
+    "submit form": "save",
   },
   
   initialize: function(){
     this.$el.show()
+    this.$username = this.$("#username")
+    this.$username.focus()
+    console.log(this.$username)
   },
   
   save: function(e){
diff --git a/public/js/lib/chat.js b/public/js/lib/views/room/chat.js
index 0968418..2c1140e 100644
--- a/public/js/lib/chat.js
+++ b/public/js/lib/views/room/chat.js
@@ -1,6 +1,8 @@
 var ChatView = View.extend({
 
-  template: $("#collaborator-template").html(),
+  el: "#chat",
+  
+  template: $("#message_template").html(),
 
   events: {
     "submit form": "send",
@@ -8,12 +10,19 @@ var ChatView = View.extend({
   },
   
   initialize: function(){
-    this.$msg = this.$("#message")
+    var $msg = this.$msg = this.$("#message")
     this.$messages = this.$("#messages")
     this.messages = this.$messages.get(0)
+    this.$msg.focus()
+    $(window).focus(function(){ $msg.focus() })
   },
   
+  seen: {},
   add: function(msg){
+    var key = msg.date + "_" + msg.nick
+    if (key in this.seen) return
+    this.seen[key] = true
+    
     var $el = $( this.template )
     $el.find(".nick").html(msg.nick)
     $el.find(".msg").html(msg.msg)
@@ -23,14 +32,20 @@ var ChatView = View.extend({
     }
   },
   
-  send: function(){
+  send: function(e){
+    e && e.preventDefault()
+    console.log("hi")
     var val = this.$msg.sanitize()
+    this.$msg.focus()
     if (! val) return
+    this.$msg.val("")
     var msg = {}
-    msg.room = room.name()
+    msg.room = room.name
     msg.msg = val
     msg.nick = user.username
-    // app.socket.send("message", msg)
+    msg.date = +new Date
+    this.add(msg)
+    app.socket.send("message", msg)
   },
   
   empty: function(){
diff --git a/public/js/lib/views/room/index.js b/public/js/lib/views/room/index.js
deleted file mode 100644
index 58d7449..0000000
--- a/public/js/lib/views/room/index.js
+++ /dev/null
@@ -1,10 +0,0 @@
-var RoomView = View.extend({
-
-  events: {
-  },
-  
-  initialize: function(name){
-    app.socket = ws.connect(name)
-  }
-  
-})
\ No newline at end of file
diff --git a/public/js/lib/views/room/room.js b/public/js/lib/views/room/room.js
new file mode 100644
index 0000000..c8d7f3f
--- /dev/null
+++ b/public/js/lib/views/room/room.js
@@ -0,0 +1,29 @@
+var chat
+
+var RoomView = View.extend({
+
+  events: {
+  },
+  
+  initialize: function(name){
+    this.name = name
+    chat = this.chatView = new ChatView ()
+    this.userlist = new UserlistView ()
+
+    app.socket = ws.connect(name)
+
+    app.socket.on("joined", function(msgs){
+      msgs && msgs.forEach(chat.add)
+    })
+    
+    app.socket.on("messages", function(msgs){
+      msgs && msgs.forEach(chat.add)
+    })
+    
+    app.socket.on("message", function(msg){
+      chat.add(msg)
+    })
+
+  }
+  
+})
\ No newline at end of file
diff --git a/public/js/lib/views/room/userlist.js b/public/js/lib/views/room/userlist.js
new file mode 100644
index 0000000..d638a02
--- /dev/null
+++ b/public/js/lib/views/room/userlist.js
@@ -0,0 +1,15 @@
+var UserlistView = View.extend({
+  
+  el: "#userlist",
+  
+  events: {
+  },
+  
+  initialize: function(){
+  },
+  
+  update: function(users){
+    
+  },
+  
+})
\ No newline at end of file
diff --git a/public/js/lib/ws.js b/public/js/lib/ws.js
index 3d62ef0..7d784ba 100644
--- a/public/js/lib/ws.js
+++ b/public/js/lib/ws.js
@@ -2,7 +2,7 @@ var ws = (function(){
   var ws = {}
   var socket, ready
 	ws.connect = function (room) {
-    if (this.socket) return;
+    if (ws.socket) return;
 
     var path = window.location.origin + '/' + room
 
diff --git a/public/js/vendor/view/router.js b/public/js/vendor/view/router.js
index 28905b2..ac2b5d4 100644
--- a/public/js/vendor/view/router.js
+++ b/public/js/vendor/view/router.js
@@ -15,7 +15,7 @@ var Router = View.extend({
 		}
 		
 		if (pathname in routes) {	
-			this[this.routes[pathname]](null)
+			this[this.routes[pathname]]()
 			return
 		}
 		
@@ -27,27 +27,27 @@ var Router = View.extend({
 			var routePath = route.split("/")
 			if (routePath[1] == path[1]) {
 				if (routePath[2] && routePath[2].indexOf(":") !== -1 && path[2] && (path[3] === routePath[3]) ) {
-					this[this.routes[route]](null, path[2])
+					this[this.routes[route]](path[2])
 					return
 				}
 				else if (routePath[2] == path[2]) {
 					if (routePath[3] && path[3]) {
 						if (routePath[3].indexOf(":") !== -1) {
-							this[this.routes[route]](null, path[3])
+							this[this.routes[route]](path[3])
 							return
 						}
 						else if (routePath[3] == path[3]) {
-							this[this.routes[route]](null)
+							this[this.routes[route]]()
 							return
 						}
 					}
 					else if (! routePath[3] && ! path[3]) {
-						this[this.routes[route]](null)
+						this[this.routes[route]]()
 						return
 					}
 				}
 				else if (! routePath[2] && (! path[2].length || ! path[2])) {
-					this[this.routes[route]](null)
+					this[this.routes[route]]()
 					return
 				}
 			}