Cyber security application | BY:AKINPELU ABIODUN MOSES BSC. MATHEMATICS | NATIONAL OPEN UNIVERSITY OF NIGERIA

 


Design and development of A Client-Side Text File Security App With Crypto JS library called ASCII  modified with  mathematical function(y=bx^2+ax+c and Caesar cipher with the shift determined by a, b, and c.



Introduction: 

ZipLock is a client-side text file security app that allows users to encrypt and decrypt their text with unique secret keys. The app was developed to provide a secure way for users to store sensitive information such as passwords, credit card information, and personal notes. ZipLock utilizes a complex algebra mathematical function to develop an encrypted algorithm, making it impossible for anyone to describe the encryption without the set secret keys.



Aim and Objectives:


The aim of the ZipLock app is to provide a secure and reliable way for users to store and manage their sensitive data. To achieve this aim, the app has the following objectives:


To provide client-side encryption to ensure that no data is stored on the server and only the user can access the encrypted data.


To generate a unique secret key for each user to encrypt and decrypt their data, ensuring that the user's data is protected, and only the user can access it.


To provide a simple user interface that is easy to use, making it accessible to users of all technical levels.


To use secure algorithms to develop an encrypted algorithm that cannot be described by anyone without the set secret keys.



Features: 

The ZipLock app provides several features to ensure the security of the user's data. These features include:


Client-side encryption: 

The encryption process takes place on the client-side, meaning that no data is stored on the server. This ensures that only the user can access the encrypted data, and no third-party can access the data.


Unique Secret Key: 

The app generates a unique secret key for each user to encrypt and decrypt their data. This ensures that the user's data is protected, and only the user can access it.


encryptBtn.addEventListener('click', function() {

  let input = inputEl.value;

  let a = parseInt(prompt('Enter key a:'));

  let b = parseInt(prompt('Enter key b:'));

  let c = parseInt(prompt('Enter key c:'));

  

  let encryptedText = encryptText(input, a, b, c);

  encryptedEl.value = encryptedText;

  

  let currentTime = new Date().toLocaleString();

  

  let encryptedList = JSON.parse(localStorage.getItem('encryptedList')) || [];

  encryptedList.push({ text: encryptedText, time: currentTime });

  localStorage.setItem('encryptedList', JSON.stringify(encryptedList));

  

  getEncryptedList();

  });

  

  






decryptBtn.addEventListener("click", function() {

  let retrievedEncryptedText = encryptedEl.value;

 /* let a = 2;

  let b = 3;

  let c = 4;

  */

  

  let a = parseInt(prompt("Enter key a:"));

  let b = parseInt(prompt("Enter key b:"));

  let c = parseInt(prompt("Enter key c:"));

  

  

  let decryptedText = decryptText(retrievedEncryptedText, a, b, c);

  decryptedEl.value = decryptedText;

});





Copy to Clipboard:

 The app allows users to copy the encrypted text to the clipboard, making it easy for users to share their encrypted data with others.


Simple User Interface:

 The app has a simple user interface that is easy to use, making it accessible to users of all technical levels.


Secure Algorithms:

 The app utilizes a complex algebra mathematical function to develop an encrypted algorithm that cannot be described by anyone without the set secret keys.

That is:

ASCII and y=bi^2+ai+c Algorithm


// define the encryption and decryption functions

function encryptText(input, a, b, c) {

  let encryptedText = '';


  for (let i = 0; i < input.length; i++) {

    let asciiCode = input.charCodeAt(i);

    // modify the ASCII code using a Caesar cipher with a shift determined by a, b, and c

    asciiCode = (asciiCode - 32 + a * i + b * i * i + c) % 94 + 32;

    let encryptedChar = String.fromCharCode(asciiCode);

    encryptedText += encryptedChar;

  }


  return encryptedText;

}


function decryptText(encryptedText, a, b, c) {

  let decryptedText = '';


  for (let i = 0; i < encryptedText.length; i++) {

    let encryptedChar = encryptedText.charAt(i);

    let asciiCode = encryptedChar.charCodeAt(0);

    // check for valid ASCII characters before attempting to decrypt them

    if (asciiCode >= 32 && asciiCode <= 126) {

      // recover the original ASCII code using the inverse of the Caesar cipher

      asciiCode = (asciiCode - 32 - c - a * i - b * i * i + 94000) % 94 + 32;

      let decryptedChar = String.fromCharCode(asciiCode);

      

decryptedText += decryptedChar;

}

}


return decryptedText;

}



Implementation: 

ZipLock was developed using HTML, CSS, and JavaScript. The app's encryption and decryption algorithms were developed using the CryptoJS library. The app uses a combination of symmetric and asymmetric encryption to provide an added layer of security. The symmetric encryption algorithm encrypts the user's data, while the asymmetric encryption algorithm encrypts the unique secret key used to encrypt and decrypt the data.






Code Explanation:

The javascript code provided below create functionality for the app. While html and css provide all necessary structures and graphics user-friendly interface for the app.





Index.html

<!DOCTYPE html>

<html>

  <head>


  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta name="description" content="ZipLock is a client-side text file security application that uses a complex algebraic mathematical function to develop the encrypted algorithm. This ensures that the encrypted text can only be decrypted using your set secret keys, making it impossible for anyone else to access your data.">

    <title>ZipLock</title>

    

  </head>

  <body>

    <h1>ZIPLOCK </h1>

    <center> <h5 id="label">ZipLock is a client-side text file security application <br>that uses a complex algebraic mathematical function to develop the encrypted algorithm. This ensures that the encrypted text can only be decrypted using your set secret keys, making it impossible for anyone else to access your data</h5></center>

 <!-- <center> <h2>Using ASCII | y=bi^2+ai+c | Algorithm</h2></center>

   <center> <h3>secure all your confidential details with zero back door</h3></center>

   -->

   

    <label for="input">Input Text:</label>

    <textarea id="input" placeholder="Enter some text..."></textarea>

    <div class="button-container">

      <button id="encryptBtn">Encrypt</button>

      <button id="decryptBtn">Decrypt</button>

      <button id="deleteButton">Delete</button>

      

    </div>

    <label for="encrypted">Encrypted Text:</label>

    <textarea id="encrypted" placeholder="Encrypted text will appear here..."></textarea>

    <label for="decrypted">Decrypted Text:</label>

    <textarea id="decrypted" placeholder="Decrypted text will appear here..."></textarea>

    <h2>Saved Encrypted Texts</h2>

    <div id="savedListContainer"></div>

    <ul id="saved-list"></ul>

</body>

</html>




Style.css

<style type="text/css">

#saved-list li:hover {

    text-decoration: underline;

  }

  

  #saved-list .time {

    font-weight: normal;

    margin-left: 10px;

    font-size: 0.8em;

  }

  

  /* Add some color and styling to the interface */

  body {

    background-color: #f2f2f2;

    font-family: Arial, sans-serif;

  }

  

  h1 {

    text-align: center;

    margin-top: 50px;

    font-size: 3em;

    color: #3d5a80;

  }

  

  label {

    display: block;

    margin-top: 20px;

    font-size: 1.5em;

    color: #3d5a80;

  }

  

  textarea {

    width: 100%;

    height: 150px;

    padding: 10px;

    margin-top: 10px;

    margin-bottom: 20px;

    font-size: 1.2em;

    border-radius: 5px;

    border: none;

    background-color: #fff;

    color: #3d5a80;

  }

  

  .button-container {

    display: flex;

    justify-content: center;

    margin-bottom: 20px;

  }

  

  button {

    font-size: 1.2em;

    padding: 10px 20px;

    margin: 0 10px;

    border-radius: 5px;

    border: none;

    cursor: pointer;

    background-color: #3d5a80;

    color: #fff;

    transition: all 0.2s ease-in-out;

  }

  

  button:hover {

    background-color: #293241;

  }

  

  #encrypted,

  #decrypted {

    font-size: 1.2em;

    margin-bottom: 20px;

    border-radius: 5px;

    border: none;

    background-color: #fff;

    color: #3d5a80;

  }

  

  #savedListContainer {

    text-align: center;

    margin-top: 50px;

    margin-bottom: 20px;

  }

  

  #saved-list {

    list-style: none;

    padding: 0;

    margin: 0;

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

  }

  

  #saved-list li {

    margin-bottom: 20px;

    font-size: 1.2em;

    font-weight: bold;

    cursor: pointer;

    background-color: #fff;

    color: #3d5a80;

    padding: 10px 20px;

    border-radius: 5px;

    border: 2px solid #3d5a80;

    transition: all 0.2s ease-in-out;

    margin-right: 10px;

    margin-left: 10px;

  }

  

  #saved-list li:hover {

    text-decoration: underline;

    background-color: #3d5a80;

    color: #fff;

  }

  

  #saved-list .time {

    font-weight: normal;

    margin-left: 10px;

    font-size: 0.8em;

    color: #3d5a80;

  }

  

  footer {

  background-color: #222;

  color: #fff;

  text-align: center;

  padding: 20px;

  position:relative;

  left: 0;

  bottom: 0;

  width: 100%;

  }

  

  footer p {

  margin: 0;

  }

  

      

