├── README.md ├── index.html ├── script.js └── style.css /README.md: -------------------------------------------------------------------------------- 1 | # Carser-Cipher 2 | Protect Your Massages With This Encryption & Decryption System 3 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Carser Cipher 9 | 10 | 11 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 24 | 25 |

26 | CAESAR 28 | CIPHER 29 |

30 | 31 |

32 | Enter 33 | your message for encryption: 34 |

35 | 36 |

37 |

38 | 39 | 40 | 48 | 49 |

50 | 51 | 52 | 53 |

54 | 55 | Enter 56 | your encrypted message for decryption: 57 |

58 | 59 | 60 | 61 | 69 | 70 | 71 |

72 | 73 | 74 | 75 | 76 | 77 | -------------------------------------------------------------------------------- /script.js: -------------------------------------------------------------------------------- 1 | var alphabet = "abcdefghijklmnopqrstuvwxyz"; 2 | var newalpha = ""; 3 | 4 | function shift() { 5 | for (let i = 0; i < alphabet.length; i++) { 6 | let offset = (i + 4) % alphabet.length; 7 | newalpha += alphabet[offset]; 8 | } 9 | } 10 | 11 | 12 | function encode() { 13 | 14 | shift(); 15 | var res = ""; 16 | let message = document.getElementById("EncryptMessage").value; 17 | let result = ""; 18 | message = message.toLowerCase(); 19 | for (let i = 0; i < message.length; i++) { 20 | let index = alphabet.indexOf(message[i]); 21 | result += newalpha[index]; 22 | } 23 | res = ("Your Encrypted Message: ").concat(result); 24 | window.alert(res); 25 | } 26 | 27 | 28 | function decode() { 29 | 30 | shift(); 31 | var res2 = ""; 32 | let message2 = document.getElementById("DecryptMessage").value; 33 | let result = ""; 34 | message2 = message2.toLowerCase(); 35 | for (let i = 0; i < message2.length; i++) { 36 | let index = newalpha.indexOf(message2[i]); 37 | result += alphabet[index]; 38 | } 39 | res2 = ("Your Decrypted Message: ").concat(result); 40 | window.alert(res2); 41 | } -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | * { 2 | padding: 0; 3 | margin: 0; 4 | 5 | } 6 | .button:hover { 7 | color: lightsalmon; 8 | } 9 | 10 | p { 11 | font-family: 'Montserrat', sans-serif; 12 | /* font-family: 'Roboto', sans-serif; */ 13 | 14 | } --------------------------------------------------------------------------------