[ADD] profile view

client/app.module.ts

@@ -12,18 +12,13 @@ import { EviewComponent }          from './eview.component';
 import { APP_ROUTES_PROVIDER }     from './app.routes';
 import { ProfileComponent }        from './profile.component';
 import { ProfileButtonComponent }  from './profile-button.component';
-// import { FormGroup }               from '@angular/forms';
-// import { FormControl }             from '@angular/forms';
-
 @NgModule({
   imports: [
     BrowserModule,
     HttpModule,
     JsonpModule,
     FormsModule,
     ReactiveFormsModule
-    // FormGroup,
-    // FormControl
   ],
   declarations: [ 
     AppComponent, 

client/event-form.component.ts

@@ -1,10 +1,12 @@
 // template for event-form. No functionality added to event services.
 import { Component } from '@angular/core';
-
+import { FormGroup, FormControl} from '@angular/forms';
+import { EvindService } from './evind.service';
 @Component({
     selector: 'event-form',
+    providers: [EvindService],
     template: `
-      <form class="form-horizontal" action="/api/events" method="post">
+      <form [formGroup]="form" (ngSubmit)="postEvent()" class="form-horizontal" action="/api/events" method="post">
         <fieldset>
 
         <!-- Form Name -->
@@ -15,7 +17,7 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="title">Event Name</label>  
           <div class="col-md-5">
-          <input id="title" name="title" type="text" placeholder="My event" class="form-control input-md">
+          <input formControlName="title" id="title" name="title" type="text" placeholder="My event" class="form-control input-md">
 
           </div>
         </div>
@@ -24,7 +26,7 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="eventDate">Event Date</label>  
           <div class="col-md-5">
-          <input id="eventDate" name="eventDate" type="date" placeholder="" class="form-control input-md">
+          <input formControlName="eventDate" id="eventDate" name="eventDate" type="date" placeholder="" class="form-control input-md">
 
           </div>
         </div>
@@ -33,7 +35,7 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="location">Event Location</label>  
           <div class="col-md-5">
-          <input id="location" name="location" type="text" placeholder="Location" class="form-control input-md">
+          <input formControlName="location" id="location" name="location" type="text" placeholder="Location" class="form-control input-md">
 
           </div>
         </div>
@@ -42,15 +44,15 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="description">Description</label>
           <div class="col-md-3">                     
-            <textarea class="form-control" id="description" placeholder="..." name="description"></textarea>
+            <textarea formControlName="description" class="form-control" id="description" placeholder="..." name="description"></textarea>
           </div>
         </div>
 
         <!-- Text input-->
         <div class="form-group">
           <label class="col-md-4 control-label" for="link">Event Link</label>  
           <div class="col-md-5">
-          <input id="link" name="link" type="text" placeholder="www.event.com" class="form-control input-md">
+          <input formControlName="link" id="link" name="link" type="text" placeholder="www.event.com" class="form-control input-md">
 
           </div>
         </div>
@@ -59,7 +61,7 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="imgUrl">Image Link</label>  
           <div class="col-md-5">
-          <input id="imgUrl" name="imgUrl" type="text" placeholder="www.event.com/picture.jpg" class="form-control input-md">
+          <input formControlName="imgUrl" id="imgUrl" name="imgUrl" type="text" placeholder="www.event.com/picture.jpg" class="form-control input-md">
 
           </div>
         </div>
@@ -69,12 +71,38 @@ import { Component } from '@angular/core';
         <div class="form-group">
           <label class="col-md-4 control-label" for="submit"></label>
           <div class="col-md-4">
-            <button id="submit" name="submit" class="btn btn-primary">Submit</button>
+            <button id="submit" name="submit" type="submit" class="btn btn-primary">Submit</button>
           </div>
         </div>
 
         </fieldset>
       </form>` 
 })
 
-export class EventFormComponent { }
+export class EventFormComponent {
+   form = new FormGroup({
+    title: new FormControl(),
+    location: new FormControl(),
+    link: new FormControl(),
+    eventDate: new FormControl(),
+    description: new FormControl(),
+    imgUrl: new FormControl(),
+  });
+   constructor(private _httpService: EvindService) {
+
+   }
+  postEvent() {
+    let eventToSend = {
+      title: this.form.value.title,
+      location: this.form.value.location,
+      link: this.form.value.link,
+      eventDate: this.form.value.eventDate,
+      description: this.form.value.description,
+      imgUrl: this.form.value.imgUrl
+    }
+    console.log(eventToSend);
+    this._httpService.postEvent(eventToSend).subscribe((res) => {
+      console.log('event posted');
+    })
+  }
+ }

client/eview.component.ts

@@ -45,22 +45,30 @@ import { FormControl } from '@angular/forms';
           </form>
         </div>
       </div>
-      <button (click)="toggleChat()">{{showChatText}}</button>
-      <div *ngIf="showChat">
-        <div id="chatroom">
-          <div class="chatheader">Event Chat Room</div><br>
-          <div id="chat-window">
-            <div id="output"></div>
-            <div id="feedback"></div>
+
+  <button (click)="toggleChat()">{{showChatText}}</button>
+  <div *ngIf="showChat">
+    <div id="chatroom">
+      <div class="chatheader">Event Chat Room</div><br>
+        <div id="chat-window">
+          <div id="output">
+          <ul>
+            <li *ngFor="let message of messages">
+              <b>{{message.handle}}</b>: {{message.message}}
+            </li>
+          </ul>
           </div>
-          <input id="handle" type="text" placeholder="Handle" />
-          <input id="message" type="text" placeholder="Message" />
-          <button id="send">Send</button>
+          <div id="feedback"></div>
         </div>
+        <form [formGroup]="form" (ngSubmit)="postMessage()">
+          <input formControlName="handle" placeholder="Handle">
+          <input formControlName="message" placeholder="Message">
+          <button type="submit">Send</button>
+        </form>
       </div>
-      <div class="entryBackLink"><a routerLink="/">Back</a></div>
-    </div> `
-
+  </div>
+  <div class="entryBackLink"><a routerLink="/">Back</a></div>
+</div> `
 })
 
 export class EviewComponent {
@@ -82,6 +90,13 @@ export class EviewComponent {
   name: string;
   image: string;
   userID: string;
+  messages: any[];
+  form = new FormGroup({
+    handle: new FormControl(),
+    message: new FormControl(),
+  })
+
+
 
   appointment = new FormGroup({
     phoneNumber: new FormControl('phoneNumber')
@@ -131,7 +146,10 @@ export class EviewComponent {
       console.error(error);
     }, () => {
       console.log('complete');
-    });
+    })
+
+
+
   }
   handleAttend() {
     if (this.name) {
@@ -149,6 +167,7 @@ export class EviewComponent {
     } else {
       this.showChat = true;
       this.showChatText = 'Hide event chat room';
+      this.getMessages();
     }
   }
   notiForm() {
@@ -158,4 +177,35 @@ export class EviewComponent {
       this.shownotiForm = true;
     }
   }
-}
+
+  getMessages() {
+    this._httpService.getMessages().subscribe((messages) => {
+      let mapped = messages.filter((message) => {
+        return message.event === this.eventName;
+      })
+      this.messages = mapped;
+    }, (err) => {
+      console.log(err);
+    }, () => {
+      console.log('messages received,', this.messages);
+    })
+  }
+
+  postMessage() {
+    console.log(this.form.get('handle'), this.form.get('name'));
+    let messageToSend = {
+      handle: this.form.value.handle,
+      message: this.form.value.message,
+      event: this.eventName,
+    }
+    this.messages.push(messageToSend);
+      this._httpService.postMessage(messageToSend).subscribe(() => {
+      console.log('Successful POST request');
+    }, error => {
+      console.error(error);
+    }, () => {
+      console.log('Request complete');
+    });
+  }
+
+}

