-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathtaller-4.html
More file actions
132 lines (123 loc) · 5.84 KB
/
taller-4.html
File metadata and controls
132 lines (123 loc) · 5.84 KB
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
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!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>Taller #3 - Promedios, Moda y Mediana - Curso Práctico de JavaScript</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&family=Poppins:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/css/main.css">
</head>
<body>
<header class="nav-bar">
<nav>
<div>
<a href="calculos.html"><img class="js-challenge" src="assets/img/js-challenge-logo.png" alt=""></a>
<a href="index.html"><img class="guiarte" src="assets/img/im.svg" alt="" href="/Guiarte.html"></a>
</div>
</nav>
</header>
<main>
<a class="home-btn" href="./calculos.html">INICIO</a>
<!-- Main Section -->
<section class="main-section main-section--inside">
<header>
<h3>TRABAJO PRÁCTICO</h3>
<h1>Análisis Salarial</h1>
</header>
<div class="taller">
<section class="taller-card">
<img src="assets/img/dollar.png" alt="">
<header>
<h2>Cálculos:</h2>
<div class="select">
<select class="" id="formulaSelect" name="select" onchange="switchFormula();">
<option value="1" selected>Mediana Salarial</option>
<option value="2">Mediana Salarial TOP 10%</option>
</select>
</div>
</header>
<form id="form">
<label class="check"><input type="checkbox" id="checkInput" value="" onclick="check()"> Utilizar lista precargada para testeo</label>
<div class="form-group">
<label for="inputPrice">Escribe un <strong> Nuevo Valor</strong> a la lista</label>
<input type="number" id="addValue">
<p class="error" id="errorAddValue"></p>
<button class="btn-form" type="button" onclick="addListNumber()" min="0"> Agregar a la lista</button>
</div>
<div class="form-group">
<label for="inputDiscount">Escribe la <strong>Posición </strong> del valor a Eliminar de la lista</label>
<input type="number" id="removeValue">
<p class="error" id="errorRemoveValue"></p>
<button class="btn-form btn-form--alert" type="button" onclick="removeListNumber()"> Quitar de la lista</button>
</div>
<button class="btn-form" id="btn-render" type="button" onclick="renderMedianaSalarial();"> Calcular Mediana Salarial</button>
<p class="error" id="errorList"></p>
</form>
</section>
<section class="taller-card">
<h2>Lista de Valores Cargados</h2>
<ul id="list-values">
</ul>
</section>
<section class="taller-card">
<h2>Lista de Valores precargados para testeo</h2>
<ul id="list-values-default">
</ul>
</section>
</div>
</section>
<!-- Nav Works -->
<section class="nav-works nav-works--inside">
<div class="card">
<div class="card__item" onclick="location.href='./taller-1.html'">
<img src="assets/img/circle.png" alt="">
<div>
<header>
<h4>TALLER #1</h4>
<h2>Figuras Geometricas</h2>
</header>
<p>Calculo básicos para Cuadrados, Triangulos y Circulos.</p>
</div>
</div>
<div class="card__item" onclick="location.href='./taller-2.html'">
<img src="assets/img/price.png" alt="">
<div>
<header>
<h4>TALLER #2</h4>
<h2>Precios y descuentos</h2>
</header>
<p>Calculo básicos para precios, descuentos y cupones de pago.</p>
</div>
</div>
<div class="card__item" onclick="location.href='./taller-3.html'">
<img src="assets/img/discount.png" alt="">
<div>
<header>
<h4>TALLER #3</h4>
<h2>Media, Moda y Mediana</h2>
</header>
<p>Calculos básicos y avanzados.</p>
</div>
</div>
</div>
</section>
</main>
<!-- Overlay Results -->
<div class="overlay" id="overlay">
<div class="result" id="result">
<p><span onclick="closeOverlay();">x</span></p>
<img id="resultIMG" alt="">
<h2 id="resultH2"></h2>
<h4 id="resultH4"></h4>
</div>
</div>
<script src="./assets/js/salarios.js"></script>
<script src="./assets/js/cuatro.js"></script>
<script>
renderListDefault(listaSalarios);
</script>
</body>
</html>