-
Notifications
You must be signed in to change notification settings - Fork 1
/
playfair.html
122 lines (120 loc) · 7.54 KB
/
playfair.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Playfair Tool</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.min.css" />
<link rel="stylesheet" type="text/css" href="css/playfair.css" />
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/playfair.js"></script>
</head>
<body>
<div class="row">
<div class="span10 offset1">
<h3>Playfair Tool</h3>
<ul class="nav nav-tabs" id="tabs">
<li class="active"><a href="#home" data-toggle="tab">Home</a></li>
<li><a href="#squaretab" data-toggle="tab">Square</a></li>
<li><a href="#help" data-toggle="tab">Help</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="home">
<label for="inkey">Keyphrase:</label>
<input placeholder="Type keyphrase..." type="text" name="inkey" id="inkey" size="10" />
<span class="help-block">This will change the cipher/decipher output, so have a secure way of negotiating this with the person with whom you're exchanging messages.</span>
<label class="checkbox">
<input type="checkbox" name="dostop" id="dostop" /> Convert "<span class="tt">.</span>" to "<span class="tt">STOP</span>"
</label>
<label class="checkbox">
<input type="checkbox" name="spellnumbers" id="spellnumbers" /> Spell out digits
</label>
<label for="message">Message:</label>
<textarea class="span10" rows="6" name="message" id="message" placeholder="Enter plaintext or ciphertext"></textarea>
<input class="btn" type="button" name="encrypt" id="encrypt" value="Encrypt" />
<input class="btn" type="button" name="decrypt" id="decrypt" value="Decrypt" />
</div>
<div class="tab-pane" id="squaretab">
<table id="squaretable">
<tbody id="squareid">
</tbody>
</table>
</div>
<div class="tab-pane" id="help">
<div id="helpbox">
<h4>Overview</h4>
The <a href="http://en.wikipedia.org/wiki/Playfair_cipher" target="_blank">Playfair cipher</a>
is a pencil and paper cipher designed in 1854 by Charles Wheatstone but named
after Lord Playfair who promoted its use.
<h4>The Key</h4>
<p>The key is a 5x5 Polybius square containing 25 of the 26 capital letters of the English
alphabet. In this application, <span class="tt">I</span> and <span class="tt">J</span> are combined. In others,
letters such as <span class="tt">Q</span> or <span class="tt">X</span> may be dropped. The order of the letters
within the square is critical. If the person with whom you're exhanging the message
doesn't have their square in the same order as you, then they will not be able to
correctly exchange messages with you. The sequencing of the key is made more simple
by using a Keyphrase.</p>
<h4>The Keyphrase</h4>
<p>The keyphrase is an alphabetic sequence (usually a word or set of words) which are used
to change the order of the Polybius Square. You and the person with whom you are
exchanging the message must have the same key to decipher the other's messages.
Because the most sensitive part of the process is the key, you should keep the keyphrase
secret and ensure a mechanism of rotating the keyphrase. A common method of rotating keys
is to use a book which both of you have and a pre-arranged algorithm for finding
the day's keyphrase within that book.</p>
<p>If you wish to specify the full square rather than just a beginning keyphrase,
simply enter all 25 letters of the key into the Keyphrase box</p>
<h4>Encrypting</h4>
<ul>
<li>Enter the keyphrase into the <em>Keyphrase</em> box</li>
<li>Enter the message you wish to encrypt into the <em>Message</em> box</li>
<li>Click the <em>Encrypt</em> button</li>
<li>The encrypted message appears in the <em>Message</em> box</li>
</ul>
<p>Remember that the alphabet for this is 25 upper-case letters. So everything that
is not a letter is removed, and all letters are converted to upper-case. If you check
the <em>Convert "<span class="tt">.</span>" to "<span class="tt">STOP</span>"</em> checkbox,
all periods will be changed to the word "STOP" so that you at least get
sentence endings in the result. Similarly, if you check <em>Spell out digits</em>,
numbers will be spelled out digit-by-digit.</p>
<h4>Decrypting</h4>
<ul>
<li>Enter the keyphrase into the <em>Keyphrase</em> box</li>
<li>Enter the encrypted message into the <em>Message</em> box</li>
<li>Click the <em>Decrypt</em> button</li>
<li>The plaintext message appears in the <em>Message</em> box</li>
</ul>
<p><strong>"The decrypted message isn't the same as I put it in."</strong> or
<strong>"I can't read the new decrypted message"</strong></p>
Remember, this is an alphabet of only 25 characters, and doesn't include punctuation.
So the resulting plaintext will probably not be exactly the same as you originally
entered. Here are some hints to get you started:
<ul>
<li>You'll need to figure out where word boundaries are. When constructing your
plaintext message, help out the recipient by removing any ambiguity in the
boundaries of the plaintext message. For example: "<span class="tt">TOPANDASYNCHRONOUS</span>"
might be construed as "<span class="tt">TOP AND A SYNCHRONOUS</span>" or "<span class="tt">TOP AND ASYNCHRONOUS</span>"
or even "<span class="tt">TO PANDA SYNCRHONOUS</span>"</li>
<li><span class="tt">J</span>'s from the plaintext are converted to <span class="tt">I</span>'s.</li>
<li>To avoid letter frequency issues of normal substitution ciphers, the Playfair
cipher converts a message into pairs of letters. A single pair cannot contain a
repeating letter, so an "X" will be inserted between them. If the decrypted
message contains "<span class="tt">NOXON</span>", the original was <strong>probably</strong>
"<span class="tt">NOON</span>.</li>
<li>Even if <em>Convert "<span class="tt">.</span>" to "<span class="tt">STOP</span>"</em>
and <em>Spell out digits</em> are selected, these processes will not be reversed
when decrypting. There's simply no good automated way to determine if "<span class="tt">PASTOPEN</span>"
means "<span class="tt">past open</span>" or "<span class="tt">pa. en</span>" or if
"<span class="tt">FALSEVENT</span>" should be "<span class="tt">FAL7VENT</span>" or
"<span class="tt">FALSE VENT</span>".</li>
<li>If the last digraph only includes one letter, a "<span class="tt">Z</span>" will be
appended. If the last "<span class="tt">Z</span>" doesn't make sense, just drop it.</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</body>
</html>