spletne-aplikacije/text-chat
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ura - 26. 11. 2022

Browse Source
This commit is contained in:
Gašper Dobrovoljc 2022-11-26 16:28:11 +01:00
commit b23ab042f3
No known key found for this signature in database
GPG Key ID: 0E7E037018CFA5A5
7 changed files with 1582 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

130
.gitignore vendored Normal file
View File

@ -0,0 +1,130 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
.cache
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*

4
.prettierrc Normal file
View File

@ -0,0 +1,4 @@
{
"singleQuote": true,
"trailingComma": "all"
}

26
index.js Normal file
View File

@ -0,0 +1,26 @@
import express from 'express';
import { Server } from 'socket.io';
import http from 'http';
const app = express();
const server = http.createServer(app);
const io = new Server(server);
app.use(express.static('static'));
io.on('connection', (socket) => {
console.log('new connection');
let name;
socket.on('name', (n) => {
console.log(n);
name = n;
});
socket.on('text', (text) => {
console.log(text);
socket.broadcast.emit('text', { name, text });
});
});
server.listen(4000);

1363
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

14
package.json Normal file
View File

@ -0,0 +1,14 @@
{
"name": "socket_vaja",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.18.2",
"socket.io": "^4.5.4"
}
}

16
static/index.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="/socket.io/socket.io.js"></script>
<script defer src="script.js"></script>
</head>
<body>
<input id="input" type="text" />
<button id="send">Send</button>
<div id="chat"></div>
</body>
</html>

29
static/script.js Normal file
View File

@ -0,0 +1,29 @@
const input = document.getElementById('input');
const button = document.getElementById('send');
const chat = document.getElementById('chat');
const name = prompt('Enter your name');
const socket = io();
socket.on('connect', () => {
console.log('connected');
socket.emit('name', name);
});
socket.on('text', (text) => {
console.log(text);
addText(text);
});
button.addEventListener('click', () => {
socket.emit('text', input.value);
addText(input.value);
});
function addText(text) {
const p = document.createElement('p');
p.innerText = text;
chat.appendChild(p);
}