From 1e9151cedcae72fd768d998230ba88dea5c87bdc Mon Sep 17 00:00:00 2001
From: benarc <ben@arc.wales>
Date: Wed, 17 Mar 2021 19:59:00 +0000
Subject: [PATCH] ran prettier on captcha

---
 .../extensions/captcha/static/js/captcha.js   | 131 ++++++++++--------
 .../captcha/templates/captcha/display.html    |   8 +-
 .../captcha/templates/captcha/index.html      |  45 +++---
 3 files changed, 106 insertions(+), 78 deletions(-)

diff --git a/lnbits/extensions/captcha/static/js/captcha.js b/lnbits/extensions/captcha/static/js/captcha.js
index 6d86e865a..b23872897 100644
--- a/lnbits/extensions/captcha/static/js/captcha.js
+++ b/lnbits/extensions/captcha/static/js/captcha.js
@@ -1,65 +1,80 @@
 var ciframeLoaded = !1,
-    captchaStyleAdded = !1;
+  captchaStyleAdded = !1
 
 function ccreateIframeElement(t = {}) {
-    const e = document.createElement("iframe");
-    // e.style.marginLeft = "25px",
-    e.style.border = "none", e.style.width = "100%", e.style.height = "100%",  e.scrolling = "no", e.id = "captcha-iframe";
-    t.dest, t.amount, t.currency, t.label, t.opReturn;
-    var captchaid = document.getElementById("captchascript").getAttribute("data-captchaid");
-    return e.src = "http://localhost:5000/captcha/" + captchaid, e
+  const e = document.createElement('iframe')
+  // e.style.marginLeft = "25px",
+  ;(e.style.border = 'none'),
+    (e.style.width = '100%'),
+    (e.style.height = '100%'),
+    (e.scrolling = 'no'),
+    (e.id = 'captcha-iframe')
+  t.dest, t.amount, t.currency, t.label, t.opReturn
+  var captchaid = document
+    .getElementById('captchascript')
+    .getAttribute('data-captchaid')
+  return (e.src = 'http://localhost:5000/captcha/' + captchaid), e
 }
