-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
84 lines (80 loc) · 3.19 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EXERCÍCIO AULA 1</title>
<link rel="icon" href="assets/computer.png">
<link rel="stylesheet" href="styles/schemeStyles.css">
<link rel="stylesheet" href="styles/basicStyles.css">
</head>
<body>
<h1>EXERCÍCIO AULA 1: CLIENTE-SERVIDOR</h1>
<div id="introduction">
<p>
Um protocolo pode ser entendido como o conjunto de regras para comunicação entre máquinas na rede. Neste projeto, foi criado o seguinte protocolo para uma simples rede cliente-servidor:
</p>
<p>
O cliente pode enviar uma array com três itens para um servidor, sendo os dois primeiros números que serão utilizados em ordem como os parâmetros de uma operação determinada pelo terceiro item. O servidor, ao receber a array, devolve um número que é o resultado da operação realizada.
</p>
<p>
O objetivo dessa rede é a terceirização de poder computacional, fazendo o computador "cliente" ser um modo de acessar o poder computacional do servidor.
</p>
</div>
<p>
Exemplo interativo abaixo:
</p>
<div id="scheme">
<img id="client" src="assets/computer.png" alt="computer">
<div id="interaction">
<div id="requestWire">
<div class="wire"></div>
<div id="request">
MENSAGEM
<div id="requestArray">
<input type="text" class="param" id="param1">
<input type="text" class="param" id="param2">
<input type="text" class="param" id="param3">
</div>
</div>
<div class="pointLeft">
<div class="wire"></div>
<div class="arrowLeft"></div>
</div>
</div>
<div id="returnWire">
<div class="pointRight">
<div class="arrowRight"></div>
<div class="wire"></div>
</div>
<div id="returnMessage">
RESPOSTA
<div id="returnArray">
<div class="answer" id="answerBox">
</div>
</div>
</div>
<div class="wire"></div>
</div>
</div>
<img id="server" src="assets/server.png" alt="client">
</div>
<div>
<br/>O terceiro número na array de mensagem significa, respectivamente:
<ul id="operations">
<li>
0 - ADIÇÃO
</li>
<li>
1 - MULTIPLICAÇÃO
</li>
<li>
2 - DIVISÃO
</li>
</ul>
</div>
<script src="protocol/protocol.js"></script>
<footer>Aluno: Anaclécio Ribeiro Brederodes Campos</footer>
</body>
</html>