eskema/static.html

## static.html
<!DOCTYPE html>
<html lang="en-US">
<head>
   <meta charset="UTF-8">
   <title>Nostr Static</title>
   <style>
      article {
         margin-bottom: 1rem;
         border-top: 1px solid #999;
      }
      article::before {
         content: attr(data-date);
         display: block;
      }
   </style>
</head>
<body> <header></header> <main></main>
<script>
const
   main = document.querySelector('main'),
   header = document.querySelector('header'),
   relay = new WebSocket("wss://nostr-relay.wlvs.space"),
   filter = {
      'authors' : ["9ec7a778167afb1d30c4833de9322da0c08ba71a69e1911d5578d3144bb56437"],
      'kinds' : [0,1]
      },
   request = ['REQ', 'static', filter];

relay.addEventListener('open', function(e) { relay.send(JSON.stringify(request)) });
relay.addEventListener('message', function(e)
{
   const message = JSON.parse(e.data);
   if (message[0] === 'EVENT')
   {
      const note = message[2];
      switch (note.kind) {
         case 0:
            // get the page details from kind-0 event
            const info = JSON.parse(note.content);
            // create the containing elements
            const
               title = document.createElement('h1'),
               description = document.createElement('p'),
               image = document.createElement('img');
            // assign the content to the elements
            title.innerHTML = info.name;
            description.innerHTML = info.about;
            image.src = info.picture;
            // put them on the page
            header.append(title, description, image);
            break;
         default:
            // get the posts from kind-1 events
            const article = document.createElement('article');
            article.innerHTML = note.content;
            article.dataset.date = new Date(note.created_at*1000).toUTCString();
            main.prepend(article);
      }
   }
});
</script> </body> </html>
	<!DOCTYPE html>
	<html lang="en-US">
	<head>
	<meta charset="UTF-8">
	<title>Nostr Static</title>
	<style>
	article {
	margin-bottom: 1rem;
	border-top: 1px solid #999;
	}
	article::before {
	content: attr(data-date);
	display: block;
	}
	</style>
	</head>
	<body> <header></header> <main></main>
	<script>
	const
	main = document.querySelector('main'),
	header = document.querySelector('header'),
	relay = new WebSocket("wss://nostr-relay.wlvs.space"),
	filter = {
	'authors' : ["9ec7a778167afb1d30c4833de9322da0c08ba71a69e1911d5578d3144bb56437"],
	'kinds' : [0,1]
	},
	request = ['REQ', 'static', filter];

	relay.addEventListener('open', function(e) { relay.send(JSON.stringify(request)) });
	relay.addEventListener('message', function(e)
	{
	const message = JSON.parse(e.data);
	if (message[0] === 'EVENT')
	{
	const note = message[2];
	switch (note.kind) {
	case 0:
	// get the page details from kind-0 event
	const info = JSON.parse(note.content);
	// create the containing elements
	const
	title = document.createElement('h1'),
	description = document.createElement('p'),
	image = document.createElement('img');
	// assign the content to the elements
	title.innerHTML = info.name;
	description.innerHTML = info.about;
	image.src = info.picture;
	// put them on the page
	header.append(title, description, image);
	break;
	default:
	// get the posts from kind-1 events
	const article = document.createElement('article');
	article.innerHTML = note.content;
	article.dataset.date = new Date(note.created_at*1000).toUTCString();
	main.prepend(article);
	}
	}
	});
	</script> </body> </html>