Search

web/src/routes/search/+page.svelte

@@ -0,0 +1,85 @@
+<script lang="ts">
+	import { afterNavigate } from '$app/navigation';
+	import { page } from '$app/stores';
+
+	let timeline: Event[] = [];
+
+	const searchRelay = 'wss://relay.nostr.band';
+
+	afterNavigate(async () => {
+		const query = $page.url.searchParams.get('q');
+		if (query !== null) {
+			console.log('[q]', query);
+			timeline = [];
+			await search(searchRelay, query);
+		}
+	});
+
+	async function search(relay: string, query: string) {
+		let eose = false;
+
+		const ws = new WebSocket(relay);
+		ws.onerror = (event) => {
+			console.error(event);
+		};
+		ws.onopen = () => {
+			console.log('Opened');
+			ws.send(
+				JSON.stringify([
+					'REQ',
+					Math.floor(Math.random() * 99999).toString(),
+					{
+						search: query,
+						limit: 500,
+					},
+				])
+			);
+		};
+		ws.onclose = () => {
+			console.log('Closed');
+		};
+		ws.onmessage = event => {
+			console.log('Message');
+			const data = JSON.parse(event.data);
+			console.log(data);
+			switch (data[0]) {
+				case 'EOSE':
+					eose = true;
+					break;
+				case 'EVENT':
+					const e: Event = data[2];
+					if (eose) {
+						timeline.unshift(e);
+					} else {
+						timeline.push(e);
+					}
+					timeline = timeline;
+					break;
+			}
+		};
+	}
+
+	interface Event {
+		id: string;
+		pubkey: string;
+		created_at: number;
+		kind: number;
+		tags: string[][];
+		content: string;
+		sig: string;
+	}
+</script>
+
+<main>
+	<h1>Search</h1>
+	<form action="/search">
+		<input type="text" name="q" />
+		<input type="submit" value="Search" />
+	</form>
+
+	<ul>
+		{#each timeline as note}
+			<li>{note.content} <span style="color: lightgra; font-size: 0.5em;">at {new Date(note.created_at * 1000)}</span></li>
+		{/each}
+	</ul>
+</main>