添加badssl.com目录

badssl.com/common/input/credit-card/index.html

@@ -0,0 +1,27 @@
+---
+title: credit-card
+layout: page
+favicon: gray
+background: gray
+---
+
+<style>
+#content input {
+  font-size: 4vw;
+}
+</style>
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    credit-card
+  </h1>
+  <br><br><br>
+  <form>
+    <input type="text" autofocus autocomplete="cc-number" placeholder="credit card number" maxlength="19"><br><br>
+    <input type="text" autocomplete="cc-csc" placeholder="security code" maxlength="4">
+  </form>
+</div>
+
+<div id="footer">
+  This page contains a credit card input form.
+</div>

badssl.com/common/input/dynamic-login/index.html

@@ -0,0 +1,64 @@
+---
+title: dynamic-login
+layout: page
+favicon: gray
+background: gray
+---
+
+<style>
+#content button {
+  font-size: 3vw;
+}
+#content input {
+  font-size: 3vw;
+}
+#content #form-wrapper {
+  height: 5em;
+}
+a {
+  font-size: 3vw;
+  color: white;
+  font-family: Helvetica, Tahoma, sans-serif;
+}
+.hidden {
+  display: none;
+}
+</style>
+
+<div id="content">
+  <h1 style="font-size: 4vw;">
+    dynamic-login
+  </h1>
+  <br><br>
+  <a href="" id="show-form">
+    Show login form
+  </a>
+  <div id="form-wrapper">
+    <br>
+    <form id="form" class="hidden" action="./submit/" method="post">
+      <input type="text" autocomplete="username" id="username" placeholder="username field"/><br><br>
+      <input type="password" id="value" placeholder="password input field" value="password"/><br><br>
+      <button type="submit">Submit</button>
+    </form>
+  </div>
+</div>
+
+<div id="footer">
+  This page can show and hide a <code>&lt;form&gt;</code><br>
+  with username and password inputs.
+</div>
+
+<script>
+var showingForm = false;
+document.querySelector("#show-form").addEventListener("click", function(e) {
+  e.preventDefault();
+  if (showingForm) {
+    document.querySelector("#form").classList.add("hidden");
+    document.querySelector("#show-form").textContent = "Show login form";
+  } else {
+    document.querySelector("#form").classList.remove("hidden");
+    document.querySelector("#show-form").textContent = "Hide login form";
+  }
+  showingForm = !showingForm;
+})
+</script>

badssl.com/common/input/dynamic-login/submit/index.html

@@ -0,0 +1,16 @@
+---
+subdomain: dynamic-login submitted
+layout: page
+favicon: gray
+background: gray
+---
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    (submitted)
+  </h1>
+</div>
+
+<div id="footer">
+  This is the submission page for <a href="../">a form</a>.
+</div>

badssl.com/common/input/login/index.html

@@ -0,0 +1,28 @@
+---
+title: login
+layout: page
+favicon: gray
+background: gray
+---
+
+<style>
+#content input {
+  font-size: 4vw;
+}
+</style>
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    login
+  </h1>
+  <br><br><br>
+  <form action="./submit/" method="post">
+    <input type="text" autocomplete="username" id="username" placeholder="username field"/><br><br>
+    <input type="password" id="value" placeholder="password input field" value="password"/><br><br>
+    <button type="submit">Submit</button>
+  </form>
+</div>
+
+<div id="footer">
+  This page contains a <code>&lt;form&gt;</code> with username and password inputs.
+</div>

badssl.com/common/input/login/submit/index.html

@@ -0,0 +1,16 @@
+---
+titled: login submitted
+layout: page
+favicon: gray
+background: gray
+---
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    (submitted)
+  </h1>
+</div>
+
+<div id="footer">
+  This is the submission page for <a href="../">a form</a>.
+</div>

badssl.com/common/input/password/index.html

