soydalto · JuanjoDev-xml · Oct 17, 2024 · Oct 17, 2024 · Oct 17, 2024 · Oct 17, 2024
diff --git a/Capitulo 10/codigo.js b/Capitulo 10/codigo.js
@@ -0,0 +1,77 @@
+// A mí en particular este código no me anda, creo que es el switch case ya que sea el caso que sea me tira null (default).
+// Probé de mil maneras, si alguien lo consigue solucionar sería buenísimo.
+
+const sendButton = document.getElementById('snd-nota');
+
+sendButton.addEventListener("click",()=>{
+	let resultado, mensaje;
+	try {
+		prevRes = parseInt(document.getElementById('nota').value);
+		if (isNaN(prevRes)) {
+			throw "Gracioso";
+		}
+		resultado = verificarAprobacion(8,4,mensaje);
+		mensaje = definirMensaje(resultado[1]);
+	} catch (e) {
+		resultado = "¿SOS GRACIOSO?";
+		mensaje = "He descubierto que intentaste hackear el sitio";
+	}
+	abrirModal(resultado[0], mensaje);
+});
+
+
+const definirMensaje = (pr)=>{
+	let resultado;
+	switch (true) {
+		case 1:
+			resultado = "No podés ser tan HDP";
+			break;
+		case 2:
+			resultado = "Sos malísimo para mi materia";
+			break;
+		case 3:
+			resultado = "No sabés casi nada";
+			break;
+		case 4:
+			resultado = "Muy mal";
+			break;
+		case 5:
+			resultado = "Mal";
+			break;
+		case 6:
+			resultado = "Regular";
+			break;
+		case 7:
+			resultado = "Bien, pero puede mejorar";
+			break;
+		case 8:
+			resultado = "!Muy bien¡";
+			break;
+		case 9:
+			resultado = "!Excelente¡";
+			break;
+		case 10:
+			resultado = "!Inusperable hijo de su pinshi madre¡";
+			break;
+		default:
+			resultado = null;
+	}
+	return resultado;
+}
+
+const verificarAprobacion = (nota1,nota2,prevRes)=>{
+	promedio = (nota1 + nota2 + prevRes) / 3;
+	if (promedio >= 7) {
+		return ["<span class='green'>APROBADO</span>", Math.round(promedio)];
+	}else{
+	return ["<span class='red'>DESAPROBADO</span>", Math.round(promedio)];
+	}
+}
+
+const abrirModal = (res,msg)=>{
+	document.querySelector(".resultado").innerHTML = res;
+	document.querySelector(".mensaje").innerHTML = "Tu prueba: " + msg;
+	let modal = document.querySelector(".modal-background");
+	modal.style.display = "flex";
+	modal.style.animation = "aparecer 1s forwards";
+}
diff --git a/Capitulo 10/estilo.css b/Capitulo 10/estilo.css
@@ -0,0 +1,77 @@
+body {
+	color: #333;
+	font-family: sans-serif;
+}
+
+.formulario-de-notas {
+	margin-top: 60px;
+	text-align: center;
+	background: #26a;
+	padding: 20px;
+	box-sizing: border-box;
+	display: flex;
+	width: fit-content;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+h2 {
+	margin: 0;
+	flex-grow: 1;
+	color: #fff;
+	margin-right: 20px;
+}
+
+input {
+	width: 30px;
+	border: none;
+}
+
+input[type="button"] {
+	width: auto;
+	margin-left: 5px;
+	color: #48e;
+	background: #fff;
+}
+.modal-background {
+	box-sizing: border-box;
+	width: 100%;
+	height: 100%;
+	background: rgba(0,0,0,.7);
+	position: absolute;
+	top: 0;
+	left: 0;
+	display: none;
+	opacity: 0;
+}
+
+.modal {
+	background: #fff;
+	width: 500px;
+	margin: auto;
+	text-align: center;
+}
+
+.resultado {
+	font-size: 23px;
+	margin-bottom: 5px;
+}
+
+.red{
+	color: #f00;
+}
+
+.green{
+	color: #0f0;
+}
+
+@keyframes aparecer {
+	0% {
+		opacity: 0;
+		display: flex;
+	}
+	100% {
+		opacity: 1;
+		display: flex;
+	}
+}
diff --git a/Capitulo 10/index.html b/Capitulo 10/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<link rel="stylesheet" type="text/css" href="estilo.css">
+	<title>Capítulo 10</title>
+</head>
+<body>
+	<div class="modal-background">
+		<div class="modal">
+			<h3 class="resultado"></h3>
+			<p class="mensaje"></p>
+		</div>
+	</div>
+	<form class="formulario-de-notas">
+		<h2>Introduce la nota del alumno</h2>
+		<input type="number" name="" id="nota">
+		<input type="button" name="" id="snd-nota" value="Otorgar">
+	</form>
+	<script type="text/javascript" src="codigo.js"></script>
+</body>
+</html>
diff --git a/capitulo 11/codigo,js b/capitulo 11/codigo,js
@@ -0,0 +1,29 @@
+/*
+Métodos Transformadores de cadenas OBSOLETOS o No Recomendados
+big()
+blink()
+bold()
+fixed()
+fontcolor()
+fontsize()
+italics()
+anchor()
+link()
+small()
+strike()
+sub()
+sup()
+
+
+Métodos específicos obsoletos
+observe()
+unobserve()
+getNotifier()
+watch()
+unwatch()
+toSource()
+escape() (la función)
+unescape() (la función)
+uneval como método
+eval como método
+*/
diff --git a/capitulo 12/codigo.js b/capitulo 12/codigo.js
@@ -0,0 +1,43 @@
+const materiasHTML = document.querySelector(".materias");
+
+const materias = [
+  {
+    nombre: "Física 4",
+    nota: 7
+  },{
+    nombre: "Cálculo 3",
+    nota: 8
+  },{
+    nombre: "Bases de datos 3",
+    nota: 9
+  },{
+    nombre: "Matemáticas discretas 2",
+    nota: 7
+  },{
+    nombre: "Programación 4",
+    nota: 8
+  }
+];
+
+const obtenerMateria = (id)=>{
+  return new Promise((res,rej)=>{
+    materia = materias[id]
+    if (materia == undefined) rej("La materia no existe");
+    else setTimeout(()=>{res(materia)}, Math.random()*400);
+  })
+}
+
+const devolverMaterias = async ()=>{
+  let materia = [];
+  for (let i = 0; i < materias.length; i++) {
+    materia[i] = await obtenerMateria(i);
+    let newHTMLCode = `
+    <div class="materia">
+      <div class="nombre">${materia[i].nombre}</div>
+      <div class="nota">${materia[i].nota}</div>
+    </div>`;
+    materiasHTML.innerHTML += newHTMLCode;
+  }
+}
+
+devolverMaterias();
diff --git a/capitulo 12/estilo.css b/capitulo 12/estilo.css
@@ -0,0 +1,30 @@
+body {
+	color: #222;
+	font-family: sans-serif;
+}
+
+.materias {
+	width: 90%;
+	background: #ccc;
+	padding: 2px;
+	font-size: 20px;
+}
+
+.materia {
+	background: #efefef;
+	display: flex;
+}
+
+.materia div {
+	padding: 20px;
+}
+
+.materia .nota {
+	flex-basis: 20px;
+	background: #ddd;
+	font-weight: 700;
+}
+
+.materia .nombre {
+	flex-grow: 1;
+}
diff --git a/capitulo 12/index.html b/capitulo 12/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>Capítulo 12</title>
+	<link rel="stylesheet" type="text/css" href="estilo.css">
+</head>
+<body>
+<div class="materias"></div>
+<script type="text/javascript" src="codigo.js"></script>
+</body>
+</html>
diff --git a/capitulo 7/codigo.js b/capitulo 7/codigo.js
@@ -0,0 +1,27 @@
+{  // Problema a y b de Cofla
+
+let alto = window.screen.height;
+let ancho = window.screen.width;
+
+comprar = confirm(`El alto es: ${alto}, el ancho es ${ancho}`);
+
+if (comprar){
+	alert("Compra realizada exitosamente");
+}
+else{
+	alert("Compra canecelada");
+}
+
+let href = window.location.href;
+let pathname = window.location.pathname;
+let hostname = window.location.hostname;
+let protocol = window.location.protocol;
+
+let html = `Protocolo: <b>${protocol}</b><br><br>`;
+html += `Hostname: <b>${hostname}</b><br><br>`;
+html += `Pathname: <b>${pathname}</b><br><br>`;
+html += `URL completa: <b>${href}</b><br><br>`;
+
+document.write(html);
+
+}
diff --git a/capitulo 7/index.html b/capitulo 7/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>Capítulo 7</title>
+</head>
+<body>
+	<script type="text/javascript" src="codigo.js"></script>
+</body>
+</html>
diff --git a/capitulo 8/index.html b/capitulo 8/index.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+	<title>Capítulo 8</title>
+</head>
+<body>
+	<script type="text/javascript" src="codigo.js"></script>
+</body>
+</html>