-document.addEventListener("DOMContentLoaded", function() {
-    if (captchaStyleAdded) console.log("Captcha stuff already added!");
-    else {
-        console.log("Adding captcha stuff"), captchaStyleAdded = !0;
-        var t = document.createElement("style");
-        t.innerHTML = "\t/*Button*/\t\t.button-captcha-filled\t\t\t{\t\t\tdisplay: flex;\t\t\talign-items: center;\t\t\tjustify-content: center;\t\t\twidth: 120px;\t\t\tmin-width: 30px;\t\t\theight: 40px;\t\t\tline-height: 2.5;\t\t\ttext-align: center;\t\t\tcursor: pointer;\t\t\t/* Rectangle 2: */\t\t\tbackground: #FF7979;\t\t\tbox-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);\t\t\tborder-radius: 20px;\t\t\t/* Sign up: */\t\t\tfont-family: 'Avenir-Heavy', Futura, Helvetica, Arial;\t\t\tfont-size: 16px;\t\t\tcolor: #FFFFFF;\t\t}\t\t.button-captcha-filled:hover\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #FF7979;\t\t\tbox-shadow: 0 0 4px 0 rgba(0,0,0,0.20);\t\t}\t\t.button-captcha-filled:active\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #FF7979;\t\t\t/*Move it down a little bit*/\t\t\tposition: relative;\t\t\ttop: 1px;\t\t}\t\t.button-captcha-filled-dark\t\t\t{\t\t\tdisplay: flex;\t\t\talign-items: center;\t\t\tjustify-content: center;\t\t\twidth: 120px;\t\t\tmin-width: 30px;\t\t\theight: 40px;\t\t\tline-height: 2.5;\t\t\ttext-align: center;\t\t\tcursor: pointer;\t\t\t/* Rectangle 2: */\t\t\tbackground: #161C38;\t\t\tbox-shadow: 0 0px 4px 0 rgba(0,0,0,0.20);\t\t\tborder-radius: 20px;\t\t\t/* Sign up: */\t\t\tfont-family: 'Avenir-Heavy', Futura, Helvetica, Arial;\t\t\tfont-size: 16px;\t\t\tcolor: #FFFFFF;\t\t}\t\t.button-captcha-filled-dark:hover\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #161C38;\t\t\tbox-shadow: 0 0px 4px 0 rgba(0,0,0,0.20);\t\t}\t\t.button-captcha-filled-dark:active\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #161C38;\t\t\t/*Move it down a little bit*/\t\t\tposition: relative;\t\t\ttop: 1px;\t\t}\t\t.modal-captcha-container {\t\t    position: fixed;\t\t    z-index: 1000;\t\t    text-align: left;/*Si no añado esto, a veces hereda el text-align:center del body, y entonces el popup queda movido a la derecha, por center + margin left que aplico*/\t\t    left: 0;\t\t    top: 0;\t\t    width: 100%;\t\t    height: 100%;\t\t    background-color: rgba(0, 0, 0, 0.5);\t\t    opacity: 0;\t\t    visibility: hidden;\t\t    transform: scale(1.1);\t\t    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\t\t}\t\t.modal-captcha-content {\t\t    position: absolute;\t\t    top: 50%;\t\t    left: 50%;\t\t    transform: translate(-50%, -50%);\t\t    background-color: white;\t\t    width: 100%;\t\t    height: 100%;\t\t    border-radius: 0.5rem;\t\t    /*Rounded shadowed borders*/\t\t\tbox-shadow: 2px 2px 4px 0 rgba(0,0,0,0.15);\t\t\tborder-radius: 5px;\t\t}\t\t.close-button-captcha {\t\t    float: right;\t\t    width: 1.5rem;\t\t    line-height: 1.5rem;\t\t    text-align: center;\t\t    cursor: pointer;\t\t    margin-right:20px;\t\t    margin-top:10px;\t\t    border-radius: 0.25rem;\t\t    background-color: lightgray;\t\t}\t\t.close-button-captcha:hover {\t\t    background-color: darkgray;\t\t}\t\t.show-modal-captcha {\t\t    opacity: 1;\t\t    visibility: visible;\t\t    transform: scale(1.0);\t\t    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\t\t}\t\t/* Mobile */\t\t@media screen and (min-device-width: 160px) and ( max-width: 1077px ) /*No tendria ni por que poner un min-device, porq abarca todo lo humano...*/\t\t{\t\t}";
-        var e = document.querySelector("script");
-        e.parentNode.insertBefore(t, e);
-        var i = document.getElementById("captchacheckbox"),
-            n = i.dataset,
-            o = "true" === n.dark;
-        var a = document.createElement("div");
-        a.className += " modal-captcha-container", a.innerHTML = '\t\t<div class="modal-captcha-content">        \t<span class="close-button-captcha" style="display: none;">&times;</span>\t\t</div>\t', document.getElementsByTagName("body")[0].appendChild(a);
-        var r = document.getElementsByClassName("modal-captcha-content").item(0);
-        document.getElementsByClassName("close-button-captcha").item(0).addEventListener("click", d), window.addEventListener("click", function(t) {
-            t.target === a && d()
-        }), i.addEventListener("change", function() {
-            if(this.checked){
-                // console.log("checkbox checked");
-                if (0 == ciframeLoaded) {
-                    // console.log("n: ", n);
-                    var t = ccreateIframeElement(n);
-                    r.appendChild(t), ciframeLoaded = !0
-                }
-                d()                
-            }
-        })
-    }
+document.addEventListener('DOMContentLoaded', function () {
+  if (captchaStyleAdded) console.log('Captcha stuff already added!')
+  else {
+    console.log('Adding captcha stuff'), (captchaStyleAdded = !0)
+    var t = document.createElement('style')
+    t.innerHTML =
+      "\t/*Button*/\t\t.button-captcha-filled\t\t\t{\t\t\tdisplay: flex;\t\t\talign-items: center;\t\t\tjustify-content: center;\t\t\twidth: 120px;\t\t\tmin-width: 30px;\t\t\theight: 40px;\t\t\tline-height: 2.5;\t\t\ttext-align: center;\t\t\tcursor: pointer;\t\t\t/* Rectangle 2: */\t\t\tbackground: #FF7979;\t\t\tbox-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);\t\t\tborder-radius: 20px;\t\t\t/* Sign up: */\t\t\tfont-family: 'Avenir-Heavy', Futura, Helvetica, Arial;\t\t\tfont-size: 16px;\t\t\tcolor: #FFFFFF;\t\t}\t\t.button-captcha-filled:hover\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #FF7979;\t\t\tbox-shadow: 0 0 4px 0 rgba(0,0,0,0.20);\t\t}\t\t.button-captcha-filled:active\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #FF7979;\t\t\t/*Move it down a little bit*/\t\t\tposition: relative;\t\t\ttop: 1px;\t\t}\t\t.button-captcha-filled-dark\t\t\t{\t\t\tdisplay: flex;\t\t\talign-items: center;\t\t\tjustify-content: center;\t\t\twidth: 120px;\t\t\tmin-width: 30px;\t\t\theight: 40px;\t\t\tline-height: 2.5;\t\t\ttext-align: center;\t\t\tcursor: pointer;\t\t\t/* Rectangle 2: */\t\t\tbackground: #161C38;\t\t\tbox-shadow: 0 0px 4px 0 rgba(0,0,0,0.20);\t\t\tborder-radius: 20px;\t\t\t/* Sign up: */\t\t\tfont-family: 'Avenir-Heavy', Futura, Helvetica, Arial;\t\t\tfont-size: 16px;\t\t\tcolor: #FFFFFF;\t\t}\t\t.button-captcha-filled-dark:hover\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #161C38;\t\t\tbox-shadow: 0 0px 4px 0 rgba(0,0,0,0.20);\t\t}\t\t.button-captcha-filled-dark:active\t\t{\t\t\tbackground:#FFFFFF;\t\t\tcolor: #161C38;\t\t\t/*Move it down a little bit*/\t\t\tposition: relative;\t\t\ttop: 1px;\t\t}\t\t.modal-captcha-container {\t\t    position: fixed;\t\t    z-index: 1000;\t\t    text-align: left;/*Si no añado esto, a veces hereda el text-align:center del body, y entonces el popup queda movido a la derecha, por center + margin left que aplico*/\t\t    left: 0;\t\t    top: 0;\t\t    width: 100%;\t\t    height: 100%;\t\t    background-color: rgba(0, 0, 0, 0.5);\t\t    opacity: 0;\t\t    visibility: hidden;\t\t    transform: scale(1.1);\t\t    transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\t\t}\t\t.modal-captcha-content {\t\t    position: absolute;\t\t    top: 50%;\t\t    left: 50%;\t\t    transform: translate(-50%, -50%);\t\t    background-color: white;\t\t    width: 100%;\t\t    height: 100%;\t\t    border-radius: 0.5rem;\t\t    /*Rounded shadowed borders*/\t\t\tbox-shadow: 2px 2px 4px 0 rgba(0,0,0,0.15);\t\t\tborder-radius: 5px;\t\t}\t\t.close-button-captcha {\t\t    float: right;\t\t    width: 1.5rem;\t\t    line-height: 1.5rem;\t\t    text-align: center;\t\t    cursor: pointer;\t\t    margin-right:20px;\t\t    margin-top:10px;\t\t    border-radius: 0.25rem;\t\t    background-color: lightgray;\t\t}\t\t.close-button-captcha:hover {\t\t    background-color: darkgray;\t\t}\t\t.show-modal-captcha {\t\t    opacity: 1;\t\t    visibility: visible;\t\t    transform: scale(1.0);\t\t    transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\t\t}\t\t/* Mobile */\t\t@media screen and (min-device-width: 160px) and ( max-width: 1077px ) /*No tendria ni por que poner un min-device, porq abarca todo lo humano...*/\t\t{\t\t}"
+    var e = document.querySelector('script')
+    e.parentNode.insertBefore(t, e)
+    var i = document.getElementById('captchacheckbox'),
+      n = i.dataset,
+      o = 'true' === n.dark
+    var a = document.createElement('div')
+    ;(a.className += ' modal-captcha-container'),
+      (a.innerHTML =
+        '\t\t<div class="modal-captcha-content">        \t<span class="close-button-captcha" style="display: none;">&times;</span>\t\t</div>\t'),
+      document.getElementsByTagName('body')[0].appendChild(a)
+    var r = document.getElementsByClassName('modal-captcha-content').item(0)
+    document
+      .getElementsByClassName('close-button-captcha')
+      .item(0)
+      .addEventListener('click', d),
+      window.addEventListener('click', function (t) {
+        t.target === a && d()
+      }),
+      i.addEventListener('change', function () {
+        if (this.checked) {
+          // console.log("checkbox checked");
+          if (0 == ciframeLoaded) {
+            // console.log("n: ", n);
+            var t = ccreateIframeElement(n)
+            r.appendChild(t), (ciframeLoaded = !0)
+          }
+          d()
+        }
+      })
+  }
 
-    function d() {
-        a.classList.toggle("show-modal-captcha")
-    }
-});
+  function d() {
+    a.classList.toggle('show-modal-captcha')
+  }
+})
 
