get nostr events and display

templates/nostrmarket/market.html

@@ -1,5 +1,46 @@
 {% extends "public.html" %} {% block page %}
-<div class="row q-mb-md">
+<q-layout view="hHh lpR fFf">
+  <q-drawer v-model="drawer" side="left" overlay elevated>
+    <q-toolbar class="bg-primary text-white shadow-2">
+      <q-toolbar-title>Settings</q-toolbar-title>
+    </q-toolbar>
+    <div class="q-pa-md">
+      <q-list padding>
+        <q-expansion-item
+          expand-separator
+          icon="perm_identity"
+          label="Merchants"
+          caption="Add/Remove pubkeys"
+        >
+          <q-card>
+            <q-card-section>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem,
+              eius reprehenderit eos corrupti commodi magni quaerat ex numquam,
+              dolorum officiis modi facere maiores architecto suscipit iste
+              eveniet doloribus ullam aliquid.
+            </q-card-section>
+          </q-card>
+        </q-expansion-item>
+        <q-expansion-item
+          expand-separator
+          icon="perm_identity"
+          label="Relays"
+          caption="Add/Remove relays"
+        >
+          <q-card>
+            <q-card-section>
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem,
+              eius reprehenderit eos corrupti commodi magni quaerat ex numquam,
+              dolorum officiis modi facere maiores architecto suscipit iste
+              eveniet doloribus ullam aliquid.
+            </q-card-section>
+          </q-card>
+        </q-expansion-item>
+      </q-list>
+    </div>
+  </q-drawer>
+  <q-page-container>
+    <div class="row q-mb-md">
       <div class="col-12 q-gutter-y-md">
         <q-toolbar class="row">
           <div class="col">
@@ -23,8 +64,8 @@
           </div>
         </q-toolbar>
       </div>
-</div>
+    </div>
-<div class="row q-col-gutter-md">
+    <div class="row q-col-gutter-md">
       <div
         class="col-xs-12 col-sm-6 col-md-4 col-lg-3"
         v-for="item in filterProducts"
@@ -76,7 +117,10 @@
               >
             </div>
             <div v-if="item.categories" class="text-subtitle1">
-          <q-chip v-for="(cat, i) in item.categories.split(',')" :key="i" dense
+              <q-chip
+                v-for="(cat, i) in item.categories.split(',')"
+                :key="i"
+                dense
                 >{{cat}}</q-chip
               >
             </div>
@@ -107,7 +151,12 @@
           {% endraw %}
         </q-card>
       </div>
-</div>
+    </div>
+  </q-page-container>
+  <q-page-sticky position="bottom-left" :offset="[18, 18]">
+    <q-btn fab @click="drawer = !drawer" icon="menu" color="accent"></q-btn>
+  </q-page-sticky>
+</q-layout>
 {% endblock %} {% block scripts %}
 <script src="https://unpkg.com/nostr-tools/lib/nostr.bundle.js"></script>
 <script>
@@ -126,16 +175,24 @@
     'wss://nostr.zebedee.cloud',
     'wss://nostr.rocks'
   ]
-  console.log
+  const eventToObj = event => {
+    event.content = JSON.parse(event.content)
+    return {
+      ...event,
+      ...Object.fromEntries(event.tags)
+    }
+  }
   Vue.component(VueQrcode.name, VueQrcode)
   new Vue({
     el: '#vue',
     mixins: [windowMixin],
     data: function () {
       return {
+        drawer: true,
         pubkeys: new Set(),
-        stalls: null,
+        stalls: [],
         products: [],
+        events: [],
         searchText: null,
         exchangeRates: null
       }
@@ -153,29 +210,38 @@
       }
     },
     async created() {
-      // Hardcode pubkey for test
+      // Hardcode pubkey for testing
       this.pubkeys.add(
         '855ea22a88d7df7ccd8497777db81f115575d5362f51df3af02ead383f5eaba2'
       )
-      await this.initNostr()
+      //await this.initNostr()
     },
     methods: {
       async initNostr() {
         this.pool = new nostr.SimplePool()
         this.relays = new Set(defaultRelays)
-        console.log(Array.from(this.relays))
         await this.pool
           .list(Array.from(this.relays), [
             {
               kinds: [30005],
-              authors: [Array.from(this.pubkeys)]
+              authors: Array.from(this.pubkeys)
             }
           ])
-          .then(event => {
+          .then(events => {
-            console.log(event)
+            this.events = events || []
-          })
+            this.events.map(eventToObj).map(e => {
+              if (e.content.stall) {
+                //it's a product
+                this.products.push(e.content)
+              } else {
+                // it's a stall
+                this.stalls.push(e.content)
               }
-      /*  
+            })
+            console.log(this.stalls)
+            console.log(this.products)
+          })
+      },
       async getRates() {
         let noFiat = this.stalls.map(s => s.currency).every(c => c == 'sat')
         if (noFiat) return
@@ -195,7 +261,6 @@
       getAmountFormated(amount, unit = 'USD') {
         return LNbits.utils.formatCurrency(amount, unit)
       }
-      */
     }
   })
 </script>