Kezdőlap Felfedezés Súgó
Bejelentkezés
tflucke
/
Simple-Chat-Room
tükrözi: https://github.com/tflucke/Simple-Chat-Room.git
1
0
Másolás 0
Fájlok Problémák 0 Wiki
Forráskód Böngészése

Inital commit

Tom Flucke 10 éve
commit
95927307d5
3 módosított fájl, 162 hozzáadás és 0 törlés
Osztott Nézet Diff Statisztika Mutatása
  1. 5 0
      README
  2. 93 0
      index.html
  3. 64 0
      main.js

+ 5 - 0
README
Fájl Megtekintése 

@@ -0,0 +1,5 @@
 
+Setup:
 
+npm install socket.io
 
+
 
+Run:
 
+node main.js

+ 93 - 0
index.html
Fájl Megtekintése 

@@ -0,0 +1,93 @@
 
+<html>
 
+	<head>
 
+		<title>Basic Chat Page</title>
 
+		<style type="text/css">
 
+			textarea
 
+			{
 
+				width: 100%;
 
+				resize: none;
 
+				min-height: 2em;
 
+			}
 
+			.italics
 
+			{
 
+				font-style: italic;
 
+			}
 
+		</style>
 
+		<script src="socket.io/socket.io.js"></script>
 
+		<script type="text/javascript">
 
+			var user;
 
+			var socket = io.connect(window.location.href);
 
+			socket.on('notification', function (data)
 
+			{
 
+				var elm = document.getElementById("display");
 
+				elm.innerHTML = elm.innerHTML + data;
 
+			});
 
+			function init()
 
+			{
 
+				do
 
+				{
 
+					user = window.prompt("Enter a username here (Minimum 2 chars).");
 
+				}
 
+				while (user == null || user.trim().length < 2);
 
+				ajax({username: user});
 
+			}
 
+			function autoGrow(element)
 
+			{
 
+				element.style.height = (element.scrollHeight)+"px";
 
+			}
 
+			function submit()
 
+			{
 
+				var elm = document.getElementById("userinput");
 
+				ajax({
 
+					username: user,
 
+					message: elm.value
 
+				});
 
+				elm.value = "";
 
+			}
 
+			function ajax(data, fn)
 
+			{
 
+/*				var xhttp = new XMLHttpRequest();
 
+				if (fn != undefined)
 
+				{
 
+					xhttp.onreadystatechange = function()
 
+					{
 
+						if (xhttp.readyState == 4 && xhttp.status == 200)
 
+						{
 
+							fn(xhttp.responseText);
 
+						}
 
+					};
 
+				}
 
+				xhttp.open("POST", "index.html", true);
 
+				xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
 
+				xhttp.send(jsonToURL(data));*/
 
+				socket.emit('notification', data);
 
+			}
 
+			function jsonToURL(data)
 
+			{
 
+				var result = "";
 
+				for (key in data)
 
+				{
 
+					result += encodeURIComponent(key)+"="+encodeURIComponent(data[key])+"&";
 
+				}
 
+				return result;
 
+			}
 
+		</script>
 
+	</head>
 
+	<body onload="init();">
 
+		<table style="width: 100%; height: 100%;">
 
+			<tr>
 
+				<td colspan="2" style="height: 100%;">
 
+					<div id="display" style="height: 100%; border: 1px solid #000000;"></div>
 
+				</td>
 
+			</tr>
 
+			<tr>
 
+				<td style="width: 100%;">
 
+					<textarea id="userinput" style="overflow: hidden;" onkeyup="autoGrow(this);" placeholder="Type your message here!"></textarea>
 
+				</td>
 
+				<td>
 
+					<button type="button" id="enterButton" onclick="submit();">Enter</button>
 
+				</td>
 
+			</tr>
 
+		</table>
 
+	</body>
 
+</html>

+ 64 - 0
main.js
Fájl Megtekintése 

@@ -0,0 +1,64 @@
 
+var http = require('http');
 
+var fs = require('fs');
 
+var app = http.createServer(handler);
 
+var io = require('socket.io').listen(app);
 
+app.listen(8081);
 
+
 
+var userList = [];
 
+
 
+function handler(request, response)
 
+{
 
+	fs.readFile(__dirname + "/index.html", function(err, data)
 
+	{
 
+		if (err)
 
+		{
 
+			response.writeHead("500", {'Content-Type': 'text/plain'});
 
+			response.end("Internal server error loading page.");
 
+		}
 
+		else
 
+		{
 
+			response.writeHead("200", {'Content-Type': 'text/html'});
 
+			response.end(data);
 
+		}
 
+	});
 
+}
 
+
 
+io.on('connection', function(socket)
 
+{
 
+//	console.log("New user registered!");
 
+	userList.push(socket);
 
+	socket.on('notification', function (data)
 
+	{
 
+		//console.log(data);
 
+		if (data.message == undefined)
 
+		{
 
+//			console.log("New user message!");
 
+			sendMessage("<span class='italics'>" + data.username.replace(/</g,"&lt;") + " has joined the chat!</span>", false);
 
+		}
 
+		else
 
+		{
 
+//			console.log("New user message!");
 
+			sendMessage(data.username + ": " + data.message, true);
 
+		}
 
+	});
 
+});
 
+
 
+function sendMessage(text, check)
 
+{
 
+//	console.log(text);
 
+	if (check)
 
+	{
 
+		text = text.trim().replace(/</g,"&lt;");
 
+	}
 
+	for (var i = 0; i < userList.length; i++)
 
+	{
 
+		if (userList[i].connected)
 
+		{
 
+			userList[i].emit('notification', text+"<br />\n");
 
+		}
 
+		else
 
+		{
 
+			userList.splice(i--, 1);
 
+		}
 
+	}
 
+}