Lab kerry

.gitignore

@@ -0,0 +1,98 @@
+
+# Created by https://www.gitignore.io/api/osx,node
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+node_modules
+log.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+.babelrc
+build
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+db/
+.vscode/
+
+# Typescript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+
+### OSX ###
+*.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+# End of https://www.gitignore.io/api/osx,node

README.md

@@ -1,19 +1,9 @@
-![cf](https://i.imgur.com/7v5ASc8.png) 43: Socket IO with Vanilla JS
-===
+#41 - Messenger App
 
-# Submission Instructions
-* Work in a fork of this repository
-* Work in a branch on your fork
-* Write all of your code in a directory named `lab-` + `<your name>` **e.g.** `lab-susan`
-* Submit a pull request to this repository
-* Submit a link to your pull request on canvas
-* Submit a question, observation, and how long you spent on canvas 
+##Description
 
-## Learning Objectives  
-* Students will learn to add real time connections from their client to their server
-* Students will gain more experience working with Vanilla JS
+This app allows the user to input a username and a message, which is rendered to the DOM.  It retains a timestamp and the user's name unless they wish to change it.  These inputs are sent to the backend where they are compiled and appended to the DOM. Once sent back from the backend, each message is logged beneath the chat input.
 
-#### Feature Tasks  
 #### Frontend 
 * Create a simple website where users can chat
 * Create an input that allows a user to choose their username
@@ -40,16 +30,3 @@
   * In your subscibers publish data to the frontends to update the chat
 * You do not need to store data to a database. It's OK to store data in the
   global state of the server for now.
-
-#### Documentation  
-Write a description of the project in your README.md
-
-#### Testing  
-Tests are not required.
-
-## Stretch Goals
-* (Medium) Save the chat history in MongoDB so it persists even if the server
-  restarts.
-* (Medium) Allow users to input a URL of an image to use as a profile picture
-* (Hard) Allow users to directly message each other privately
-* Have fun and add any other chat features you can imagine!

index.js

@@ -0,0 +1,37 @@
+'use strict';
+
+const express = require('express');
+const app = express();
+const http = require('http').Server(app);
+const io = require('socket.io')(http);
+
+app.use(express.static('./public'));
+
+const USERS = {};
+
+io.on('connection', (socket) => {
+	USERS[socket.id] = {};
+	USERS[socket.id].username = 'foobar';
+
+	console.log('JOINED', socket.id);
+
+	socket.on('disconnect', () => {
+		console.log('LEFT', socket.id);
+	});
+
+	socket.on('send-message', (data) => {
+		data.username = USERS[socket.id].username
+		data.timestamp = new Date().toLocaleTimeString();
+
+		io.emit('receive-message', data);
+	});
+
+	socket.on('set-username', (data) => {
+		USERS[socket.id].username = data.username;
+	})	
+});
+
+	let port = 3000;
+	http.listen(port, () => {
+		console.log('http://localhost:' + port);
+	});