# 2023: Комп'ютерні системи та мережі. Екзаменаційний лист.
[TOC]

---
# [Прізвище ім'я по батькові. Дата народження.]()

Cтасюк Владислав Дмитрович, 30.11.2001

---

# 1. Розрахункові екзаменаційні завдання
## 1.1 "Ненадійні WebSockets"
**Варіант: (30.11.2001)**
$$v=1+(30\mod 10)=1+0=1$$
$$n = 1 + v = 1 + 1 = 2$$
$$p=\frac {v}{v+1}=\frac {1}{1+1}=\frac {1}{2}=0.5$$

У момент часу $t=0$ серверна програма була з'єднана з $n$ незалежними клієнтськими програмами за протоколом WebSockets:
Щохвилини серверна програма надсилає повідомлення клієнтам і перевіряє, яка кількість клієнтів у нього знаходиться. На жаль, через стан каналів зв'язку, обмежень браузерів і серверів, ймовірність відключення сокету між черговими повідомленнями дорівнює $p$.

Через деякий час усі сокети були відключені: 
Розподілений клієнт-серверний додаток вважається працюючим до тих пір, поки є хоча б одне працююче з'єднання. Така поведінка називається [плавною деградацією роботи](https://en.wikipedia.org/wiki/Fault_tolerance#:~:text=The%20ability%20of%20maintaining%20functionality%20when%20portions%20of%20a%20system%20break%20down%20is%20referred%20to%20as%20graceful%20degradation.) клієнт-серверної системи.

**Знайдіть середній час (у хвилинах) роботи цієї програми** з точністю 2 знаки після коми.

## 1.2 Рішення
Цей код створює функцію averageWorkingTime, яка приймає два параметри, n та p, і розраховує середній час роботи системи на основі заданих параметрів. Після того, як функція виконана, результат зберігається в змінній result. Значення result виводиться на консоль з точністю 2 знаки після коми.

**Код:**

// 1.1 “Ненадійні WebSockets”
function averageWorkingTime(n, p) {
  let q = 1 - p;
  let timeSum = 0;

  for (let i = 1; i <= n; i++) {
    timeSum += (Math.pow(q, i - 1) * p) / i;
  }

  return timeSum;
}

let n = 2;
let p = 0.5;
let result = averageWorkingTime(n, p);

console.log("Середній час роботи системи: " + result.toFixed(2) + " хвилин");

**Середній час роботи системи: 0.63 хвилин**

## 1.3 [Посилання на рішення](https://functional-fragrant-charger.glitch.me)

---

# 2. Екзаменаційне завдання на реалізацію

## 2.1 Створення повнозв'язної мережі
**Опис:**
Створіть веб-додаток, який відображатиме повнозв'язну мережу, де кожен новий користувач, який підключився до сервера, буде представлений вузлом на графі. Граф має бути повнозв'язним, тобто кожен вузол безпосередньо з'єднаний з усіма іншими вузлами.

Вимоги:

1. Реалізувати сервер на Node.js, який оброблятиме підключення клієнтів і формуватиме структуру даних для графа (вузли і зв'язки).
2. Виводити в консоль сервера інформацію про підключення і відключення клієнтів, а також їхні IP-адреси.
3. На клієнтській стороні відображати граф із вузлами і зв'язками, де кожен вузол представляє клієнта, підключеного до сервера.
4. Візуалізація графа має бути виконана з використанням бібліотеки D3.js.
5. Гарантувати, що граф буде повнозв'язним, тобто кожен вузол буде безпосередньо з'єднаний з усіма іншими вузлами.

У міру під'єднання нових користувачів до сервера, їхні вузли мають додаватися на граф, і кожен вузол має бути з'єднаний з усіма іншими вузлами.

## 2.2 Опис рішення
Рішення являє собою веб-додаток, який візуалізує повнозв'язкову мережу на основі підключених користувачів. Додаток складається з серверної частини на Node.js і клієнтської частини з використанням бібліотеки D3.js для відображення графа.

**1. Серверна частина (Node.js):**

* Створено сервер на Node.js з використанням модулів http і WebSocket.
* Сервер обробляє HTTP-запити і відправляє клієнтам HTML-сторінку з графом і JavaScript-код для роботи з графом.
* Під час підключення нового користувача сервер зберігає інформацію про нього, включно з ID та IP-адресою.
* Сервер розсилає всім клієнтам повідомлення про оновлення графа, що містять інформацію про вузли (під'єднані користувачі) і зв'язки між ними (повнозв'язкова мережа).
* Виведення інформації про підключення та відключення клієнтів у консоль сервера.

**2. Клієнтська частина (HTML, CSS, JavaScript, D3.js):**

* HTML-сторінка з контейнером для графа і заголовком.
* JavaScript-код для роботи з WebSocket і обробки повідомлень від сервера про оновлення графа.
* Візуалізація графа з використанням бібліотеки D3.js, яка відображає вузли (користувачів) і зв'язки між ними (повнозв'язкова мережа).
* Адаптивне розташування вузлів графа на екрані залежно від кількості підключених користувачів.
* Коли новий користувач підключається до сервера, його вузол додається на граф, і кожен вузол безпосередньо з'єднується з усіма іншими вузлами, забезпечуючи повнозв'язність мережі. Візуалізація графа оновлюється в реальному часі під час під'єднання і від'єднання користувачів.

## 2.3 [Посилання на рішення](https://replit.com/join/unpqvlabot-vladislavstasiu)

---

# 3. Питання на теми лекцій

### 3.1 *Доведіть, що Ваша мережа є повною мережею.*

**Відповідь:**

Для доказу того, що цей код імплементує повнозв'язну мережу, можна звернутися до того, як він створює зв'язки між вузлами.

У файлі index.js на сервері, функція broadcastUpdate() відповідає за створення зв'язків. Розглянемо цей фрагмент коду всередині функції:

const nodes = clients.map(client => (
  { id: client.id, ip: client.socket._socket.remoteAddress }
));
const links = [];

for (let i = 0; i < nodes.length; i++) {
    for (let j = i + 1; j < nodes.length; j++) {
        links.push({ source: i, target: j });
    }
}

У цьому фрагменті коду спочатку створюється масив nodes, який містить інформацію про вузли (їхні ідентифікатори та IP-адреси). Потім створюється порожній масив links, який міститиме зв'язки між вузлами.

Далі, за допомогою подвійного циклу, відбувається ітерація по кожній парі вузлів. Внутрішній цикл починається з i + 1, щоб уникнути повторення зв'язків і зв'язку вузла із самим собою. У результаті, для кожної пари унікальних вузлів створюється зв'язок і додається в масив links. Таким чином, кожен вузол буде безпосередньо з'єднаний з усіма іншими вузлами, що і визначає повнозв'язкову мережу.

На клієнтській стороні, у файлі client.js, функція updateGraph() відповідає за візуалізацію вузлів і зв'язків на основі отриманих даних від сервера. Вона створює елементи SVG для вузлів і зв'язків і додає їх на веб-сторінку. Таким чином, візуалізований граф представляє повнозв'язну мережу, як і задумано.

---

### 3.2 *Спробуйте доробити функціонал, який дозволить надсилати повідомлення від клієнта до клієнта*

**Виконано!**