Added download links for certs and changed some formatting.

This commit is contained in:
John Shaver 2018-08-21 14:15:09 -07:00 committed by AJ ONeal
parent 1c39971be5
commit fad0739f68
3 changed files with 29 additions and 5 deletions

View File

@ -184,7 +184,7 @@
<pre id="js-acme-ver-content">...loading</pre> <pre id="js-acme-ver-content">...loading</pre>
</div> </div>
</div> </div>
<div class="download-ver-file"> <div class="download-file">
<svg class="mdicon icon-download" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"> <svg class="mdicon icon-download" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<use xlink:href="#svg-download"></use> <use xlink:href="#svg-download"></use>
</svg> </svg>
@ -259,20 +259,35 @@
<!-- Step 5 Get Certs --> <!-- Step 5 Get Certs -->
<form class="js-acme-form js-acme-form-download"> <form class="js-acme-form js-acme-form-download">
<div> <div class="cert-download-container">
<h2><label>privkey.pem</label></h2> <h2><label>privkey.pem</label></h2>
<div class="acme-result-privkey file-preview"> <div class="acme-result-privkey file-preview">
<div class="paper-fold"></div> <div class="paper-fold"></div>
<pre id="js-privkey"> <pre id="js-privkey">
</pre> </pre>
</div> </div>
<div class="download-file">
<svg class="mdicon icon-download" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<use xlink:href="#svg-download"></use>
</svg>
<a id="js-download-privkey-link" href="data:text/octet-stream;base64,SGVsbG8gV29ybGQuLi4=" download="privkey.pem" target="_blank">
Download
</a>
</div>
<h2><label>fullchain.pem</label></h2> <h2><label>fullchain.pem</label></h2>
<div class="acme-result-fullchain file-preview"> <div class="acme-result-fullchain file-preview">
<div class="paper-fold"></div> <div class="paper-fold"></div>
<pre id="js-fullchain"> <pre id="js-fullchain">
</pre> </pre>
</div> </div>
<div class="download-file">
<svg class="mdicon icon-download" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<use xlink:href="#svg-download"></use>
</svg>
<a id="js-download-fullchain-link" href="data:text/octet-stream;base64,SGVsbG8gV29ybGQuLi4=" download="fullchain.pem" target="_blank">
Download
</a>
</div>
<div> <div>
<h3>node.js https server example</h3> <h3>node.js https server example</h3>
<pre><code>'use strict'; <pre><code>'use strict';

View File

@ -471,6 +471,8 @@
console.log('WINNING!'); console.log('WINNING!');
console.log(certs); console.log(certs);
$qs('#js-fullchain').innerHTML = certs; $qs('#js-fullchain').innerHTML = certs;
$qs("#js-download-fullchain-link").href =
"data:text/octet-stream;base64," + window.btoa(certs);
// https://stackoverflow.com/questions/40314257/export-webcrypto-key-to-pem-format // https://stackoverflow.com/questions/40314257/export-webcrypto-key-to-pem-format
function spkiToPEM(keydata){ function spkiToPEM(keydata){
@ -530,6 +532,8 @@
}).then (function (keydata) { }).then (function (keydata) {
var pem = spkiToPEM(keydata); var pem = spkiToPEM(keydata);
$qs('#js-privkey').innerHTML = pem; $qs('#js-privkey').innerHTML = pem;
$qs("#js-download-privkey-link").href =
"data:text/octet-stream;base64," + window.btoa(pem);
steps[i](); steps[i]();
}).catch(function(err){ }).catch(function(err){
console.error(err); console.error(err);

View File

@ -191,12 +191,12 @@ pre {
display: none; display: none;
} }
.download-ver-file svg { .download-file svg {
fill: #5bc17f; fill: #5bc17f;
width: 1.333333333em; width: 1.333333333em;
} }
.download-ver-file a { .download-file a {
color: #5bc17f; color: #5bc17f;
} }
@ -250,3 +250,8 @@ pre {
white-space: pre-line; white-space: pre-line;
word-break: break-all; word-break: break-all;
} }
.cert-download-container {
margin: 0 -31%;
}