@@ -0,0 +1,24 @@
+---
+title: password
+layout: page
+favicon: gray
+background: gray
+---
+
+<style>
+#content input {
+  font-size: 4vw;
+}
+</style>
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    password
+  </h1>
+  <br><br><br>
+  <input type="password" id="value" placeholder="password input field" value="password"/>
+</div>
+
+<div id="footer">
+  This page contains a lone password field<br> that is <b>not</b> wrapped in a <tt>&lt;form&gt;</tt> tag.
+</div>

badssl.com/common/input/textarea/index.html

@@ -0,0 +1,24 @@
+---
+title: textarea
+layout: page
+favicon: gray
+background: gray
+---
+
+<style>
+#content textarea {
+  font-size: 4vw;
+}
+</style>
+
+<div id="content">
+  <h1 style="font-size: 5vw;">
+    textarea
+  </h1>
+  <br><br><br>
+  <textarea placeholder="Type here." autofocus></textarea>
+</div>
+
+<div id="footer">
+  This page contains a <code>&lt;textarea&gt;</code> input.
+</div>

badssl.com/common/input/web-payment/index.html

@@ -0,0 +1,21 @@
+---
+title: web-payment
+layout: page
+favicon: gray
+background: gray
+---
+
+<div id="content">
+  <h1>web-payment</h1>
+  <p>
+    <button onclick="handleClick();">Initiate payment</button>
+    <button id="log-toggle" onclick="toggleLogVisibility();">Show log</button>
+    <ul id="log" hidden></ul>
+  </p>
+</div>
+
+<div id="footer">
+  <p>This page requires web payment API.</p>
+</div>
+
+<script src="index.js"></script>

badssl.com/common/input/web-payment/index.js

@@ -0,0 +1,75 @@
+function appendLog(msg) {
+  console.log(msg);
+  let logList = document.getElementById('log');
+  let logEntry = document.createElement('li');
+  let logText = document.createTextNode(msg);
+  logEntry.appendChild(logText);
+  logList.appendChild(logEntry);
+}
+
+function clearLog() {
+  let logList = document.getElementById('log');
+  while (logList.firstChild) {
+    logList.removeChild(logList.firstChild);
+  }
+}
+
+function toggleLogVisibility() {
+  let logList = document.getElementById('log');
+  let logToggle = document.getElementById('log-toggle');
+  if (logList.hidden) {
+    logToggle.innerHTML = 'Hide log';
+    logList.hidden = false;
+  } else {
+    logToggle.innerHTML = 'Show log';
+    logList.hidden = true;
+  }
+}
+
+/**
+ * Builds PaymentRequest for credit cards, but does not show any UI yet.
+ * @return {PaymentRequest} The PaymentRequest object.
+ */
+function initPaymentRequest() {
+  const request = new PaymentRequest(
+      [{
+        supportedMethods: ['basic-card'],
+      }],
+      {
+        total: {
+          label: 'Total',
+          amount: {
+            currency: 'USD',
+            value: '1.00',
+          },
+        },
+      });
+  request.canMakePayment().then(function(result) {
+    appendLog('canMakePayment returned: ' + result);
+  }).catch(function(err) {
+    appendLog('canMakePayment rejected: ' + err.name + ': ' + err.message);
+  });
+  request.hasEnrolledInstrument().then(function(result) {
+    appendLog('hasEnrolledInstrument returned: ' + result);
+  }).catch(function(err) {
+    appendLog('hasEnrolledInstrument rejected: ' + err.name + ': ' + err.message);
+  });
+  return request;
+}
+
+let request = initPaymentRequest();
+
+/** Invokes PaymentRequest for credit cards. */
+function handleClick() {
+  clearLog();
+  request.show().then(function(instrumentResponse) {
+    appendLog('show returned: ' + JSON.stringify(instrumentResponse));
+    request = initPaymentRequest();
+    return instrumentResponse.complete('success');
+  })
+  .catch(function(err) {
+    appendLog('show rejected: ' + err.name + ': ' + err.message);
+    request = initPaymentRequest();
+  });
+
+}