client/evind.service.ts

@@ -20,4 +20,24 @@ export class EvindService {
         return res.json();
       });
   }
+
+  getMessages() {
+    return this._http.get('messages')
+    .map(res => {
+      return res.json();
+    })
+  }
+
+  postMessage(message) {
+    return this._http.post('messages', message)
+      .map(res => {
+        return res.json();
+      })
+  }
+  postEvent(event) {
+    return this._http.post('api/events/', event)
+      .map(res => {
+        return res;
+      })
+  }
 }

client/index.html

@@ -45,7 +45,6 @@ <h2>Test Chat</h2>
       });
     </script>
     <!-- 3. Add socket.io -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>
-    <script src="chat.js"></script>
+
   </body>
 </html>

package.json

@@ -50,6 +50,7 @@
     "feedme": "^0.3.2",
     "jquery": "^3.1.0",
     "moment": "^2.18.1",
+    "moment-timezone": "^0.5.13",
     "mongodb": "^2.2.5",
     "mongoose": "^4.5.8",
     "mongoose-findorcreate": "^2.0.0",
@@ -62,7 +63,6 @@
     "request": "^2.74.0",
     "request-promise": "^4.1.1",
     "rxjs": "5.0.0-beta.6",
-    "socket.io": "^2.0.3",
     "systemjs": "0.19.27",
     "typescript": "^1.8.10",
     "typings": "^1.0.4",

server/handlers/index.js

@@ -1,6 +1,6 @@
 const Event = require('../models/Event.js');
+const Message = require('../models/Message');
 const saveEvent = require('../controllers/eventcontroller');
