bobbydigitales/dandelion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lotsa changes :)

Browse Source
This commit is contained in:
bobbydigitales
2024-10-03 12:32:59 -07:00
parent c449267f01
commit 2236ff0e6d
41 changed files with 1402 additions and 541 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
app.webmanifest
View File

@@ -1,35 +0,0 @@
{
"name": "Dandelion",
"short_name": "ddln",
"start_url": "/",
"display": "standalone",
"display_override": ["window-controls-overlay","standalone"],
"id": "b1dbe643-36fc-4419-9448-80f32a1baa1a",
"background_color": "#000000",
"theme_color": "#000000",
"icons": [
{
"src": "icons/dandelion_512x512.png",
"type": "image/png",
"sizes":"512x512"
}
],
"screenshots" : [
{
"src": "images/screenshot1.jpg",
"sizes": "1280x720",
"type": "image/png",
"form_factor": "wide",
"label": "Dandelion desktop"
},
{
"src": "images/screenshot2.jpg",
"sizes": "720x1280",
"type": "image/png",
"form_factor": "narrow",
"label": "Dandelion mobile"
}
]
}

1
db.js.map
View File

File diff suppressed because one or more lines are too long

BIN
main
View File

Binary file not shown.

190
main.go
View File

@@ -11,12 +11,13 @@ import (
"os/signal" "os/signal"
"path/filepath" "path/filepath"
"strconv" "strconv"
"strings"
"sync"
"syscall" "syscall"
"time" "time"
// "strings" // "strings"
"github.com/andybalholm/brotli"
"github.com/gorilla/websocket" "github.com/gorilla/websocket"
) )
@@ -60,30 +61,33 @@ func dispatchMessage(message []byte, peer *Peer) ([]byte, error) {
} }
const ( const (
writeWait = 10 * time.Second writeWait = 120 * time.Second
) )
type Peer struct { type Peer struct {
conn *websocket.Conn conn *websocket.Conn
send chan []byte send chan []byte
lastActive time.Time lastActive time.Time
closeOnce sync.Once
} }
// func removePeer(peerID string, peer *Peer) { func removePeer(peerID string, peer *Peer) {
// delete(peerConnections, peerID) delete(peerConnections, peerID)
// for userID, peers := range userPeers { for userID, peers := range userPeers {
// delete(peers, peerID) delete(peers, peerID)
// if len(peers) == 0 { if len(peers) == 0 {
// delete(userPeers, userID) delete(userPeers, userID)
// } }
// } }
// delete(connectionPeers, peer.conn) delete(connectionPeers, peer.conn)
// // Close the peer's send channel // Close the peer's send channel safely
// close(peer.send) peer.closeOnce.Do(func() {
// } close(peer.send)
})
}
func handleWebSocket(w http.ResponseWriter, r *http.Request) { func handleWebSocket(w http.ResponseWriter, r *http.Request) {
log.Println("Websocket connection!", r.RemoteAddr) log.Println("Websocket connection!", r.RemoteAddr)
@@ -131,7 +135,10 @@ func handleWebSocket(w http.ResponseWriter, r *http.Request) {
} }
// Clean up when the connection is closed // Clean up when the connection is closed
close(peer.send) peer.closeOnce.Do(func() {
close(peer.send)
})
peerID := connectionPeers[peer.conn] peerID := connectionPeers[peer.conn]
if peerID != "" { if peerID != "" {
delete(peerConnections, peerID) delete(peerConnections, peerID)
@@ -186,9 +193,10 @@ var connectionPeers = make(map[*websocket.Conn]string)
func handleHello(message []byte, peer *Peer) ([]byte, error) { func handleHello(message []byte, peer *Peer) ([]byte, error) {
var m struct { var m struct {
Type string `json:"type"` Type string `json:"type"`
UserID string `json:"user_id"` UserID string `json:"user_id"`
PeerID string `json:"peer_id"` PeerID string `json:"peer_id"`
KnownUsers []string `json:"known_users"`
} }
if err := json.Unmarshal(message, &m); err != nil { if err := json.Unmarshal(message, &m); err != nil {
@@ -200,6 +208,16 @@ func handleHello(message []byte, peer *Peer) ([]byte, error) {
userPeers[m.UserID] = make(PeerSet) userPeers[m.UserID] = make(PeerSet)
} }
for _, knownUserID := range m.KnownUsers {
fmt.Printf("Adding user %s for peer %s\n", knownUserID, m.PeerID)
if userPeers[knownUserID] == nil {
userPeers[knownUserID] = make(PeerSet)
}
userPeers[knownUserID][m.PeerID] = struct{}{}
}
userPeers[m.UserID][m.PeerID] = struct{}{} userPeers[m.UserID][m.PeerID] = struct{}{}
peerConnections[m.PeerID] = peer peerConnections[m.PeerID] = peer
connectionPeers[peer.conn] = m.PeerID connectionPeers[peer.conn] = m.PeerID
@@ -266,46 +284,74 @@ func (w *brotliResponseWriter) Write(b []byte) (int, error) {
func noDirListing(h http.Handler, root string) http.HandlerFunc { func noDirListing(h http.Handler, root string) http.HandlerFunc {
return func(w http.ResponseWriter, r *http.Request) { return func(w http.ResponseWriter, r *http.Request) {
// Serve index.html when root is requested // For anything under /static/, we serve it, unless it's a directory
if r.URL.Path == "/" { // Otherwise we serve index.html and the app does the routing nad rendering.
http.ServeFile(w, r, filepath.Join(root, "index.html"))
log.Printf("%s %s %s", r.URL.Path, r.RemoteAddr, r.UserAgent())
if r.URL.Path == "/sw.js" {
http.ServeFile(w, r, filepath.Join(root, "static/sw.js"))
return return
} }
path := filepath.Join(root, r.URL.Path) if r.URL.Path == "/robots.txt" {
info, err := os.Stat(path) http.ServeFile(w, r, filepath.Join(root, "static/robots.txt"))
if err != nil || info.IsDir() {
log.Printf("404 File not found/dir serving: %s to ip %s, useragent %s", r.URL.Path, r.RemoteAddr, r.UserAgent())
http.NotFound(w, r)
return return
} }
log.Printf("Serving: %s to ip %s, useragent %s", r.URL.Path, r.RemoteAddr, r.UserAgent()) if r.URL.Path == "/favicon.ico" {
http.ServeFile(w, r, filepath.Join(root, "static/favicon.ico"))
return
}
if strings.Contains(r.URL.Path, "/static/") {
log.Print("Serving static")
path := filepath.Join(root, r.URL.Path)
info, err := os.Stat(path)
if err != nil || info.IsDir() {
log.Printf("404 File not found/dir")
http.NotFound(w, r)
return
}
log.Printf("Serving")
h.ServeHTTP(w, r)
return
}
// // Serve index.html when root is requested
// if r.URL.Path == "/" {
log.Printf("Serving index %s", r.URL.Path)
http.ServeFile(w, r, filepath.Join(root, "/static/index.html"))
// return
// }
// w.Header().Set("Cache-Control", "no-cache") // w.Header().Set("Cache-Control", "no-cache")
// Check if client supports Brotli encoding // Check if client supports Brotli encoding
// if strings.Contains(r.Header.Get("Accept-Encoding"), "br") { // if strings.Contains(r.Header.Get("Accept-Encoding"), "br") {
if false { // if false {
w.Header().Set("Content-Encoding", "br") // w.Header().Set("Content-Encoding", "br")
w.Header().Del("Content-Length") // Cannot know content length with compressed data // w.Header().Del("Content-Length") // Cannot know content length with compressed data
// Wrap the ResponseWriter with Brotli writer // // Wrap the ResponseWriter with Brotli writer
brWriter := brotli.NewWriter(w) // brWriter := brotli.NewWriter(w)
defer brWriter.Close() // defer brWriter.Close()
// Create a ResponseWriter that writes to brWriter // // Create a ResponseWriter that writes to brWriter
bw := &brotliResponseWriter{ // bw := &brotliResponseWriter{
ResponseWriter: w, // ResponseWriter: w,
Writer: brWriter, // Writer: brWriter,
} // }
// Serve the file using http.ServeFile // // Serve the file using http.ServeFile
http.ServeFile(bw, r, path) // http.ServeFile(bw, r, path)
return // return
} // }
h.ServeHTTP(w, r) // h.ServeHTTP(w, r)
} }
} }
@@ -348,39 +394,39 @@ func main() {
Handler: nil, // Use the default ServeMux Handler: nil, // Use the default ServeMux
} }
// // Start the inactivity monitor goroutine // Start the inactivity monitor goroutine
// go func() { go func() {
// ticker := time.NewTicker(10 * time.Second) ticker := time.NewTicker(10 * time.Second)
// defer ticker.Stop() defer ticker.Stop()
// for { for {
// select { select {
// case <-done: case <-done:
// return return
// case <-ticker.C: case <-ticker.C:
// now := time.Now() now := time.Now()
// // Collect inactive peers // Collect inactive peers
// var inactivePeers []string var inactivePeers []string
// for peerID, peer := range peerConnections { for peerID, peer := range peerConnections {
// if now.Sub(peer.lastActive) > 60*time.Second { if now.Sub(peer.lastActive) > 60*time.Second {
// inactivePeers = append(inactivePeers, peerID) inactivePeers = append(inactivePeers, peerID)
// } }
// } }
// // Remove inactive peers // Remove inactive peers
// for _, peerID := range inactivePeers { for _, peerID := range inactivePeers {
// peer := peerConnections[peerID] peer := peerConnections[peerID]
// if peer != nil { if peer != nil {
// log.Printf("Peer %s inactive for more than 60 seconds. Closing connection.", peerID) log.Printf("Peer %s inactive for more than 60 seconds. Closing connection.", peerID)
// peer.conn.Close() peer.conn.Close()
// removePeer(peerID, peer) removePeer(peerID, peer)
// } }
// } }
// } }
// } }
// }() }()
// Run a goroutine to handle graceful shutdown // Run a goroutine to handle graceful shutdown
go func() { go func() {

1
main.js.map
View File

File diff suppressed because one or more lines are too long

110
src/db.ts
View File

@@ -10,6 +10,7 @@
const postStoreName: string = "posts"; const postStoreName: string = "posts";
let keyBase = "dandelion_posts_v1_" let keyBase = "dandelion_posts_v1_"
let key = ""; let key = "";
let version = 1;
interface IDBRequestEvent<T = any> extends Event { interface IDBRequestEvent<T = any> extends Event {
@@ -21,26 +22,29 @@ type DBError = Event & {
target: { errorCode: DOMException }; target: { errorCode: DOMException };
}; };
function upgrade_0to1(db:IDBDatabase) {
let store = db.createObjectStore(postStoreName, { keyPath: "id", autoIncrement: true });
store.createIndex("datetimeIndex", "post_timestamp", { unique: false });
store.createIndex("postIDIndex", "data.post_id", { unique: true });
}
export function openDatabase(userID: string): Promise<IDBDatabase> { export function openDatabase(userID: string): Promise<IDBDatabase> {
const dbName = `user_${userID}` const dbName = `user_${userID}`
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const request: IDBOpenDBRequest = indexedDB.open(dbName, 1); const request: IDBOpenDBRequest = indexedDB.open(dbName, version);
request.onerror = (event: Event) => { request.onerror = (event: Event) => {
// Use a type assertion to access the specific properties of IDBRequest error event
const errorEvent = event as IDBRequestEvent; const errorEvent = event as IDBRequestEvent;
reject(`Database error: ${errorEvent.target.error?.message}`); reject(`Database error: ${errorEvent.target.error?.message}`);
}; };
request.onupgradeneeded = (event: IDBVersionChangeEvent) => { request.onupgradeneeded = (event: IDBVersionChangeEvent) => {
const db: IDBDatabase = (event.target as IDBOpenDBRequest).result; const db: IDBDatabase = (event.target as IDBOpenDBRequest).result;
if (!db.objectStoreNames.contains(postStoreName)) {
let store = db.createObjectStore(postStoreName, { keyPath: "id", autoIncrement: true });
store.createIndex("datetimeIndex", "post_timestamp", { unique: false });
store.createIndex("postIDIndex", "data.post_id", { unique: true });
} upgrade_0to1(db);
}; };
request.onsuccess = (event: Event) => { request.onsuccess = (event: Event) => {
@@ -50,14 +54,17 @@ export function openDatabase(userID: string): Promise<IDBDatabase> {
}); });
} }
async function getDBTransactionStore(userID:string) {
const db = await openDatabase(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
return {db, transaction, store}
}
export async function addData(userID: string, data: any): Promise<void> { export async function addData(userID: string, data: any): Promise<void> {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const addRequest = store.add({ post_timestamp: data.post_timestamp, data: data }); const addRequest = store.add({ post_timestamp: data.post_timestamp, data: data });
addRequest.onsuccess = (e: Event) => { addRequest.onsuccess = (e: Event) => {
@@ -76,12 +83,9 @@ export async function addData(userID: string, data: any): Promise<void> {
export async function deleteData(userID: string, postID: string) { export async function deleteData(userID: string, postID: string) {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
const getRequest = index.getKey(postID); const getRequest = index.getKey(postID);
getRequest.onerror = e => console.log((e.target as IDBRequest).error) getRequest.onerror = e => console.log((e.target as IDBRequest).error)
@@ -104,9 +108,7 @@ export async function deleteData(userID: string, postID: string) {
export async function clearData(userID: string) { export async function clearData(userID: string) {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const clearRequest = store.clear(); const clearRequest = store.clear();
clearRequest.onsuccess = (e: Event) => { clearRequest.onsuccess = (e: Event) => {
@@ -126,9 +128,7 @@ export async function clearData(userID: string) {
export async function addDataArray(userID: string, array: any[]): Promise<void> { export async function addDataArray(userID: string, array: any[]): Promise<void> {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
let count = 0; let count = 0;
@@ -161,13 +161,12 @@ export async function addDataArray(userID: string, array: any[]): Promise<void>
export async function checkPostIds(userID: string, post_ids: string[]) { export async function checkPostIds(userID: string, post_ids: string[]) {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
transaction.oncomplete = () => { transaction.oncomplete = () => {
console.log("Transaction completed successfully"); // console.log("Transaction completed successfully");
db.close(); db.close();
}; };
@@ -214,13 +213,12 @@ export async function checkPostIds(userID: string, post_ids: string[]) {
export async function mergeDataArray(userID: string, array: any[]): Promise<void> { export async function mergeDataArray(userID: string, array: any[]): Promise<void> {
try { try {
const db = await openDatabase(userID); const {db, transaction, store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
transaction.oncomplete = () => { transaction.oncomplete = () => {
console.log("Transaction completed successfully"); // console.log("Transaction completed successfully");
db.close(); db.close();
}; };
@@ -266,46 +264,35 @@ export async function mergeDataArray(userID: string, array: any[]): Promise<void
} }
} }
export async function getPostForUser(userID: string, postID: string): Promise<any | undefined> {
}
export async function getData(userID: string, lowerID: Date, upperID: Date): Promise<any | undefined> { export async function getData(userID: string, lowerID: Date, upperID: Date): Promise<any | undefined> {
const db = await openDatabase(userID); const { store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly"); const keyRangeValue = IDBKeyRange.bound(lowerID, upperID);
const store = transaction.objectStore(postStoreName); const index = store.index("datetimeIndex");
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const keyRangeValue = IDBKeyRange.bound(lowerID, upperID); const getAllRequest = index.getAll(keyRangeValue);
const records: any[] = []; getAllRequest.onsuccess = () => {
const records = getAllRequest.result.map((item: any) => item.data);
const index = store.index("datetimeIndex"); resolve(records);
const cursorRequest = index.openCursor(keyRangeValue);
cursorRequest.onsuccess = (event: Event) => {
const cursor = (event.target as IDBRequest).result as IDBCursorWithValue;
if (cursor) {
records.push(cursor.value.data); // Collect the record
cursor.continue(); // Move to the next item in the range
} else {
// No more entries in the range
resolve(records);
}
}; };
cursorRequest.onerror = (event: Event) => { getAllRequest.onerror = () => {
// Use a type assertion to access the specific properties of IDBRequest error event console.error('Transaction failed:', getAllRequest.error?.message);
const errorEvent = event as IDBRequestEvent; reject(getAllRequest.error);
console.error('Transaction failed:', errorEvent.target.error?.message);
reject(errorEvent.target.error); // Reject the promise if there's an error
}; };
}); });
} }
export async function getAllData(userID: string): Promise<any | undefined> { export async function getAllData(userID: string): Promise<any | undefined> {
const db = await openDatabase(userID); const {store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const getRequest = store.getAll(); const getRequest = store.getAll();
@@ -331,9 +318,8 @@ export async function getAllData(userID: string): Promise<any | undefined> {
} }
export async function getAllIds(userID: string): Promise<any | undefined> { export async function getAllIds(userID: string): Promise<any | undefined> {
const db = await openDatabase(userID); const {store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
let keys: string[] = []; let keys: string[] = [];
@@ -357,9 +343,7 @@ export async function getAllIds(userID: string): Promise<any | undefined> {
} }
export async function getPostsByIds(userID:string, postIDs:string[]) { export async function getPostsByIds(userID:string, postIDs:string[]) {
const db = await openDatabase(userID); const {store} = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
let posts = []; let posts = [];

539
src/main.ts
View File

@@ -2,7 +2,7 @@
import { getData, addData, addDataArray, clearData, deleteData, mergeDataArray, getAllData, checkPostIds, getAllIds, getPostsByIds} from "./db.js" import { getData, addData, addDataArray, clearData, deleteData, mergeDataArray, getAllData, checkPostIds, getAllIds, getPostsByIds } from "./db.js"
declare let WebTorrent: any; declare let WebTorrent: any;
@@ -31,6 +31,56 @@ function uuidv4() {
); );
} }
function uuidToBytes(uuid: string): Uint8Array {
return new Uint8Array(uuid.match(/[a-fA-F0-9]{2}/g)!.map((hex) => parseInt(hex, 16)));
}
// Base58 character set
const BASE58_ALPHABET = '123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz';
// Base58 encoding
// Base58 encoding
function encodeBase58(buffer: Uint8Array): string {
let carry;
const digits = [0];
for (const byte of buffer) {
carry = byte;
for (let i = 0; i < digits.length; i++) {
carry += digits[i] << 8;
digits[i] = carry % 58;
carry = Math.floor(carry / 58);
}
while (carry > 0) {
digits.push(carry % 58);
carry = Math.floor(carry / 58);
}
}
let result = '';
for (const digit of digits.reverse()) {
result += BASE58_ALPHABET[digit];
}
// Handle leading zero bytes
for (const byte of buffer) {
if (byte === 0x00) {
result = BASE58_ALPHABET[0] + result;
} else {
break;
}
}
return result;
}
// Convert UUID v4 to Base58
function uuidToBase58(uuid: string): string {
const bytes = uuidToBytes(uuid);
return encodeBase58(bytes);
}
let logLines: string[] = []; let logLines: string[] = [];
let logLength = 10; let logLength = 10;
@@ -101,7 +151,7 @@ window.addEventListener('scroll', () => {
console.log('Scrolled to the bottom!'); console.log('Scrolled to the bottom!');
console.log(scrollPoint, totalPageHeight); console.log(scrollPoint, totalPageHeight);
} }
}); });
@@ -123,23 +173,36 @@ window.addEventListener('scroll', () => {
// } // }
// } // }
function arrayBufferToBase64( buffer:ArrayBuffer ) { async function bytesToBase64DataUrl(bytes: Uint8Array, type = "application/octet-stream") {
var binary = ''; return await new Promise((resolve, reject) => {
var bytes = new Uint8Array( buffer ); const reader = Object.assign(new FileReader(), {
var len = bytes.byteLength; onload: () => resolve(reader.result),
for (var i = 0; i < len; i++) { onerror: () => reject(reader.error),
binary += String.fromCharCode( bytes[ i ] ); });
} reader.readAsDataURL(new File([bytes], "", { type }));
return window.btoa( binary ); });
} }
function base64ToArrayBuffer(base64:string) { async function arrayBufferToBase64(buffer: ArrayBuffer) {
var binaryString = atob(base64); var bytes = new Uint8Array(buffer);
var bytes = new Uint8Array(binaryString.length); return (await bytesToBase64DataUrl(bytes) as string).replace("data:application/octet-stream;base64,", "");
for (var i = 0; i < binaryString.length; i++) { }
bytes[i] = binaryString.charCodeAt(i);
} // function base64ToArrayBuffer(base64: string) {
return bytes.buffer; // var binaryString = atob(base64);
// var bytes = new Uint8Array(binaryString.length);
// for (var i = 0; i < binaryString.length; i++) {
// bytes[i] = binaryString.charCodeAt(i);
// }
// return bytes.buffer;
// }
async function base64ToArrayBuffer(base64String: string) {
let response = await fetch("data:application/octet-stream;base64," + base64String);
let arrayBuffer = await response.arrayBuffer();
return arrayBuffer;
// let buffer = new Uint8Array(arrayBuffer);
// return buffer;
} }
class wsConnection { class wsConnection {
@@ -154,7 +217,7 @@ class wsConnection {
messageHandlers: Map<string, (event: any) => void> = new Map(); messageHandlers: Map<string, (event: any) => void> = new Map();
peerMessageHandlers: Map<string, (data: any) => void> = new Map(); peerMessageHandlers: Map<string, (data: any) => void> = new Map();
send(message: any) { send(message: any) {
let json = "" let json = ""
try { try {
@@ -162,13 +225,26 @@ class wsConnection {
} catch (e) { } catch (e) {
console.log(e, "wsConnection send: Couldn't serialize message", message); console.log(e, "wsConnection send: Couldn't serialize message", message);
} }
log(`ws->${json.slice(0,240)}`) // log(`ws->${json.slice(0, 240)}`)
this.websocket!.send(json); this.websocket!.send(json);
} }
helloResponseHandler(data: any) { helloResponseHandler(data: any) {
for (let [userID, peerIDs] of Object.entries(data.userPeers)) {
let users = [];
try {
let currentUserPeers = data.userPeers[app.router.userID];
users.push([app.router.userID, data.userPeers[app.router.userID]]);
delete data.userPeers[app.router.userID];
} catch (e) {
console.log('helloResponseHandler', e);
}
users = [...users, ...Object.entries(data.userPeers)];
log(`Network: got ${users.length} users from bootstrap peer. ${users.join(',')}`)
for (let [userID, peerIDs] of users) {
this.peers.set(userID, [...Object.keys(peerIDs as any)]); this.peers.set(userID, [...Object.keys(peerIDs as any)]);
for (let peerID of [...Object.keys(peerIDs as any)]) { for (let peerID of [...Object.keys(peerIDs as any)]) {
@@ -176,11 +252,12 @@ class wsConnection {
continue; continue;
} }
log(`Network: Requesting post IDs for user ${userID} from peer ${peerID}`);
this.send({ this.send({
type:"peer_message", type: "peer_message",
from:this.peerID, from: this.peerID,
to:peerID, to: peerID,
message:{type:"get_post_ids_for_user", user_id:userID} message: { type: "get_post_ids_for_user", user_id: userID }
}) })
} }
} }
@@ -193,8 +270,8 @@ class wsConnection {
// log(`getPostsForUserResponse: ${data}`) // log(`getPostsForUserResponse: ${data}`)
let message = data.message; let message = data.message;
console.log(`getPostIdsForUserResponseHandler Got ${message.post_ids.length} from peer ${data.from}`); log(`Network: got ${message.post_ids.length} post IDs for user ${data.message.user_id} from peer ${data.from}`);
console.log(`Checking post IDs...`); console.log(`Checking post IDs...`);
let postIds = await checkPostIds(message.user_id, data.message.post_ids); let postIds = await checkPostIds(message.user_id, data.message.post_ids);
@@ -203,18 +280,36 @@ class wsConnection {
return; return;
} }
log(`Network: requesting ${postIds.length} posts for user ${message.user_id} from peer ${data.from}`)
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user", post_ids: postIds, user_id: message.user_id } } let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user", post_ids: postIds, user_id: message.user_id } }
this.send(responseMessage); this.send(responseMessage);
} }
// static async compressArrayBuffer(data: ArrayBuffer): Promise<ArrayBuffer> {
// const compressionStream = new CompressionStream('gzip'); // You can also use 'deflate', 'deflate-raw', etc.
// const compressedStream = new Response(
// new Blob([data]).stream().pipeThrough(compressionStream)
// );
// const compressedArrayBuffer = await compressedStream.arrayBuffer();
// return compressedArrayBuffer;
// }
async getPostIdsForUserHandler(data: any) { async getPostIdsForUserHandler(data: any) {
let message = data.message; let message = data.message;
let postIds = await getAllIds(message.user_id) ?? []; let postIds = await getAllIds(message.user_id) ?? [];
if (postIds.length === 0) {
log(`Network: I know about user ${message.user_id} but I have 0 posts, so I'm not sending any to to peer ${data.from}`);
return;
}
log(`Network: Sending ${postIds.length} post Ids for user ${message.user_id} to peer ${data.from}`)
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_post_ids_for_user_response", post_ids: postIds, user_id: message.user_id } } let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_post_ids_for_user_response", post_ids: postIds, user_id: message.user_id } }
this.send(responseMessage) this.send(responseMessage);
} }
// Send posts to peer // Send posts to peer
@@ -222,43 +317,65 @@ class wsConnection {
let message = data.message; let message = data.message;
let posts = await getPostsByIds(message.user_id, message.post_ids) ?? []; let posts = await getPostsByIds(message.user_id, message.post_ids) ?? [];
log(`Network: Sending ${posts.length} posts for user ${message.user_id} to peer ${data.from}`);
app.timerStart();
let output = []; let output = [];
for (let post of posts) { for (let post of posts) {
let newPost = (post as any).data; if (newPost.image_data) { let newPost = (post as any).data;
newPost.image_data = arrayBufferToBase64(newPost.image_data)
if (newPost.image_data) {
// let compressedData = await wsConnection.compressArrayBuffer(newPost.image_data);
// console.log((newPost.image_data.byteLength - compressedData.byteLength) / 1024 / 1024);
newPost.image_data = await arrayBufferToBase64(newPost.image_data)
} }
// let megs = JSON.stringify(newPost).length/1024/1024;
// console.log(`getPostsForUserHandler id:${newPost.post_id} post length:${megs}`);
output.push(newPost); output.push(newPost);
} }
// posts = posts.map((post:any)=>{let newPost = post.data; if (newPost.image_data){newPost.image_data = arraybufferto};return newPost}); // posts = posts.map((post:any)=>{let newPost = post.data; if (newPost.image_data){newPost.image_data = arraybufferto};return newPost});
// posts = posts.map((post:any)=>{}) // posts = posts.map((post:any)=>{})
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user_response", posts: output, user_id: message.user_id } } let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user_response", posts: output, user_id: message.user_id } }
this.send(responseMessage) this.send(responseMessage)
let sendTime = app.timerDelta();
log(`send took: ${sendTime.toFixed(2)}ms`);
} }
// Got posts from peer // Got posts from peer
async getPostsForUserReponseHandler(data: any) { async getPostsForUserReponseHandler(data: any) {
app.timerStart();
let message = data.message; let message = data.message;
console.log(`Network: got ${message.posts.length} posts for user ${message.user_id} from peer ${data.from}`);
console.log(`getPostsForUserResponseHandler Got ${message.posts.length} from peer ${data.from}`); console.log(`getPostsForUserResponseHandler Got ${message.posts.length} from peer ${data.from}`);
for (let post of message.posts) { for (let post of message.posts) {
if (message.user_id === app.userID) {
post.author_id = app.userID;
}
post.post_timestamp = new Date(post.post_timestamp); post.post_timestamp = new Date(post.post_timestamp);
if (post.image_data) { if (post.image_data) {
post.image_data = base64ToArrayBuffer(post.image_data); post.image_data = await base64ToArrayBuffer(post.image_data);
} }
} }
console.log(`Merging same user peer posts...`) console.log(`Merging same user peer posts...`)
await mergeDataArray(message.user_id, data.message.posts) await mergeDataArray(message.user_id, data.message.posts);
let receiveTime = app.timerDelta();
log(`Receive took: ${receiveTime.toFixed(2)}ms`);
if (message.user_id === this.userID) { if (message.user_id === app.router.userID) {
app.posts = await app.loadPosts(this.userID) ?? []; app.render();
app.render(app.posts);
} }
} }
async peerMessageHandler(data: any) { async peerMessageHandler(data: any) {
log(`peerMessageHandler ${data}`) // log(`peerMessageHandler ${JSON.stringify(data)}`)
let peerMessageType = data.message.type; let peerMessageType = data.message.type;
@@ -287,14 +404,16 @@ class wsConnection {
return; return;
} }
this.websocket.onopen = (event) => { this.websocket.onopen = async (event) => {
log("ws:connected"); log("ws:connected");
this.send({type:"hello", user_id: this.userID, peer_id:this.peerID}); let knownUsers = [...(await indexedDB.databases())].map((db) => db.name?.replace('user_', ''));
console.log('Network: Sending known users', knownUsers);
this.send({ type: "hello", user_id: this.userID, peer_id: this.peerID, known_users: knownUsers });
this.websocketPingInterval = window.setInterval(() => { this.websocketPingInterval = window.setInterval(() => {
if (!navigator.onLine) { if (!navigator.onLine) {
return; return;
} }
this.send({type:"ping", peer_id: this.peerID}); this.send({ type: "ping", peer_id: this.peerID });
}, 10_000) }, 10_000)
}; };
@@ -306,7 +425,7 @@ class wsConnection {
}; };
this.websocket.onmessage = (event) => { this.websocket.onmessage = (event) => {
log('ws:<-' + event.data.slice(0,240)); // log('ws:<-' + event.data.slice(0, 240));
let data = JSON.parse(event.data); let data = JSON.parse(event.data);
@@ -361,6 +480,8 @@ class App {
userID: string = ''; userID: string = '';
peerID: string = ''; peerID: string = '';
posts: Post[] = []; posts: Post[] = [];
isHeadless: boolean = false;
showLog: boolean = false;
initMarkdown() { initMarkdown() {
const renderer = new marked.Renderer(); const renderer = new marked.Renderer();
@@ -511,19 +632,19 @@ class App {
}); });
} }
addPost(userID: string, postText: string, imageData?: ArrayBuffer) { addPost(userID: string, postText: string, mediaData?: ArrayBuffer, mediaType?: "image/png" | "image/gif" | "image/jpg" | "video/mp4") {
if ((typeof postText !== "string") || postText.length === 0) { if ((typeof postText !== "string") || postText.length === 0) {
log("Not posting an empty string...") log("Not posting an empty string...")
return; return;
} }
let post = new Post(this.username, userID, postText, new Date(), imageData); let post = new Post(this.username, userID, postText, new Date(), mediaData);
this.posts.push(post); this.posts.push(post);
// localStorage.setItem(key, JSON.stringify(posts)); // localStorage.setItem(key, JSON.stringify(posts));
addData(userID, post) addData(userID, post)
this.render(this.posts); this.render();
} }
@@ -551,11 +672,30 @@ class App {
return id; return id;
} }
animals = ['shrew', 'jerboa', 'lemur', 'weasel', 'possum', 'possum', 'marmoset', 'planigale', 'mole', 'narwhal'];
adjectives = ['snazzy', 'whimsical', 'jazzy', 'bonkers', 'wobbly', 'spiffy', 'chirpy', 'zesty', 'bubbly', 'perky', 'sassy'];
hashUserIdToIndices() {
let indices = [];
for (let char of this.userID) {
if (char !== '0' && char !== '-') {
indices.push(parseInt(char, 16));
if (indices.length == 2) {
break;
}
}
}
return [indices[0], indices[1]];
}
getUsername() { getUsername() {
let username = localStorage.getItem("dandelion_username"); let username = localStorage.getItem("dandelion_username");
if (!username) { if (!username || username === "not_set") {
username = "not_set" let [one, two] = this.hashUserIdToIndices();
let adjective = this.adjectives[one % this.adjectives.length]
let animal = this.animals[two % this.animals.length]
username = `${adjective}_${animal}`
localStorage.setItem("dandelion_username", username); localStorage.setItem("dandelion_username", username);
} }
@@ -592,8 +732,7 @@ class App {
window.addEventListener('online', async () => { window.addEventListener('online', async () => {
log("online") log("online")
connection.connect(); connection.connect();
this.posts = await this.loadPosts(this.userID) ?? []; this.render();
this.render(this.posts);
}); });
log(`Online status: ${navigator.onLine ? "online" : "offline"}`) log(`Online status: ${navigator.onLine ? "online" : "offline"}`)
@@ -650,14 +789,32 @@ class App {
let clearPostsButton = document.getElementById("clear_posts") as HTMLButtonElement; let clearPostsButton = document.getElementById("clear_posts") as HTMLButtonElement;
let updateApp = document.getElementById("update_app") as HTMLButtonElement; let updateApp = document.getElementById("update_app") as HTMLButtonElement;
let ddlnLogoButton = document.getElementById('ddln_logo_button') as HTMLDivElement; let ddlnLogoButton = document.getElementById('ddln_logo_button') as HTMLDivElement;
// let addP = document.getElementById('button_add_pic') as HTMLDivElement; // let addPic = document.getElementById('button_add_pic') as HTMLDivElement;
let filePickerLabel = document.getElementById('file_input_label');
let filePicker = document.getElementById('file_input') as HTMLInputElement;
let toggleDark = document.getElementById('toggle_dark') as HTMLButtonElement;
toggleDark.addEventListener('click', () => {
document.documentElement.style.setProperty('--main-bg-color', 'white');
document.documentElement.style.setProperty('--main-fg-color', 'black');
})
filePicker?.addEventListener('change', async (event: any) => {
for (let file of filePicker.files as any) {
let buffer = await file.arrayBuffer();
let type =
this.addPost(this.userID, 'image...', buffer);
}
});
filePickerLabel?.addEventListener('click', () => {
console.log("Add pic...")
})
let usernameField = document.getElementById('username'); let usernameField = document.getElementById('username');
usernameField?.addEventListener('input', (event:any)=>{ usernameField?.addEventListener('input', (event: any) => {
this.username = event.target.innerText; this.username = event.target.innerText;
localStorage.setItem("dandelion_username", this.username); localStorage.setItem("dandelion_username", this.username);
}) })
@@ -678,12 +835,11 @@ class App {
clearData(userID); clearData(userID);
// posts = posts.reverse(); // posts = posts.reverse();
addDataArray(userID, imported_posts); addDataArray(userID, imported_posts);
posts = await this.loadPosts(userID) ?? []; this.render();
this.render(posts);
}); });
clearPostsButton.addEventListener('click', () => { clearData(userID); posts = []; this.render(posts) }); clearPostsButton.addEventListener('click', () => { clearData(userID); posts = []; this.render() });
let postButton = document.getElementById("button_post") as HTMLButtonElement; let postButton = document.getElementById("button_post") as HTMLButtonElement;
@@ -693,12 +849,12 @@ class App {
throw new Error(); throw new Error();
} }
postText.addEventListener('paste', async (e)=>{ postText.addEventListener('paste', async (e) => {
const dataTransfer = e.clipboardData const dataTransfer = e.clipboardData
const file = dataTransfer!.files[ 0 ]; const file = dataTransfer!.files[0];
let buffer = await file.arrayBuffer(); let buffer = await file.arrayBuffer();
let type = let type =
this.addPost(this.userID, 'image...', buffer); this.addPost(this.userID, 'image...', buffer);
}); });
postButton.addEventListener("click", () => { postButton.addEventListener("click", () => {
@@ -719,10 +875,16 @@ class App {
ddlnLogoButton.addEventListener('click', () => { infoElement.style.display == 'none' ? infoElement.style.display = 'block' : infoElement.style.display = 'none'; }); ddlnLogoButton.addEventListener('click', () => { infoElement.style.display == 'none' ? infoElement.style.display = 'block' : infoElement.style.display = 'none'; });
} }
async loadPosts(userID: string) { async loadPosts(userID: string, postID?: string) {
this.timerStart(); this.timerStart();
let posts: any = await getData(userID, new Date(2022, 8), new Date()); let posts: Post[] = [];
// if (postID) {
// posts = await gePostForUser(userID, postID);
// }
posts = await getData(userID, new Date(2022, 8), new Date());
if (posts.length > 0) { if (posts.length > 0) {
log(`Loaded ${posts.length} posts in ${this.timerDelta().toFixed(2)}ms`); log(`Loaded ${posts.length} posts in ${this.timerDelta().toFixed(2)}ms`);
@@ -736,27 +898,47 @@ class App {
// return await getData(userID, new Date(2022, 8), new Date()); // return await getData(userID, new Date(2022, 8), new Date());
} }
async main() { async purgeEmptyUsers() {
let urlParams = (new URL(window.location.href)).searchParams; let knownUsers = [...(await indexedDB.databases())].map((db) => db.name?.replace('user_', ''));
let connection_userID = urlParams.get('connect'); if (!knownUsers) {
return;
let registration = undefined;
// if (urlParams.get("sw") === "true") {
registration = await this.registerServiceWorker();
// }
if (connection_userID) {
console.log('connect', connection_userID);
localStorage.setItem("dandelion_id", connection_userID);
} }
this.username = this.getUsername(); for (let userID of knownUsers as string[]) {
document.getElementById('username')!.innerText = this.username; let ids = await getAllIds(userID);
if (ids.length === 0) {
console.log(`Purging user ${userID}`);
indexedDB.deleteDatabase(`user_${userID}`);
}
console.log(`https://ddln.app/user/${userID}`);
}
}
async main() {
this.isHeadless = /\bHeadlessChrome\//.test(navigator.userAgent)
let userID = this.getUserID(); let userID = this.getUserID();
let peerID = this.getPeerID(); let peerID = this.getPeerID();
this.userID = userID; this.userID = userID;
this.peerID = peerID; this.peerID = peerID;
this.initButtons(userID, this.posts, registration); this.getRoute();
if (this.router.route === App.Route.CONNECT) {
console.log('connect', this.router.userID);
localStorage.setItem("dandelion_id", this.router.userID);
}
let urlParams = (new URL(window.location.href)).searchParams;
let connection_userID = urlParams.get('connect');
let registration = undefined;
if (urlParams.has('log')) {
document.getElementById('info')!.style.display = "block";
this.showLog = true;
}
let time = 0; let time = 0;
let delta = 0; let delta = 0;
@@ -776,20 +958,25 @@ class App {
// console.log(code); // console.log(code);
// registration.active.postMessage({type:"updateMain", code:code}); // registration.active.postMessage({type:"updateMain", code:code});
this.posts = await this.loadPosts(userID) ?? []; // this.posts = await this.loadPosts(userID) ?? [];
// debugger; // debugger;
this.timerStart(); await this.render(); // , (postID:string)=>{this.deletePost(userID, postID)}
this.render(this.posts); // , (postID:string)=>{this.deletePost(userID, postID)}
let renderTime = this.timerDelta();
log(`render took: ${renderTime.toFixed(2)}ms`);
if ((performance as any)?.memory) { if ((performance as any)?.memory) {
log(`memory used: ${((performance as any).memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`) log(`memory used: ${((performance as any).memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`)
} }
let connectURL = `https://${document.location.hostname}?connect=${this.userID}`; // if (urlParams.get("sw") === "true") {
registration = await this.registerServiceWorker();
// }
this.username = this.getUsername();
document.getElementById('username')!.innerText = this.username;
this.initButtons(userID, this.posts, registration);
let connectURL = `https://${document.location.hostname}/connect/${this.userID}`;
document.getElementById('connectURL')!.innerHTML = `<a href="${connectURL}">connect</a>`; document.getElementById('connectURL')!.innerHTML = `<a href="${connectURL}">connect</a>`;
let qrcode = await new QRCode(document.getElementById('qrcode'), { let qrcode = await new QRCode(document.getElementById('qrcode'), {
@@ -801,11 +988,14 @@ class App {
correctLevel: QRCode.CorrectLevel.H correctLevel: QRCode.CorrectLevel.H
}); });
let qrcodeImage:HTMLImageElement = document.querySelector('#qrcode > img') as HTMLImageElement;
qrcodeImage.classList.add('qrcode_image');
log(`user:${userID} peer:${peerID}`); (document.querySelector('#qrcode > img') as HTMLImageElement).classList.add('qrcode_image');
(document.querySelector('#qrcode > canvas') as HTMLImageElement).classList.add('qrcode_image');
log(`username:${this.username} user:${userID} peer:${peerID}`);
await this.purgeEmptyUsers();
let websocket = new wsConnection(userID, peerID); let websocket = new wsConnection(userID, peerID);
window.addEventListener('beforeunload', () => { websocket.disconnect() }) window.addEventListener('beforeunload', () => { websocket.disconnect() })
this.initOffline(websocket); this.initOffline(websocket);
@@ -828,7 +1018,52 @@ class App {
// }) // })
} }
render(posts: Post[]) {
// keep a map of posts to dom nodes.
// on re-render
// posts that are not in our list that we need at add
// posts that are in our list that we need to remove
// postsSet = new Set();
async render() {
if (this.isHeadless) {
console.log('Headless so skipping render...');
return;
}
this.timerStart();
let posts = [];
switch (this.router.route) {
case App.Route.HOME:
case App.Route.CONNECT: {
posts = await this.loadPosts(this.userID) ?? [];
break;
}
case App.Route.USER: {
posts = await this.loadPosts(this.router.userID) ?? [];
break;
}
case App.Route.POST: {
posts = await this.loadPosts(this.router.userID, this.router.postID) ?? [];
break;
}
default: {
console.log("Render: got a route I didn't understand. Rendering HOME:", this.router.route);
posts = await this.loadPosts(this.userID) ?? [];
break;
}
}
// let newPostsSet = new Set(posts.map(post=>post.post_id));
// let newPosts = (newPostsSet as any).difference(this.postsSet);
// // let removedPosts = (this.postsSet as any).difference(newPosts);
// let keepPosts = (this.postsSet as any).intersection(newPostsSet);
// let renderPosts = keepPosts.union(newPosts);
const fragment = document.createDocumentFragment(); const fragment = document.createDocumentFragment();
let contentDiv = document.getElementById("content"); let contentDiv = document.getElementById("content");
if (!contentDiv) { if (!contentDiv) {
@@ -839,8 +1074,9 @@ class App {
for (let i = posts.length - 1; i >= 0; i--) { for (let i = posts.length - 1; i >= 0; i--) {
let postData = posts[i]; let postData = posts[i];
// this.postsSet.add(postData);
let post = this.renderPost(postData, posts); let post = this.renderPost(postData);
if (post) { if (post) {
fragment.appendChild(post); fragment.appendChild(post);
@@ -858,15 +1094,23 @@ class App {
contentDiv.appendChild(fragment); contentDiv.appendChild(fragment);
let renderTime = this.timerDelta();
log(`render took: ${renderTime.toFixed(2)}ms`);
if ((performance as any)?.memory) {
log(`memory used: ${((performance as any).memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`)
}
} }
async deletePost(userID: string, postID: string) { async deletePost(userID: string, postID: string) {
deleteData(userID, postID) deleteData(userID, postID)
this.posts = await this.loadPosts(userID) ?? [];
this.render(this.posts); this.render();
} }
renderPost(post: Post, posts: Post[]) { renderPost(post: Post) {
if (!(post.hasOwnProperty("text"))) { if (!(post.hasOwnProperty("text"))) {
throw new Error("Post is malformed!"); throw new Error("Post is malformed!");
} }
@@ -875,23 +1119,41 @@ class App {
let timestamp = `${post.post_timestamp.toLocaleTimeString()} · ${post.post_timestamp.toLocaleDateString()}`; let timestamp = `${post.post_timestamp.toLocaleTimeString()} · ${post.post_timestamp.toLocaleDateString()}`;
let deleteButton = document.createElement('button'); deleteButton.innerText = 'delete'; let deleteButton = document.createElement('button'); deleteButton.innerText = 'delete';
deleteButton.onclick = () => { this.deletePost(post.author_id, post.post_id) };
let editButton = document.createElement('button'); editButton.innerText = 'edit'; let editButton = document.createElement('button'); editButton.innerText = 'edit';
deleteButton.onclick = () => { this.deletePost(this.userID, post.post_id) }; let shareButton = document.createElement('button'); shareButton.innerText = 'share';
shareButton.onclick = async () => {
let shareUrl = `https://${document.location.hostname}/user/${post.author_id}/post/${post.post_id}`;
await navigator.clipboard.writeText(shareUrl)
};
let ownPost = post.author_id === this.userID;
let postTemplate = let postTemplate =
`<div><hr> `<div><hr>
<div> <div>
<span class='header' title='${timestamp}'>@${post.author} - <span class='header' title='${timestamp}'><img class="logo" src="/static/favicon.ico">@${post.author} -
<span style="color:rgb(128,128,128)">${post.post_timestamp.toLocaleDateString()}</span> <span style="color:rgb(128,128,128)">${post.post_timestamp.toLocaleDateString()}</span>
</span> </span>
<span id="deleteButton"></span><span id="editButton"></span></div> ${ownPost ? `<span id="deleteButton"></span>` : ''}
<div>${marked.parse(post.text)}</div> ${ownPost ? `<span id="editButton"></span>` : ''}
</div>` <span id="shareButton"></span>
</div>
<div>${marked.parse(post.text)}</div>
</div>`
containerDiv.innerHTML = postTemplate; containerDiv.innerHTML = postTemplate;
containerDiv.querySelector('#deleteButton')?.appendChild(deleteButton);
containerDiv.querySelector('#editButton')?.appendChild(editButton); if (ownPost) {
containerDiv.querySelector('#deleteButton')?.appendChild(deleteButton);
containerDiv.querySelector('#editButton')?.appendChild(editButton);
}
containerDiv.querySelector('#shareButton')?.appendChild(shareButton);
if (!("image_data" in post && post.image_data)) { if (!("image_data" in post && post.image_data)) {
// containerDiv.appendChild(timestampDiv); // containerDiv.appendChild(timestampDiv);
@@ -900,6 +1162,7 @@ class App {
} }
let image = document.createElement("img"); let image = document.createElement("img");
image.title = `${(post.image_data.byteLength / 1024 / 1024).toFixed(2)}MBytes`;
// const blob = new Blob([post.image_data as ArrayBuffer], { type: 'image/png' }); // const blob = new Blob([post.image_data as ArrayBuffer], { type: 'image/png' });
const blob = new Blob([post.image_data as ArrayBuffer]); const blob = new Blob([post.image_data as ArrayBuffer]);
const url = URL.createObjectURL(blob); const url = URL.createObjectURL(blob);
@@ -907,12 +1170,10 @@ class App {
URL.revokeObjectURL(url); URL.revokeObjectURL(url);
}; };
image.src = url; image.src = url;
// image.src = image.src = "data:image/png;base64," + post.image; // image.src = image.src = "data:image/png;base64," + post.image;
image.className = "postImage"; image.className = "postImage";
image.onclick = () => { App.maximizeElement(image) };
containerDiv.appendChild(image); containerDiv.appendChild(image);
// containerDiv.appendChild(timestampDiv); // containerDiv.appendChild(timestampDiv);
@@ -920,8 +1181,72 @@ class App {
return containerDiv; return containerDiv;
} }
static maximizeElement(element: HTMLImageElement) {
element.style.transform = "scale(2.0)"
}
router = {
route: App.Route.HOME,
userID: '',
postID: '',
mediaID: ''
}
getRoute() {
app.router.userID = this.userID;
let path = document.location.pathname;
console.log(">>>>>>>>>>>>>>>>>>>>>>>>>", path);
const regex = "(user/([a-zA-Z0-9\-]+)/?(post/([a-zA-Z0-9\-]+)?/?)?(media/([0-9]+)?)?)|(connect/([a-zA-Z0-9\-]+))";
const match = path.match(new RegExp(regex));
if (match) {
if (match[8]) { // Check for the connect route
this.router.userID = match[8];
this.router.route = App.Route.CONNECT;
} else {
this.router.userID = match[2];
this.router.postID = match[4];
this.router.mediaID = match[6];
if (this.router.mediaID) {
this.router.route = App.Route.MEDIA;
} else if (this.router.postID) {
this.router.route = App.Route.POST;
} else {
this.router.route = App.Route.USER;
}
}
}
console.log(">>>>>>>>>>>>>", this.router, App.Route[this.router.route]);
// user = /user/<ID>
// post = /user/<ID>/post/<ID>
// media = /user/<ID>/post/<ID>/media/<index>
// group = /group/ID/post/<ID>
// hashtag = /hashtag/ -- maybe only hastags in groups
// home = /
}
} }
namespace App {
export enum Route {
USER,
POST,
MEDIA,
GROUP,
HOME,
CONNECT,
};
}
let app = new App(); let app = new App();
window.addEventListener("load", app.main.bind(app)); window.addEventListener("load", app.main.bind(app));

140
src/sw.ts
View File

@@ -1,14 +1,15 @@
const debugLog = false;
// Establish a cache name // Establish a cache name
const cacheName = "dandelion_cache_v1"; const cacheName = "dandelion_cache_v1";
const contentToCache = [ const contentToCache = [
'/index.html', '/static/index.html',
'/main.css', '/static/main.css',
'/main.js', '/static/main.js',
'lib//marked.min.js', '/static/lib/marked.min.js',
'lib/qrcode.min.js', '/static/lib/qrcode.min.js',
'/db.js', '/static/db.js',
'/favicon.ico' '/static/favicon.ico'
]; ];
self.addEventListener("install", (e: any) => { self.addEventListener("install", (e: any) => {
@@ -19,55 +20,126 @@ self.addEventListener("install", (e: any) => {
"[Service Worker] Caching all: app shell and content", "[Service Worker] Caching all: app shell and content",
contentToCache contentToCache
); );
await cache.addAll(contentToCache);
try {
await cache.addAll(contentToCache);
} catch (e) {
debugLog ? console.log(e) : null;
}
})() })()
); );
}); });
async function responder(event: any) {
console.log('Fetching', event.request.url);
let response = await fetch(event.request); async function staleWhileRevalidate(event: any) {
if (!response) { let cache = await caches.open(cacheName);
console.log('Fetch failed, falling back to cache', event.request.url);
let cacheMatch = await caches.match(event.request); let response = await cache.match(event.request);
if (!cacheMatch) {
// DUnno what to return here! if (response) {
debugLog ? console.log('Service Worker: Cache hit', event.request.url) : null;
}
const fetchPromise = (async () => {
debugLog ? console.log('Service Worker: Fetching', event.request.url) : null;
let networkResponse = null;
try {
networkResponse = await fetch(event.request);
} catch (e) {
debugLog ? console.log('Service Worker: Failed to fetch', e) : null;
return new Response('Network error occurred', {
status: 404,
statusText: 'Cache miss and fetch failed',
headers: { 'Content-Type': 'text/plain' }
});
} }
return cacheMatch;
}
if (response.status === 206) { debugLog ? console.log('Service Worker: Updating cache', event.request.url) : null;
console.log('Not caching partial content');
return response;
}
console.log('Fetch successful, updating cache'); try {
const cache = await caches.open(cacheName); await cache.put(event.request, networkResponse.clone());
try { } catch (e) {
cache.put(event.request, response.clone()).catch((error)=>console.log('failed to cache', event.request, error)); debugLog ? console.log('Service Worker: failed to update cache', event.request.url, e) : null;
} catch (e) {
console.log('failed to cache', event.request) }
}
return response; debugLog ? console.log('Service Worker: Returning networkResponse', event.request.url) : null;
return networkResponse;
})();
debugLog ? console.log('Service Worker: Returning return response || fetchPromise', event.request.url) : null;
return response || fetchPromise;
// if (networkResponse) {
// cache.put(event.request, networkResponse.clone())
// return networkResponse;
// }
// caches.open(cacheName)
// .then(function (cache) {
// return cache.match(event.request)
// .then(function (response) {
// var fetchPromise = fetch(event.request)
// .then(function (networkResponse) {
// cache.put(event.request, networkResponse.clone());
// return networkResponse;
// });
// return response || fetchPromise;
// });
// })
} }
// async function responder(event: any) {
// debugLog ? console.log('Fetching', event.request.url) : null;
// let response = await fetch(event.request);
// if (!response) {
// debugLog ? console.log('Fetch failed, falling back to cache', event.request.url) : null;
// let cacheMatch = await caches.match(event.request);
// if (!cacheMatch) {
// // DUnno what to return here!
// }
// return cacheMatch;
// }
// if (response.status === 206) {
// debugLog ? console.log('Not caching partial content') : null;
// return response;
// }
// debugLog ? console.log('Fetch successful, updating cache', event.request.url) : null;
// const cache = await caches.open(cacheName);
// try {
// cache.put(event.request, response.clone()).catch((error) => debugLog ? console.log('failed to cache', event.request, error)) : null;
// } catch (e) {
// console.log('failed to cache', event.request)
// }
// return response;
// }
self.addEventListener('fetch', function (event: any) { self.addEventListener('fetch', function (event: any) {
event.respondWith(responder(event)); event.respondWith(staleWhileRevalidate(event));
// event.respondWith(responder(event));
}); });
addEventListener("message", async (e) => { addEventListener("message", async (e) => {
console.log(`Message received:`, e.data); debugLog ? console.log(`Message received:`, e.data) : null;
switch (e.data.type) { switch (e.data.type) {
case "update_app": case "update_app":
const cache = await caches.open(cacheName); const cache = await caches.open(cacheName);
console.log(`[Service Worker] Caching resources`); debugLog ? console.log(`[Service Worker] Caching resources`) : null;
// cache.put("/main.js", new Response()); // cache.put("/main.js", new Response());
for (let item of contentToCache) { for (let item of contentToCache) {
cache.delete(item); cache.delete(item);
} }
await cache.addAll(contentToCache); await cache.addAll(contentToCache);

42
static/app.webmanifest Normal file
View File

@@ -0,0 +1,42 @@
{
"name": "ddln",
"short_name": "ddln",
"start_url": "/",
"display": "standalone",
"display_override": [
"window-controls-overlay",
"standalone"
],
"id": "b1dbe643-36fc-4419-9448-80f32a1baa1a",
"background_color": "#000000",
"theme_color": "#000000",
"icons": [
{
"src": "/static/icons/dandelion_512x512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"screenshots": [
{
"src": "/static/images/screenshot1.jpg",
"sizes": "1280x720",
"type": "image/png",
"form_factor": "wide",
"label": "Dandelion desktop"
},
{
"src": "/static/images/screenshot2.jpg",
"sizes": "720x1280",
"type": "image/png",
"form_factor": "narrow",
"label": "Dandelion mobile"
}
],
"protocol_handlers": [
{
"protocol": "web+ddln",
"url": "/%s"
}
]
}

0
bookerly.woff2 → static/bookerly.woff2
View File

95
db.js → static/db.js
View File

@@ -7,22 +7,23 @@
const postStoreName = "posts"; const postStoreName = "posts";
let keyBase = "dandelion_posts_v1_"; let keyBase = "dandelion_posts_v1_";
let key = ""; let key = "";
let version = 1;
function upgrade_0to1(db) {
let store = db.createObjectStore(postStoreName, { keyPath: "id", autoIncrement: true });
store.createIndex("datetimeIndex", "post_timestamp", { unique: false });
store.createIndex("postIDIndex", "data.post_id", { unique: true });
}
export function openDatabase(userID) { export function openDatabase(userID) {
const dbName = `user_${userID}`; const dbName = `user_${userID}`;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const request = indexedDB.open(dbName, 1); const request = indexedDB.open(dbName, version);
request.onerror = (event) => { request.onerror = (event) => {
// Use a type assertion to access the specific properties of IDBRequest error event
const errorEvent = event; const errorEvent = event;
reject(`Database error: ${errorEvent.target.error?.message}`); reject(`Database error: ${errorEvent.target.error?.message}`);
}; };
request.onupgradeneeded = (event) => { request.onupgradeneeded = (event) => {
const db = event.target.result; const db = event.target.result;
if (!db.objectStoreNames.contains(postStoreName)) { upgrade_0to1(db);
let store = db.createObjectStore(postStoreName, { keyPath: "id", autoIncrement: true });
store.createIndex("datetimeIndex", "post_timestamp", { unique: false });
store.createIndex("postIDIndex", "data.post_id", { unique: true });
}
}; };
request.onsuccess = (event) => { request.onsuccess = (event) => {
const db = event.target.result; const db = event.target.result;
@@ -30,11 +31,15 @@ export function openDatabase(userID) {
}; };
}); });
} }
async function getDBTransactionStore(userID) {
const db = await openDatabase(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
return { db, transaction, store };
}
export async function addData(userID, data) { export async function addData(userID, data) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const addRequest = store.add({ post_timestamp: data.post_timestamp, data: data }); const addRequest = store.add({ post_timestamp: data.post_timestamp, data: data });
addRequest.onsuccess = (e) => { addRequest.onsuccess = (e) => {
// console.log('Data has been added:', (e.target as IDBRequest).result); // console.log('Data has been added:', (e.target as IDBRequest).result);
@@ -51,9 +56,7 @@ export async function addData(userID, data) {
} }
export async function deleteData(userID, postID) { export async function deleteData(userID, postID) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
const getRequest = index.getKey(postID); const getRequest = index.getKey(postID);
getRequest.onerror = e => console.log(e.target.error); getRequest.onerror = e => console.log(e.target.error);
@@ -74,9 +77,7 @@ export async function deleteData(userID, postID) {
} }
export async function clearData(userID) { export async function clearData(userID) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const clearRequest = store.clear(); const clearRequest = store.clear();
clearRequest.onsuccess = (e) => { clearRequest.onsuccess = (e) => {
// console.log('Data has been added:', (e.target as IDBRequest).result); // console.log('Data has been added:', (e.target as IDBRequest).result);
@@ -93,9 +94,7 @@ export async function clearData(userID) {
} }
export async function addDataArray(userID, array) { export async function addDataArray(userID, array) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
let count = 0; let count = 0;
array.reverse(); array.reverse();
for (let data of array) { for (let data of array) {
@@ -120,12 +119,10 @@ export async function addDataArray(userID, array) {
} }
export async function checkPostIds(userID, post_ids) { export async function checkPostIds(userID, post_ids) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
transaction.oncomplete = () => { transaction.oncomplete = () => {
console.log("Transaction completed successfully"); // console.log("Transaction completed successfully");
db.close(); db.close();
}; };
transaction.onerror = (event) => { transaction.onerror = (event) => {
@@ -164,12 +161,10 @@ export async function checkPostIds(userID, post_ids) {
} }
export async function mergeDataArray(userID, array) { export async function mergeDataArray(userID, array) {
try { try {
const db = await openDatabase(userID); const { db, transaction, store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readwrite");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
transaction.oncomplete = () => { transaction.oncomplete = () => {
console.log("Transaction completed successfully"); // console.log("Transaction completed successfully");
db.close(); db.close();
}; };
transaction.onerror = (event) => { transaction.onerror = (event) => {
@@ -206,38 +201,26 @@ export async function mergeDataArray(userID, array) {
console.error("Error in opening database:", error); console.error("Error in opening database:", error);
} }
} }
export async function getPostForUser(userID, postID) {
}
export async function getData(userID, lowerID, upperID) { export async function getData(userID, lowerID, upperID) {
const db = await openDatabase(userID); const { store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly"); const keyRangeValue = IDBKeyRange.bound(lowerID, upperID);
const store = transaction.objectStore(postStoreName); const index = store.index("datetimeIndex");
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const keyRangeValue = IDBKeyRange.bound(lowerID, upperID); const getAllRequest = index.getAll(keyRangeValue);
const records = []; getAllRequest.onsuccess = () => {
const index = store.index("datetimeIndex"); const records = getAllRequest.result.map((item) => item.data);
const cursorRequest = index.openCursor(keyRangeValue); resolve(records);
cursorRequest.onsuccess = (event) => {
const cursor = event.target.result;
if (cursor) {
records.push(cursor.value.data); // Collect the record
cursor.continue(); // Move to the next item in the range
}
else {
// No more entries in the range
resolve(records);
}
}; };
cursorRequest.onerror = (event) => { getAllRequest.onerror = () => {
// Use a type assertion to access the specific properties of IDBRequest error event console.error('Transaction failed:', getAllRequest.error?.message);
const errorEvent = event; reject(getAllRequest.error);
console.error('Transaction failed:', errorEvent.target.error?.message);
reject(errorEvent.target.error); // Reject the promise if there's an error
}; };
}); });
} }
export async function getAllData(userID) { export async function getAllData(userID) {
const db = await openDatabase(userID); const { store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const getRequest = store.getAll(); const getRequest = store.getAll();
getRequest.onsuccess = () => { getRequest.onsuccess = () => {
@@ -260,9 +243,7 @@ export async function getAllData(userID) {
}); });
} }
export async function getAllIds(userID) { export async function getAllIds(userID) {
const db = await openDatabase(userID); const { store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
let keys = []; let keys = [];
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
@@ -283,9 +264,7 @@ export async function getAllIds(userID) {
}); });
} }
export async function getPostsByIds(userID, postIDs) { export async function getPostsByIds(userID, postIDs) {
const db = await openDatabase(userID); const { store } = await getDBTransactionStore(userID);
const transaction = db.transaction(postStoreName, "readonly");
const store = transaction.objectStore(postStoreName);
const index = store.index("postIDIndex"); const index = store.index("postIDIndex");
let posts = []; let posts = [];
for (const postID of postIDs) { for (const postID of postIDs) {

1
static/db.js.map Normal file
View File

File diff suppressed because one or more lines are too long

0
favicon.ico → static/favicon.ico
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 198 B

After

Width:  |  Height:  |  Size: 198 B

0
icons/dandelion_512x512.png → static/icons/dandelion_512x512.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.9 KiB

After

Width:  |  Height:  |  Size: 5.9 KiB

0
images/lottie_test.json → static/images/lottie_test.json
View File

0
images/screenshot1.jpg → static/images/screenshot1.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 137 KiB

After

Width:  |  Height:  |  Size: 137 KiB

0
images/screenshot1.png → static/images/screenshot1.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 206 KiB

After

Width:  |  Height:  |  Size: 206 KiB

0
images/screenshot2.jpg → static/images/screenshot2.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 138 KiB

After

Width:  |  Height:  |  Size: 138 KiB

0
images/screenshot2.png → static/images/screenshot2.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 206 KiB

After

Width:  |  Height:  |  Size: 206 KiB

25
index.html → static/index.html
View File

@@ -6,15 +6,15 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, maximum-scale=1">
<title>Dandelion</title> <title>Dandelion</title>
<script type="module" src="main.js"></script> <script type="module" src="/static/main.js"></script>
<script src="lib/marked.min.js"></script> <script src="/static/lib/marked.min.js"></script>
<script src="lib/qrcode.min.js"></script> <script src="/static/lib/qrcode.min.js"></script>
<!-- <script src="lib/lottie.min.js"></script> --> <!-- <script src="lib/lottie.min.js"></script> -->
<!-- <script src="https://unpkg.com/@dotlottie/player-component@latest/dist/dotlottie-player.mjs" type="module"></script> --> <!-- <script src="https://unpkg.com/@dotlottie/player-component@latest/dist/dotlottie-player.mjs" type="module"></script> -->
<!-- <script src="/lib/webtorrent/webtorrent_1_8_0.min.js"></script> --> <!-- <script src="/lib/webtorrent/webtorrent_1_8_0.min.js"></script> -->
<link rel="manifest" href="/app.webmanifest"> <link rel="manifest" href="/static/app.webmanifest">
<link rel="stylesheet" href="/main.css"> <link rel="stylesheet" href="/static/main.css">
</head> </head>
<body> <body>
@@ -23,7 +23,7 @@
<div class="flex-container"> <div class="flex-container">
<div class="content"> <div class="content">
<div class="img-button" id="ddln_logo_button"><img class="logo" src="favicon.ico"></div> <div class="img-button" id="ddln_logo_button"><img class="logo" src="/static/favicon.ico"></div>
<div id="status"></div> <div id="status"></div>
@@ -31,10 +31,11 @@
<div id="profile"> <div id="profile">
<span class="form_label">username:</span><span class="form_field" id="username" contenteditable="true">unnamed</span> <span class="form_label">username:</span><span class="form_field" id="username" contenteditable="true">unnamed</span>
</div> </div>
<div id="following"> <!-- <div id="following">
<div>fiona</div> <div>fiona</div>
<div>fiona</div> <div>fiona</div>
</div> </div> -->
<div id="peers"></div>
<div id="log" ></div> <div id="log" ></div>
<div id="connectURL"></div> <div id="connectURL"></div>
<div id="qrcode"></div> <div id="qrcode"></div>
@@ -47,13 +48,15 @@
<button id="import_tweets" >import</button> <button id="import_tweets" >import</button>
<button id="clear_posts" >clear </button> <button id="clear_posts" >clear </button>
<button id="update_app" >check for updates</button> <button id="update_app" >check for updates</button>
<button id="toggle_dark" >light/dark</button>
</div> </div>
<textarea cols="60" rows="6" id="textarea_post"></textarea> <textarea cols="60" rows="6" id="textarea_post"></textarea>
<div class="button"> <div class="right">
<input type="file" id="fileInput" multiple style="display:none"> <label for="file_input" id="file_input_label" class="button">photo</label>
<input type="file" id="file_input" multiple style="display:none">
<button id="button_add_pic" >🏞️</button> <!-- <button id="button_add_pic" >🏞️</button> -->
<button id="button_post" >post</button> <button id="button_post" >post</button>
</div> </div>
<!-- <div id="torrent-content"></div> --> <!-- <div id="torrent-content"></div> -->

0
lib/lottie.min.js → static/lib/lottie.min.js vendored
View File

0
lib/marked.min.js → static/lib/marked.min.js vendored
View File

0
lib/qrcode.min.js → static/lib/qrcode.min.js vendored
View File

0
lib/webtorrent/webtorrent_1_8_0.min.js → static/lib/webtorrent/webtorrent_1_8_0.min.js vendored
View File

47
main.css → static/main.css
View File

@@ -1,8 +1,18 @@
:root {
--main-bg-color: black;
--border-color:rgb(132,136,138);
--edge-color:rgb(60,60,60);
--main-fg-color:rgb(202,208,211);
--highlight-fg-color:rgb(255,255,255);
--link-color:rgb(29, 155, 240);
}
body { body {
font-family: sans-serif; font-family: sans-serif;
color: rgb(202, 208, 211); color: var(--main-fg-color);
background-color: black; background-color: var(--main-bg-color);
/* Use the font with a fallback */ margin:0px;
} }
hr { hr {
@@ -12,13 +22,13 @@ hr {
.form_field { .form_field {
font-size: medium; font-size: medium;
font-family: sans-serif; font-family: sans-serif;
background-color: rgb(0, 0, 0); background-color: var(--edge-color);
color: rgb(202, 208, 211); color: var(--main-fg-color);
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
border: 1px solid rgb(132, 136, 138); border: 1px solid var(--border-color);
resize: vertical; resize: vertical;
border-radius: 20px; border-radius: 20px;
} }
@@ -26,14 +36,14 @@ hr {
#textarea_post { #textarea_post {
font-size: medium; font-size: medium;
font-family: sans-serif; font-family: sans-serif;
background-color: rgb(0, 0, 0); background-color: var(--main-bg-color);
color: rgb(202, 208, 211); color: var(--main-fg-color);
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding-left: 30px; padding-left: 30px;
padding-right: 30px; padding-right: 30px;
padding-top: 10px; padding-top: 10px;
border: 1px solid rgb(132, 136, 138); border: 1px solid var(--border-color);
resize: vertical; resize: vertical;
border-radius: 40px; border-radius: 40px;
} }
@@ -55,7 +65,7 @@ hr {
min-width: 300px; min-width: 300px;
/* Minimum width the content can shrink to */ /* Minimum width the content can shrink to */
padding: 20px; padding: 20px;
box-shadow: 0 0 5px rgb(60, 60, 60); box-shadow: 0 0 5px var(--edge-color);
text-align: left; text-align: left;
overflow-x: hidden; overflow-x: hidden;
/* Hide horizontal overflow inside the flex container */ /* Hide horizontal overflow inside the flex container */
@@ -82,7 +92,7 @@ hr {
width: 50%; width: 50%;
} }
.button { .right {
text-align: right; text-align: right;
} }
@@ -95,7 +105,7 @@ hr {
} }
a { a {
color: rgb(29, 155, 240); color: var(--link-color);
} }
.logo { .logo {
@@ -113,18 +123,19 @@ a {
cursor: pointer; cursor: pointer;
} }
button { button,.button {
background-color: rgb(0, 0, 0); font-size:small;
background-color: var(--main-bg-color);
border-radius: 10px; border-radius: 10px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
padding-top: 5px; padding-top: 5px;
padding-bottom: 5px; padding-bottom: 5px;
margin-left: 5px; margin-left: 5px;
color: rgb(255, 255, 255); color: var(--highlight-fg-color);
/* border:solid 1px white; */ /* border:solid 1px white; */
border: 1px solid rgb(132, 136, 138); border: 1px solid var(--border-color);
color: rgb(202, 208, 211); color: var(--main-fg-color);
cursor: pointer; cursor: pointer;
} }
@@ -137,6 +148,6 @@ iframe {
} }
.qrcode_image { .qrcode_image {
background-color: white; background-color: var(--highlight-fg-color);
padding: 10px; padding: 10px;
} }

415
main.js → static/main.js
View File

@@ -17,6 +17,48 @@ function waitMs(durationMs) {
function uuidv4() { function uuidv4() {
return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (c) => (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)); return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (c) => (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16));
} }
function uuidToBytes(uuid) {
return new Uint8Array(uuid.match(/[a-fA-F0-9]{2}/g).map((hex) => parseInt(hex, 16)));
}
// Base58 character set
const BASE58_ALPHABET = '123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz';
// Base58 encoding
// Base58 encoding
function encodeBase58(buffer) {
let carry;
const digits = [0];
for (const byte of buffer) {
carry = byte;
for (let i = 0; i < digits.length; i++) {
carry += digits[i] << 8;
digits[i] = carry % 58;
carry = Math.floor(carry / 58);
}
while (carry > 0) {
digits.push(carry % 58);
carry = Math.floor(carry / 58);
}
}
let result = '';
for (const digit of digits.reverse()) {
result += BASE58_ALPHABET[digit];
}
// Handle leading zero bytes
for (const byte of buffer) {
if (byte === 0x00) {
result = BASE58_ALPHABET[0] + result;
}
else {
break;
}
}
return result;
}
// Convert UUID v4 to Base58
function uuidToBase58(uuid) {
const bytes = uuidToBytes(uuid);
return encodeBase58(bytes);
}
let logLines = []; let logLines = [];
let logLength = 10; let logLength = 10;
function log(message) { function log(message) {
@@ -72,22 +114,33 @@ window.addEventListener('scroll', () => {
// this.addPosts(newPosts); // this.addPosts(newPosts);
// } // }
// } // }
function arrayBufferToBase64(buffer) { async function bytesToBase64DataUrl(bytes, type = "application/octet-stream") {
var binary = ''; return await new Promise((resolve, reject) => {
var bytes = new Uint8Array(buffer); const reader = Object.assign(new FileReader(), {
var len = bytes.byteLength; onload: () => resolve(reader.result),
for (var i = 0; i < len; i++) { onerror: () => reject(reader.error),
binary += String.fromCharCode(bytes[i]); });
} reader.readAsDataURL(new File([bytes], "", { type }));
return window.btoa(binary); });
} }
function base64ToArrayBuffer(base64) { async function arrayBufferToBase64(buffer) {
var binaryString = atob(base64); var bytes = new Uint8Array(buffer);
var bytes = new Uint8Array(binaryString.length); return (await bytesToBase64DataUrl(bytes)).replace("data:application/octet-stream;base64,", "");
for (var i = 0; i < binaryString.length; i++) { }
bytes[i] = binaryString.charCodeAt(i); // function base64ToArrayBuffer(base64: string) {
} // var binaryString = atob(base64);
return bytes.buffer; // var bytes = new Uint8Array(binaryString.length);
// for (var i = 0; i < binaryString.length; i++) {
// bytes[i] = binaryString.charCodeAt(i);
// }
// return bytes.buffer;
// }
async function base64ToArrayBuffer(base64String) {
let response = await fetch("data:application/octet-stream;base64," + base64String);
let arrayBuffer = await response.arrayBuffer();
return arrayBuffer;
// let buffer = new Uint8Array(arrayBuffer);
// return buffer;
} }
class wsConnection { class wsConnection {
send(message) { send(message) {
@@ -98,16 +151,28 @@ class wsConnection {
catch (e) { catch (e) {
console.log(e, "wsConnection send: Couldn't serialize message", message); console.log(e, "wsConnection send: Couldn't serialize message", message);
} }
log(`ws->${json.slice(0, 240)}`); // log(`ws->${json.slice(0, 240)}`)
this.websocket.send(json); this.websocket.send(json);
} }
helloResponseHandler(data) { helloResponseHandler(data) {
for (let [userID, peerIDs] of Object.entries(data.userPeers)) { let users = [];
try {
let currentUserPeers = data.userPeers[app.router.userID];
users.push([app.router.userID, data.userPeers[app.router.userID]]);
delete data.userPeers[app.router.userID];
}
catch (e) {
console.log('helloResponseHandler', e);
}
users = [...users, ...Object.entries(data.userPeers)];
log(`Network: got ${users.length} users from bootstrap peer. ${users.join(',')}`);
for (let [userID, peerIDs] of users) {
this.peers.set(userID, [...Object.keys(peerIDs)]); this.peers.set(userID, [...Object.keys(peerIDs)]);
for (let peerID of [...Object.keys(peerIDs)]) { for (let peerID of [...Object.keys(peerIDs)]) {
if (peerID === this.peerID) { if (peerID === this.peerID) {
continue; continue;
} }
log(`Network: Requesting post IDs for user ${userID} from peer ${peerID}`);
this.send({ this.send({
type: "peer_message", type: "peer_message",
from: this.peerID, from: this.peerID,
@@ -122,19 +187,33 @@ class wsConnection {
async getPostIdsForUserResponseHandler(data) { async getPostIdsForUserResponseHandler(data) {
// log(`getPostsForUserResponse: ${data}`) // log(`getPostsForUserResponse: ${data}`)
let message = data.message; let message = data.message;
console.log(`getPostIdsForUserResponseHandler Got ${message.post_ids.length} from peer ${data.from}`); log(`Network: got ${message.post_ids.length} post IDs for user ${data.message.user_id} from peer ${data.from}`);
console.log(`Checking post IDs...`); console.log(`Checking post IDs...`);
let postIds = await checkPostIds(message.user_id, data.message.post_ids); let postIds = await checkPostIds(message.user_id, data.message.post_ids);
if (postIds.length === 0) { if (postIds.length === 0) {
log(`Don't need any posts from peer ${data.from}`); log(`Don't need any posts from peer ${data.from}`);
return; return;
} }
log(`Network: requesting ${postIds.length} posts for user ${message.user_id} from peer ${data.from}`);
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user", post_ids: postIds, user_id: message.user_id } }; let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user", post_ids: postIds, user_id: message.user_id } };
this.send(responseMessage); this.send(responseMessage);
} }
// static async compressArrayBuffer(data: ArrayBuffer): Promise<ArrayBuffer> {
// const compressionStream = new CompressionStream('gzip'); // You can also use 'deflate', 'deflate-raw', etc.
// const compressedStream = new Response(
// new Blob([data]).stream().pipeThrough(compressionStream)
// );
// const compressedArrayBuffer = await compressedStream.arrayBuffer();
// return compressedArrayBuffer;
// }
async getPostIdsForUserHandler(data) { async getPostIdsForUserHandler(data) {
let message = data.message; let message = data.message;
let postIds = await getAllIds(message.user_id) ?? []; let postIds = await getAllIds(message.user_id) ?? [];
if (postIds.length === 0) {
log(`Network: I know about user ${message.user_id} but I have 0 posts, so I'm not sending any to to peer ${data.from}`);
return;
}
log(`Network: Sending ${postIds.length} post Ids for user ${message.user_id} to peer ${data.from}`);
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_post_ids_for_user_response", post_ids: postIds, user_id: message.user_id } }; let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_post_ids_for_user_response", post_ids: postIds, user_id: message.user_id } };
this.send(responseMessage); this.send(responseMessage);
} }
@@ -142,38 +221,52 @@ class wsConnection {
async getPostsForUserHandler(data) { async getPostsForUserHandler(data) {
let message = data.message; let message = data.message;
let posts = await getPostsByIds(message.user_id, message.post_ids) ?? []; let posts = await getPostsByIds(message.user_id, message.post_ids) ?? [];
log(`Network: Sending ${posts.length} posts for user ${message.user_id} to peer ${data.from}`);
app.timerStart();
let output = []; let output = [];
for (let post of posts) { for (let post of posts) {
let newPost = post.data; let newPost = post.data;
if (newPost.image_data) { if (newPost.image_data) {
newPost.image_data = arrayBufferToBase64(newPost.image_data); // let compressedData = await wsConnection.compressArrayBuffer(newPost.image_data);
// console.log((newPost.image_data.byteLength - compressedData.byteLength) / 1024 / 1024);
newPost.image_data = await arrayBufferToBase64(newPost.image_data);
} }
// let megs = JSON.stringify(newPost).length/1024/1024;
// console.log(`getPostsForUserHandler id:${newPost.post_id} post length:${megs}`);
output.push(newPost); output.push(newPost);
} }
// posts = posts.map((post:any)=>{let newPost = post.data; if (newPost.image_data){newPost.image_data = arraybufferto};return newPost}); // posts = posts.map((post:any)=>{let newPost = post.data; if (newPost.image_data){newPost.image_data = arraybufferto};return newPost});
// posts = posts.map((post:any)=>{}) // posts = posts.map((post:any)=>{})
let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user_response", posts: output, user_id: message.user_id } }; let responseMessage = { type: "peer_message", from: app.peerID, to: data.from, message: { type: "get_posts_for_user_response", posts: output, user_id: message.user_id } };
this.send(responseMessage); this.send(responseMessage);
let sendTime = app.timerDelta();
log(`send took: ${sendTime.toFixed(2)}ms`);
} }
// Got posts from peer // Got posts from peer
async getPostsForUserReponseHandler(data) { async getPostsForUserReponseHandler(data) {
app.timerStart();
let message = data.message; let message = data.message;
console.log(`Network: got ${message.posts.length} posts for user ${message.user_id} from peer ${data.from}`);
console.log(`getPostsForUserResponseHandler Got ${message.posts.length} from peer ${data.from}`); console.log(`getPostsForUserResponseHandler Got ${message.posts.length} from peer ${data.from}`);
for (let post of message.posts) { for (let post of message.posts) {
if (message.user_id === app.userID) {
post.author_id = app.userID;
}
post.post_timestamp = new Date(post.post_timestamp); post.post_timestamp = new Date(post.post_timestamp);
if (post.image_data) { if (post.image_data) {
post.image_data = base64ToArrayBuffer(post.image_data); post.image_data = await base64ToArrayBuffer(post.image_data);
} }
} }
console.log(`Merging same user peer posts...`); console.log(`Merging same user peer posts...`);
await mergeDataArray(message.user_id, data.message.posts); await mergeDataArray(message.user_id, data.message.posts);
if (message.user_id === this.userID) { let receiveTime = app.timerDelta();
app.posts = await app.loadPosts(this.userID) ?? []; log(`Receive took: ${receiveTime.toFixed(2)}ms`);
app.render(app.posts); if (message.user_id === app.router.userID) {
app.render();
} }
} }
async peerMessageHandler(data) { async peerMessageHandler(data) {
log(`peerMessageHandler ${data}`); // log(`peerMessageHandler ${JSON.stringify(data)}`)
let peerMessageType = data.message.type; let peerMessageType = data.message.type;
let handler = this.peerMessageHandlers.get(peerMessageType); let handler = this.peerMessageHandlers.get(peerMessageType);
if (!handler) { if (!handler) {
@@ -198,9 +291,11 @@ class wsConnection {
console.log(error.message); console.log(error.message);
return; return;
} }
this.websocket.onopen = (event) => { this.websocket.onopen = async (event) => {
log("ws:connected"); log("ws:connected");
this.send({ type: "hello", user_id: this.userID, peer_id: this.peerID }); let knownUsers = [...(await indexedDB.databases())].map((db) => db.name?.replace('user_', ''));
console.log('Network: Sending known users', knownUsers);
this.send({ type: "hello", user_id: this.userID, peer_id: this.peerID, known_users: knownUsers });
this.websocketPingInterval = window.setInterval(() => { this.websocketPingInterval = window.setInterval(() => {
if (!navigator.onLine) { if (!navigator.onLine) {
return; return;
@@ -215,7 +310,7 @@ class wsConnection {
window.setTimeout(() => { this.connect(); }, this.retry * 1000); window.setTimeout(() => { this.connect(); }, this.retry * 1000);
}; };
this.websocket.onmessage = (event) => { this.websocket.onmessage = (event) => {
log('ws:<-' + event.data.slice(0, 240)); // log('ws:<-' + event.data.slice(0, 240));
let data = JSON.parse(event.data); let data = JSON.parse(event.data);
let { type } = data; let { type } = data;
let handler = this.messageHandlers.get(type); let handler = this.messageHandlers.get(type);
@@ -263,7 +358,17 @@ class App {
this.userID = ''; this.userID = '';
this.peerID = ''; this.peerID = '';
this.posts = []; this.posts = [];
this.isHeadless = false;
this.showLog = false;
this.time = 0; this.time = 0;
this.animals = ['shrew', 'jerboa', 'lemur', 'weasel', 'possum', 'possum', 'marmoset', 'planigale', 'mole', 'narwhal'];
this.adjectives = ['snazzy', 'whimsical', 'jazzy', 'bonkers', 'wobbly', 'spiffy', 'chirpy', 'zesty', 'bubbly', 'perky', 'sassy'];
this.router = {
route: App.Route.HOME,
userID: '',
postID: '',
mediaID: ''
};
} }
initMarkdown() { initMarkdown() {
const renderer = new marked.Renderer(); const renderer = new marked.Renderer();
@@ -379,16 +484,16 @@ class App {
console.error("Service Worker registration failed:", error); console.error("Service Worker registration failed:", error);
}); });
} }
addPost(userID, postText, imageData) { addPost(userID, postText, mediaData, mediaType) {
if ((typeof postText !== "string") || postText.length === 0) { if ((typeof postText !== "string") || postText.length === 0) {
log("Not posting an empty string..."); log("Not posting an empty string...");
return; return;
} }
let post = new Post(this.username, userID, postText, new Date(), imageData); let post = new Post(this.username, userID, postText, new Date(), mediaData);
this.posts.push(post); this.posts.push(post);
// localStorage.setItem(key, JSON.stringify(posts)); // localStorage.setItem(key, JSON.stringify(posts));
addData(userID, post); addData(userID, post);
this.render(this.posts); this.render();
} }
getPeerID() { getPeerID() {
let id = localStorage.getItem("peer_id"); let id = localStorage.getItem("peer_id");
@@ -406,10 +511,25 @@ class App {
} }
return id; return id;
} }
hashUserIdToIndices() {
let indices = [];
for (let char of this.userID) {
if (char !== '0' && char !== '-') {
indices.push(parseInt(char, 16));
if (indices.length == 2) {
break;
}
}
}
return [indices[0], indices[1]];
}
getUsername() { getUsername() {
let username = localStorage.getItem("dandelion_username"); let username = localStorage.getItem("dandelion_username");
if (!username) { if (!username || username === "not_set") {
username = "not_set"; let [one, two] = this.hashUserIdToIndices();
let adjective = this.adjectives[one % this.adjectives.length];
let animal = this.animals[two % this.animals.length];
username = `${adjective}_${animal}`;
localStorage.setItem("dandelion_username", username); localStorage.setItem("dandelion_username", username);
} }
return username; return username;
@@ -437,8 +557,7 @@ class App {
window.addEventListener('online', async () => { window.addEventListener('online', async () => {
log("online"); log("online");
connection.connect(); connection.connect();
this.posts = await this.loadPosts(this.userID) ?? []; this.render();
this.render(this.posts);
}); });
log(`Online status: ${navigator.onLine ? "online" : "offline"}`); log(`Online status: ${navigator.onLine ? "online" : "offline"}`);
} }
@@ -486,7 +605,23 @@ class App {
let clearPostsButton = document.getElementById("clear_posts"); let clearPostsButton = document.getElementById("clear_posts");
let updateApp = document.getElementById("update_app"); let updateApp = document.getElementById("update_app");
let ddlnLogoButton = document.getElementById('ddln_logo_button'); let ddlnLogoButton = document.getElementById('ddln_logo_button');
// let addP = document.getElementById('button_add_pic') as HTMLDivElement; // let addPic = document.getElementById('button_add_pic') as HTMLDivElement;
let filePickerLabel = document.getElementById('file_input_label');
let filePicker = document.getElementById('file_input');
let toggleDark = document.getElementById('toggle_dark');
toggleDark.addEventListener('click', () => {
document.documentElement.style.setProperty('--main-bg-color', 'white');
document.documentElement.style.setProperty('--main-fg-color', 'black');
});
filePicker?.addEventListener('change', async (event) => {
for (let file of filePicker.files) {
let buffer = await file.arrayBuffer();
let type = this.addPost(this.userID, 'image...', buffer);
}
});
filePickerLabel?.addEventListener('click', () => {
console.log("Add pic...");
});
let usernameField = document.getElementById('username'); let usernameField = document.getElementById('username');
usernameField?.addEventListener('input', (event) => { usernameField?.addEventListener('input', (event) => {
this.username = event.target.innerText; this.username = event.target.innerText;
@@ -505,10 +640,9 @@ class App {
clearData(userID); clearData(userID);
// posts = posts.reverse(); // posts = posts.reverse();
addDataArray(userID, imported_posts); addDataArray(userID, imported_posts);
posts = await this.loadPosts(userID) ?? []; this.render();
this.render(posts);
}); });
clearPostsButton.addEventListener('click', () => { clearData(userID); posts = []; this.render(posts); }); clearPostsButton.addEventListener('click', () => { clearData(userID); posts = []; this.render(); });
let postButton = document.getElementById("button_post"); let postButton = document.getElementById("button_post");
let postText = document.getElementById("textarea_post"); let postText = document.getElementById("textarea_post");
if (!(postButton && postText)) { if (!(postButton && postText)) {
@@ -533,9 +667,13 @@ class App {
} }
ddlnLogoButton.addEventListener('click', () => { infoElement.style.display == 'none' ? infoElement.style.display = 'block' : infoElement.style.display = 'none'; }); ddlnLogoButton.addEventListener('click', () => { infoElement.style.display == 'none' ? infoElement.style.display = 'block' : infoElement.style.display = 'none'; });
} }
async loadPosts(userID) { async loadPosts(userID, postID) {
this.timerStart(); this.timerStart();
let posts = await getData(userID, new Date(2022, 8), new Date()); let posts = [];
// if (postID) {
// posts = await gePostForUser(userID, postID);
// }
posts = await getData(userID, new Date(2022, 8), new Date());
if (posts.length > 0) { if (posts.length > 0) {
log(`Loaded ${posts.length} posts in ${this.timerDelta().toFixed(2)}ms`); log(`Loaded ${posts.length} posts in ${this.timerDelta().toFixed(2)}ms`);
return posts; return posts;
@@ -545,24 +683,38 @@ class App {
// addDataArray(userID, posts); // addDataArray(userID, posts);
// return await getData(userID, new Date(2022, 8), new Date()); // return await getData(userID, new Date(2022, 8), new Date());
} }
async main() { async purgeEmptyUsers() {
let urlParams = (new URL(window.location.href)).searchParams; let knownUsers = [...(await indexedDB.databases())].map((db) => db.name?.replace('user_', ''));
let connection_userID = urlParams.get('connect'); if (!knownUsers) {
let registration = undefined; return;
// if (urlParams.get("sw") === "true") {
registration = await this.registerServiceWorker();
// }
if (connection_userID) {
console.log('connect', connection_userID);
localStorage.setItem("dandelion_id", connection_userID);
} }
this.username = this.getUsername(); for (let userID of knownUsers) {
document.getElementById('username').innerText = this.username; let ids = await getAllIds(userID);
if (ids.length === 0) {
console.log(`Purging user ${userID}`);
indexedDB.deleteDatabase(`user_${userID}`);
}
console.log(`https://ddln.app/user/${userID}`);
}
}
async main() {
this.isHeadless = /\bHeadlessChrome\//.test(navigator.userAgent);
let userID = this.getUserID(); let userID = this.getUserID();
let peerID = this.getPeerID(); let peerID = this.getPeerID();
this.userID = userID; this.userID = userID;
this.peerID = peerID; this.peerID = peerID;
this.initButtons(userID, this.posts, registration); this.getRoute();
if (this.router.route === App.Route.CONNECT) {
console.log('connect', this.router.userID);
localStorage.setItem("dandelion_id", this.router.userID);
}
let urlParams = (new URL(window.location.href)).searchParams;
let connection_userID = urlParams.get('connect');
let registration = undefined;
if (urlParams.has('log')) {
document.getElementById('info').style.display = "block";
this.showLog = true;
}
let time = 0; let time = 0;
let delta = 0; let delta = 0;
// let isPersisted = await navigator?.storage?.persisted(); // let isPersisted = await navigator?.storage?.persisted();
@@ -577,16 +729,19 @@ class App {
// let code = await main.text(); // let code = await main.text();
// console.log(code); // console.log(code);
// registration.active.postMessage({type:"updateMain", code:code}); // registration.active.postMessage({type:"updateMain", code:code});
this.posts = await this.loadPosts(userID) ?? []; // this.posts = await this.loadPosts(userID) ?? [];
// debugger; // debugger;
this.timerStart(); await this.render(); // , (postID:string)=>{this.deletePost(userID, postID)}
this.render(this.posts); // , (postID:string)=>{this.deletePost(userID, postID)}
let renderTime = this.timerDelta();
log(`render took: ${renderTime.toFixed(2)}ms`);
if (performance?.memory) { if (performance?.memory) {
log(`memory used: ${(performance.memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`); log(`memory used: ${(performance.memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`);
} }
let connectURL = `https://${document.location.hostname}?connect=${this.userID}`; // if (urlParams.get("sw") === "true") {
registration = await this.registerServiceWorker();
// }
this.username = this.getUsername();
document.getElementById('username').innerText = this.username;
this.initButtons(userID, this.posts, registration);
let connectURL = `https://${document.location.hostname}/connect/${this.userID}`;
document.getElementById('connectURL').innerHTML = `<a href="${connectURL}">connect</a>`; document.getElementById('connectURL').innerHTML = `<a href="${connectURL}">connect</a>`;
let qrcode = await new QRCode(document.getElementById('qrcode'), { let qrcode = await new QRCode(document.getElementById('qrcode'), {
text: connectURL, text: connectURL,
@@ -596,9 +751,10 @@ class App {
colorLight: "#ffffff", colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H correctLevel: QRCode.CorrectLevel.H
}); });
let qrcodeImage = document.querySelector('#qrcode > img'); document.querySelector('#qrcode > img').classList.add('qrcode_image');
qrcodeImage.classList.add('qrcode_image'); document.querySelector('#qrcode > canvas').classList.add('qrcode_image');
log(`user:${userID} peer:${peerID}`); log(`username:${this.username} user:${userID} peer:${peerID}`);
await this.purgeEmptyUsers();
let websocket = new wsConnection(userID, peerID); let websocket = new wsConnection(userID, peerID);
window.addEventListener('beforeunload', () => { websocket.disconnect(); }); window.addEventListener('beforeunload', () => { websocket.disconnect(); });
this.initOffline(websocket); this.initOffline(websocket);
@@ -615,7 +771,43 @@ class App {
// file.appendTo(document.getElementById('torrent-content')); // file.appendTo(document.getElementById('torrent-content'));
// }) // })
} }
render(posts) { // keep a map of posts to dom nodes.
// on re-render
// posts that are not in our list that we need at add
// posts that are in our list that we need to remove
// postsSet = new Set();
async render() {
if (this.isHeadless) {
console.log('Headless so skipping render...');
return;
}
this.timerStart();
let posts = [];
switch (this.router.route) {
case App.Route.HOME:
case App.Route.CONNECT: {
posts = await this.loadPosts(this.userID) ?? [];
break;
}
case App.Route.USER: {
posts = await this.loadPosts(this.router.userID) ?? [];
break;
}
case App.Route.POST: {
posts = await this.loadPosts(this.router.userID, this.router.postID) ?? [];
break;
}
default: {
console.log("Render: got a route I didn't understand. Rendering HOME:", this.router.route);
posts = await this.loadPosts(this.userID) ?? [];
break;
}
}
// let newPostsSet = new Set(posts.map(post=>post.post_id));
// let newPosts = (newPostsSet as any).difference(this.postsSet);
// // let removedPosts = (this.postsSet as any).difference(newPosts);
// let keepPosts = (this.postsSet as any).intersection(newPostsSet);
// let renderPosts = keepPosts.union(newPosts);
const fragment = document.createDocumentFragment(); const fragment = document.createDocumentFragment();
let contentDiv = document.getElementById("content"); let contentDiv = document.getElementById("content");
if (!contentDiv) { if (!contentDiv) {
@@ -625,7 +817,8 @@ class App {
// let count = 0; // let count = 0;
for (let i = posts.length - 1; i >= 0; i--) { for (let i = posts.length - 1; i >= 0; i--) {
let postData = posts[i]; let postData = posts[i];
let post = this.renderPost(postData, posts); // this.postsSet.add(postData);
let post = this.renderPost(postData);
if (post) { if (post) {
fragment.appendChild(post); fragment.appendChild(post);
// count++; // count++;
@@ -638,13 +831,17 @@ class App {
throw new Error("Couldn't get content div!"); throw new Error("Couldn't get content div!");
} }
contentDiv.appendChild(fragment); contentDiv.appendChild(fragment);
let renderTime = this.timerDelta();
log(`render took: ${renderTime.toFixed(2)}ms`);
if (performance?.memory) {
log(`memory used: ${(performance.memory.usedJSHeapSize / 1024 / 1024).toFixed(2)}Mb`);
}
} }
async deletePost(userID, postID) { async deletePost(userID, postID) {
deleteData(userID, postID); deleteData(userID, postID);
this.posts = await this.loadPosts(userID) ?? []; this.render();
this.render(this.posts);
} }
renderPost(post, posts) { renderPost(post) {
if (!(post.hasOwnProperty("text"))) { if (!(post.hasOwnProperty("text"))) {
throw new Error("Post is malformed!"); throw new Error("Post is malformed!");
} }
@@ -652,26 +849,40 @@ class App {
let timestamp = `${post.post_timestamp.toLocaleTimeString()} · ${post.post_timestamp.toLocaleDateString()}`; let timestamp = `${post.post_timestamp.toLocaleTimeString()} · ${post.post_timestamp.toLocaleDateString()}`;
let deleteButton = document.createElement('button'); let deleteButton = document.createElement('button');
deleteButton.innerText = 'delete'; deleteButton.innerText = 'delete';
deleteButton.onclick = () => { this.deletePost(post.author_id, post.post_id); };
let editButton = document.createElement('button'); let editButton = document.createElement('button');
editButton.innerText = 'edit'; editButton.innerText = 'edit';
deleteButton.onclick = () => { this.deletePost(this.userID, post.post_id); }; let shareButton = document.createElement('button');
shareButton.innerText = 'share';
shareButton.onclick = async () => {
let shareUrl = `https://${document.location.hostname}/user/${post.author_id}/post/${post.post_id}`;
await navigator.clipboard.writeText(shareUrl);
};
let ownPost = post.author_id === this.userID;
let postTemplate = `<div><hr> let postTemplate = `<div><hr>
<div> <div>
<span class='header' title='${timestamp}'>@${post.author} - <span class='header' title='${timestamp}'><img class="logo" src="/static/favicon.ico">@${post.author} -
<span style="color:rgb(128,128,128)">${post.post_timestamp.toLocaleDateString()}</span> <span style="color:rgb(128,128,128)">${post.post_timestamp.toLocaleDateString()}</span>
</span> </span>
<span id="deleteButton"></span><span id="editButton"></span></div> ${ownPost ? `<span id="deleteButton"></span>` : ''}
<div>${marked.parse(post.text)}</div> ${ownPost ? `<span id="editButton"></span>` : ''}
</div>`; <span id="shareButton"></span>
</div>
<div>${marked.parse(post.text)}</div>
</div>`;
containerDiv.innerHTML = postTemplate; containerDiv.innerHTML = postTemplate;
containerDiv.querySelector('#deleteButton')?.appendChild(deleteButton); if (ownPost) {
containerDiv.querySelector('#editButton')?.appendChild(editButton); containerDiv.querySelector('#deleteButton')?.appendChild(deleteButton);
containerDiv.querySelector('#editButton')?.appendChild(editButton);
}
containerDiv.querySelector('#shareButton')?.appendChild(shareButton);
if (!("image_data" in post && post.image_data)) { if (!("image_data" in post && post.image_data)) {
// containerDiv.appendChild(timestampDiv); // containerDiv.appendChild(timestampDiv);
return containerDiv; return containerDiv;
// return null; // return null;
} }
let image = document.createElement("img"); let image = document.createElement("img");
image.title = `${(post.image_data.byteLength / 1024 / 1024).toFixed(2)}MBytes`;
// const blob = new Blob([post.image_data as ArrayBuffer], { type: 'image/png' }); // const blob = new Blob([post.image_data as ArrayBuffer], { type: 'image/png' });
const blob = new Blob([post.image_data]); const blob = new Blob([post.image_data]);
const url = URL.createObjectURL(blob); const url = URL.createObjectURL(blob);
@@ -681,11 +892,61 @@ class App {
image.src = url; image.src = url;
// image.src = image.src = "data:image/png;base64," + post.image; // image.src = image.src = "data:image/png;base64," + post.image;
image.className = "postImage"; image.className = "postImage";
image.onclick = () => { App.maximizeElement(image); };
containerDiv.appendChild(image); containerDiv.appendChild(image);
// containerDiv.appendChild(timestampDiv); // containerDiv.appendChild(timestampDiv);
return containerDiv; return containerDiv;
} }
static maximizeElement(element) {
element.style.transform = "scale(2.0)";
}
getRoute() {
app.router.userID = this.userID;
let path = document.location.pathname;
console.log(">>>>>>>>>>>>>>>>>>>>>>>>>", path);
const regex = "(user/([a-zA-Z0-9\-]+)/?(post/([a-zA-Z0-9\-]+)?/?)?(media/([0-9]+)?)?)|(connect/([a-zA-Z0-9\-]+))";
const match = path.match(new RegExp(regex));
if (match) {
if (match[8]) { // Check for the connect route
this.router.userID = match[8];
this.router.route = App.Route.CONNECT;
}
else {
this.router.userID = match[2];
this.router.postID = match[4];
this.router.mediaID = match[6];
if (this.router.mediaID) {
this.router.route = App.Route.MEDIA;
}
else if (this.router.postID) {
this.router.route = App.Route.POST;
}
else {
this.router.route = App.Route.USER;
}
}
}
console.log(">>>>>>>>>>>>>", this.router, App.Route[this.router.route]);
// user = /user/<ID>
// post = /user/<ID>/post/<ID>
// media = /user/<ID>/post/<ID>/media/<index>
// group = /group/ID/post/<ID>
// hashtag = /hashtag/ -- maybe only hastags in groups
// home = /
}
} }
(function (App) {
let Route;
(function (Route) {
Route[Route["USER"] = 0] = "USER";
Route[Route["POST"] = 1] = "POST";
Route[Route["MEDIA"] = 2] = "MEDIA";
Route[Route["GROUP"] = 3] = "GROUP";
Route[Route["HOME"] = 4] = "HOME";
Route[Route["CONNECT"] = 5] = "CONNECT";
})(Route = App.Route || (App.Route = {}));
;
})(App || (App = {}));
let app = new App(); let app = new App();
window.addEventListener("load", app.main.bind(app)); window.addEventListener("load", app.main.bind(app));
//# sourceMappingURL=main.js.map //# sourceMappingURL=main.js.map

1
static/main.js.map Normal file
View File

File diff suppressed because one or more lines are too long

20
static/peers.js Normal file
View File

@@ -0,0 +1,20 @@
var PeerMessageTypes;
(function (PeerMessageTypes) {
PeerMessageTypes[PeerMessageTypes["HELLO"] = 0] = "HELLO";
})(PeerMessageTypes || (PeerMessageTypes = {}));
export class Peer {
constructor() {
this.peer_id = '';
this.state = 'ready';
}
connect(peer_id) {
}
}
export class PeerManager {
constructor() {
this.peers = [];
}
connectPeer(peer_id) {
}
}
//# sourceMappingURL=peers.js.map

1
static/peers.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"peers.js","sourceRoot":"","sources":["../src/peers.ts"],"names":[],"mappings":"AACA,IAAK,gBAGJ;AAHD,WAAK,gBAAgB;IACjB,yDAAK,CAAA;AAET,CAAC,EAHI,gBAAgB,KAAhB,gBAAgB,QAGpB;AAED,MAAM,OAAO,IAAI;IAAjB;QACI,YAAO,GAAU,EAAE,CAAC;QAEpB,UAAK,GAAmD,OAAO,CAAC;IAIpE,CAAC;IAHG,OAAO,CAAC,OAAc;IAEtB,CAAC;CACJ;AAED,MAAM,OAAO,WAAW;IAAxB;QACI,UAAK,GAAU,EAAE,CAAC;IAOtB,CAAC;IALG,WAAW,CAAC,OAAc;IAE1B,CAAC;CAGJ"}

0
robots.txt → static/robots.txt
View File

117
static/sw.js Normal file
View File

@@ -0,0 +1,117 @@
"use strict";
const debugLog = false;
// Establish a cache name
const cacheName = "dandelion_cache_v1";
const contentToCache = [
'/static/index.html',
'/static/main.css',
'/static/main.js',
'/static/lib/marked.min.js',
'/static/lib/qrcode.min.js',
'/static/db.js',
'/static/favicon.ico'
];
self.addEventListener("install", (e) => {
e.waitUntil((async () => {
const cache = await caches.open(cacheName);
console.log("[Service Worker] Caching all: app shell and content", contentToCache);
try {
await cache.addAll(contentToCache);
}
catch (e) {
debugLog ? console.log(e) : null;
}
})());
});
async function staleWhileRevalidate(event) {
let cache = await caches.open(cacheName);
let response = await cache.match(event.request);
if (response) {
debugLog ? console.log('Service Worker: Cache hit', event.request.url) : null;
}
const fetchPromise = (async () => {
debugLog ? console.log('Service Worker: Fetching', event.request.url) : null;
let networkResponse = null;
try {
networkResponse = await fetch(event.request);
}
catch (e) {
debugLog ? console.log('Service Worker: Failed to fetch', e) : null;
return new Response('Network error occurred', {
status: 404,
statusText: 'Cache miss and fetch failed',
headers: { 'Content-Type': 'text/plain' }
});
}
debugLog ? console.log('Service Worker: Updating cache', event.request.url) : null;
try {
await cache.put(event.request, networkResponse.clone());
}
catch (e) {
debugLog ? console.log('Service Worker: failed to update cache', event.request.url, e) : null;
}
debugLog ? console.log('Service Worker: Returning networkResponse', event.request.url) : null;
return networkResponse;
})();
debugLog ? console.log('Service Worker: Returning return response || fetchPromise', event.request.url) : null;
return response || fetchPromise;
// if (networkResponse) {
// cache.put(event.request, networkResponse.clone())
// return networkResponse;
// }
// caches.open(cacheName)
// .then(function (cache) {
// return cache.match(event.request)
// .then(function (response) {
// var fetchPromise = fetch(event.request)
// .then(function (networkResponse) {
// cache.put(event.request, networkResponse.clone());
// return networkResponse;
// });
// return response || fetchPromise;
// });
// })
}
// async function responder(event: any) {
// debugLog ? console.log('Fetching', event.request.url) : null;
// let response = await fetch(event.request);
// if (!response) {
// debugLog ? console.log('Fetch failed, falling back to cache', event.request.url) : null;
// let cacheMatch = await caches.match(event.request);
// if (!cacheMatch) {
// // DUnno what to return here!
// }
// return cacheMatch;
// }
// if (response.status === 206) {
// debugLog ? console.log('Not caching partial content') : null;
// return response;
// }
// debugLog ? console.log('Fetch successful, updating cache', event.request.url) : null;
// const cache = await caches.open(cacheName);
// try {
// cache.put(event.request, response.clone()).catch((error) => debugLog ? console.log('failed to cache', event.request, error)) : null;
// } catch (e) {
// console.log('failed to cache', event.request)
// }
// return response;
// }
self.addEventListener('fetch', function (event) {
event.respondWith(staleWhileRevalidate(event));
// event.respondWith(responder(event));
});
addEventListener("message", async (e) => {
debugLog ? console.log(`Message received:`, e.data) : null;
switch (e.data.type) {
case "update_app":
const cache = await caches.open(cacheName);
debugLog ? console.log(`[Service Worker] Caching resources`) : null;
// cache.put("/main.js", new Response());
for (let item of contentToCache) {
cache.delete(item);
}
await cache.addAll(contentToCache);
break;
}
});
//# sourceMappingURL=sw.js.map

1
static/sw.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"sw.js","sourceRoot":"","sources":["../src/sw.ts"],"names":[],"mappings":"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"}

BIN
static/test_data/thrust.webm Normal file
View File

Binary file not shown.

BIN
static/test_data/wingit.mp4 Normal file
View File

Binary file not shown.

BIN
static/test_data/yt-dlp Executable file
View File

Binary file not shown.

0
virgil.woff2 → static/virgil.woff2
View File

96
static/webRTC.js Normal file
View File

@@ -0,0 +1,96 @@
"use strict";
class PeerManager {
connect(peerID) {
// Connect to the peer that has the peer id peerID
}
disconnect(peerID) {
}
}
class PeerConnection {
}
PeerConnection.config = {
iceServers: [
{ urls: "stun:stun.l.google.com" },
{ urls: "stun:stun1.l.google.com" },
{ urls: "stun:stun2.l.google.com" },
{ urls: "stun:stun3.l.google.com" },
{ urls: "stun:stun4.l.google.com" },
],
};
const config = {
iceServers: [{ urls: "stun:stun.mystunserver.tld" }],
};
let polite = true;
// const signaler = new SignalingChannel();
const signaler = {};
const pc = new RTCPeerConnection(config);
const constraints = { audio: true, video: true };
const selfVideo = document.querySelector("video.selfview");
const remoteVideo = document.querySelector("video.remoteview");
async function start() {
try {
const stream = await navigator.mediaDevices.getUserMedia(constraints);
for (const track of stream.getTracks()) {
pc.addTrack(track, stream);
}
// selfVideo.srcObject = stream;
}
catch (err) {
console.error(err);
}
}
pc.ontrack = ({ track, streams }) => {
track.onunmute = () => {
// if (remoteVideo.srcObject) {
// return;
// }
// remoteVideo.srcObject = streams[0];
};
};
let makingOffer = false;
pc.onnegotiationneeded = async () => {
try {
makingOffer = true;
await pc.setLocalDescription();
signaler.send({ description: pc.localDescription });
}
catch (err) {
console.error(err);
}
finally {
makingOffer = false;
}
};
pc.onicecandidate = ({ candidate }) => signaler.send({ candidate });
let ignoreOffer = false;
signaler.onmessage = async ({ data: { description, candidate } }) => {
try {
if (description) {
const offerCollision = description.type === "offer" &&
(makingOffer || pc.signalingState !== "stable");
ignoreOffer = !polite && offerCollision;
if (ignoreOffer) {
return;
}
await pc.setRemoteDescription(description);
if (description.type === "offer") {
await pc.setLocalDescription();
signaler.send({ description: pc.localDescription });
}
}
else if (candidate) {
try {
await pc.addIceCandidate(candidate);
}
catch (err) {
if (!ignoreOffer) {
throw err;
}
}
}
}
catch (err) {
console.error(err);
}
};
//# sourceMappingURL=webRTC.js.map

1
static/webRTC.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"webRTC.js","sourceRoot":"","sources":["../src/webRTC.ts"],"names":[],"mappings":"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"}

62
sw.js
View File

@@ -1,62 +0,0 @@
"use strict";
// Establish a cache name
const cacheName = "dandelion_cache_v1";
const contentToCache = [
'/index.html',
'/main.css',
'/main.js',
'lib//marked.min.js',
'lib/qrcode.min.js',
'/db.js',
'/favicon.ico'
];
self.addEventListener("install", (e) => {
e.waitUntil((async () => {
const cache = await caches.open(cacheName);
console.log("[Service Worker] Caching all: app shell and content", contentToCache);
await cache.addAll(contentToCache);
})());
});
async function responder(event) {
console.log('Fetching', event.request.url);
let response = await fetch(event.request);
if (!response) {
console.log('Fetch failed, falling back to cache', event.request.url);
let cacheMatch = await caches.match(event.request);
if (!cacheMatch) {
// DUnno what to return here!
}
return cacheMatch;
}
if (response.status === 206) {
console.log('Not caching partial content');
return response;
}
console.log('Fetch successful, updating cache');
const cache = await caches.open(cacheName);
try {
cache.put(event.request, response.clone()).catch((error) => console.log('failed to cache', event.request, error));
}
catch (e) {
console.log('failed to cache', event.request);
}
return response;
}
self.addEventListener('fetch', function (event) {
event.respondWith(responder(event));
});
addEventListener("message", async (e) => {
console.log(`Message received:`, e.data);
switch (e.data.type) {
case "update_app":
const cache = await caches.open(cacheName);
console.log(`[Service Worker] Caching resources`);
// cache.put("/main.js", new Response());
for (let item of contentToCache) {
cache.delete(item);
}
await cache.addAll(contentToCache);
break;
}
});
//# sourceMappingURL=sw.js.map

1
sw.js.map
View File

@@ -1 +0,0 @@
{"version":3,"file":"sw.js","sourceRoot":"","sources":["src/sw.ts"],"names":[],"mappings":"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"}

2
tsconfig.json
View File

@@ -14,7 +14,7 @@
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */ // "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
"sourceMap": true, /* Generates corresponding '.map' file. */ "sourceMap": true, /* Generates corresponding '.map' file. */
// "outFile": "./", /* Concatenate and emit output to single file. */ // "outFile": "./", /* Concatenate and emit output to single file. */
"outDir": "./", /* Redirect output structure to the directory. */ "outDir": "./static", /* Redirect output structure to the directory. */
"rootDir": "./src", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */ "rootDir": "./src", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
// "composite": true, /* Enable project compilation */ // "composite": true, /* Enable project compilation */
// "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */ // "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */