Cargar archivos

LeydiD · Aug 11, 2024 · f09a4e7 · f09a4e7
commit f09a4e7
Show file tree

Hide file tree

Showing 7 changed files with 433 additions and 0 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/imagenes/Logo.png b/imagenes/Logo.png
diff --git a/imagenes/Muñeco.png b/imagenes/Muñeco.png
diff --git a/imagenes/exclamacion.png b/imagenes/exclamacion.png
diff --git a/index.html b/index.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Encriptador de texto</title>
+    <link rel="stylesheet" href="style.css">
+    <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=Honk:MORF,SHLN@0,87.6&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Neucha&family=Rubik+Doodle+Shadow&display=swap"
+        rel="stylesheet">
+
+    <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=Grey+Qo&family=Honk:MORF,SHLN@0,87.6&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Neucha&family=Rubik+Doodle+Shadow&display=swap"
+        rel="stylesheet">
+</head>
+
+<body>
+
+    <header>
+        <img src="/imagenes/Logo.png" alt="Logo de alura" class="logo">
+    </header>
+
+    <main>
+        <section class="entrada">
+            <textarea class="txt-entrada" cols="30" rows="10" placeholder="Ingrese el texto aquí"></textarea>
+
+            <div class="indicaciones">
+                <img src="/imagenes/exclamacion.png" alt="advertencia" class="img_exclamacion">
+                <p class="advertencia"> Solo letras minúsculas y sin acentos</p>
+            </div>
+
+            <div class="botones">
+                <button type="submit" class="btn-encriptar" onclick="btnEncriptar()">Encriptar</button>
+                <button type="submit" class="btn-desencriptar" onclick="btnDesencriptar()">Desencriptar</button>
+            </div>
+        </section>
+
+
+        <section class="salida">
+            <textarea class="txt-salida" cols="20" rows="11"></textarea>
+            <div class="noMensaje">
+                <p>Ningún mensaje fue encontrado <br> Ingresa el texto que desees encriptar o desencriptar</p>
+            </div>
+            <div>
+                <button class="btn-copiar" onclick="copiar()" hidden>Copiar</button>
+            </div>
+        </section>
+    </main>
+    <footer>
+        <p> &copy; Leydi Alejandra Durán Rozo-2024</p>
+
+    </footer>
+    <script src="script.js"></script>
+</body>
+
+
+</html>
diff --git a/script.js b/script.js
@@ -0,0 +1,99 @@
+const txtEntrada = document.querySelector(".txt-entrada");
+const txtSalida = document.querySelector(".txt-salida");
+const btnCopiar = document.querySelector(".btn-copiar");
+const noMensaje = document.querySelector(".noMensaje");
+
+// btnCopiar.style.visibility="hidden"
+// La letra "e" es convertida para "enter"
+// La letra "i" es convertida para "imes"
+// La letra "a" es convertida para "ai"
+// La letra "o" es convertida para "ober"
+// La letra "u" es convertida para "ufat"
+
+function validarTexto(texto) {
+    const regex = /[ÁÉÍÓÚÑáéíóúñ]|[^a-z\s]/; // Regex para detectar mayúsculas y acentos
+    return regex.test(texto);
+}
+function copiar() {
+    navigator.clipboard.writeText(txtSalida.value);
+}
+
+function btnEncriptar() {
+    const txtEncriptado = encriptar(txtEntrada.value);
+    txtSalida.style.backgroundImage = 'none';
+    if (validarTexto(txtEntrada.value)) {
+        alert("No deben ser utilizados letras mayúsculas, con acentos ni caracteres especiales.");
+        txtEntrada.value = "";
+        alertar();
+    } else if (txtEntrada.value.trim() === "") {
+        alertar();
+    } else {
+        txtEntrada.value = "";
+        noMensaje.style.visibility = "hidden";
+        txtSalida.value = txtEncriptado;
+        btnCopiar.hidden = false;
+    }
+
+}
+
+function btnDesencriptar() {
+    const txtDesencriptado = desencriptar(txtEntrada.value);
+    txtSalida.style.backgroundImage = 'none';
+    if (validarTexto(txtEntrada.value)) {
+        alert("No deben ser utilizados letras con acentos ni caracteres especiales.");
+        txtEntrada.value = "";
+        alertar();
+    } else if (txtEntrada.value.trim() === "") {
+        alertar();
+    } else {
+        txtEntrada.value = "";
+        noMensaje.style.visibility = "hidden";
+        txtSalida.value = txtDesencriptado;
+        // copiar.style.visibility = "visible";
+        btnCopiar.hidden = false;
+
+    }
+}
+
+function alertar() {
+    txtSalida.value = "";
+    txtSalida.style.backgroundImage = "url('/imagenes/Muñeco.png')";
+    noMensaje.style.visibility = "visible";
+    btnCopiar.hidden=true;
+}
+
+
+function encriptar(mensajeEncriptado) {
+    let reglas = [["e", "enter"],
+    ["i", "imes"],
+    ["a", "ai"],
+    ["o", "ober"],
+    ["u", "ufat"]];
+    mensajeEncriptado = mensajeEncriptado.toLowerCase();
+
+    for (let i = 0; i < reglas.length; i++) {
+        if (mensajeEncriptado.includes(reglas[i][0])) {
+            mensajeEncriptado = mensajeEncriptado.replaceAll(reglas[i][0], reglas[i][1])
+        }
+    }
+
+    return mensajeEncriptado;
+}
+
+
+function desencriptar(mensajeDesencriptado) {
+    let reglas = [["e", "enter"],
+    ["i", "imes"],
+    ["a", "ai"],
+    ["o", "ober"],
+    ["u", "ufat"]];
+    mensajeDesencriptado = mensajeDesencriptado.toLowerCase();
+
+    for (let i = 0; i < reglas.length; i++) {
+        if (mensajeDesencriptado.includes(reglas[i][1])) {
+            mensajeDesencriptado = mensajeDesencriptado.replaceAll(reglas[i][1], reglas[i][0])
+        }
+    }
+
+    return mensajeDesencriptado;
+}