Encriptador concluido por el momento ._O

mrp500 · Mar 5, 2024 · e49f976 · e49f976
1 parent cf0b233
commit e49f976
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 6 deletions.
diff --git a/script.js b/script.js
@@ -1,3 +1,21 @@
+document.getElementById('clickable-image').addEventListener('click', function() {
+    document.querySelector('.button-tres').style.visibility = 'visible';
+});
+
+document.getElementById('result').addEventListener('click', function() {
+    document.querySelector('.button-tres').style.visibility = 'visible';
+});
+console.log()
+
+document.getElementById('result').addEventListener('blur', function() {
+    var resultTextArea = document.getElementById('result');
+    var image = document.getElementById('clickable-image');
+    var button = document.querySelector('.button-tres');
+    if (resultTextArea.value.trim() === '') {
+        image.style.display = 'block';
+        button.style.visibility = 'hidden';
+    }
+});
 
 function encryptText() {
     var inputText = document.getElementById('inputTextArea').value;
@@ -9,10 +27,11 @@ function encryptText() {
             .replace(/a/g, 'ai')
             .replace(/o/g, 'ober')
             .replace(/u/g, 'ufat');
-    resultTextArea.value = encryptedText;
-    var inputElement = document.getElementById('inputTextArea');
-    inputElement.value = '';
-    document.getElementById('clickable-image').style.display = 'none';
+        resultTextArea.value = encryptedText;
+        var inputElement = document.getElementById('inputTextArea');
+        inputElement.value = '';
+        document.querySelector('.button-tres').style.visibility = 'visible';
+        document.getElementById('clickable-image').style.display = 'none';
     } else {
         var inputElement = document.getElementById('inputTextArea');
         inputElement.focus();
@@ -32,6 +51,7 @@ function decryptText() {
     resultTextArea.value = decryptedText;
     var inputElement = document.getElementById('inputTextArea');
     inputElement.value = '';
+    document.querySelector('.button-tres').style.visibility = 'visible';
     document.getElementById('clickable-image').style.display = 'none';
     } else {
         var inputElement = document.getElementById('inputTextArea');
@@ -44,6 +64,7 @@ document.querySelector('.button-tres').addEventListener('click', function() {
     image.style.display = 'none'; 
 });
 
+
 function convertToTextArea() {
     var image = document.getElementById('clickable-image');
     var textArea = document.getElementById('result');
@@ -70,4 +91,3 @@ document.getElementById('result').addEventListener('blur', function() {
     }
 });
 
-document.getElementById('result').onblur = showImageIfNoFocus;
diff --git a/styles.css b/styles.css
@@ -181,6 +181,10 @@ p {
 
 }
 
+.divbutton-tres {
+    visibility: hidden; /* Ocultar el botón inicialmente */
+}
+
 .button-tres {
     width: 120px;
     height: 40px;
@@ -231,7 +235,6 @@ p {
         float: none;
         width: auto;
         padding: 0px;
-        margin: 0;
     }
 
     .campotransparente-uno {