-const passport = require('passport');
 
 module.exports = {
   getEvents: (req, res) => {
@@ -48,5 +48,31 @@ module.exports = {
         }
       });
     }
+  },
+  addMessage: (req, res, next) => {
+    console.log(req.body);
+    let incomingMessage = req.body;
+    Message.create({
+      handle: incomingMessage.handle,
+      message: incomingMessage.message,
+      event: incomingMessage.event,
+    }, (err, message) => {
+      if (err) {
+        console.log(err);
+        res.status(500).send('error posting message');
+      } else {
+        res.status(201).send(message);
+      }
+    });
+  },
+  getMessages: (req, res) => {
+    Message.find({}, (err, messages) => {
+      if (err) {
+        console.log(err);
+        res.status(500).send('error getting messages');
+      } else {
+        res.status(200).send(messages);
+      }
+    });
   }
 };

server/index.js

@@ -8,12 +8,12 @@ const session = require('express-session');
 const handlers = require('./handlers');
 const rss = require('./rss.js');
 const fbAuth = require('./config/facebook_passport');
-const socket = require('socket.io');
+// const socket = require('socket.io');
 const path = require('path');
 const momentTimeZone = require('moment-timezone');
 const moment = require('moment');
 const router = new express.Router();
-require('dotenv').config();
+
 require('./dbConnect');
 require('./config/passport')(passport);
 
@@ -212,6 +212,11 @@ app.get('/events/:id', (req, res) => {
 //add user to event
 app.post('/adduser', handlers.addToAttending);
 
+// Add to message board
+app.post('/messages', handlers.addMessage);
+
+app.get('/messages', handlers.getMessages);
+
 // Catch all other routes and return the index file
 app.get('*', (req, res) => {
   res.sendFile(path.join(__dirname, '../client/index.html'));
@@ -221,44 +226,47 @@ const server = app.listen(port, () => {
   console.log(`Listening on port: ${port}`);
 });
 
-// Socket
-const io = socket(server);
-
-io.on('connection', (socket) => {
-  console.log('made socket connection');
-  console.log('socket', socket.id);
-  socket.on('open', (data) => {
-    Message.find({ event: data.event }, (err, messages) => {
-      if (err) {
-        console.log(err);
-      } else {
-        messages.forEach((message) => {
-          const messageToSend = {
-            handle: message.handle,
-            message: message.message,
-            event: message.event,
-          };
-          socket.emit('chat', messageToSend);
-        });
-      }
-    });
-  });
-  socket.on('chat', (data) => {
-    Message.create({
-      handle: data.handle,
-      message: data.message,
-      event: data.event
-    }, (err, message) => {
-      if (err) {
-        console.log(err);
-      } else {
-        io.sockets.emit('chat', data);
-      }
-    });
-  });
 
-  socket.on('typing', (data) => {
-    socket.broadcast.emit('typing', data);
-  });
-});
+
+
+// Socket (Eventually...)
+// const io = socket(server);
+
+// io.on('connection', (socket) => {
+//   console.log('made socket connection');
+//   console.log('socket', socket.id);
+//   socket.on('open', (data) => {
+//     Message.find({ event: data.event }, (err, messages) => {
+//       if (err) {
+//         console.log(err);
+//       } else {
+//         messages.forEach((message) => {
+//           const messageToSend = {
+//             handle: message.handle,
+//             message: message.message,
+//             event: message.event,
+//           };
+//           socket.emit('chat', messageToSend);
+//         });
+//       }
+//     });
+//   });
+//   socket.on('chat', (data) => {
+//     Message.create({
+//       handle: data.handle,
+//       message: data.message,
+//       event: data.event
+//     }, (err, message) => {
+//       if (err) {
+//         console.log(err);
+//       } else {
+//         io.sockets.emit('chat', data);
+//       }
+//     });
+//   });
+
+//   socket.on('typing', (data) => {
+//     socket.broadcast.emit('typing', data);
+//   });
+// });
 

server/models/Message.js

@@ -9,17 +9,17 @@ const messageSchema = new Schema({
 });
 
 const Message = mongoose.model('Message', messageSchema);
+// TEST MESSAGE CREATION AND SAVE
+// const testMessage = new Message({
+//   handle: 'Jake',
+//   message: 'I am a test',
+//   event: 'coding frenzy',
+// });
 
-const testMessage = new Message({
-  handle: 'Jake',
-  message: 'I am a test',
-  event: 'coding frenzy',
-});
-
-testMessage.save((err) => {
-  if (err) {
-    console.log(err);
-  }
-});
+// testMessage.save((err) => {
+//   if (err) {
+//     console.log(err);
+//   }
+// });
 
 module.exports = Message;