-function receiveMessage(event){
-   if (event.data.includes("paymenthash")){
-        // console.log("paymenthash received: ", event.data);
-        document.getElementById("captchapayhash").value = event.data.split("_")[1];
-   }
-   if (event.data.includes("removetheiframe")){
-      if (event.data.includes("nok")){
-        //invoice was NOT paid
-        // console.log("receiveMessage not paid")
-        document.getElementById("captchacheckbox").checked = false;
-      }
-      ciframeLoaded = !1;
-      var element = document.getElementById('captcha-iframe');
-      document.getElementsByClassName("modal-captcha-container")[0].classList.toggle("show-modal-captcha");
-      element.parentNode.removeChild(element);
-   }
+function receiveMessage(event) {
+  if (event.data.includes('paymenthash')) {
+    // console.log("paymenthash received: ", event.data);
+    document.getElementById('captchapayhash').value = event.data.split('_')[1]
+  }
+  if (event.data.includes('removetheiframe')) {
+    if (event.data.includes('nok')) {
+      //invoice was NOT paid
+      // console.log("receiveMessage not paid")
+      document.getElementById('captchacheckbox').checked = false
+    }
+    ciframeLoaded = !1
+    var element = document.getElementById('captcha-iframe')
+    document
+      .getElementsByClassName('modal-captcha-container')[0]
+      .classList.toggle('show-modal-captcha')
+    element.parentNode.removeChild(element)
+  }
 }
-window.addEventListener("message", receiveMessage, false);
-
-
+window.addEventListener('message', receiveMessage, false)
diff --git a/lnbits/extensions/captcha/templates/captcha/display.html b/lnbits/extensions/captcha/templates/captcha/display.html
index af40ff4a2..80e59e63d 100644
--- a/lnbits/extensions/captcha/templates/captcha/display.html
+++ b/lnbits/extensions/captcha/templates/captcha/display.html
@@ -46,7 +46,11 @@
               <q-btn outline color="grey" @click="copyText(paymentReq)"
                 >Copy invoice</q-btn
               >
-              <q-btn @click="cancelPayment(false)" flat color="grey" class="q-ml-auto"
+              <q-btn
+                @click="cancelPayment(false)"
+                flat
+                color="grey"
+                class="q-ml-auto"
                 >Cancel</q-btn
               >
             </div>
@@ -58,7 +62,7 @@
             Captcha accepted. You are probably human.<br />
             <!-- <strong>{% raw %}{{ redirectUrl }}{% endraw %}</strong> -->
           </p>
-  <!--         <div class="row q-mt-lg">
+          <!--         <div class="row q-mt-lg">
             <q-btn outline color="grey" type="a" :href="redirectUrl"
               >Open URL</q-btn>
           </div> -->
diff --git a/lnbits/extensions/captcha/templates/captcha/index.html b/lnbits/extensions/captcha/templates/captcha/index.html
index a83e1029a..2250bcedf 100644
--- a/lnbits/extensions/captcha/templates/captcha/index.html
+++ b/lnbits/extensions/captcha/templates/captcha/index.html
@@ -106,7 +106,7 @@
           label="Wallet *"
         >
         </q-select>
-<!--         <q-input
+        <!--         <q-input
           filled
           dense
           v-model.trim="formDialog.data.url"
@@ -148,7 +148,8 @@
               <q-item-label>Remember payments</q-item-label>
               <q-item-label caption
                 >A succesful payment will be registered in the browser's
-                storage, so the user doesn't need to pay again to prove they are human.</q-item-label
+                storage, so the user doesn't need to pay again to prove they are
+                human.</q-item-label
               >
             </q-item-section>
           </q-item>
@@ -173,7 +174,7 @@
     <q-card v-if="qrCodeDialog.data" class="q-pa-lg lnbits__dialog-card">
       {% raw %}
       <q-responsive :ratio="1" class="q-mx-xl q-mb-md">
-   <!--      <qrcode
+        <!--      <qrcode
           :value="qrCodeDialog.data.lnurl"
           :options="{width: 800}"
           class="rounded-borders"
@@ -181,12 +182,15 @@
         <code style="word-break: break-all">
           {{ qrCodeDialog.data.snippet }}
         </code>
-        <p style="margin-top: 20px;">Copy the snippet above and paste into your website/form. The checkbox can be in checked state only after user pays.</p>
+        <p style="margin-top: 20px">
+          Copy the snippet above and paste into your website/form. The checkbox
+          can be in checked state only after user pays.
+        </p>
       </q-responsive>
       <p style="word-break: break-all">
         <strong>ID:</strong> {{ qrCodeDialog.data.id }}<br />
         <strong>Amount:</strong> {{ qrCodeDialog.data.amount }}<br />
-   <!--      <span v-if="qrCodeDialog.data.currency"
+        <!--      <span v-if="qrCodeDialog.data.currency"
           ><strong>{{ qrCodeDialog.data.currency }} price:</strong> {{
           fiatRates[qrCodeDialog.data.currency] ?
           fiatRates[qrCodeDialog.data.currency] + ' sat' : 'Loading...' }}<br
@@ -305,7 +309,7 @@
       createCaptcha: function () {
         var data = {
           // url: this.formDialog.data.url,
-          url: "http://dummy.com",
+          url: 'http://dummy.com',
           memo: this.formDialog.data.memo,
           amount: this.formDialog.data.amount,
           description: this.formDialog.data.description,
@@ -355,7 +359,7 @@
               })
           })
       },
