-
-
Save theCaptain420/68f40d0bfcd5ee4ca08a9698a94905b6 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<title>Socket.IO chat</title> | |
<style> | |
* { margin: 0; padding: 0; box-sizing: border-box; } | |
body { font: 13px Helvetica, Arial; } | |
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; } | |
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; } | |
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; } | |
#messages { list-style-type: none; margin: 0; padding: 0; } | |
#messages li { padding: 5px 10px; } | |
#messages li:nth-child(odd) { background: #eee; } | |
</style> | |
</head> | |
<body> | |
<select id="friendslist" onchange="vaeglVen()"> | |
</select> | |
<ul id="messages"></ul> | |
<form action=""> | |
<input id="m" autocomplete="off" /><button>Send</button> | |
</form> | |
<script src="/socket.io/socket.io.js"></script> | |
<script src="https://code.jquery.com/jquery-1.11.1.js"></script> | |
<script> | |
function vaeglVen(){ | |
hvemSkriverJegTil = document.getElementById("friendslist").value; | |
console.log(document.getElementById("friendslist").value) | |
} | |
//Henter friendslist | |
/* | |
var xmlhttp = new XMLHttpRequest(); | |
xmlhttp.onreadystatechange = function() { | |
if(this.readyState == 4 && this.status == 200) { | |
var myObj = JSON.parse(this.responseText); | |
console.log( myObj.value); | |
} | |
}; | |
xmlhttp.open("GET", "https://172.20.10.5:3000/getChats", true); | |
xmlhttp.send(); | |
*/ | |
var pingPong = [{"id":"ajjskkksk123ws","name":"Mads"}, {"id":"ajjskodaoksdko2","name":"Mathias"},{"id":"ajjskkksk123ws","name":"Mikkel"}] | |
console.log(pingPong[1].name); | |
//Friendslist | |
var x = document.getElementById("friendslist"); | |
for (let index = 0; index < pingPong.length; index++) { | |
let option = document.createElement("option"); | |
option.text = pingPong[index].name; | |
x.add(option); | |
} | |
//Til at printe of sende beskeder. | |
$(function () { | |
var socket = io(); | |
var username = prompt('What\'s your username?'); | |
//var hvemSkriverJegTil = prompt("Hvem vil du skrive til?"); | |
socket.emit('new_client', username); | |
document.title = username + ' - ' + document.title; | |
$('form').submit(function(){ | |
//socket.emit('chat message',username+' : '+ $('#m').val()); | |
socket.emit('chat message',hvemSkriverJegTil+' : '+ $('#m').val()); | |
$('#messages').append($('<li>').text(username+" : "+$('#m').val())); | |
$('#m').val(''); | |
return false; | |
}); | |
socket.on('chat message', function(msg){ | |
console.log("Her : "+msg.search(hvemSkriverJegTil)) | |
if(msg.search(username)>(-1)){ | |
console.log(msg) | |
if(msg.search(hvemSkriverJegTil)==0){ | |
var res = msg.replace(hvemSkriverJegTil, " "); | |
$('#messages').append($('<li>').text(username+" "+res)); | |
}else{ | |
var res2 = msg.replace(username, " "); | |
$('#messages').append($('<li>').text(hvemSkriverJegTil+" "+res2)); | |
} | |
}else{ | |
} | |
}); | |
}); | |
</script> | |
</body> | |
</html> | |
________________________________________________________________________________________ | |
var app = require('express')(); | |
var http = require('http').Server(app); | |
var io = require('socket.io')(http); | |
app.get('/', function(req, res){ | |
res.sendFile(__dirname + '/chatSide.html'); | |
}); | |
//fixer Cross-Origin Resource Sharing (CORS) | |
app.use(function(req, res, next) { | |
res.header("Access-Control-Allow-Origin", "*"); | |
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); | |
next(); | |
}); | |
//get alle brugerens chats | |
app.get('/getChats',function(req,res){ | |
//Her skal vi have lavet noget, så den sender en list over id'er på hvem man chatter med. | |
//Aka noget ala. [{ajjskkksk123ws, sjiij222jk3jd, jijidkerjkk23123}] | |
var sendListe = [{"id":"ajjskkksk123ws","name":"Hans"}, {"id":"ajjskodaoksdko2","name":"Johan"}]; | |
res.sendFile(sendListe); | |
}); | |
http.listen(3000, function(){ | |
console.log('listening on *:3000'); | |
}); | |
io.on('connection', function(socket){ | |
socket.on('new_client',function(username){ | |
socket.broadcast.emit('new_client', socket.username); | |
socket.username = username; | |
socket.id = username; | |
console.log(socket.id) | |
console.log(username +' connected'); | |
}); | |
// | |
socket.on('disconnect',function(username){ | |
console.log( socket.username+' disconnected'); | |
}); | |
//En listener der venter på at 'chat message' eventet forekommer | |
socket.on('chat message', function(msg){ | |
io.emit('chat message', msg); | |
console.log(socket.username +' siger: ' + msg); | |
}); | |
}); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment