feat: UI fixes, ticket waves, ticket image (#52)

* email input fixes

* promo code ui fix

* ticket waves

* works, but horrible slop

* slightly cleaner

* filter most recent

* make

* pyright

static/js/ticket.js

@@ -3,16 +3,36 @@ window.PageEventsTicket = {
   data() {
     return {
       ticketId: null,
-      ticket: null
+      ticket: null,
+      printMode: false,
+      qrSrc: ''
     }
   },
   methods: {
-    printWindow() {
-      window.print()
+    async printWindow() {
+      this.printMode = true
+      await this.$nextTick()
+      await this.waitForPrintAssets()
+      setTimeout(() => window.print(), 50)
+    },
+    async waitForPrintAssets() {
+      await this.$nextTick()
+      const img = document.querySelector('.ticket-print-qr')
+      if (!img) return
+      if (img.complete && img.naturalWidth > 0) return
+      await new Promise(resolve => {
+        const done = () => resolve()
+        img.addEventListener('load', done, {once: true})
+        img.addEventListener('error', done, {once: true})
+        setTimeout(done, 500)
+      })
     }
   },
   async created() {
     this.ticketId = this.$route.params.id
+    this.qrSrc = `/api/v1/qrcode?data=${encodeURIComponent(
+      `ticket://${this.ticketId}`
+    )}`
     try {
       const {data} = await LNbits.api.request(
         'GET',
@@ -22,5 +42,8 @@ window.PageEventsTicket = {
     } catch (error) {
       LNbits.utils.notifyApiError(error)
     }
+    window.addEventListener('afterprint', () => {
+      this.printMode = false
+    })
   }
 }