added server and client

2c773109 · Mahmoud Ibrahim Mohammad · 2c773109 · 2c773109 · 2c773109 · 2c773109
Commit 2c773109 authored Apr 17, 2020 by Mahmoud Ibrahim Mohammad
--- a/client/index.html
+++ b/client/index.html
+<!DOCTYPE HTML>
+<html>
+<head>
+    <script src="./main.js" type="text/javascript"></script>
+    <script src="index.js"></script>
+</head>
+
+<body>
+<div id="loading">
+    Laster....
+</div>
+
+<ul id="tavle" ></ul>
+
+<div>
+    <p>Navn: <input type="text" id="name"></p>
+    <p>Tekst: <input type="text" id="message" > <button id="submit" onclick="chat.sendMelding()">Send</button></p>
+</div>
+</body>
+</html>
\ No newline at end of file
--- a/client/index.js
+++ b/client/index.js
+class Chat {
+    constructor() {
+        var url = window.location.hostname;
+        this.ws = new WebSocket("ws://" + url + ":3001");
+
+        this.ws.onerror = (error) => {
+            $("#loading").html("ikke tilkoblet");
+        };
+
+        this.ws.onopen = () => {
+            $("#loading").html("WebSocket");
+        };
+
+        this.ws.onmessage = (event) => {
+            var json=JSON.parse(event.data);
+            if(json.message){
+                var date = new Date();
+                var hour = date.getHours();
+                var minute = date.getMinutes();
+                var time = hour + ':' + minute;
+                $("#tavle").append('<li>' + time + ' <b>' + json.message.name + ':</b> ' +  json.message.text +'</li>');
+            }
+        };
+
+        this.ws.onclose = function(message) {
+            $("#loading").html("ikke tilkoblet: Forbindelse lukket");
+        };
+    }
+
+    sendMelding() {
+        const navn = document.getElementById("name").value;
+        const tekst = document.getElementById("message").value;
+
+        if(this.ws.readyState==1) {
+            var json={"message": { "name": navn, "text": tekst}};
+            this.ws.send(JSON.stringify(json));
+        }
+    }
+}
+
+var chat;
+$(document).ready(function(){
+    chat = new Chat();
+});
\ No newline at end of file
--- a/client/main.js
+++ b/client/main.js
--- a/server/package.json
+++ b/server/package.json
+{
+  "name": "websocket_server",
+  "version": "1.0.0",
+  "description": "",
+  "main": "server.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "Mahmoud Ibrahim",
+  "license": "",
+  "dependencies": {
+    "express": "^4.17.1",
+    "nodemon": "^2.0.2",
+    "ws": "^7.2.3"
+  }
+}
--- a/server/server.js
+++ b/server/server.js
+'use strict';
+
+var express = require('express');
+var WebSocket = require('ws');
+
+var http_server = express();
+
+// To download and start WS client
+http_server.use(express.static(__dirname + "/../client"));
+
+var ws_server = new WebSocket.Server({ port: 3001 });
+
+var forbindelser = [];
+var meldinger = [];
+
+ws_server.on('connection', (connection) => {
+    console.log('forbindelse er satt opp');
+    forbindelser.push(connection);
+
+    meldinger.forEach((message) => {
+        connection.send(message);
+    });
+
+    connection.on('message', (message) => {
+        console.log("melding fra client: "+message);
+        meldinger.push(message);
+
+        ws_server.clients.forEach((client) => {
+            if (client.readyState === WebSocket.OPEN) {
+                client.send(message);
+            }
+        });
+    });
+
+    connection.on('close', () => {
+        console.log("Forbindelse lukket");
+    });
+
+    connection.on('error', (error) => {
+        console.error("Error: "+error.message);
+    });
+});
+var server = http_server.listen(3000, () => {
+    console.log('Server started on port 3000,and'+ '\nWS server is listening on 3001 ');
+});
\ No newline at end of file
--- a/ving8.iml
+++ b/ving8.iml
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file