Intro & What was I trying to solve?
Quick app Structure overview
Two pages - home, and remote workers
Camera access and storage - HTML 5, Base64
Overview of Code
Show it’s practical use
Management of users & DB:
Houston for Admin
RoboMongo
Ability to call/IM someone:
_loginButtonsAdditionalLoggedInDropdownActions
Meteor Toys - Bug in query
I’m Paul Sainsbury - @Rathlan on twitter. Since September last year I moved to an “Operations” role which has meant no official development time at work, so after 13-14 years of .Net development I’ve been expanding my knowledge on other frameworks, and have grown to love Meteor.
One of the problems we have at the office is that we’re trying to develop a culture of “working remotely” but are struggling to easily know when people are available or not. I’d read how some companies end up having group Skype sessions, or a “video portal” where you can always see into the remote worker’s “home office”.
It’s very “big brother”, but this was more of a thought idea than anything else. Since that our bandwidth is not that great, I thought a small photo from a web cam every minute or so would be far better than a permanently open video/voice connection.
The basic idea was to have a landing page, and once you’re logged in, you get to see the remote workers. I wanted to be able to specify whether you were available, away, dnd, etc. (The blurred out image is of a work colleague who I didn’t ask permission to use his picture)
I need to track “users”, as well as users that are setup as “remote workers”, store the images, maintain their status, and do some simple admin tasks.
I went with using HTML 5 access to the camera, because I didn’t think to search for a meteor package to help me out, and because I wanted to learn about HTML 5 access.
Be careful about the image sizes you’re handling if you’re going to store in the DB - Base64 does not compress.
You can use mongo db directly, it’s hard work, but it’s good to know how the underlying database works.
Use Mongo DB University for some great learning resources. Next batch starting in August 2015.
You can use Robo mongo locally which makes life really easy. Especially if you need a quick overview of the structure of your database.
But - if you can access your mongo db remotely, you’re exposing your data - so how do you get this kind of access without exposing yourself?
Enter Houston:admin - this gives you a simple way to access your database details remotely, and create, edit, or delete items there.
The interface is pretty simple.
By default it doesn’t let you see users or the houston admins, if you want to open that up, you can simply tell Houston to add those collections to the interface.
When exposing User data - you must always be careful to not expose too much data. I tested the code at the top in Mongo and was sure it was working correctly, so I translated it directly into Meteor in the code below.
Anyone spot problems?
db.getCollection('users').find({}, {
_id : 1,
username: 1,
'profile.firstName' : 1,
'profile.callUrl' : 1,
'profile.chatUrl' : 1
})
I’m going to show you how I found the bug, and what I had to do to fix it. I’ll be showing you Meteor Toys - pro version, but the free version includes the tools I’m going to be using here.