</style>



App.js

<script type="text/javascript">

// select the elements

const inputEl = document.getElementById('input');

const encryptBtn = document.getElementById('encryptBtn');

const decryptBtn = document.getElementById('decryptBtn');

const encryptedEl = document.getElementById('encrypted');

const decryptedEl = document.getElementById('decrypted');


// define the encryption and decryption functions

function encryptText(input, a, b, c) {

  let encryptedText = '';


  for (let i = 0; i < input.length; i++) {

    let asciiCode = input.charCodeAt(i);

    // modify the ASCII code using a Caesar cipher with a shift determined by a, b, and c

    asciiCode = (asciiCode - 32 + a * i + b * i * i + c) % 94 + 32;

    let encryptedChar = String.fromCharCode(asciiCode);

    encryptedText += encryptedChar;

  }


  return encryptedText;

}


function decryptText(encryptedText, a, b, c) {

  let decryptedText = '';


  for (let i = 0; i < encryptedText.length; i++) {

    let encryptedChar = encryptedText.charAt(i);

    let asciiCode = encryptedChar.charCodeAt(0);

    // check for valid ASCII characters before attempting to decrypt them

    if (asciiCode >= 32 && asciiCode <= 126) {

      // recover the original ASCII code using the inverse of the Caesar cipher

      asciiCode = (asciiCode - 32 - c - a * i - b * i * i + 94000) % 94 + 32;

      let decryptedChar = String.fromCharCode(asciiCode);

      

decryptedText += decryptedChar;

}

}


return decryptedText;

}



      


  encryptBtn.addEventListener('click', function() {

  let input = inputEl.value;

  let a = parseInt(prompt('Enter key a:'));

  let b = parseInt(prompt('Enter key b:'));

  let c = parseInt(prompt('Enter key c:'));

  

  let encryptedText = encryptText(input, a, b, c);

  encryptedEl.value = encryptedText;

  

  let currentTime = new Date().toLocaleString();

  

  let encryptedList = JSON.parse(localStorage.getItem('encryptedList')) || [];

  encryptedList.push({ text: encryptedText, time: currentTime });

  localStorage.setItem('encryptedList', JSON.stringify(encryptedList));

  

  getEncryptedList();

  });

  

  






