Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit a383671

Browse files
Fixed tasks and code
1 parent 8ed7397 commit a383671

File tree

2 files changed

+57
-53
lines changed

2 files changed

+57
-53
lines changed

‎LiveTable/index.html

Lines changed: 52 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,53 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<body>
4-
<h1>Live table</h1>
5-
<table id="table"></table>
6-
<style>
7-
input { border: 1px solid green; width: 30px; }
8-
</style>
9-
<script>
10-
11-
var table = document.getElementById('table');
12-
var cells = {};
13-
var letters = ['A', 'B', 'C', 'D', 'E', 'F'];
14-
15-
var tr;
16-
tr = document.createElement('tr');
17-
tr.innerHTML = '<td></td>' + letters.map(function(col) {
18-
return '<td>' + col + '</td>'
19-
}).join('');
20-
table.appendChild(tr);
21-
22-
for (var i = 1; i <= 5; i++) {
23-
tr = document.createElement('tr');
24-
tr.innerHTML = '<td>' + i + '</td>' + letters.map(function(col) {
25-
return '<td><input id="' + col + i + '" type="text"></td>';
26-
}).join('');
27-
table.appendChild(tr);
28-
letters.forEach(function(col) {
29-
var cell = col + i;
30-
var input = document.getElementById(cell);
31-
input.addEventListener('keyup', keyup);
32-
cells[cell] = input;
33-
});
34-
}
35-
36-
function keyup(event) {
37-
socket.send(JSON.stringify({
38-
cell: event.target.id,
39-
value: event.target.value
40-
}));
41-
}
42-
43-
var socket = new WebSocket('ws://127.0.0.1/chat');
44-
45-
socket.onmessage = function(event) {
46-
var change = JSON.parse(event.data);
47-
var cell = cells[change.cell];
48-
cell.value = change.value;
49-
};
50-
51-
</script>
52-
</body>
1+
<!DOCTYPE html>
2+
<html>
3+
<body>
4+
<h1>Live table</h1>
5+
<table id="table"></table>
6+
<style>
7+
input { border: 1px solid green; width: 30px; }
8+
</style>
9+
<script>
10+
11+
var table = document.getElementById('table');
12+
var cells = {};
13+
var letters = ['A', 'B', 'C', 'D', 'E', 'F'];
14+
15+
var tr;
16+
tr = document.createElement('tr');
17+
tr.innerHTML = '<td></td>' + letters.map(function(col) {
18+
return '<td>' + col + '</td>';
19+
}).join('');
20+
table.appendChild(tr);
21+
22+
for (var i = 1; i <= 5; i++) {
23+
tr = document.createElement('tr');
24+
tr.innerHTML = '<td>' + i + '</td>' + letters.map(function(col) {
25+
return '<td><input id="' + col + i + '" type="text"></td>';
26+
}).join('');
27+
table.appendChild(tr);
28+
letters.forEach(function(col) {
29+
var cell = col + i;
30+
var input = document.getElementById(cell);
31+
input.addEventListener('keyup', keyup);
32+
cells[cell] = input;
33+
});
34+
}
35+
36+
function keyup(event) {
37+
socket.send(JSON.stringify({
38+
cell: event.target.id,
39+
value: event.target.value
40+
}));
41+
}
42+
43+
var socket = new WebSocket('ws://127.0.0.1/');
44+
45+
socket.onmessage = function(event) {
46+
var change = JSON.parse(event.data);
47+
var cell = cells[change.cell];
48+
cell.value = change.value;
49+
};
50+
51+
</script>
52+
</body>
5353
</html>

‎README.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,11 @@
44
- `emitter.js` - простейшая реализация EventEmitter
55
- 'events.js' - расширенная версию EventEmitter для Node.js
66
* Каталог 'LiveTable' - пример таблицы, которая синхронизируется
7-
между несколькими браузерами через отправку событий по Websocket
7+
между несколькими браузерами через отправку событий по Websocket.
8+
9+
Перед запуском `LiveTable` нужно запустить `npm install` из этого каталога,
10+
npm устаносит зависимости, указанные в `package.json`, после этого можно
11+
запускать `sudo node server`
812

913
## Задания
1014

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /