28:null 29:["$","title",null,{"children":"Caesar's Cipher | Ben Pyrik | Observable"}] 2e:T433,md`

The Caesar cipher is an ancient [substitution cipher](https://en.wikipedia.org/wiki/Substitution_cipher) named after its first recorded user, Julius Caesar who used it to [communicate with his army](https://www.cia.gov/news-information/featured-story-archive/2007-featured-story-archive/cracking-the-code.html). > "If he had anything confidential to say, he wrote it in cipher, that is, by so changing the order of the letters of the alphabet, that not a word could be made out. If anyone wishes to decipher these, and get at their meaning, he must substitute the fourth letter of the alphabet, namely D, for A, and so with the others." - Suetonius, *Life of Julius Caesar* 56 (from [Wikipedia](https://en.wikipedia.org/wiki/Caesar_cipher#History_and_usage)) As Suetonius says, the Caesar cipher works by shifting each letter of the alphabet. Caesar shifted each letter by three, but the amount doesn't matter.`2f:[] 2c:{"id":"788eb6789d311e9a","slug":"caesar-cipher","title":"Caesar's Cipher","thumbnail":"79efde633bf87e5c74ac696e3799e27c935c4caea68f91e5b1df51d857b3a69d","access_level":"public","create_time":"$D2019-03-02T17:56:02.250Z","update_time":"$D2019-03-03T03:00:07.842Z","view_time":null,"first_public_time":"$D2019-03-02T20:58:24.462Z","has_unpublished_edits":null,"fork":false,"stars":7,"starred":false,"owner":{"type":"team","id":"97e03c8520c8407e","login":"bryik","name":"Ben Pyrik","avatar_url":"https://avatars-next.observableusercontent.com/855ee5aed892f1112efa8abfe4d3b82a1cd5a6db03fc4c2456abab99fe563c60","tier":"starter_2024"},"version":301,"publish_version":301,"role":null,"authored":false,"authors":[{"type":"individual","id":"a068242f2b7fc4a4","login":"bryik","name":"Ben Pyrik","avatar_url":"https://avatars-next.observableusercontent.com/855ee5aed892f1112efa8abfe4d3b82a1cd5a6db03fc4c2456abab99fe563c60","tier":null}],"members":[{"type":"individual","id":"a068242f2b7fc4a4","login":"bryik","name":"Ben Pyrik","avatar_url":"https://avatars-next.observableusercontent.com/855ee5aed892f1112efa8abfe4d3b82a1cd5a6db03fc4c2456abab99fe563c60","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Caesar's Cipher","cells":[{"id":0,"value":"md`# Caesar's Cipher`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"alphabet = 'abcdefghijklmnopqrstuvwxyz'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":28,"value":"viewof shift = slider({\n min: 0, \n max: alphabet.length - 1, \n step: 1, \n value: 3, \n title: \"Shift\", \n description: \"Each letter will be shifted to the left by this amount.\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"shiftedAlphabet = {\n let result = alphabet;\n for (let i = 0; i < shift; i++) {\n result = result.substr(1) + result[0];\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":125,"value":" md`The result is a new, shifted alphabet.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"md`With a shift of ${shift}, every letter is replaced by the letter ${shift} letters to its right. Letters at the end of the alphabet wrap around to the beginning (e.g. **'z'** shifted by ${shift} becomes **'${shiftedAlphabet[alphabet.length - 1]}'**).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":196,"value":"{\n let table = \"\";\n \n let width = 12; // px\n \n let tr = \"\";\n for (let i = 0; i < alphabet.length; i++) {\n let td = ``;\n tr += td;\n }\n tr += '';\n table += tr;\n \n tr = '';\n for (let i = 0; i < alphabet.length; i++) {\n let td = ``;\n tr += td;\n }\n tr += '';\n table += tr;\n \n tr = \"\";\n for (let i = 0; i < alphabet.length; i++) {\n let td = ``;\n tr += td;\n }\n tr += '';\n table += tr;\n \n table += '

${i}

${alphabet[i]}

${shiftedAlphabet[i]}

'\n return html`${table}`\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":280,"value":"md`The table above has three rows: the first row gives letter indices, the second is the original (unshifted) alphabet, and the third is the shifted alphabet.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":193,"value":"md`A message is encrypted by shifting every letter.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"viewof plaintext = text({title: \"Message\", value: \"attack at dawn\", description: \"The text to encrypt.\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":38,"value":"// The implementation below shifts each letter by looking up its index in the original (unshifted) alphabet. \n// The letter at that index in the **shifted** alphabet corresponds to the shifted-form of that letter.\nciphertext = {\n let encrypted = '';\n for (let letter of plaintext) {\n let letterIndex = alphabet.indexOf(letter);\n if (letterIndex === -1) {\n // It's a space. \n encrypted += ' '\n } else {\n encrypted += shiftedAlphabet[letterIndex]\n }\n }\n \n return encrypted;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":90,"value":"md`Messages can be decrypted by reversing the shift.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":94,"value":"viewof rightShift = slider({\n min: -25, \n max: 0, \n step: 1, \n value: 0, \n title: \"Reverse shift\", \n description: \"Each letter will be shifted to the right by this amount.\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":105,"value":"reverseShiftedAlphabet = {\n let alphLen = alphabet.length;\n let result = shiftedAlphabet;\n for (let i = 0; i > rightShift; i--) {\n result = result[alphLen-1] + result.substr(0, alphLen - 1);\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":153,"value":"md`A reverse shift produces a new alphabet. If the shift is equivalent in magnitude to the original shift then the resulting alphabet can be used to recover the message.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":117,"value":"md`Since there are only 25 possible shifts, the Caesar cipher is quite easy to bruteforce. **Try it yourself** by moving the reverse shift slider slowly to the left while watching the decrypted output below. All shifts except one produce a garbled mess of letters.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"decryptedtext = {\n let decrypted = '';\n for (let letter of ciphertext) {\n let letterIndex = shiftedAlphabet.indexOf(letter);\n if (letterIndex === -1) {\n // It's a space. \n decrypted += ' '\n } else {\n decrypted += reverseShiftedAlphabet[letterIndex]\n }\n }\n \n return decrypted;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"md`### Libraries`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"import {slider, text} from \"@jashkenas/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W2f","stdlib":"1","titling":"auto"}} 2d:"$2c:body"