**Розрахунково-графічна робота**
**Куліш Марія Михайлівна**

[TOC]
# Задача:
Створити мульти-клієнт-серверний додаток з візуалізацією поточної топології мережі та стану з'єднань, що використовує хостинг replit.com
з реалізацією функціоналу за допомогою API Socket.IO

Додаток має забезпечувати

1) передачу повідомлень від вашого клієнта будь-якому іншому ([unicasting](https://en.wikipedia.org/wiki/Unicast))
2) передачу повідомлень від вашого клієнта всім іншим ([broadcasting](https://en.wikipedia.org/wiki/Broadcast,_unknown-unicast_and_multicast_traffic))
Повідомлення мають бути двох типів
* текстові повідомлення
* зображення

Під час передачі даних додаток повинен контролювати поточну [затримку поширення (propagation delay)](https://hackmd.io/y40T210qQ5-2pqQYJ6j09A#:~:text=%D0%97%D0%B0%D1%82%D1%80%D0%B8%D0%BC%D0%BA%D0%B0%20%D0%BF%D0%BE%D1%88%D0%B8%D1%80%D0%B5%D0%BD%D0%BD%D1%8F%20%E2%80%93,)) від клієнта $\delta_{i}$ і пропускну здатність $B_{i}$ канала клієнта (де $i$ - номер клієнта, що бере участь у поточній комунікації) та візуалізувати їх на діаграмі товщиною ребер графа діаграми та розміром вузлів.

**Код на replit:** https://replit.com/@MashaKulish/RGZ#index.js

# Вступ

1. Пропускна здатність: Пропускна здатність стосується максимальної швидкості передачі даних через мережу або канал зв'язку. Зазвичай вона вимірюється в бітах за секунду (bps). Вища пропускна здатність дозволяє швидше передавати дані та підтримувати більше одночасних з'єднань або більші обсяги даних.

2. Затримка поширення: Затримка поширення - це час, необхідний для того, щоб сигнал подолав шлях від відправника до одержувача в каналі зв'язку. Вона включає час, необхідний для розповсюдження сигналу через середовище (наприклад, кабелі, оптичні волокна), а також будь-які затримки обробки в маршрутизаторах або комутаторах на шляху. На затримку поширення впливає фізична відстань між відправником і одержувачем, швидкість світла в середовищі та обробні можливості проміжних пристроїв.

**Подключение к серверу через WebSocket и обработка событий**

const socket = io();

socket.on("connect", handleConnect);
socket.on("did", handleYourId);
  socket.on("disconnect", handleDisconnect);
 socket.on("message", handleMessage);
  socket.on("beginning_of_message_confirmed", handleBeginningOfMessageConfirmed);
   socket.on("end_of_message_confirmed", handleEndOfMessageConfirmed);
    socket.on("sending_message_confirmed", handleSendingMessageConfirmed);
     socket.on("update_graph", handleUpdateGraph); 
  socket.on("error", handleError);
   socket.on("leave", handleLeave);

Настройка графа с помощью библиотеки vis.js

const nodes = new vis.DataSet();
const edges = new vis.DataSet();
const graph = { nodes, edges };
const options = {
    nodes: {
        shape: "dot",
        scaling: {
            customScalingFunction: function (min, max, total, value) {
                return value;
            },
            min: 1,
            max: 10,
        },
    },
    edges: {
        scaling: {
            customScalingFunction: function (min, max, total, value) {
                return value;
            },
            min: 0.003,
            max: 1,
        },
    },
};

const visNetwork = new vis.Network(network, graph, options);

У браузері користувача, напочтаку, відображається його ідентифікатор (ID) та статус підключення до чату. Після відправки повідомлення клієнтом отримуються дані про затримку передачі та пропускну здатність каналу клієнта.



Спробуємо надіслати файл:
Різні IP позначаються різними кольорами, спробуємо надіслати запит з інших пристроїв(а саме: телефон і планшет):

# Висновки:

В результаті проведеної лабораторної роботи ми реалізували чат-додаток, що дозволяє користувачам взаємодіяти в режимі реального часу. У процесі роботи ми виконали наступні кроки:

Відображення ідентифікатора та статусу підключення: Користувачі можуть бачити свої ідентифікатори (ID) та статус підключення до чату у своєму браузері. Це допомагає зрозуміти, що підключення до сервера встановлено успішно.

Надсилання повідомлень: Ми реалізували функціонал для надсилання як публічних, так і приватних повідомлень. Користувачі можуть обирати, кому відправляти повідомлення: всім учасникам чату або конкретному адресату.

Вимірювання затримки та пропускної здатності: Після надсилання повідомлення від клієнта ми отримуємо дані про затримку передачі інформації (propagation delay) та пропускну здатність каналу (bandwidth). Це дозволяє оцінити якість з'єднання кожного користувача та потенційно виявити вузькі місця в мережі.