feat: extracted

templates/nostrrelay/index.html

@@ -0,0 +1,108 @@
+{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
+%} {% block page %}
+<div class="row q-col-gutter-md">
+  <div class="col-12 col-md-8 col-lg-7 q-gutter-y-md">
+    <q-card>
+      <q-card-section>
+        <q-btn unelevated color="primary" @click="enableRelay"
+          ><div v-if="enabled">Disable relay</div>
+          <div v-else>Enable relay</div></q-btn
+        >
+      </q-card-section>
+    </q-card>
+
+    <q-card>
+      <q-card-section>
+        <h6>WebSocket Chat</h6>
+
+        <input type="text" id="messageText" autocomplete="off" />
+
+        <q-btn unelevated color="primary" @click="sendMessage()"
+          ><div>Send</div>
+        </q-btn>
+
+        <ul id="messages"></ul>
+      </q-card-section>
+    </q-card>
+  </div>
+
+  <div class="col-12 col-md-5 q-gutter-y-md">
+    <q-card>
+      <q-card-section>
+        <h6 class="text-subtitle1 q-my-none">
+          {{SITE_TITLE}} NostrRelay extension
+        </h6>
+      </q-card-section>
+      <q-card-section>
+        <p>
+          Thiago's Point of Sale is a secure, mobile-ready, instant and
+          shareable point of sale terminal (PoS) for merchants. The PoS is
+          linked to your LNbits wallet but completely air-gapped so users can
+          ONLY create invoices. To share the NostrRelay hit the hash on the
+          terminal.
+        </p>
+        <small
+          >Created by
+          <a
+            class="text-secondary"
+            href="https://pypi.org/user/dcs/"
+            target="_blank"
+            >DCs</a
+          >,
+          <a
+            class="text-secondary"
+            href="https://github.com/benarc"
+            target="_blank"
+            >Ben Arc</a
+          >.</small
+        >
+      </q-card-section>
+    </q-card>
+  </div>
+</div>
+{% endblock %} {% block scripts %} {{ window_vars(user) }}
+<script>
+  new Vue({
+    el: '#vue',
+    mixins: [windowMixin],
+    data: function () {
+      return {
+        enabled: false,
+        ws: null
+      }
+    },
+    methods: {
+      enableRelay: function () {
+        // var self = this
+        // LNbits.api
+        //   .request(
+        //     'GET',
+        //     '/nostrrelay/api/v1/nostrrelays?all_wallets=true',
+        //     this.g.user.wallets[0].inkey
+        //   )
+        //   .then(function (response) {
+        //     self.nostrrelays = response.data.map(function (obj) {
+        //       return mapNostrRelay(obj)
+        //     })
+        //   })
+        this.enabled = !this.enabled
+      },
+      sendMessage: function (event) {
+        var input = document.getElementById('messageText')
+        this.ws.send(input.value)
+        input.value = ''
+      }
+    },
+    created: function () {
+      this.ws = new WebSocket('ws://localhost:5000/nostrrelay/client')
+      this.ws.onmessage = function (event) {
+        var messages = document.getElementById('messages')
+        var message = document.createElement('li')
+        var content = document.createTextNode(event.data)
+        message.appendChild(content)
+        messages.appendChild(message)
+      }
+    }
+  })
+</script>
+{% endblock %}

templates/nostrrelay/public.html

@@ -0,0 +1,29 @@
+{% extends "public.html" %} {% block toolbar_title %} {{ nostrrelay.name }}
+<q-btn
+  flat
+  dense
+  size="md"
+  @click.prevent="urlDialog.show = true"
+  icon="share"
+  color="white"
+></q-btn>
+{% endblock %} {% block footer %}{% endblock %} {% block page_container %}
+<q-page-container>
+  <q-page>
+    <h3>Shareable public page on relay to go here!</h3>
+  </q-page>
+</q-page-container>
+{% endblock %} {% block scripts %}
+<script>
+  Vue.component(VueQrcode.name, VueQrcode)
+
+  new Vue({
+    el: '#vue',
+    mixins: [windowMixin],
+    data: function () {
+      return {}
+    },
+    methods: {}
+  })
+</script>
+{% endblock %}