noogle: use as browser search engine

ui/noogle/src/App.vue

@@ -2,6 +2,7 @@
 import Home from './components/Home.vue'
 import ThreeColumnLayout from "./layouts/ThreeColumnLayout.vue";
 import Nip07 from "@/components/Nip07.vue";
+
 </script>
 
 <template>

ui/noogle/src/components/AboutPage.vue

@@ -109,7 +109,7 @@
       <img alt="Tailwind CSS chat bubble component" src="https://daisyui.com/images/stock/photo-1534528741775-53994a69daeb.jpg" />
     </div>
   </div>
-  <div className="chat-bubble">When you're logged in you can add from:me to search content from yourself</div>
+  <div className="chat-bubble">When you're logged in (via getalby or nos2x extension) you can add from:me to search content from yourself</div>
 </div>
   <div className="chat chat-start">
   <div className="chat-image avatar">

ui/noogle/src/components/Home.vue

@@ -8,6 +8,8 @@ export default {
   name: "Home",
   components: {Donate, Nip07, ResultsTable, Search}
 }
+
+
 </script>
 
 <template>

ui/noogle/src/components/Nip07.vue

@@ -1,4 +1,5 @@
 <template>
+
   <div>
      <div class="playeauthor-wrapper" v-if="current_user">
         <img class="avatar" @click="sign_out()" :src="this.avatar" alt="" />
@@ -38,15 +39,24 @@ import Nip89 from "@/components/Nip89.vue";
 import miniToastr from "mini-toastr";
 import deadnip89s from "@/components/data/deadnip89s.json";
 let nip89dvms = []
