-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
115 lines (109 loc) · 4.12 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
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Visualización de Grafo</title>
<link rel="stylesheet" type="text/css" href="grafos21.css">
<link rel="shortcut icon" href="https://cdn-icons-png.flaticon.com/512/2103/2103658.png">
<script src="https://d3js.org/d3.v7.min.js"></script>
</head>
<body>
<header>
<img src="https://cdn-icons-png.flaticon.com/512/2103/2103658.png" class="logo">
<h1>Graphs</h1>
</header>
<main>
<div class="static-archives">
<label for="download-button" class="custom-file-input descagarLabel">Download</label>
<button class="archiveBtn" id="download-button"></button>
<label for="cargarBtn" class="custom-file-input">
Upload Graph
</label>
<input class="archiveBtn" type="file" id="cargarBtn" accept=".json">
</div>
<div class="all-container">
<section id="graph-container"></section>
<section id="tools-graphic">
<section class="info">
<div class="info-box" id="info-node">
<h2>Node Information</h2>
<div class="info-box-content" id="info-node-content">
<p>id:</p>
<p>Name:</p>
<p>Costo:</p>
<p>Prerequisite:</p>
<p>Postrequisite:</p>
<input type="text" name="" id="id_input" disabled>
<input type="text" name="" id="nombre_input" disabled>
<input type="text" name="" id="costo_input" disabled>
<input type="text" name="" id="prerequisito_input" disabled>
<input type="text" name="" id="postrequisito_input" disabled>
</div>
</div>
<div class="info-box" id="info-link">
<h2>Edge Information</h2>
<div class="info-box-content" id="info-link-content">
<p>Duration:</p>
<p>Source Node:</p>
<p>Target Node:</p>
<input type="text" name="" id="duracion_input" disabled>
<input type="text" name="" id="inicio_input" disabled>
<input type="text" name="" id="fin_input" disabled>
</div>
</div>
</section>
</section>
</div>
<div class="second-container">
<div class="botones">
<h2>Basics Nodes</h2>
<div class="tools-nodo">
<button class="boton nodo" id="add-node-button">Add Node</button>
<button class="boton nodo" id="delete-node-button">Delete Node</button>
<button class="boton nodo" id="modify-node-button">Modify Node</button>
</div>
<h2>Basics Edges</h2>
<div class="tools-arista">
<div class="basicsLinks">
<button class="boton arista" id="add-edge-button">Add Edge</button>
<button class="boton arista" id="delete-edge-button">Delete Edge</button>
<button class="boton arista" id="modify-edge-button">Modify Edge</button>
</div>
<h2>Routes</h2>
<div class="rutas">
<button class="boton arista" id="dijkstra-button">Minimum Route</button>
<button class="boton arista" id="critical-path-button">Critical Route</button>
</div>
</div>
</div>
<div id="matrix-container">
<div id="adjacency-matrix">
<h2>Adjacency Matrix</h2>
</div>
<div id="incidence-matrix">
<h2>Incidence Matrix</h2>
</div>
</div>
</div>
</main>
<footer>
<h2>Web App developed by: </h2>
<div class="integrantes">
<p>Harold Burbano</p>
<p>Andres Rey</p>
<p>Daniel Valera</p>
<p>Juan Silva</p>
</div>
<div class="github">
<p>
<a href="https://github.com/dvar98/html.git" target="_blank">
<img src="https://github.githubassets.com/favicons/favicon-dark.png" alt="">GitHub
</a>
</p>
</div>
</footer>
</body>
<script src="./dto/graphData.js"></script>
<script src="pruebasFuncionado.js"></script>
</html>