more refactoring and tidying up. took out some unused libraries

This commit is contained in:
miggymofongo 2025-01-06 00:07:18 -04:00
parent 2d75697f99
commit 748c70fa04
4 changed files with 40 additions and 24 deletions

View file

@ -27,22 +27,23 @@ export class AppAbout extends LitElement {
<h3>What am I looking at?</h3> <h3>What am I looking at?</h3>
<p> <p>
This is a micro-nostr client that can be installed to your desktop or smartphone This is a personal micro-social media client that can be installed to
home screen. Something like this can be used as an alternative to big tech your desktop or smartphone home screen. You can sign in via an extension
platforms that exploit your data. It pulls my profile data and notes from one to display your profile data and notes from preprogrammed relays. You
of the relays I run. can compose a letter to me using a rich text editor I built with Prosemirror.
</p> </p>
<h3>How do I install this on my home screen?</h3>
<p>Look for "Add to Home Screen" in your browser toolbar and
to save it to your homescreen. </p>
<h3>What is Nostr?</h3> <h3>What is Nostr?</h3>
<p>Nostr stands for Notes and Other Stuff Transmitted Over Relays. It's a simple open source <p>Notes and Other Stuff Transmitted Over Relays is a simple open source
social media protocol that enables anybody to implement some basic social media functionalities social media protocol that enables anybody to implement social media functionalities
into their websites.</p> into their websites.</p>
<h3>How can I install this on my home screen?</h3>
<p>If you are on a PC browser, check for a download buttom inside the URL box
flushed against the right side. Click on it </p>
<hr> <hr>
<h2>Technology Used</h2> <h2>Technology Used</h2>

View file

@ -204,7 +204,6 @@ Profile Picture Container
<p class="personal-msg"><b>${this.bio || 'Welcome, guest! Please sign in to view your profile.'}</b></p> <p class="personal-msg"><b>${this.bio || 'Welcome, guest! Please sign in to view your profile.'}</b></p>
<p class="pics-videos">View My: <a href="#"><b>Pics</b></a> | <a href="#"><b>Videos</b></a></p>
</div> </div>
${'share' in navigator ${'share' in navigator

View file

@ -1,8 +1,6 @@
import { LitElement, css, html } from 'lit'; import { LitElement, css, html } from 'lit';
import { property, customElement } from 'lit/decorators.js'; import { property, customElement } from 'lit/decorators.js';
import { resolveRouterPath } from '../router';
import { Relay } from 'nostr-tools'; import { Relay } from 'nostr-tools';
import axios from 'axios';
import '@shoelace-style/shoelace/dist/components/card/card.js'; import '@shoelace-style/shoelace/dist/components/card/card.js';
import '@shoelace-style/shoelace/dist/components/button/button.js'; import '@shoelace-style/shoelace/dist/components/button/button.js';
@ -10,12 +8,16 @@ import '@shoelace-style/shoelace/dist/components/button/button.js';
import { styles } from '../styles/shared-styles'; import { styles } from '../styles/shared-styles';
@customElement('note-wall') @customElement('note-wall')
export class NoteWall extends LitElement { export class NoteWall extends LitElement {
@property({ type: Array }) notes: { content: string; date: string }[] = []; @property({ type: Array }) notes: { content: string; date: string }[] = [];
@property({ type: String }) relayName: string = '';
note = ''; // store notes
static styles = [ static styles = [
styles, styles,
@ -88,10 +90,12 @@ export class NoteWall extends LitElement {
`]; `];
note = ''; // store notes
getUserLang() { getUserLang() {
return navigator.language || 'en'; return navigator.language || 'en';
} }
async firstUpdated() { async firstUpdated() {
@ -106,7 +110,6 @@ export class NoteWall extends LitElement {
this.fetchNotes(), this.fetchNotes(),
]); ]);
console.log('initial notes:', this.notes);
} }
@ -128,13 +131,19 @@ export class NoteWall extends LitElement {
async fetchNotes() { async fetchNotes() {
// const ifcaRelay = await Relay.connect('wss://hi.myvoiceourstory.org'); // const ifcaRelay = await Relay.connect('wss://hi.myvoiceourstory.org');
const migsRelay = await Relay.connect('wss://notes.miguelalmodo.com'); const migsRelay = await Relay.connect('wss://notes.miguelalmodo.com');
console.log(`connected to ${migsRelay.url}`); console.log(`connected to ${migsRelay.url}`);
// console.log(`connected to ${migsRelay.url}`);
// store the relay name
this.relayName = migsRelay.url;
const sub = migsRelay.subscribe([ const sub = migsRelay.subscribe([
{ {
kinds: [30023], // short and long form notes kinds: [30023], // short and long form notes
limit: 10, limit: 5,
} }
], { ], {
onevent: async (event) => { onevent: async (event) => {
@ -155,6 +164,10 @@ async fetchNotes() {
} }
async displayLongNotes() {
}
@ -163,7 +176,7 @@ async fetchNotes() {
(navigator as any).share({ (navigator as any).share({
title: 'Nostr Micro Client', title: 'Nostr Micro Client',
text: 'Share this with your homie!', text: 'Share this with your homie!',
url: 'https://miguelalmodo.com', url: 'https://miguelalmodo.com/',
}); });
} }
} }
@ -176,7 +189,7 @@ async fetchNotes() {
<section> <section>
<header class="main-section-header"> <header class="main-section-header">
<h2 class="main-section-h2">Recent Notes from IFCA</h2> <h2 class="main-section-h2">Recent Notes from ${this.relayName}</h2>
</header> </header>
@ -188,6 +201,7 @@ async fetchNotes() {
const urlMatch = note.content.match(/https?:\/\/[^\s]+/); const urlMatch = note.content.match(/https?:\/\/[^\s]+/);
const textContent = note.content.replace(urlMatch?.[0] || '', '').trim(); const textContent = note.content.replace(urlMatch?.[0] || '', '').trim();
// Check for yt links and extract video ID // Check for yt links and extract video ID
const youtubeRegex = /(?:https?:\/\/(?:www\.)?youtube\.com\/watch\?v=|https?:\/\/youtu\.be\/)([a-zA-Z0-9_-]{11})/; const youtubeRegex = /(?:https?:\/\/(?:www\.)?youtube\.com\/watch\?v=|https?:\/\/youtu\.be\/)([a-zA-Z0-9_-]{11})/;
const youtubeMatch = urlMatch?.[0].match(youtubeRegex); const youtubeMatch = urlMatch?.[0].match(youtubeRegex);
@ -217,7 +231,6 @@ async fetchNotes() {
`; `;
})} })}
</table> </table>
<div class="comment-wall"

View file

@ -35,6 +35,9 @@ export const router = new Router({
{ {
path: resolveRouterPath('note-wall'), path: resolveRouterPath('note-wall'),
title: 'Note Wall', title: 'Note Wall',
plugins: [
lazy(() => import('./pages/note-wall.js')),
],
render: () => html`<note-wall></note-wall>` render: () => html`<note-wall></note-wall>`
}, },
{ {