I have a chat application where users send messages to each other(private chat). Now using that i want to create chat application where all the users can send messages to admin individually, how can i do that.
server.js
'use strict';
const express = require("express");
const http = require('http');
const socketio = require('socket.io');
const bodyParser = require('body-parser');
const routes = require('./utils/routes');
const config = require('./utils/config');
class Server{
constructor(){
this.port = process.env.PORT || 81;
this.host = `localhost`;
this.app = express();
this.http = http.Server(this.app);
this.socket = socketio(this.http);
}
appConfig(){
this.app.use(
bodyParser.json()
);
new config(this.app);
}
/* Including app Routes starts*/
includeRoutes(){
new routes(this.app,this.socket).routesConfig();
}
/* Including app Routes ends*/
appExecute(){
this.appConfig();
this.includeRoutes();
this.http.listen(this.port, this.host, () => {
console.log(`Listening on http://${this.host}:${this.port}`);
});
}
}
const app = new Server();
app.appExecute();
routes.js
'use strict';
class Routes{
constructor(app,socket){
this.app = app;
this.io = socket;
/*
Array to store the list of users along with there respective socket id.
*/
this.users = [];
}
appRoutes(){
this.app.get('/', (request,response) => {
response.render('index');
});
}
socketEvents(){
this.io.on('connection', (socket) => {
socket.on('username', (userName) => {
this.users.push({
id : socket.id,
userName : userName
});
let len = this.users.length;
len--;
this.io.emit('userList',this.users,this.users[len].id);
});
socket.on('getMsg', (data) => {
socket.broadcast.to(data.toid).emit('sendMsg',{
msg:data.msg,
name:data.name
});
});
socket.on('disconnect',()=>{
for(let i=0; i < this.users.length; i++){
if(this.users[i].id === socket.id){
this.users.splice(i,1);
}
}
this.io.emit('exit',this.users);
});
});
}
routesConfig(){
this.appRoutes();
this.socketEvents();
}
}
module.exports = Routes;
index.html
<html ng-app="app" ng-controller="app">
<head>
<title>Sending message to specific client</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4 user-list">
<h2>List of Users</h2>
<ul class="list-group">
<li class="list-group-item"
ng-repeat="user in userList"
ng-class="{ 'active' : user.id == selectedUser}"
ng-click = seletedUser(user.id);
ng-style="{
'cursor': user.id === socketId ? 'not-allowed' :'pointer'
}"
>
<span id='' ></span>
</li>
</ul>
</div>
<div class="col-md-8 message-box">
<h2>Messages sent by users</h2>
<div class="message-container">
<ul class="list-group">
<li class="list-group-item"
ng-repeat="message in messages"
>
says:
</li>
</ul>
<div class="alert alert-warning" ng-show='messages.length == 0'>
No messages for you.
</div>
</div>
<div class="message-sender">
<textarea class="form-control" ng-model='message' ng-keypress="sendMsg($event)"></textarea>
</div>
</div>
</div>
</div>
</body>
<script src="/socket.io/socket.io.js"></script>
<script src="js/angular.min.js"></script>
<script src="js/script.js"></script>
</html>
config.js
class Config{
constructor(app){
// Setting .html as the default template extension
app.set('view engine', 'html');
// Initializing the ejs template engine
app.engine('html', require('ejs').renderFile);
// Telling express where it can find the templates
app.set('views', (__dirname + '/../views'));
//Files
app.use(require('express').static(require('path').join('public_data')));
}
}
module.exports = Config;
via akhil reddy
No comments:
Post a Comment