computer_glamour
/
privatebin-mirror
дзеркало https://github.com/PrivateBin/PrivateBin


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
							<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
        
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>SJCL demo</title>
  <link rel="stylesheet" type="text/css" href="example.css"/>
  <script type="text/javascript" src="../sjcl.js"></script>
  <script type="text/javascript" src="form.js"></script>
  <script type="text/javascript" src="example.js"></script>
</head>
<body onload="loaded()">
  <h1>SJCL demo</h1>

  <div class="header">
  <p>This page is a demo of the Stanford Javascript Crypto Library. To get started, just type in a password in the left pane and a secret message in the middle pane, then click "encrypt". Encryption takes place in your browser and we never see the plaintext.</p>
  
  <p>SJCL has lots of other options, many of which are shown in the grey boxes.</p>
  </div>

  <form id="theForm" onsubmit="return false;">
  <div class="column" id="ckey">
    <!-- Password and pbkdf2 parameters -->
    <div class="box" id="ppassword">
      <h2>Password</h2>
      <div class="section">
        <label for="password">Password:</label>
        <input type="password" class="wide" name="password" id="password" autocomplete="off" tabindex="1"/>
        <p class="explanation">
          Choose a strong, random password.
        </p>
      </div>
    </div>
    
    <div class="box" id="pkey">
      <h2>Key Derivation</h2>
      <div class="section">
        <div>
          <label for="salt"">Salt:</label>
          <a class="random floatright" href="javascript:randomize('salt',2,0)">random</a>
        </div>
        <input type="text" id="salt" class="wide hex" autocomplete="off" size="17" maxlength="35"/>
        <input type="checkbox" name="freshsalt" id="freshsalt" autocomplete="off" checked="checked"/>
        <label for="freshsalt">Use fresh random salt for each new password</label>
        <p class="explanation">
          Salt adds more variability to your key, and prevents attackers
          from using <a href="http://en.wikipedia.org/wiki/Rainbow_table">rainbow tables</a> to attack it.
        </p>     
      </div>

      <div class="section">
        <label for="iter">Strengthen by a factor of:</label>
        <input type="text" name="iter" id="iter" value="1000" class="numeric" size="5" maxlength="5" autocomplete="off"/>
        <p class="explanation">
          Strengthening makes it slower to compute the key corresponding to your
          password.  This makes it take much longer for an attacker to guess it.
        </p>
      </div>

      <div class="section">
        Key size:
        <input type="radio" name="keysize" value="128" id="key128" checked="checked" autocomplete="off" onclick="extendKey(4)"/>
        <label for="key128">128</label>
        <input type="radio" name="keysize" value="192" id="key192" autocomplete="off" onclick="extendKey(6)"/>
        <label for="key192">192</label>
        <input type="radio" name="keysize" value="256" id="key256" autocomplete="off" onclick="extendKey(8)"/>
        <label for="key256">256</label>
        <p class="explanation">
          128 bits should be secure enough, but you can generate a longer
          key if you wish.
        </p>
      </div>

      <!-- cipher key -->
      <div class="section">
        <div>
          <label for="key">Key:</label>
          <!--
          <a class="random floatright" href="javascript:randomizeKey()">random</a>
          -->
        </div>
        <textarea id="key" name="key" class="hex" rows="2" autocomplete="off"></textarea>
        <p class="explanation">
          This key is computed from your password, salt and strengthening factor.  It
          will be used internally by the cipher.  Instead of using a password, you can
          enter a key here directly.  If you do, it should be 32, 48 or 64 hexadecimal
          digits (128, 192 or 256 bits).
        </p>
      </div>
     
    </div>
  </div>
    
    <!-- mode controls -->
  <div class="column" id="cmode">
    <div class="box">
      <h2>Cipher Parameters</h2>
      <p class="explanation">
        SJCL encrypts your data with the <a href="http://en.wikipedia.org/wiki/Advanced_Encryption_Standard"><acronym title="Advanced Encryption Standard">AES</acronym></a> block cipher.
      </p>
      <div class="section">
        Cipher mode:
        <input type="radio" name="mode" value="ccm" id="ccm" checked="checked" autocomplete="off"/>
        <label for="ccm"><acronym title="Counter mode with Cipher block chaining Message authentication code">CCM</acronym></label>
        <input type="radio" name="mode" value="ocb2" id="ocb2" autocomplete="off"/>
        <label for="ocb2"><acronym title="Offset CodeBook mode, version 2.0">OCB2</acronym></label>
        <p class="explanation">
          The cipher mode is a standard for how to use AES and other
          algorithms to encrypt and authenticate your message.
          <a href="http://en.wikipedia.org/wiki/OCB_mode">OCB2 mode</a>
          is slightly faster and has more features, but
          <a href="http://en.wikipedia.org/wiki/CCM_mode">CCM mode</a> has wider
          support because it is not patented.
        </p>
      </div>
      
      <div class="section">
        <div>
          <label for="iv">Initialization vector:</label>
          <a class="random floatright" href="javascript:randomize('iv',4,0)">random</a>
        </div>
        <input type="text" name="iv" id="iv" class="wide hex" size="32" maxlength="35" autocomplete="off"/>
        <input type="checkbox" id="freshiv" autocomplete="off" checked="checked"/>
        <label for="freshiv">Choose a new random IV for every message.</label>
        <p class="explanation">
          The IV needs to be different for every message you send.  It adds
          randomness to your message, so that the same message will look
          different each time you send it.
        </p>
        <p class="explanation">
          Be careful: CCM mode doesn't use
          the whole IV, so changing just part of it isn't enough.
        </p>
      </div>
      
      <div class="section">
        Authentication strength:
        <input type="radio" name="tag" value="64" id="tag64" autocomplete="off" checked="checked"/>
        <label for="tag64">64</label>
        <input type="radio" name="tag" value="96" id="tag96" autocomplete="off"/>
        <label for="tag96">96</label>
        <input type="radio" name="tag" value="128" id="tag128" autocomplete="off"/>
        <label for="tag128">128</label>
        <p class="explanation">
          SJCL adds a an authentication tag to your message to make sure
          nobody changes it.  The longer the authentication tag, the harder it is
          for somebody to change your encrypted message without you noticing.  64
          bits is probably enough.
        </p>
      </div>
      
      <div class="section">
        <input type="checkbox" name="json" id="json" autocomplete="off" checked="checked"/>
        <label for="json">Send the parameters and authenticated data along
          with the message.</label>
         <p class="explanation">
           These parameters are required to decrypt your message later.  If the
           person you're sending the message to knows them, you don't need to send
           them so your message will be shorter.
         </p>
         <p class="explanation">
           Default parameters won't be sent.  Your password won't be sent, either.
           The salt and iv will be encoded in base64 instead of hex, so they'll
           look different from what's in the box.
         </p>
      </div>
    </div>
  </div>
  
  <div class="column" id="ctexts">
    <div id="pplaintext" class="box">
      <h2>Plaintext</h2>
      <div class="section">
        <label for="plaintext">Secret message:</label>
        <textarea id="plaintext" autocomplete="off" rows="5" tabindex="2"></textarea>
        <div class="explanation">
          This message will be encrypted, so that nobody can read it or change it
          without your password.
        </div>
      </div>  
   
      <div class="section">
        <label for="adata">Authenticated data:</label>
        <textarea id="adata" autocomplete="off" tabindex="3"></textarea>
        <div class="explanation">
          This auxilliary message isn't secret, but its integrity will be checked
          along with the integrity of the message.
        </div>
      </div>
    </div>
    
    <div id="buttons">
      <a href="javascript:doEncrypt()" id="encrypt" tabindex="4"><span class="turnDown">encrypt</span></a>
      <a href="javascript:doDecrypt()" id="decrypt" tabindex="6"><span class="turnUp">decrypt</span></a>
    </div>
    
    <div id="pciphertext" class="box">
      <h2>Ciphertext</h2>
      <label for="ciphertext">Ciphertext:</label>
      <textarea id="ciphertext" autocomplete="off" rows="7" tabindex="5"></textarea>
      <div class="explanation">
        Your message, encrypted and authenticated so that nobody can read it
        or change it without your password.
      </div>
    </div>
  </form>
</body>
</html>