-      buildCaptchaSnippet: function(captchaId){
+      buildCaptchaSnippet: function (captchaId) {
         var locationPath = [
           window.location.protocol,
           '//',
@@ -363,14 +367,19 @@
           window.location.pathname
         ].join('')
 
-        var captchasnippet = '<!-- Captcha Checkbox Start -->\n'
-          + '<input type="checkbox" id="captchacheckbox">\n'
-          + '<label for="captchacheckbox">I\'m not a robot</label><br/>\n'
-          + '<input type="text" id="captchapayhash" style="display: none;"/>\n'
-          + '<script type="text/javascript" src="'+ locationPath +'static/js/captcha.js" id="captchascript" data-captchaid="'+ captchaId +'">\n'
-          + '<\/script>\n'
-          + '<!-- Captcha Checkbox End -->';
-        return captchasnippet;
+        var captchasnippet =
+          '<!-- Captcha Checkbox Start -->\n' +
+          '<input type="checkbox" id="captchacheckbox">\n' +
+          '<label for="captchacheckbox">I\'m not a robot</label><br/>\n' +
+          '<input type="text" id="captchapayhash" style="display: none;"/>\n' +
+          '<script type="text/javascript" src="' +
+          locationPath +
+          'static/js/captcha.js" id="captchascript" data-captchaid="' +
+          captchaId +
+          '">\n' +
+          '<\/script>\n' +
+          '<!-- Captcha Checkbox End -->'
+        return captchasnippet
       },
       openQrCodeDialog(captchaId) {
         // var link = _.findWhere(this.payLinks, {id: linkId})
@@ -380,9 +389,9 @@
         this.qrCodeDialog.data = {
           id: captcha.id,
           amount: captcha.amount,
-            // (link.min === link.max ? link.min : `${link.min} - ${link.max}`) +
-            // ' ' +
-            // (link.currency || 'sat'),
+          // (link.min === link.max ? link.min : `${link.min} - ${link.max}`) +
+          // ' ' +
+          // (link.currency || 'sat'),
           snippet: this.buildCaptchaSnippet(captcha.id)
           // currency: link.currency,
           // comments: link.comment_chars