125 lines
4.6 KiB
HTML
125 lines
4.6 KiB
HTML
<html>
|
|
<head>
|
|
<title>BlueCrypt</title>
|
|
<style>
|
|
textarea {
|
|
width: 42em;
|
|
height: 10em;
|
|
}
|
|
/* need to word wrap the binary no space der */
|
|
.js-der-public, .js-der-private{
|
|
white-space: pre-wrap; /* CSS3 */
|
|
white-space: -moz-pre-wrap; /* Firefox */
|
|
white-space: -pre-wrap; /* Opera <7 */
|
|
white-space: -o-pre-wrap; /* Opera 7 */
|
|
word-wrap: break-word; /* IE */
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>BlueCrypt for the Browser</h1>
|
|
<p>BlueCrypt is universal crypto for the browser. It's lightweight, fast, and based on native webcrypto.
|
|
This means it's easy-to-use crypto in kilobytes, not megabytes.</p>
|
|
|
|
<h2>Keypair Generation</h2>
|
|
<form class="js-keygen">
|
|
<p>Key Type:</p>
|
|
<div>
|
|
<input type="radio" id="-ktyEC"
|
|
name="kty" value="EC" checked>
|
|
<label for="-ktyEC">ECDSA</label>
|
|
<input type="radio" id="-ktyRSA"
|
|
name="kty" value="RSA">
|
|
<label for="-ktyRSA">RSA</label>
|
|
</div>
|
|
<div class="js-ec-opts">
|
|
<p>EC Options:</p>
|
|
<input type="radio" id="-crv2"
|
|
name="ec-crv" value="P-256" checked>
|
|
<label for="-crv2">P-256</label>
|
|
<input type="radio" id="-crv3"
|
|
name="ec-crv" value="P-384">
|
|
<label for="-crv3">P-384</label>
|
|
<!-- input type="radio" id="-crv5"
|
|
name="ec-crv" value="P-521">
|
|
<label for="-crv5">P-521</label -->
|
|
</div>
|
|
<div class="js-rsa-opts" hidden>
|
|
<p>RSA Options:</p>
|
|
<input type="radio" id="-modlen2"
|
|
name="rsa-len" value="2048" checked>
|
|
<label for="-modlen2">2048</label>
|
|
<input type="radio" id="-modlen3"
|
|
name="rsa-len" value="3072">
|
|
<label for="-modlen3">3072</label>
|
|
<input type="radio" id="-modlen5"
|
|
name="rsa-len" value="4096">
|
|
<label for="-modlen5">4096</label>
|
|
</div>
|
|
<button class="js-generate" hidden>Generate</button>
|
|
</form>
|
|
|
|
<h2>ACME Account</h2>
|
|
<form class="js-acme-account">
|
|
<label for="-acmeEmail">Email:</label>
|
|
<input class="js-email" type="email" id="-acmeEmail">
|
|
<br>
|
|
<label for="-acmeDomains">Domains:</label>
|
|
<input class="js-domains" type="text" id="-acmeDomains">
|
|
<br>
|
|
<button class="js-create-account" hidden>Create Account</button>
|
|
</form>
|
|
|
|
<div class="js-loading" hidden>Loading</div>
|
|
|
|
<details class="js-toc-jwk" hidden>
|
|
<summary>JWK Keypair</summary>
|
|
<pre><code class="js-jwk"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-der-private" hidden>
|
|
<summary>DER Private Binary</summary>
|
|
<pre><code class="js-der-private"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-der-public" hidden>
|
|
<summary>DER Public Binary</summary>
|
|
<pre><code class="js-der-public"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs1-private" hidden>
|
|
<summary>PEM Private (base64-encoded PKCS1 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs1-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-sec1-private" hidden>
|
|
<summary>PEM Private (base64-encoded SEC1 DER)</summary>
|
|
<pre><code class="js-input-pem-sec1-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs8-private" hidden>
|
|
<summary>PEM Private (base64-encoded PKCS8 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs8-private" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-pkcs1-public" hidden>
|
|
<summary>PEM Public (base64-encoded PKCS1 DER)</summary>
|
|
<pre><code class="js-input-pem-pkcs1-public" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-pem js-toc-pem-spki-public" hidden>
|
|
<summary>PEM Public (base64-encoded SPKI/PKIX DER)</summary>
|
|
<pre><code class="js-input-pem-spki-public" ></code></pre>
|
|
</details>
|
|
<details class="js-toc-acme-account-request" hidden>
|
|
<summary>ACME Account Request</summary>
|
|
<pre><code class="js-acme-account-request"> </code></pre>
|
|
</details>
|
|
<details class="js-toc-acme-account-response" hidden>
|
|
<summary>ACME Account Response</summary>
|
|
<pre><code class="js-acme-account-response"> </code></pre>
|
|
</details>
|
|
<script src="./lib/bluecrypt-encoding.js"></script>
|
|
<script src="./lib/asn1-packer.js"></script>
|
|
<script src="./lib/x509.js"></script>
|
|
<script src="./lib/ecdsa.js"></script>
|
|
<script src="./lib/rsa.js"></script>
|
|
<script src="./lib/keypairs.js"></script>
|
|
<script src="./lib/acme.js"></script>
|
|
<script src="./app.js"></script>
|
|
</body>
|
|
</html>
|