Fixed routing lag causing random bug. Removed autopublish. Refactored. Orders home list.

.eslintrc.js

@@ -26,9 +26,10 @@ module.exports = {
     "Router": true,
 
     // aldeed:autoform
-    SimpleSchema: true
+    "SimpleSchema": true,
 
     // Project-specific.
+    "Chats": true
   },
 
   "plugins": ["react"],

.meteor/packages

@@ -16,7 +16,6 @@ standard-minifiers      # JS/CSS minifiers run for production mode
 es5-shim                # ECMAScript 5 compatibility for older browsers.
 ecmascript              # Enable ECMAScript2015+ syntax in app code
 
-autopublish             # Publish all data to the clients (for prototyping)
 iron:router
 accounts-password
 twbs:bootstrap

.meteor/versions

@@ -1,7 +1,6 @@
 accounts-base@1.2.2
 accounts-password@1.1.4
 anti:i18n@0.4.3
-autopublish@1.0.4
 autoupdate@1.2.4
 babel-compiler@5.8.24_1
 babel-runtime@0.1.4

client/available_user.html

@@ -0,0 +1,19 @@
+<!-- display an individual user -->
+<template name="available_user">
+  <div class="col-md-2">
+    <div class="user_avatar">
+      {{#if isMyUser _id}}
+        <div class="bg-success">{{getUsername _id}} (YOU)
+          <br/>
+          <img src="/{{profile.avatar}}" class="avatar_img">
+        </div>
+      {{else}}
+        <a href="/chat/{{_id}}">
+          {{getUsername _id}}
+          <br/>
+          <img src="/{{profile.avatar}}" class="avatar_img">
+        </a>
+      {{/if}}
+    </div>
+  </div>
+</template>

client/available_user.js

@@ -0,0 +1,10 @@
+Template.available_user.helpers({
+  getUsername: function (userId) {
+    const user = Meteor.users.findOne({ _id: userId });
+    return user.profile.username;
+  },
+
+  isMyUser: function (userId) {
+    return userId === Meteor.userId();
+  }
+});

client/available_user_list.html

@@ -0,0 +1,9 @@
+<!-- display a list of users -->
+<template name="available_user_list">
+  <h2>Choose someone to chat with:</h2>
+  <div class="row">
+    {{#each users}}
+      {{> available_user}}
+    {{/each}}
+  </div>
+</template>

client/available_user_list.js

@@ -0,0 +1,5 @@
+Template.available_user_list.helpers({
+  users: function () {
+    return Meteor.users.find({}, { sort: { "profile.username": 1 } });
+  }
+});

client/chat_page.html

@@ -0,0 +1,21 @@
+<!-- Top level template for the chat page -->
+<template name="chat_page">
+  <h2>Type in the box below to send a message!</h2>
+  <div class="row">
+    <div class="col-md-12">
+      <div class="well well-lg">
+        {{#each messages}}
+          {{> chat_message}}
+        {{/each}}
+      </div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-md-12">
+      <form class="js-send-chat">
+        <input class="input" type="text" name="chat" placeholder="type a message here...">
+        <button class="btn btn-default">send</button>
+      </form>
+    </div>
+  </div>
+</template>

client/chat_page.js

@@ -0,0 +1,38 @@
+
+Template.chat_page.helpers({
+  messages: function () {
+    const chat = Chats.findOne({ _id: Session.get("chatId" )});
+    return chat.messages;
+  },
+
+  other_user: function () {
+    return "";
+  }
+});
+
+Template.chat_page.events({
+  // this event fires when the user sends a message on the chat page
+  "submit .js-send-chat": function (event) {
+    // stop the form from triggering a page reload
+    event.preventDefault();
+    // see if we can find a chat object in the database
+    // to which we'll add the message
+    const chat = Chats.findOne({_id: Session.get("chatId")});
+    if (chat) {// ok - we have a chat to use
+      let msgs = chat.messages; // pull the messages property
+      if (!msgs) {// no messages yet, create a new array
+        msgs = [];
+      }
+      // is a good idea to insert data straight from the form
+      // (i.e. the user) into the database?? certainly not.
+      // push adds the message to the end of the array
+      msgs.push({ text: event.target.chat.value });
+      // reset the form
+      event.target.chat.value = "";
+      // put the messages array onto the chat object
+      chat.messages = msgs;
+      // update the chat object in the database.
+      Chats.update(chat._id, chat);
+    }
+  }
+});

client/minstant.html

@@ -0,0 +1,31 @@
+<head>
+  <title>minstant</title>
+</head>
+
+<body>
+</body>
+
+<!-- this is the main template used by iron:router to build the page -->
+<template name="ApplicationLayout">
+	{{> yield "header"}}
+
+	<div class="container">
+	{{> yield "main"}}
+	</div>
+</template>
+
+<!-- Top level template for the lobby page -->
+<template name="lobby_page">
+	{{> available_user_list}}
+</template>
+
+
+<!-- simple template that displays a message -->
+<template name="chat_message">
+	someone said: {{text}}
+	<br>
+</template>
+
+<template name="Loading">
+  Loading...
+</template>

client/navbar.html

@@ -0,0 +1,15 @@
+<!-- top level template for the nav bar -->
+<template name="navbar">
+  <nav class="navbar navbar-default">
+    <div class="container-fluid">
+      <div class="navbar-header">
+        <a class="navbar-brand" href="/">
+          Minstant!
+        </a>
+      </div>
+      <div class="nav navbar-nav">
+        {{> loginButtons}}
+      </div>
+    </div>
+  </nav>
+</template>

client/routes.js

@@ -0,0 +1,71 @@
+Meteor.subscribe("users");
+
+// set up the main template the the router will use to build pages
+Router.configure({
+  layoutTemplate: "ApplicationLayout"
+});
+
+// specify the top level route, the page users see when they arrive at the site
+Router.route("/", function () {
+  console.log("rendering root /");
+  this.render("navbar", { to: "header" });
+  this.render("lobby_page", { to: "main" });
+});
+
+// specify a route that allows the current user to chat to another users
+Router.route("/chat/:_id", {
+  subscriptions: function () {
+    Meteor._debug('subscriptions', arguments);
+    return Meteor.subscribe("chats");
+  },
+
+  action: function () {
+    Meteor._debug('action', arguments);
+    if (this.ready()) {
+      Meteor._debug("Ready");
+      // the user they want to chat to has id equal to
+      // the id sent in after /chat/...
+      const otherUserId = this.params._id;
+      // find a chat that has two users that match current user id
+      // and the requested user id
+      const filter = {
+        $or: [
+          {
+            user1Id: Meteor.userId(),
+            user2Id: otherUserId
+          },
+          {
+            user2Id: Meteor.userId(),
+            user1Id: otherUserId
+          }
+        ]
+      };
+      const chat = Chats.findOne(filter);
+      Meteor._debug(filter, chat);
+      // No chat matching the filter - need to insert a new one.
+      let chatId;
+      if (!chat) {
+        chatId = Chats.insert({
+          user1Id: Meteor.userId(),
+          user2Id: otherUserId
+        });
+        Meteor._debug("No chat found between " + Meteor.userId() + " and " + otherUserId + ". Created " + chatId);
+      }
+      // There is a chat going already - use that.
+      else {
+        chatId = chat._id;
+        Meteor._debug("Chat " + chatId + " found between " + Meteor.userId() + " and " + otherUserId + ".");
+      }
+      // Looking good, save the id to the session.
+      if (chatId) {
+        Session.set("chatId", chatId);
+      }
+      this.render("navbar", { to: "header" });
+      this.render("chat_page", { to: "main" });
+    }
+    else {
+      Meteor._debug('not ready');
+      this.render("Loading");
+    }
+  }
+});

lib/collections.js

@@ -0,0 +1 @@
+Chats = new Mongo.Collection("chats");

minstant.html

@@ -1,98 +0,0 @@
-<head>
-  <title>minstant</title>
-</head>
-
-<body>
-</body>
-
-<!-- this is the main template used by iron:router to build the page -->
-<template name="ApplicationLayout">
-	{{> yield "header"}}
-	
-	<div class="container">
-	{{> yield "main"}}
-	</div>
-</template>
-
-<!-- top level template for the nav bar -->
-<template name="navbar">
-<nav class="navbar navbar-default">
-  <div class="container-fluid">
-    <div class="navbar-header">
-      <a class="navbar-brand" href="/">
-        Minstant!
-      </a>
-    </div>
-    <div class="nav navbar-nav">
-    {{> loginButtons}}
-</div>
-  </div>
-</nav>
-</template>
-
-<!-- Top level template for the lobby page -->
-<template name="lobby_page">
-	{{> available_user_list}}
-</template>
-
-<!-- display a list of users -->
-<template name="available_user_list">
-	<h2>Choose someone to chat with:</h2>
-	<div class="row">
-	{{#each users}}
-	{{> available_user}}
-	{{/each}}
-</div>
-</template>
-
-<!-- display an individual user -->
-<template name="available_user">
-	<div class="col-md-2">
-		<div class="user_avatar">
-			{{#if isMyUser _id}} 
-			<div class="bg-success">{{getUsername _id}} (YOU)
-				<br/>
-				<img src="/{{profile.avatar}}" class="avatar_img">			
-			</div>
-			{{else}}
-			<a href="/chat/{{_id}}">
-				{{getUsername _id}}
-				<br/>
-				<img src="/{{profile.avatar}}" class="avatar_img">
-			</a>
-			{{/if}}
-		</div>
-	</div>
-</template>
-
-
-<!-- Top level template for the chat page -->
-<template name="chat_page">
-	<h2>Type in the box below to send a message!</h2>
-	<div class="row">
-		<div class="col-md-12">
-			<div class="well well-lg">
-			{{#each messages}}
-			{{> chat_message}}
-			{{/each}}
-			</div>	
-		</div>
-	</div>
-    <div class="row">
-		<div class="col-md-12">
-			<form class="js-send-chat">
-			<input class="input" type="text" name="chat" placeholder="type a message here...">
-			<button class="btn btn-default">send</button>
-		</form>
-		</div>
-	</div>
-</template>
-
-<!-- simple template that displays a message -->
-<template name="chat_message">
-	someone said: {{text}}
-	<br>
-</template>
-
-
-

minstant.js

@@ -1,119 +0,0 @@
-Chats = new Mongo.Collection("chats");
-
-if (Meteor.isClient) {
-  // set up the main template the the router will use to build pages
-  Router.configure({
-    layoutTemplate: 'ApplicationLayout'
-  });
-  // specify the top level route, the page users see when they arrive at the site
-  Router.route('/', function () {
-    console.log("rendering root /");
-    this.render("navbar", {to:"header"});
-    this.render("lobby_page", {to:"main"});  
-  });
-
-  // specify a route that allows the current user to chat to another users
-  Router.route('/chat/:_id', function () {
-    // the user they want to chat to has id equal to 
-    // the id sent in after /chat/... 
-    var otherUserId = this.params._id;
-    // find a chat that has two users that match current user id
-    // and the requested user id
-    var filter = {$or:[
-                {user1Id:Meteor.userId(), user2Id:otherUserId}, 
-                {user2Id:Meteor.userId(), user1Id:otherUserId}
-                ]};
-    var chat = Chats.findOne(filter);
-    if (!chat){// no chat matching the filter - need to insert a new one
-      chatId = Chats.insert({user1Id:Meteor.userId(), user2Id:otherUserId});
-    }
-    else {// there is a chat going already - use that. 
-      chatId = chat._id;
-    }
-    if (chatId){// looking good, save the id to the session
-      Session.set("chatId",chatId);
-    }
-    this.render("navbar", {to:"header"});
-    this.render("chat_page", {to:"main"});  
-  });
-
-  ///
-  // helper functions 
-  /// 
-  Template.available_user_list.helpers({
-    users:function(){
-      return Meteor.users.find();
-    }
-  })
- Template.available_user.helpers({
-    getUsername:function(userId){
-      user = Meteor.users.findOne({_id:userId});
-      return user.profile.username;
-    }, 
-    isMyUser:function(userId){
-      if (userId == Meteor.userId()){
-        return true;
-      }
-      else {
-        return false;
-      }
-    }
-  })
-
-
-  Template.chat_page.helpers({
-    messages:function(){
-      var chat = Chats.findOne({_id:Session.get("chatId")});
-      return chat.messages;
-    }, 
-    other_user:function(){
-      return ""
-    }, 
-
-  })
- Template.chat_page.events({
-  // this event fires when the user sends a message on the chat page
-  'submit .js-send-chat':function(event){
-    // stop the form from triggering a page reload
-    event.preventDefault();
-    // see if we can find a chat object in the database
-    // to which we'll add the message
-    var chat = Chats.findOne({_id:Session.get("chatId")});
-    if (chat){// ok - we have a chat to use
-      var msgs = chat.messages; // pull the messages property
-      if (!msgs){// no messages yet, create a new array
-        msgs = [];
-      }
-      // is a good idea to insert data straight from the form
-      // (i.e. the user) into the database?? certainly not. 
-      // push adds the message to the end of the array
-      msgs.push({text: event.target.chat.value});
-      // reset the form
-      event.target.chat.value = "";
-      // put the messages array onto the chat object
-      chat.messages = msgs;
-      // update the chat object in the database.
-      Chats.update(chat._id, chat);
-    }
-  }
- })
-}
-
-
-// start up script that creates some users for testing
-// users have the username 'user1@test.com' .. 'user8@test.com'
-// and the password test123 
-
-if (Meteor.isServer) {
-  Meteor.startup(function () {
-    if (!Meteor.users.findOne()){
-      for (var i=1;i<9;i++){
-        var email = "user"+i+"@test.com";
-        var username = "user"+i;
-        var avatar = "ava"+i+".png"
-        console.log("creating a user with password 'test123' and username/ email: "+email);
-        Meteor.users.insert({profile:{username:username, avatar:avatar}, emails:[{address:email}],services:{ password:{"bcrypt" : "$2a$10$I3erQ084OiyILTv8ybtQ4ON6wusgPbMZ6.P33zzSDei.BbDL.Q4EO"}}});
-      }
-    } 
-  });
-}

server/server.js

@@ -0,0 +1,31 @@
+// start up script that creates some users for testing
+// users have the username 'user1@test.com' .. 'user8@test.com'
+// and the password test123
+
+Meteor.startup(function () {
+  if (!Meteor.users.findOne()) {
+    for (let i = 1; i < 9; i++) {
+      let email = "user" + i + "@test.com";
+      let username = "user" + i;
+      let avatar = "ava" + i + ".png";
+      console.log("creating a user with password 'test123' and username/ email: " + email);
+      Meteor.users.insert({
+        profile: {
+          username: username,
+          avatar: avatar
+        },
+        emails: [{ address: email }],
+        services: { password: { "bcrypt": "$2a$10$I3erQ084OiyILTv8ybtQ4ON6wusgPbMZ6.P33zzSDei.BbDL.Q4EO" } }
+      });
+    }
+  }
+
+  Meteor.publish("chats", function () {
+    return Chats.find();
+  });
+  Meteor.publish("users", function () {
+    return Meteor.users.find();
+  });
+
+});
+