+let logger = false
 export default {
    data() {
     return {
       current_user: "",
       avatar: "",
       signer: "",
+      isdark: JSON.parse(localStorage.getItem('isdark')) || false,
 
     };
   },
+  watch: {
+    isdark: function (newVal) {
+      localStorage.setItem('isdark', JSON.stringify(newVal));
+    },
+  },
+
+
   async mounted() {
      try{
         if (localStorage.getItem('nostr-key-method') === 'nip07')
@@ -66,13 +76,18 @@ export default {
   },
 
   methods: {
+     handleCheckboxChange() {
+      this.isdark = !this.isdark;
+    },
     async sign_in_anon() {
       try {
          await loadWasmAsync();
-         try {
+       if(logger){
-            initLogger(LogLevel.debug());
+            try {
-        } catch (error) {
+                initLogger(LogLevel.debug());
-            console.log(error);
+            } catch (error) {
+                console.log(error);
+            }
         }
 
         let keys = Keys.fromSkStr("ece3c0aa759c3e895ecb3c13ab3813c0f98430c6d4bd22160b9c2219efc9cf0e")
@@ -117,17 +132,21 @@ export default {
 
         await loadWasmAsync();
 
+        if(logger){
             try {
                 initLogger(LogLevel.debug());
             } catch (error) {
                 console.log(error);
             }
+        }
+
 
         let nip07_signer = new Nip07Signer();
             try{
               this.signer = ClientSigner.nip07(nip07_signer);
               console.log("SIGNER: " + this.signer)
 
+
             } catch (error) {
             console.log(error);
              this.signer = ClientSigner.keys(Keys.generate())

ui/noogle/src/components/Nip89view.vue

@@ -1,29 +1,47 @@
 <template>
 
-  <div class="max-w-5xl relative space-y-3">
+    <div class="max-w-5xl relative space-y-3">
-    <div v-if="store.state.nip89dvms.length === 0">
+    <div class="grid grid-cols-1 gap-6">
-      <p>Loading Nip89s.. </p>
+
-       <span className="loading loading-dots loading-lg"  ></span>
+        <div className="card w-70 bg-base-100 shadow-xl flex flex-col"   v-for="dvm in store.state.nip89dvms"
-    </div>
+            :key="dvm.id">
-    <div class="grid grid-cols-2 gap-6">
+
-        <div className="card w-70 bg-base-100 shadow-xl"  v-for="dvm in store.state.nip89dvms"
+
-            :key="dvm.name">
+
-        <figure><img :src="dvm.image" alt="DVM Picture" /></figure>
+
         <div className="card-body">
+
+<div className="playeauthor-wrapper">
+  <figure  className="w-20">
+       <img className="avatar" :src="dvm.image"  alt="DVM Picture" />
+  </figure>
+
+
           <h2 className="card-title">{{ dvm.name }}</h2>
-          <p>  {{ dvm.about }}</p>
+  </div>
-           <p>Kind: {{ dvm.kind }}</p>
+          <h3 class="fa-cut" >{{ dvm.about }}</h3>
-          <div className="card-actions justify-end">
+
+
+
+          <div className="card-actions justify-end mt-auto" >
+
+             <div className="card-actions justify-end">
         <div className="tooltip" :data-tip="dvm.event">
          <button className="btn" @click="copyDoiToClipboard(dvm.event);">Copy Event</button>
         </div>
-          </div>
+
         </div>
-          <br>
+
+           </div>
+
       </div>
-    </div>
+
   </div>
 
+  </div>
+  </div>
+
+
 </template>
 
 <script>
@@ -42,6 +60,9 @@ import deadnip89s from './data/deadnip89s.json'
 
 export default {
   computed: {
+    Keys() {
+      return Keys
+    },
     store() {
       return store
     }

ui/noogle/src/components/Search.vue

@@ -15,22 +15,42 @@ import store from '../store';
 import miniToastr from "mini-toastr";
 import VueNotifications from "vue-notifications";
 import searchdvms from './data/searchdvms.json'
-import {computed} from "vue";
+import {computed, onMounted, ref} from "vue";
 import countries from "@/components/data/countries.json";
 import deadnip89s from "@/components/data/deadnip89s.json";
+import Nip07 from "@/components/Nip07.vue";
 
 let items = []
 let dvms =[]
 let listener = false
 let searching = false
 
+const message = ref("");
+
+onMounted(async () => {
+  let urlParams = new URLSearchParams(window.location.search);
+  if (urlParams.has('search')) {
+    message.value = urlParams.get('search')
+    await sleep(1000)
+    await send_search_request(message.value)
+  }
+})
+
+
+   // console.log(urlParams.has('search')); // true
+   // console.log(urlParams.get('search')); // "MyParam"
 
 
 
-async function send_search_request(message) {
+
+const sleep = (ms) => {
+  return new Promise(resolve => setTimeout(resolve, ms))
+}
+
+async function send_search_request(msg) {
    try {
-     if (message === undefined){
+     if (msg === undefined){
-       message = "Nostr"
+       msg = "Nostr"
      }
 
      if(store.state.pubkey === undefined){
@@ -41,15 +61,16 @@ async function send_search_request(message) {
         dvms =[]
         store.commit('set_search_results', items)
         let client = store.state.client
+
         let tags = []
         let users = [];
 
-        const taggedUsersFrom = message.split(' ')
+        const taggedUsersFrom = msg.split(' ')
           .filter(word => word.startsWith('from:'))
           .map(word => word.replace('from:', ''));
 
         // search
-        let search = message;
+        let search = msg;
 
         // tags
 
@@ -63,14 +84,15 @@ async function send_search_request(message) {
           users.push(pTag.asVec());
         }
 
-        message = search.replace(/from:|to:|@/g, '').trim();
+        msg = search.replace(/from:|to:|@/g, '').trim();
         console.log(search);
 
-        tags.push(Tag.parse(["i", message, "text"]))
+        tags.push(Tag.parse(["i", msg, "text"]))
         tags.push(Tag.parse(["param", "max_results", "150"]))
         tags.push(Tag.parse(['param', 'users', JSON.stringify(users)]))
 
         let evt = new EventBuilder(5302, "NIP 90 Search request", tags)
+
         let res = await client.sendEventBuilder(evt)
         let requestid = res.toHex()
         console.log("STORE: " +store.state.requestidSearch)
@@ -95,9 +117,7 @@ async function send_search_request(message) {
       }
 }
 
-const sleep = (ms) => {
+
-  return new Promise(resolve => setTimeout(resolve, ms))
-}
 async function getEvents(eventids) {
   const event_filter = new Filter().ids(eventids)
   let client = store.state.client
@@ -339,6 +359,15 @@ defineProps({
        <input class="c-Input" autofocus placeholder="Search..." v-model="message"  @keyup.enter="send_search_request(message)" @keydown.enter="nextInput">
        <button class="v-Button"  @click="send_search_request(message)">Search the Nostr</button>
       </h3>
+     <!-- <div class="collapse bg-base-200">
+  <input type="checkbox" />
+  <div class="collapse-title text-xl font-medium">
+    Click me to show/hide content
+  </div>
+  <div class="collapse-content">
+    <p>hello</p>
+  </div>
+</div>-->
     </div>
     <div class="max-w-5xl relative space-y-3">
       <div class="grid grid-cols-1 gap-6">

ui/noogle/src/store.js

@@ -16,12 +16,13 @@ const store = createStore({
       nip89dvms: [],
       activesearchdvms: [],
       results:  [],
-      relays: ["wss://relay.damus.io",
+      relays: [
+          //"wss://relay.damus.io",
         "wss://nos.lol",
         "wss://pablof7z.nostr1.com",
         "wss://relay.nostr.net",
         "wss://relay.nostr.band",
-        "wss://nostr-pub.wellorder.net",
+        //"wss://nostr-pub.wellorder.net",
       ],
     }
   },
@@ -43,11 +44,11 @@ const store = createStore({
     },
     set_nip89dvms(state, nip89dvms) {
       state.nip89dvms.length = 0
-      console.log(nip89dvms)
+      //console.log(nip89dvms)
          let nip89dvmssorted =  nip89dvms.sort(function(a, b) {
           return a.createdAt - b.createdAt;
       });
-      console.log(nip89dvmssorted)
+      //console.log(nip89dvmssorted)
       state.nip89dvms.push.apply(state.nip89dvms, nip89dvmssorted)
     },
     set_current_request_id_search(state, requestid){