diff --git a/index.html b/index.html index da82a8d..97626e6 100644 --- a/index.html +++ b/index.html @@ -93,6 +93,10 @@ padding: 20px; } + .postImage { + width:100%; + } + #log { font-family: monospace; } @@ -104,6 +108,11 @@ a { color: rgb(29, 155, 240); } + + #log { + margin-bottom: 20px; + height:150px; + } @@ -115,7 +124,7 @@
-
+
diff --git a/main b/main index 59ca008..cd6f82a 100755 Binary files a/main and b/main differ diff --git a/main.go b/main.go index 6c85c27..ffae6ec 100644 --- a/main.go +++ b/main.go @@ -52,7 +52,7 @@ func (lh *LoggingHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) { func main() { dir := "./" - port := 9000 + port := 80 addr := ":" + strconv.Itoa(port) log.Printf("Starting server on %s", addr) diff --git a/package.json b/package.json new file mode 100644 index 0000000..04263dc --- /dev/null +++ b/package.json @@ -0,0 +1,5 @@ +{ + "devDependencies": { + "typescript": "^5.2.2" + } +} diff --git a/src/db.ts b/src/db.ts index 108d6e6..604a834 100644 --- a/src/db.ts +++ b/src/db.ts @@ -78,6 +78,9 @@ export async function addDataArray(userID: string, array: any[]): Promise const store = transaction.objectStore(storeName); let count = 0; + + array.reverse(); + for (let data of array) { const addRequest = store.add(data); addRequest.onsuccess = (e: Event) => { diff --git a/src/main.ts b/src/main.ts index 06ea90c..cb2f9c0 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,5 +1,6 @@ import { openDatabase, getData, addData, addDataArray, getAllData } from "./db.js" +declare let marked:any; // let posts:any; // let keyBase = "dandelion_posts_v1_" // let key:string = ""; @@ -14,15 +15,36 @@ interface PostTimestamp { } class Post { - constructor(author: string, text: string, post_timestamp: PostTimestamp, format = null) { - post_timestamp = post_timestamp; - author = author; - text = text; - format = format; + post_timestamp:PostTimestamp; + author:string; + author_id:string; + text:string; + // format + constructor(author: string, author_id:string, text: string, post_timestamp: PostTimestamp, format = null) { + this.post_timestamp = post_timestamp; + this.author = author; + this.author_id = author_id; + this.text = text; + // this.format = format; } } +function timestampToString(t:PostTimestamp) { +return `${t.year}/${t.month}/${t.day}-${t.hour}:${t.minute}:${t.second}` +} + +function getCurrentTimestamp() { + let date = new Date(); + return { + year: date.getFullYear(), + month: date.getMonth()+1, + day: date.getDate(), + hour: date.getHours(), + minute: date.getMinutes(), + second: date.getSeconds(), + }; +} function uuidv4() { return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (c: any) => @@ -33,7 +55,7 @@ function uuidv4() { let logLines: string[] = []; let logLength = 10; function log(message: string) { - logLines.push(`${message}`); + logLines.push(`${new Date().toLocaleTimeString()}:${message}`); if (logLines.length > 10) { logLines = logLines.slice(logLines.length - logLength); } @@ -158,10 +180,10 @@ async function createTestData3(userID: string) { return posts; } -function post(key: string, posts: { author: any; text: any; image: any; }[], author: any, text: any, image: any) { - posts.push({ author: author, text: text, image: image }); - localStorage.setItem(key, JSON.stringify(posts)); -} +// function post(key: string, posts: { author: any; text: any; image: any; }[], author: any, text: any, image: any) { +// posts.push({ author: author, text: text, image: image }); +// localStorage.setItem(key, JSON.stringify(posts)); +// } async function registerServiceWorker() { if (!("serviceWorker" in navigator)) { @@ -186,13 +208,14 @@ async function registerServiceWorker() { } function addPost(userID: string, posts: Post[], postText: string) { - let post: Post = { - author: `bobbydigitales`, - text: postText, - }; + if ((typeof postText !== "string") || postText.length === 0) { + log ("Not posting an empty string...") + return; + } + let post = new Post(`bobbydigitales`, userID, postText, getCurrentTimestamp()); - posts.unshift(post); + posts.push(post); // localStorage.setItem(key, JSON.stringify(posts)); addData(userID, post) @@ -288,7 +311,7 @@ function initButtons(userID: string, posts: Post[]) { async function loadPosts(userID: string) { timerStart(); - let posts = await getData(userID, 1, 500); + let posts = await getData(userID, 1, 1000); if (posts.length > 0) { log(`Loaded ${posts.length} posts in ${timerDelta().toFixed(2)}ms`); @@ -312,7 +335,7 @@ async function loadPosts(userID: string) { // log("Finished!"); - return await getData(userID, 1, 100); + return await getData(userID, 1, 1000); // debugger; @@ -372,16 +395,16 @@ async function main() { console.log(`Persisted storage granted: ${isPersisted}`); } - let websocket = connectWebsocket(userID); - initOffline(); - initButtons(userID, posts); - // let main = await fetch("/main.js"); // let code = await main.text(); // console.log(code); // registration.active.postMessage({type:"updateMain", code:code}); posts = await loadPosts(userID); + + let websocket = connectWebsocket(userID); + initOffline(); + initButtons(userID, posts); // debugger; timerStart(); @@ -401,17 +424,31 @@ function render(posts: Post[]) { } contentDiv.innerHTML = ""; let count = 0; - for (const postData of posts) { + + + for (let i=posts.length -1; i>0; i--) { + let postData = posts[i]; + let post = renderPost(postData); fragment.appendChild(post); - count++; - if (count > 500) { - break; - } + // if (count > 500) { + // break; + // } } + // for (const postData of posts) { + // let post = renderPost(postData); + + // fragment.appendChild(post); + + // count++; + // if (count > 500) { + // break; + // } + // } + if (!contentDiv) { throw new Error("Couldn't get content div!"); } @@ -426,12 +463,15 @@ function renderPost(post: Post) { } let containerDiv = document.createElement("div"); let textDiv = document.createElement("div"); + let timestampDiv = document.createElement("div"); let hr = document.createElement("hr"); - // @ts-ignore + textDiv.innerHTML = marked.parse(post.text); + timestampDiv.innerText = timestampToString(post.post_timestamp); containerDiv.appendChild(hr); containerDiv.appendChild(textDiv); + containerDiv.appendChild(timestampDiv); if (!("image" in post && post.image)) { return containerDiv; @@ -439,6 +479,7 @@ function renderPost(post: Post) { let image = document.createElement("img"); image.src = image.src = "data:image/png;base64," + post.image; + image.className = "postImage"; containerDiv.appendChild(image); return containerDiv;