add otpauth

test.html

@@ -16,6 +16,7 @@
       <img alt="qrcode" class="js-qrcode" width="166" height="166" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" />
       <p>20-byte (160-bit) Base32 Key:</p>
       <h3 class="js-key">xxxx xxxx xxxx xxxx xxxx xxxx xxxx xxxx</h3>
+      <p class="js-otpauth">otpauth://totp/company:user?secret=xxxx</p>
     </div>
 
     <br />

test.js

@@ -16,16 +16,13 @@ function generate(ke) {
     var userAccount = $('.js-user-account').value;
 
     // obviously don't use this in production, but it's not so bad for the demo
-    var src = 'https://www.google.com/chart?chs=166x166&chld=L|0&cht=qr&chl='
+    var otpauth = 'otpauth://totp/'
-      + encodeURIComponent(
+      + encodeURIComponent(companyName) + ':' + encodeURIComponent(userAccount)
-          'otpauth://totp/'
+      + '?secret=' + key.replace(/\s+/g, '').toUpperCase()
-        + encodeURIComponent(companyName)
+      ;
-        + ':'
+    var src = 'https://www.google.com/chart?chs=166x166&chld=L|0&cht=qr&chl=' + encodeURIComponent(otpauth);
-        + encodeURIComponent(userAccount)
-        + '?secret='
-        + key.replace(/\s+/g, '').toUpperCase()
-      );
 
+    $('.js-otpauth').innerHTML = otpauth; // safe to inject because I created it
     $('.js-key').innerHTML = key; // safe to inject because I created it
     $('img.js-qrcode').src = src;