decryptBtn.addEventListener("click", function() {

  let retrievedEncryptedText = encryptedEl.value;

 /* let a = 2;

  let b = 3;

  let c = 4;

  */

  

  let a = parseInt(prompt("Enter key a:"));

  let b = parseInt(prompt("Enter key b:"));

  let c = parseInt(prompt("Enter key c:"));

  

  

  let decryptedText = decryptText(retrievedEncryptedText, a, b, c);

  decryptedEl.value = decryptedText;

});





const deleteBtn = document.getElementById('deleteButton');

deleteBtn.addEventListener('click', function() {

  localStorage.removeItem('encryptedText');

  encryptedEl.value = '';

  decryptedEl.value = '';

});



deleteBtn.addEventListener('click', function() {

  localStorage.removeItem('encryptedList');

  document.getElementById('saved-list').innerHTML = '';

});



// Retrieve and set the value of the input element from local storage

function getEncryptedList() {

  const encryptedList = JSON.parse(localStorage.getItem('encryptedList')) || [];


  let savedListHtml = '';

  encryptedList.forEach(function(item) {

    savedListHtml += '<li>' + item.text + ' - ' + item.time + '</li>';

  });

  document.getElementById('saved-list').innerHTML = savedListHtml;

}


// Call the getEncryptedList function when the page loads

window.onload = function() {

  getEncryptedList();

};








</script>


The code provided is a JavaScript implementation of an encryption and decryption algorithm that uses a modified Caesar cipher. The algorithm takes in three keys, a, b, and c, and applies a mathematical function that modifies the ASCII code of each character in the input text. The resulting encrypted text can only be decrypted by someone who knows the exact values of a, b, and c.


The encryption function, encryptText, takes the input text and the keys a, b, and c as arguments, and returns the encrypted text. The function iterates through each character in the input text, modifies its ASCII code using the Caesar cipher with the shift determined by a, b, and c, and then converts the modified ASCII code back into a character. The resulting encrypted text is then returned.


The decryption function, decryptText, takes the encrypted text and the keys a, b, and c as arguments, and returns the decrypted text. The function iterates through each character in the encrypted text, checks for valid ASCII characters, and then recovers the original ASCII code using the inverse of the Caesar cipher with the same keys a, b, and c. The resulting decrypted text is then returned.


The code also includes event listeners for the encryption and decryption buttons, which prompt the user to enter the keys a, b, and c, and then call the corresponding encryption or decryption function with the user input as arguments. The encrypted and decrypted texts are then displayed in the corresponding input fields. The code also provides the functionality to delete the saved encrypted text and the saved list of encrypted texts from local storage. Additionally, the code uses the localStorage object to store and retrieve encrypted texts, and displays them in a list.






Conclusion: 

ZipLock provides a secure way for users to store and share sensitive information without worrying about the data falling into the wrong hands. The app's unique secret key and complex algebra mathematical function encryption algorithm ensure that the user's data is protected at all times. The app's simple user interface makes it easy for users to use the app, while the copy to clipboard feature allows users to share their encrypted data with others easily. ZipLock is a must-have app for anyone looking to secure their sensitive information.



References:


  1. Cryptography https://www.researchgate.net/publication/356879084_CryptographyBy:Waliyullahi-Zakariyah/University of Ilorin
  2. December 2021
  3. Encryption and Decryption Cloud Computing Data Based on XOR and Genetic Algorithmhttps://www.researchgate.net/publication/358395610_Encryption_and_Decryption_Cloud_Computing_Data_Based_on_XOR_and_Genetic_Algorithm,January 2022International Journal of Cloud Applications and Computing 12(1):1-10,DOI: 10.4018/IJCAC.297101,Authors:,Huthaifa Al Issa,Al-Balqa' Applied University,Mustafa Hamzeh Al-Jarah,Dr.Ammar Almomani,Skyline University College,Ahmad Al Nawasrah,King Saud University

Comments

Popular posts from this blog

Home Automation using NodeMCU ESP8266 and Blynk 2.0(IOT)