From a412ed531c7f980cf7db4e752a437ba42e0f2aec Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 19:39:38 -0700
Subject: [PATCH 01/16] bsky stuff now works as intended

---
 JS/expanded.js | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/JS/expanded.js b/JS/expanded.js
index 497f650..d6f1898 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -60,7 +60,7 @@ async function GetPost() {
 		}
 		// Update the post to see if there is new information.
 		post = await MastodonAPI.GetStatus(post.id);
-		// Set the texts.
+		// Set the texts. It's opposite because "setting" causes it to switch.
 		FavoriteFlipper = !(post.favourite);
 		BoostFlipper = !(post.reblogged);
 		SetFavorite();
@@ -81,8 +81,17 @@ async function GetPost() {
 			}
 		}
 		// We don't need to update the post with new information. The repos are seperate.
-		// Set the texts.
-		// TODO!
+		// Set the texts. It's opposite because "setting" causes it to switch.
+		let GetRepo = await BlueskyAPI.GetRecord(localStorage.getItem(Variables.BlueskyDID), "app.bsky.feed.like", post.post.uri.split("/")[post.post.uri.split("/").length - 1]);
+		if (GetRepo.hasOwnProperty("error") && GetRepo.error == "RecordNotFound") {
+			FavoriteFlipper = true;
+		}
+		GetRepo = await BlueskyAPI.GetRecord(localStorage.getItem(Variables.BlueskyDID), "app.bsky.feed.repost", post.post.uri.split("/")[post.post.uri.split("/").length - 1]);
+		if (GetRepo.hasOwnProperty("error") && GetRepo.error == "RecordNotFound") {
+			BoostFlipper = true;
+		}
+		SetFavorite();
+		SetBoost();
 	} else {
 		document.getElementsByClassName("PostText")[0].innerHTML = "Nothing to load.";
 	}
-- 
2.45.3


From 6a6d4f9c3f14c3712833aa231dc476be3bd30832 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 19:43:41 -0700
Subject: [PATCH 02/16] music now refreshes properly

---
 JS/index.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/JS/index.js b/JS/index.js
index f8e93f2..c3acb18 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -71,12 +71,19 @@ Warning.onclick = (event) => {
 	setTimeout(() => {
 		Main.classList.remove("MainFadeInAnimation");
 		Main.classList.add("MainAfter");
-		BackgroundMusic.play();
+		Music();
 	}, 5000);
 	Main = document.getElementsByClassName("MainFadeInAnimation")[0];
 	PosterContainerUpdate();
 }
 
+function Music() {
+	BackgroundMusic.play();
+	setTimeout(() => {
+		Music();
+	}, 180000);
+}
+
 // Clicking the next button
 ArrowsButton[1].onclick = (event) => {
 	if (!ContainerContainer.classList.contains("NextAnimation")) {
-- 
2.45.3


From bd6ad4a0aaa3685c678e4665a9d195f7fcae735b Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 16:14:40 -0700
Subject: [PATCH 03/16] fix a bug where the innerHTML did not reset on reload.

---
 JS/index.js | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/JS/index.js b/JS/index.js
index c3acb18..ff7a529 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -188,7 +188,9 @@ async function PosterContainerUpdate(Direction) {
 		switch(countergroup) {
 			// Mastodon
 			case 0:
+				// Begin by having the website we are using get pushed to the expanded view array and clean out the HTML.
 				WebsiteAPIType.push("Mastodon");
+				i.getElementsByClassName("PostContent")[0].innerHTML = "";
 				if (MastodonLoadedFeed[CurrentThing + counter] == undefined) {
 					let TempFeed = await MastodonAPI.GetTimeline(MastodonLoadedFeed[CurrentThing + counter - 1].id);
 					MastodonLoadedFeed = MastodonLoadedFeed.concat(TempFeed);
@@ -214,7 +216,9 @@ async function PosterContainerUpdate(Direction) {
 				break;
 			// Bsky
 			case 1:
+				// Begin by having the website we are using get pushed to the expanded view array and clean out the HTML.
 				WebsiteAPIType.push("Bluesky");
+				i.getElementsByClassName("PostContent")[0].innerHTML = "";
 				if (BlueskyLoadedFeed[CurrentThing + counter] == undefined) {
 					let TempFeed = await BlueskyAPI.GetTimeline(BlueskyLoadedFeed[CurrentThing + counter - 1].post.indexedAt).then((response) => response.feed)
 					BlueskyLoadedFeed = BlueskyLoadedFeed.concat(TempFeed);
-- 
2.45.3


From f838a1c18e273bfd75ac117f1ebe8b25de5bf4ef Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 20:02:04 -0700
Subject: [PATCH 04/16] images now work for mastodon boosts

---
 JS/expanded.js | 15 ++++++++++-----
 JS/index.js    | 12 +++++++++---
 2 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/JS/expanded.js b/JS/expanded.js
index d6f1898..3aa028e 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -48,14 +48,19 @@ async function GetPost() {
 		if (post.reblog != null) {
 			document.getElementsByClassName("PostText")[0].innerHTML = post.reblog.content;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.reblog.account.username + " ( R: " + post.account.username + " )";
+			if (post.reblog.media_attachments.length != 0) {
+				for (let i of post.reblog.media_attachments) {
+					document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + i.remote_url + " alt='" + i.description + "'/>";
+				}
+			}
 		} else {
 			document.getElementsByClassName("PostText")[0].innerHTML = post.content;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.account.username;
-		}
-		// Show the image if it exists.
-		if (post.media_attachments.length != 0) {
-			for (let i of post.media_attachments) {
-				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + i.remote_url + " alt='" + i.description + "'/>";
+			// Show the image if it exists.
+			if (post.media_attachments.length != 0) {
+				for (let i of post.media_attachments) {
+					document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + i.remote_url + " alt='" + i.description + "'/>";
+				}
 			}
 		}
 		// Update the post to see if there is new information.
diff --git a/JS/index.js b/JS/index.js
index ff7a529..a317e0a 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -195,9 +195,15 @@ async function PosterContainerUpdate(Direction) {
 					let TempFeed = await MastodonAPI.GetTimeline(MastodonLoadedFeed[CurrentThing + counter - 1].id);
 					MastodonLoadedFeed = MastodonLoadedFeed.concat(TempFeed);
 				}
-				// Check for images.
-				if (MastodonLoadedFeed[CurrentThing + counter].media_attachments.length != 0) {
-					i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+				// Check for images. Reblog roundabout fix included.
+				if (MastodonLoadedFeed[CurrentThing + counter].reblog != null) {
+					if (MastodonLoadedFeed[CurrentThing + counter].reblog.media_attachments.length != 0) {
+						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+					}
+				} else {
+					if (MastodonLoadedFeed[CurrentThing + counter].media_attachments.length != 0) {
+						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+					}
 				}
 				// Content warning. Don't show the content unless clicked!!!
 				if (MastodonLoadedFeed[CurrentThing + counter].spoiler_text != "") {
-- 
2.45.3


From fd96902e77e72692e1dc0cf141a27c1ee4338298 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 22:15:14 -0700
Subject: [PATCH 05/16] Fixed image bugs, Mastodon video

---
 JS/expanded.js | 21 +++++++++++++++++++--
 JS/index.js    | 12 ++++++++++--
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/JS/expanded.js b/JS/expanded.js
index 3aa028e..8f7b69c 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -50,7 +50,7 @@ async function GetPost() {
 			document.getElementsByClassName("Handle")[0].innerHTML = post.reblog.account.username + " ( R: " + post.account.username + " )";
 			if (post.reblog.media_attachments.length != 0) {
 				for (let i of post.reblog.media_attachments) {
-					document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + i.remote_url + " alt='" + i.description + "'/>";
+					CreateMedia(i);
 				}
 			}
 		} else {
@@ -59,7 +59,7 @@ async function GetPost() {
 			// Show the image if it exists.
 			if (post.media_attachments.length != 0) {
 				for (let i of post.media_attachments) {
-					document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + i.remote_url + " alt='" + i.description + "'/>";
+					CreateMedia(i);
 				}
 			}
 		}
@@ -102,6 +102,23 @@ async function GetPost() {
 	}
 }
 
+function CreateMedia(Media) {
+	// Check to see if the image is on the same server.
+	if (Media.type == "image") {
+		if (Media.remote_url == null) {
+			document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + Media.url + " alt='" + Media.description + "'/>";
+		} else {
+			document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + Media.remote_url + " alt='" + Media.description + "'/>";
+		}
+	} else if (Media.type == "video") {
+		if (Media.remote_url == null) {
+			document.getElementsByClassName("Images")[0].innerHTML += "<video controls src=" + Media.url + " alt='" + Media.description + "'></video>";
+		} else {
+			document.getElementsByClassName("Images")[0].innerHTML += "<video controls src=" + Media.remote_url + " alt='" + Media.description + "'></video>";
+		}
+	}
+}
+
 function SetFavorite() {
 	FavoriteFlipper = !(FavoriteFlipper);
 	if (FavoriteFlipper == false) {
diff --git a/JS/index.js b/JS/index.js
index a317e0a..e8e962d 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -198,11 +198,19 @@ async function PosterContainerUpdate(Direction) {
 				// Check for images. Reblog roundabout fix included.
 				if (MastodonLoadedFeed[CurrentThing + counter].reblog != null) {
 					if (MastodonLoadedFeed[CurrentThing + counter].reblog.media_attachments.length != 0) {
-						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+						if (MastodonLoadedFeed[CurrentThing + counter].reblog.media_attachments[0].type == "image") {
+							i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+						} else if (MastodonLoadedFeed[CurrentThing + counter].reblog.media_attachments[0].type == "video") {
+							i.getElementsByClassName("PostContent")[0].innerHTML += "This post has a video!<br/>";
+						}
 					}
 				} else {
 					if (MastodonLoadedFeed[CurrentThing + counter].media_attachments.length != 0) {
-						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+						if (MastodonLoadedFeed[CurrentThing + counter].media_attachments[0].type == "image") {
+							i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+						} else if (MastodonLoadedFeed[CurrentThing + counter].media_attachments[0].type == "video") {
+							i.getElementsByClassName("PostContent")[0].innerHTML += "This post has a video!<br/>";
+						}
 					}
 				}
 				// Content warning. Don't show the content unless clicked!!!
-- 
2.45.3


From d87faaf38e7fdc08fc8bca942dcf96c7f960dda8 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Sun, 11 May 2025 22:24:14 -0700
Subject: [PATCH 06/16] css beginnings

---
 CSS/expanded.css | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/CSS/expanded.css b/CSS/expanded.css
index 8715043..0889f7a 100644
--- a/CSS/expanded.css
+++ b/CSS/expanded.css
@@ -1,5 +1,5 @@
 /* HTML items */
-img {
+img, video {
 	border-style: solid;
 	border-radius: 1%; 
 	
@@ -8,20 +8,20 @@ img {
 
 /* Classes */
 .Handle {
-	
+	background-color: white;
 }
 
 .Origin {
-	
+	background-color: grey;
 }
 
 .PostText {
-	
+	background-color: #00ECE8;
 }
 
 .Images {
 	display: flex;
 	justify-content: center;
 	flex-wrap: wrap;
-	
+	background-color: #050505;
 }
-- 
2.45.3


From d82ca66d1288604aea24e5d52fa2f4cb8d3ef906 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Mon, 12 May 2025 18:40:09 -0700
Subject: [PATCH 07/16] Beutification successful. That's all I will be doing
 for now.

---
 CSS/expanded.css          |  17 +++++++++-
 CSS/index.css             |  67 +++++++++++++++++++++++++-------------
 CSS/mail.css              |  42 ++++++++++++++++++++++++
 CSS/post.css              |  28 ++++++++++++++++
 CSS/setting.css           |  47 ++++++++++++++++++++++++++
 HTML/expanded.html        |   6 ++--
 HTML/mail.html            |  14 +++++---
 HTML/post.html            |  26 ++++++++-------
 HTML/setting.html         |  31 +++++++++++++-----
 Icons/IndexBackground.png | Bin 0 -> 180 bytes
 JS/setting.js             |   4 +--
 index.html                |   9 +++--
 12 files changed, 235 insertions(+), 56 deletions(-)
 create mode 100644 Icons/IndexBackground.png

diff --git a/CSS/expanded.css b/CSS/expanded.css
index 0889f7a..a4a9d07 100644
--- a/CSS/expanded.css
+++ b/CSS/expanded.css
@@ -6,6 +6,11 @@ img, video {
 	width: 45%;
 }
 
+html {
+	overflow-x: hidden;
+	overflow-y: hidden;
+}
+
 /* Classes */
 .Handle {
 	background-color: white;
@@ -16,7 +21,7 @@ img, video {
 }
 
 .PostText {
-	background-color: #00ECE8;
+	background-color: #00FFFF;
 }
 
 .Images {
@@ -25,3 +30,13 @@ img, video {
 	flex-wrap: wrap;
 	background-color: #050505;
 }
+
+.Button {
+	margin-top: 30px;
+	
+	border-style: solid;
+	border-width: 1px;
+	
+	width: 100px;
+	height: 100px;
+}
diff --git a/CSS/index.css b/CSS/index.css
index 231b039..1207c5b 100644
--- a/CSS/index.css
+++ b/CSS/index.css
@@ -111,18 +111,17 @@ html {
 }
 
 /* Classes for the main page */
-.MainBefore {
+.MainBefore, .MainAfter {
 	position: absolute;
 	top: 0px;
 	left: 0px;
 	
-	visibility: collapse;
+	background-image: url("../Icons/IndexBackground.png");
 }
 
-.MainAfter {
-	position: absolute;
-	top: 0px;
-	left: 0px;
+/* Animation things to get it working smoothly */
+.MainBefore {
+	visibility: collapse;
 }
 
 .MainFadeInAnimation {
@@ -161,6 +160,7 @@ html {
 	height: 5vh;
 }
 
+/* Stuff that goes into the posts. */
 .Arrow {
 	position: absolute;
 	top: 35vh;
@@ -182,11 +182,21 @@ html {
 .Post {
 	overflow: hidden;
 	
+	margin-top: 1%;
+	margin-bottom: 1%;
+	margin-left: 1%;
+	margin-right: 1%;
+	
 	border-style: solid;
 	border-width: 2px;
+	border-top-left-radius: 2% 50%;
+	border-top-right-radius: 2% 50%;
+	border-bottom-left-radius: 2% 50%;
+	border-bottom-right-radius: 2% 50%;
 	
-	width: 24%;
-	height: 25%;
+	background-color: #FFFFFF;
+	width: 22%;
+	height: 23%;
 }
 
 .Post:hover {
@@ -196,35 +206,46 @@ html {
 .Username {
 	text-align: center;
 	font-weight: bold;
+	font-size: 2ch;
+	
+	margin-top: -5px;
 }
 
 .PostContent {
-	font-size: 1ch;
+	font-size: 0.9ch;
 }
 
-.Setting {
-	border-style: solid;
-	border-width: 1px;
-}
-
-.Mail {
-	border-style: solid;
-	border-width: 1px;
-}
-
-.Posting {
+/* Footer things */
+.Setting, .Posting, .Mail {
+	margin-top: 30px;
+	
 	border-style: solid;
 	border-width: 1px;
 	
+	width: 100px;
+	height: 100px;
+}
+
+.Time {
+	font-size: 4ch;
+}
+
+.Posting {	
 	margin-right: 5%;
 }
 
 .MainFooter {
 	display: flex;
-	margin-top: 75vh;
-	
 	text-align: center;
 	justify-content: center;
 	
-	height: 15vh;
+	background: linear-gradient(#dcdcdc, #b4b4b4);
+	
+	margin-top: 75vh;
+	
+	border-top-style: solid;
+	border-width: 2px;
+	border-color: #00FFFF;
+	
+	height: 20vh;
 }
diff --git a/CSS/mail.css b/CSS/mail.css
index e18b85f..f1a1769 100644
--- a/CSS/mail.css
+++ b/CSS/mail.css
@@ -1,3 +1,36 @@
+/* Combination */
+header, footer {
+	style="position: relative;
+	z-index: 1;
+}
+
+/* Singletons */
+html {
+	background: linear-gradient(#b4b4b4, #dcdcdc, #b4b4b4);
+	overflow-x: hidden;
+	overflow-y: hidden;
+}
+
+header {
+	height: 5vh;
+}
+
+section {
+	position: absolute;
+	width: 100%;
+	height: 80vh;
+}
+
+.Button {
+	margin-top: 30px;
+	
+	border-style: solid;
+	border-width: 1px;
+	
+	width: 100px;
+	height: 100px;
+}
+
 .Favorite {
 	border-style: solid;
 	border-width: 2px;
@@ -42,3 +75,12 @@
 .Notification:hover {
 	overflow: visible;
 }
+
+footer {
+	display: flex;
+	justify-content: center;
+	
+	margin-top: -10vh;
+	
+	height: 20vh;
+}
diff --git a/CSS/post.css b/CSS/post.css
index 8b13789..8d19465 100644
--- a/CSS/post.css
+++ b/CSS/post.css
@@ -1 +1,29 @@
+html {
+	overflow-x: hidden;
+	overflow-y: hidden;
+}
 
+header {
+	height: 5vh;
+}
+
+section {
+	height: 75vh;
+}
+
+.SmallButton {
+	margin-top: 30px;
+	
+	border-style: solid;
+	border-width: 1px;
+	
+	width: 100px;
+	height: 100px;
+}
+
+footer {
+	display: flex;
+	justify-content: center;
+	
+	height: 5vh;
+}
diff --git a/CSS/setting.css b/CSS/setting.css
index e69de29..a86bd3d 100644
--- a/CSS/setting.css
+++ b/CSS/setting.css
@@ -0,0 +1,47 @@
+html {
+	background-color: black;
+	color: white;
+	overflow-x: hidden;
+	overflow-y: hidden;
+}
+
+header {
+	border-bottom-style: solid;
+	
+	height: 5vh;
+}
+
+.Hidden {
+	visibility: hidden;
+	display: none;
+}
+
+.Button {	
+	border-style: solid;
+	border-width: 6px;
+	border-color: #00FFFF;
+	
+	padding: 25vh 8vw;
+	
+	background: linear-gradient(#dcdcdc, #b4b4b4);
+	color: black;
+}
+
+.SmallButton {
+	margin-top: 30px;
+	
+	border-style: solid;
+	border-width: 1px;
+	
+	width: 100px;
+	height: 100px;
+}
+
+footer {
+	display: flex;
+	justify-content: center;
+	
+	border-top-style: solid;
+	
+	height: 10vh;
+}
diff --git a/HTML/expanded.html b/HTML/expanded.html
index 76ce64e..c295f75 100644
--- a/HTML/expanded.html
+++ b/HTML/expanded.html
@@ -19,11 +19,13 @@
 		<p class="PostText"></p>
 		<div class="Images">
 		</div>
-		<div>
+		<div "display: flex;">
 			<p class="Favorite">Favorite!</p>
 			<p class="Boost">Boost!</p>
 			<p class="Reply">Reply!</p>
 		</div>
-		<p onclick="history.back()"><b>Back</b></p>
+		<footer>
+			<p class="Button" onclick="history.back()"><b>Back</b></p>
+		</footer>
 	</body>
 </html>
diff --git a/HTML/mail.html b/HTML/mail.html
index d9417a7..37ce1fe 100644
--- a/HTML/mail.html
+++ b/HTML/mail.html
@@ -12,12 +12,16 @@
 	</head>
 
 	<body style="margin: 0px; text-align: center;">
-		<section style="position: absolute; width: 100%; height: 100%" class="Favorites"></section>
-		<section style="position: absolute; width: 100%; height: 100%" class="Bookmarks"></section>
-		<section style="position: absolute; width: 100%; height: 100%" class="Notifications"></section>
-		<header style="position: relative; z-index: 1;">
+		<header>
 			<h1>Mail</h1>
-			<p onclick="history.back();"><b>Back</b></p>
 		</header>
+		<div style="height: 85vh;">
+			<section class="Favorites"></section>
+			<section class="Bookmarks"></section>
+			<section class="Notifications"></section>
+		</div>
+		<footer>
+			<p class="Button" onclick="history.back();"><b>Back</b></p>
+		</footer>
 	</body>
 </html>
diff --git a/HTML/post.html b/HTML/post.html
index 612c6e9..55733ca 100644
--- a/HTML/post.html
+++ b/HTML/post.html
@@ -15,16 +15,20 @@
 		<header>
 			<h1>Post</h1>
 		</header>
-		<textarea cols="50" rows="25" class="Text" placeholder="status here..."></textarea>
-		<div>
-			<select class="PostVisibility">
-				<option value="Public">Public Post</option>
-				<option value="Quiet">Quiet Public Post</option>
-				<option value="Friend">Friends Only Post</option>
-				<option value="Private">Private Post</option>
-			</select>
-		</div>
-		<p class="Button">POST!</p>
-		<p onclick="history.back();"><b>Back</b></p>
+		<section>
+			<textarea cols="50" rows="25" class="Text" placeholder="status here..."></textarea>
+			<div>
+				<select class="PostVisibility">
+					<option value="Public">Public Post</option>
+					<option value="Quiet">Quiet Public Post</option>
+					<option value="Friend">Friends Only Post</option>
+					<option value="Private">Private Post</option>
+				</select>
+			</div>
+			<p class="Button">POST!</p>
+		</section>
+		<footer>
+			<p class="SmallButton" onclick="history.back();"><b>Back</b></p>
+		</footer>
 	</body>
 </html>
diff --git a/HTML/setting.html b/HTML/setting.html
index 51f38ed..d085474 100644
--- a/HTML/setting.html
+++ b/HTML/setting.html
@@ -15,14 +15,27 @@
 		<header>
 			<h1>Setting</h1>
 		</header>
-		<p class="Local">Toggle Local</p>
-		<p class="Remote">Toggle Remote</p>
-		<p class="Login Mastodon"><em>Login to Mastodon</em></p>
-		<input type="text" class="WebInput Mastodon" placeholder="Website (mastodon.social)"/>
-		<p class="Logout Mastodon" style="visibility: hidden;"><em>Logout of Mastodon</em></p>
-		<p class="Login Bluesky"><em>Login to Bluesky</em></p>
-		<input type="text" class="WebInput Bluesky" placeholder="Website (bsky.social)" />
-		<p class="Logout Bluesky" style="visibility: hidden;"><em>Logout of Bluesky</em></p>
-		<p onclick="window.location.href = window.location.origin"><b>Back</b></p>
+		<div style="display: flex; justify-content: center; height: 75vh;">
+			<div class="Button" style="margin: auto;">
+				<p class="Local">Toggle Local</p>
+				<p class="Remote">Toggle Remote</p>
+			</div>
+			<div class="Button" style="display: flex; justify-content: center; margin: auto;">
+				<!-- Sorry people! -->
+				<div>
+					<input type="text" class="WebInput Mastodon" placeholder="Website (mastodon.social)"/>
+					<p class="Login Mastodon"><em>Login to Mastodon</em></p>
+					<p class="Logout Mastodon Hidden"><em>Logout of Mastodon</em></p>
+				</div>
+				<div>
+					<input type="text" class="WebInput Bluesky" placeholder="Website (bsky.social)"/>
+					<p class="Login Bluesky"><em>Login to Bluesky</em></p>
+					<p class="Logout Bluesky Hidden"><em>Logout of Bluesky</em></p>
+				</div>
+			</div>
+		</div>
+		<footer>
+			<p class="SmallButton" onclick="window.location.href = window.location.origin"><b>Back</b></p>
+		</footer>
 	</body>
 </html>
diff --git a/Icons/IndexBackground.png b/Icons/IndexBackground.png
new file mode 100644
index 0000000000000000000000000000000000000000..94981bfca28559b01a8445ee6ddc9467be905e44
GIT binary patch
literal 180
zcmeAS@N?(olHy`uVBq!ia0vp^93afW1|*O0@9PFqjKx9jPK-BC>eK@{Ea{HEjtmSN
z`?>!lvI6-E$sR$z3=CCj3=9n|3=F@3LJcn%7)lKo7+xhXFj&oCU=S~uvn$XBD8X6a
z5n0T@pr;JNj1^1m%YcHio-U3d5|@+r6hA*#&t}um*~qY<nd#X7|Nk%Fn8;wD#6GWl
S=Yn%Ug$$mqelF{r5}E)dATXc+

literal 0
HcmV?d00001

diff --git a/JS/setting.js b/JS/setting.js
index 779975d..39efa0c 100644
--- a/JS/setting.js
+++ b/JS/setting.js
@@ -85,7 +85,7 @@ async function CheckLogin() {
 		// Swap the buttons
 		MastodonLoginButton.remove();
 		MastodonWebInput.remove();
-		MastodonLogoutButton.setAttribute("style", "");
+		MastodonLogoutButton.classList.remove("Hidden");
 	} else {
 		// Auto log in
 		await MastodonAPI.GainToken(Variables.MastodonWebsite);
@@ -95,7 +95,7 @@ async function CheckLogin() {
 		// Swap the buttons
 		BlueskyLoginButton.remove();
 		BlueskyWebInput.remove();
-		BlueskyLogoutButton.setAttribute("style", "");
+		BlueskyLogoutButton.classList.remove("Hidden");
 	} else {
 		// Auto log in
 		await BlueskyAPI.GainTokens();
diff --git a/index.html b/index.html
index 8ca936d..f716ede 100644
--- a/index.html
+++ b/index.html
@@ -18,9 +18,12 @@
 		<section class="WarningMessage">
 			<h2>Warning! Care for yourself!</h2>
 			<p>
-				The world might seem like an uncaring place. At a glance, that might seem true. However, that doesn't mean nobody cares. The average person has enough affection to share with you, so please share it back. <br>
-				You are also cute :3 <br>
-				<em>Safety options are available here: https://CrowdedGames.Group</em>
+				The world might seem like an uncaring place. At a glance, that might seem true looking at social media.<br><br>
+				However, that doesn't mean nobody cares. The average person has enough affection to share with you. You just need to ask. Trust us.<br><br>
+				There are mean people on the internet. Pay no attention to them and block them. They don't matter. You do.<br><br>
+				One more thing... There are people who might also be down. Please spread around the affection. It's for the best.<br><br>
+				You are also cute :3<br><br>
+				<em>Safety options are available here: https://CrowdedGames.Group</em><br><br>
 				<noscript>Look. Javascript is required to run this. I'm sorry, there isn't anything I can do about it.</noscript>
 			</p>
 			<p class="BlinkAnimation"><b>Click on this webpage to continue</b></p>
-- 
2.45.3


From a1b27d7549d5d2b3c53533a0f7dc429f339466bb Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Mon, 12 May 2025 19:01:50 -0700
Subject: [PATCH 08/16] videos now work on Bsky

---
 JS/expanded.js | 10 +++++++---
 JS/index.js    |  8 ++++++--
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/JS/expanded.js b/JS/expanded.js
index 8f7b69c..7354656 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -80,9 +80,13 @@ async function GetPost() {
 			document.getElementsByClassName("Handle")[0].innerHTML = post.post.author.handle;
 		}
 		// Show the image if it exists.
-		if (post.post.record.hasOwnProperty("embed") && post.post.record.embed.$type == "app.bsky.embed.images") {
-			for (let i of post.post.embed.images) {
-				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + i.fullsize + " alt='" + i.alt + "'/>";
+		if (post.post.record.hasOwnProperty("embed")) {
+			if (post.post.record.embed.$type == "app.bsky.embed.images") {
+				for (let i of post.post.embed.images) {
+					document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + i.fullsize + " alt='" + i.alt + "'/>";
+				}
+			} else if (post.post.record.embed.$type == "app.bsky.embed.video") {
+				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + i.fullsize + " alt='" + i.alt + "'></video>";
 			}
 		}
 		// We don't need to update the post with new information. The repos are seperate.
diff --git a/JS/index.js b/JS/index.js
index e8e962d..21b84a6 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -241,8 +241,12 @@ async function PosterContainerUpdate(Direction) {
 				BlueskyLoadedFeed = CheckForDups(BlueskyLoadedFeed, BlueskyPostsDup, counter);
 				BlueskyPostsDup.push(BlueskyLoadedFeed[counter].post.uri);
 				// Check for an image
-				if (BlueskyLoadedFeed[CurrentThing + counter].post.record.hasOwnProperty("embed") && BlueskyLoadedFeed[CurrentThing + counter].post.record.embed.$type == "app.bsky.embed.images") {
-					i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+				if (BlueskyLoadedFeed[CurrentThing + counter].post.record.hasOwnProperty("embed")) {
+					if (BlueskyLoadedFeed[CurrentThing + counter].post.record.embed.$type == "app.bsky.embed.images") {
+						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has an image!<br/>";
+					} else if (BlueskyLoadedFeed[CurrentThing + counter].post.record.embed.$type == "app.bsky.embed.video") {
+						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has a video!<br/>";
+					}
 				}
 				// Labels
 				if (BlueskyLoadedFeed[CurrentThing + counter].post.labels.length != 0) {
-- 
2.45.3


From 3d3cb1f69d3ed14d626d4ac84936e924c80e52b4 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Tue, 13 May 2025 15:23:43 -0700
Subject: [PATCH 09/16] small bug fix?

---
 JS/BlueskyAPI.js | 1 -
 JS/expanded.js   | 3 ++-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/JS/BlueskyAPI.js b/JS/BlueskyAPI.js
index 2d18b84..7879277 100644
--- a/JS/BlueskyAPI.js
+++ b/JS/BlueskyAPI.js
@@ -47,7 +47,6 @@ export async function GetPosts(URIs) {
 
 // Get a blob (like an image or video). Authentication need not apply.
 export async function GetBlob(DID, CID) {
-	let PDS = localStorage.getItem(Variables.BlueskyPDS);
 	let request = fetch("https://bsky.social/xrpc/com.atproto.sync.getBlob?did=" + DID + "&cid=" + CID, {method: "GET"});
 	let body = await request.then((response) => response.json());
 	return body;
diff --git a/JS/expanded.js b/JS/expanded.js
index 7354656..7b30090 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -86,7 +86,8 @@ async function GetPost() {
 					document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + i.fullsize + " alt='" + i.alt + "'/>";
 				}
 			} else if (post.post.record.embed.$type == "app.bsky.embed.video") {
-				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + i.fullsize + " alt='" + i.alt + "'></video>";
+				let i = post.post.embed.playlist;
+				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + i + "></video>";
 			}
 		}
 		// We don't need to update the post with new information. The repos are seperate.
-- 
2.45.3


From ee5f7c21cb8b777485ba910932294e257a311710 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Wed, 14 May 2025 08:58:32 -0700
Subject: [PATCH 10/16] arg!

---
 CSS/expanded.css | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/CSS/expanded.css b/CSS/expanded.css
index a4a9d07..0795470 100644
--- a/CSS/expanded.css
+++ b/CSS/expanded.css
@@ -6,11 +6,6 @@ img, video {
 	width: 45%;
 }
 
-html {
-	overflow-x: hidden;
-	overflow-y: hidden;
-}
-
 /* Classes */
 .Handle {
 	background-color: white;
-- 
2.45.3


From 6e8ca0b4d864e46b771dc64d68983604c6a62e5c Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Tue, 20 May 2025 16:59:24 -0700
Subject: [PATCH 11/16] posting to Youtube

---
 HTML/post.html    |  2 ++
 HTML/setting.html |  6 ++++++
 JS/Variables.js   |  5 ++++-
 JS/YoutubeAPI.js  | 20 ++++++++++++++++++++
 JS/post.js        | 15 +++++++++++++--
 JS/setting.js     | 34 +++++++++++++++++++++++++++++++++-
 README.md         |  1 +
 7 files changed, 79 insertions(+), 4 deletions(-)
 create mode 100644 JS/YoutubeAPI.js

diff --git a/HTML/post.html b/HTML/post.html
index 55733ca..15dc869 100644
--- a/HTML/post.html
+++ b/HTML/post.html
@@ -24,6 +24,8 @@
 					<option value="Friend">Friends Only Post</option>
 					<option value="Private">Private Post</option>
 				</select>
+				<input type="checkbox" class="PostYoutube" />
+				<label>Post to Youtube</label>
 			</div>
 			<p class="Button">POST!</p>
 		</section>
diff --git a/HTML/setting.html b/HTML/setting.html
index d085474..71c471d 100644
--- a/HTML/setting.html
+++ b/HTML/setting.html
@@ -32,6 +32,12 @@
 					<p class="Login Bluesky"><em>Login to Bluesky</em></p>
 					<p class="Logout Bluesky Hidden"><em>Logout of Bluesky</em></p>
 				</div>
+				<div>
+					<input type="text" class="WebInput Youtube" placeholder="Youtube API Key"/>
+					<input type="text" class="WebInput Youtube" placeholder="Youtube Channel Handle"/>
+					<p class="Login Youtube"><em>Login to Youtube</em></p>
+					<p class="Logout Youtube Hidden"><em>Logout of Youtube</em></p>
+				</div>
 			</div>
 		</div>
 		<footer>
diff --git a/JS/Variables.js b/JS/Variables.js
index 29d0cf6..3b78a21 100644
--- a/JS/Variables.js
+++ b/JS/Variables.js
@@ -19,5 +19,8 @@ export const BlueskyRefreshToken = "bluesky_refresh_token";
 // Tumblr
 export const TumblrWebsiteName = "https://www.tumblr.com";
 
-// WARNING: Research suggests that cookies are very unsecue.
+// Youtube
+export const YoutubeID = "youtube_id";
+
+// WARNING: Research suggests that cookies are very unsecure.
 // Every Fetch request (http or https) sends these cookies. That's bad!
diff --git a/JS/YoutubeAPI.js b/JS/YoutubeAPI.js
new file mode 100644
index 0000000..f6aa224
--- /dev/null
+++ b/JS/YoutubeAPI.js
@@ -0,0 +1,20 @@
+import * as Variables from "./Variables.js";
+
+// Uses the API to get the channel ID.
+// Interesting problem: You have to use either an API key or a Auth2.0.
+// I think only developer asses will be using this, so we'll use API keys.
+export async function GetChannelID(APIKey, Channel) {
+	if (Channel == "" || APIKey == "") {
+		console.error("Forgot a variable.");
+		return;
+	}
+	if (Channel.slice(0, 1) != "@") {
+		// Apply the correct Handle
+		Channel = "@" + Channel;
+	}
+	// Get the channel ID
+	var webbiesite = "https://www.googleapis.com/youtube/v3/channels";
+	var response = await fetch(webbiesite + "?part=id&forHandle=" + Channel + "&key=" + APIKey, {method: "GET"})
+		.then((response) => response.json());
+	localStorage.setItem(Variables.YoutubeID, response.items[0].id);
+}
diff --git a/JS/post.js b/JS/post.js
index 0d9771f..6d19e07 100644
--- a/JS/post.js
+++ b/JS/post.js
@@ -7,6 +7,7 @@ import * as Variables from "./Variables.js";
 let PostButton = document.getElementsByClassName("Button")[0];
 let VisibilityDropdown = document.getElementsByClassName("PostVisibility")[0];
 let InputArea = document.getElementsByClassName("Text")[0];
+let YoutubePoser = document.getElementsByClassName("PostYoutube")[0];
 
 // Clicking the beeg POST button.
 PostButton.onclick = (event) => {
@@ -27,7 +28,6 @@ async function Post() {
 	if (Text == "") {
 		return;
 	}
-	InputArea.value = "";
 	// Mastodon posting.
 	if (localStorage.getItem(Variables.MastodonAccessToken) != null) {
 		let TempVisible;
@@ -84,9 +84,20 @@ async function Post() {
 			await BlueskyAPI.SetThreadGate(localStorage.getItem(Variables.BlueskyDID), Post.uri, TempVisible);
 		}
 	}
+	// Youtube posting.
+	if (YoutubePoser.checked == true) {
+		navigator.clipboard.writeText(Text);
+		window.open("https://www.youtube.com/channel/" + localStorage.getItem(Variables.YoutubeID) + "/posts");
+	}
+	// The input being cleared means that the posting happened.
+	InputArea.value = "";
 }
 
 // Check if you can interact with the textbox
-if (localStorage.getItem(Variables.MastodonAccessToken) == null && localStorage.getItem(Variables.BlueskyAccessToken) == null) {
+if (localStorage.getItem(Variables.MastodonAccessToken) == null && localStorage.getItem(Variables.BlueskyAccessToken) == null && localStorage.getItem(Variables.YoutubeID) == null) {
 	InputArea.disabled = true;
 }
+// Check if you can post on Youtube
+if (localStorage.getItem(Variables.YoutubeID) == null) {
+	YoutubePoser.disabled = true;
+}
diff --git a/JS/setting.js b/JS/setting.js
index 39efa0c..9b98a20 100644
--- a/JS/setting.js
+++ b/JS/setting.js
@@ -1,19 +1,27 @@
 import * as MastodonAPI from "./MastodonAPI.js";
 import * as BlueskyAPI from "./BlueskyAPI.js";
 import * as TumblrAPI from "./TumblrAPI.js";
+import * as YoutubeAPI from "./YoutubeAPI.js";
 import * as Variables from "./Variables.js";
 
 // Settings buttons
 let LocalButton = document.getElementsByClassName("Local")[0];
 let RemoteButton = document.getElementsByClassName("Remote")[0];
 
+// Website Stuff
 let MastodonLoginButton = document.getElementsByClassName("Login Mastodon")[0];
 let MastodonWebInput = document.getElementsByClassName("WebInput Mastodon")[0];
 let MastodonLogoutButton = document.getElementsByClassName("Logout Mastodon")[0];
+
 let BlueskyLoginButton = document.getElementsByClassName("Login Bluesky")[0];
 let BlueskyWebInput = document.getElementsByClassName("WebInput Bluesky")[0];
 let BlueskyLogoutButton = document.getElementsByClassName("Logout Bluesky")[0];
 
+let YoutubeLoginButton = document.getElementsByClassName("Login Youtube")[0];
+let YoutubeAPIInput = document.getElementsByClassName("WebInput Youtube")[0];
+let YoutubeHandleInput = document.getElementsByClassName("WebInput Youtube")[1];
+let YoutubeLogoutButton = document.getElementsByClassName("Logout Youtube")[0];
+
 // original link
 let Origin = location.origin + "/HTML/setting.html"
 
@@ -59,7 +67,7 @@ MastodonLogoutButton.onclick = (event) => {
 // Login
 BlueskyLoginButton.onclick = (event) => {
 	if (BlueskyWebInput.value != "") {
-		let text = BlueskyWebInput.value
+		let text = BlueskyWebInput.value;
 		BlueskyAPI.HandleAuthorization(text);
 	}
 }
@@ -78,6 +86,23 @@ BlueskyLogoutButton.onclick = (event) => {
 	document.location.href = Origin;
 }
 
+// Youtube Buttons
+// Login
+YoutubeLoginButton.onclick = (event) => {
+	if (YoutubeHandleInput.value != "" && YoutubeAPIInput.value != "") {
+		YoutubeAPI.GetChannelID(YoutubeAPIInput.value, YoutubeHandleInput.value);
+		// Clear the stuff
+		YoutubeHandleInput.value = "";
+		YoutubeAPIInput.value = "";
+	}
+}
+
+// Logout
+YoutubeLogoutButton.onclick = (event) => {
+	localStorage.removeItem(Variables.YoutubeID);
+	document.location.href = Origin;
+}
+
 // if an access token is found, login.
 async function CheckLogin() {
 	// Check for a mastodon token.
@@ -100,6 +125,13 @@ async function CheckLogin() {
 		// Auto log in
 		await BlueskyAPI.GainTokens();
 	}
+	// Check for a Youtube ID.
+	if (localStorage.getItem(Variables.YoutubeID) != null) {
+		YoutubeLoginButton.remove();
+		YoutubeAPIInput.remove();
+		YoutubeHandleInput.remove();
+		YoutubeLogoutButton.classList.remove("Hidden");
+	}
 }
 
 // Runs on website start.
diff --git a/README.md b/README.md
index 73d8218..c736e00 100644
--- a/README.md
+++ b/README.md
@@ -15,3 +15,4 @@ Quick launch server without docker: `npx http-server /home/<HomeDirectory>/Docum
 |Question|Answer|
 |--------|-------|
 |Where can I find my PDS?|Create an access token and then examine the payload's `aud`|
+|Where can I get a Youtube Key?|console.cloud.google.com/apis|
-- 
2.45.3


From 69605379c3b7801391049cd0656d1d143e5f5ea7 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Tue, 20 May 2025 17:36:28 -0700
Subject: [PATCH 12/16] Videos and Images now work with the blob system in Bsky
 (mastodon doesn't give the user a blob)

---
 JS/BlueskyAPI.js | 2 +-
 JS/expanded.js   | 8 ++++++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/JS/BlueskyAPI.js b/JS/BlueskyAPI.js
index 7879277..da94bff 100644
--- a/JS/BlueskyAPI.js
+++ b/JS/BlueskyAPI.js
@@ -48,7 +48,7 @@ export async function GetPosts(URIs) {
 // Get a blob (like an image or video). Authentication need not apply.
 export async function GetBlob(DID, CID) {
 	let request = fetch("https://bsky.social/xrpc/com.atproto.sync.getBlob?did=" + DID + "&cid=" + CID, {method: "GET"});
-	let body = await request.then((response) => response.json());
+	let body = await request.then((response) => response.blob());
 	return body;
 }
 
diff --git a/JS/expanded.js b/JS/expanded.js
index 7b30090..37e8c65 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -83,11 +83,15 @@ async function GetPost() {
 		if (post.post.record.hasOwnProperty("embed")) {
 			if (post.post.record.embed.$type == "app.bsky.embed.images") {
 				for (let i of post.post.embed.images) {
-					document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + i.fullsize + " alt='" + i.alt + "'/>";
+					var Blobby = await BlueskyAPI.GetBlob(post.post.author.did, post.post.record.embed.images[0].image.ref.$link);
+					var ObjectURL = URL.createObjectURL(Blobby)
+					document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + ObjectURL + " alt='" + i.alt + "'/>";
 				}
 			} else if (post.post.record.embed.$type == "app.bsky.embed.video") {
 				let i = post.post.embed.playlist;
-				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + i + "></video>";
+				var Blobby = await BlueskyAPI.GetBlob(post.post.author.did, post.post.record.embed.video.ref.$link);
+				var ObjectURL = URL.createObjectURL(Blobby)
+				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + ObjectURL + "></video>";
 			}
 		}
 		// We don't need to update the post with new information. The repos are seperate.
-- 
2.45.3


From 4c871c5ce4ca07ad3a2614d774ed0bddcd7b1ccc Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Wed, 21 May 2025 12:50:09 -0700
Subject: [PATCH 13/16] commenting things

---
 HTML/setting.html | 4 ++++
 index.html        | 3 +++
 2 files changed, 7 insertions(+)

diff --git a/HTML/setting.html b/HTML/setting.html
index 71c471d..6a25e31 100644
--- a/HTML/setting.html
+++ b/HTML/setting.html
@@ -22,16 +22,19 @@
 			</div>
 			<div class="Button" style="display: flex; justify-content: center; margin: auto;">
 				<!-- Sorry people! -->
+				<!-- Mastodon things. -->
 				<div>
 					<input type="text" class="WebInput Mastodon" placeholder="Website (mastodon.social)"/>
 					<p class="Login Mastodon"><em>Login to Mastodon</em></p>
 					<p class="Logout Mastodon Hidden"><em>Logout of Mastodon</em></p>
 				</div>
+				<!-- Bluesky things. -->
 				<div>
 					<input type="text" class="WebInput Bluesky" placeholder="Website (bsky.social)"/>
 					<p class="Login Bluesky"><em>Login to Bluesky</em></p>
 					<p class="Logout Bluesky Hidden"><em>Logout of Bluesky</em></p>
 				</div>
+				<!-- Youtube things. -->
 				<div>
 					<input type="text" class="WebInput Youtube" placeholder="Youtube API Key"/>
 					<input type="text" class="WebInput Youtube" placeholder="Youtube Channel Handle"/>
@@ -41,6 +44,7 @@
 			</div>
 		</div>
 		<footer>
+			<!-- This button has a different script compared to others because of authentication measures. -->
 			<p class="SmallButton" onclick="window.location.href = window.location.origin"><b>Back</b></p>
 		</footer>
 	</body>
diff --git a/index.html b/index.html
index f716ede..fa40d56 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,7 @@
 	</head>
 
 	<body style="margin: 0px;">
+		<!-- This gets the user input to make sounds. Also it (hopefully) makes the user more passive. -->
 		<section class="WarningMessage">
 			<h2>Warning! Care for yourself!</h2>
 			<p>
@@ -34,6 +35,7 @@
 				<h1>The World Wide Web</h1>
 			</header>
 			
+			<!-- Container to be inside the container. -->
 			<div style="width: 100%" class="PostContainerContainer">
 			<div style="left: -170vw;" class="PostContainer Back">
 				<article class="Post">
@@ -293,6 +295,7 @@
 			
 			</div>
 			
+			<!-- Arrows to put the stuff going forward and backward (scrolling posts). -->
 			<img class="Arrow" src="Icons/ArrowLeft.png" onclick="Back()"/>
 			<img class="Arrow" src="Icons/ArrowRight.png" onclick="Next()"/>
 			
-- 
2.45.3


From 81ba37fcdf6fd6f3d84a0b1cf789c3dc21211262 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Wed, 21 May 2025 20:34:47 -0700
Subject: [PATCH 14/16] Threads, but something is off

---
 CSS/expanded.css   |  11 +++-
 HTML/expanded.html |  18 ++++--
 JS/expanded.js     | 134 ++++++++++++++++++++++++++++++++++-----------
 3 files changed, 126 insertions(+), 37 deletions(-)

diff --git a/CSS/expanded.css b/CSS/expanded.css
index 0795470..00ad5c8 100644
--- a/CSS/expanded.css
+++ b/CSS/expanded.css
@@ -1,8 +1,10 @@
 /* HTML items */
-img, video {
+.Embed, img, video {
 	border-style: solid;
 	border-radius: 1%; 
 	
+	background-color: yellow;
+	
 	width: 45%;
 }
 
@@ -35,3 +37,10 @@ img, video {
 	width: 100px;
 	height: 100px;
 }
+
+footer {
+	display: flex;
+	justify-content: center;
+	
+	height: 5vh;
+}
diff --git a/HTML/expanded.html b/HTML/expanded.html
index c295f75..391a069 100644
--- a/HTML/expanded.html
+++ b/HTML/expanded.html
@@ -12,13 +12,21 @@
 	</head>
 
 	<body style="margin: 0px; text-align: center;">
+		<!-- Grandparent is a reply post above the reply post above the regular, clicked post. -->
+		<p class="PostText GrandParent"></p>
+		<div class="Images GrandParent"></div>
+		<hr/>
+		<!-- Parent is a reply post above the regular, clicked post. -->
+		<p class="PostText Parent"></p>
+		<div class="Images Parent"></div>
+		<hr/>
+		<!-- The regular, clicked post. -->
 		<header>
-			<h1 class="Handle"></h1>
-			<h2 class="Origin"></h2>
+			<h1 class="Handle Regular"></h1>
+			<h2 class="Origin Regular"></h2>
 		</header>
-		<p class="PostText"></p>
-		<div class="Images">
-		</div>
+		<p class="PostText Regular"></p>
+		<div class="Images Regular"></div>
 		<div "display: flex;">
 			<p class="Favorite">Favorite!</p>
 			<p class="Boost">Boost!</p>
diff --git a/JS/expanded.js b/JS/expanded.js
index 37e8c65..910a430 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -46,53 +46,78 @@ async function GetPost() {
 	if (website == "Mastodon") {
 		// Check for a reblog.
 		if (post.reblog != null) {
-			document.getElementsByClassName("PostText")[0].innerHTML = post.reblog.content;
+			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.reblog.content;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.reblog.account.username + " ( R: " + post.account.username + " )";
 			if (post.reblog.media_attachments.length != 0) {
 				for (let i of post.reblog.media_attachments) {
-					CreateMedia(i);
+					await CreateMedia(i, document.getElementsByClassName("Images Regular")[0]);
 				}
 			}
 		} else {
-			document.getElementsByClassName("PostText")[0].innerHTML = post.content;
+			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.content;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.account.username;
 			// Show the image if it exists.
 			if (post.media_attachments.length != 0) {
 				for (let i of post.media_attachments) {
-					CreateMedia(i);
+					await CreateMedia(i, document.getElementsByClassName("Images Regular")[0]);
 				}
 			}
 		}
-		// Update the post to see if there is new information.
-		post = await MastodonAPI.GetStatus(post.id);
 		// Set the texts. It's opposite because "setting" causes it to switch.
 		FavoriteFlipper = !(post.favourite);
 		BoostFlipper = !(post.reblogged);
 		SetFavorite();
 		SetBoost();
+		// Now time to see if there are any parents
+		if (post.in_reply_to_id != null) {
+			var AnotherPost = await MastodonAPI.GetStatus(post.in_reply_to_id);
+			if (AnotherPost.reblog != null) {
+				document.getElementsByClassName("PostText Parent")[0].innerHTML = AnotherPost.reblog.content;
+				if (AnotherPost.reblog.media_attachments.length != 0) {
+					for (let i of AnotherPost.reblog.media_attachments) {
+						await CreateMedia(i, document.getElementsByClassName("Images Parent")[0]);
+					}
+				}
+			} else {
+				document.getElementsByClassName("PostText Parent")[0].innerHTML = AnotherPost.content;
+				if (AnotherPost.media_attachments.length != 0) {
+					for (let i of AnotherPost.media_attachments) {
+						await CreateMedia(i, document.getElementsByClassName("Images Parent")[0]);
+					}
+				}
+			}
+			// Now time to see if there are any grandparents
+			if (AnotherPost.in_reply_to_id != null) {
+				var AnotherAnotherPost = await MastodonAPI.GetStatus(AnotherPost.in_reply_to_id);
+				if (AnotherAnotherPost.reblog != null) {
+					document.getElementsByClassName("PostText GrandParent")[0].innerHTML = AnotherAnotherPost.reblog.content;
+					if (AnotherAnotherPost.reblog.media_attachments.length != 0) {
+						for (let i of AnotherAnotherPost.reblog.media_attachments) {
+							await CreateMedia(i, document.getElementsByClassName("Images GrandParent")[0]);
+						}
+					}
+				} else {
+					document.getElementsByClassName("PostText GrandParent")[0].innerHTML = AnotherAnotherPost.content;
+					if (AnotherAnotherPost.media_attachments.length != 0) {
+						for (let i of AnotherAnotherPost.media_attachments) {
+							await CreateMedia(i, document.getElementsByClassName("Images GrandParent")[0]);
+						}
+					}
+				}
+			}
+		}
 	} else if (website == "Bluesky") {
 		// Check for a reblog.
 		if (post.hasOwnProperty("reason") && post.reason.$type == "app.bsky.feed.defs#reasonRepost") {
-			document.getElementsByClassName("PostText")[0].innerHTML = post.post.record.text;
+			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.post.record.text;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.post.author.handle + " ( R: " + post.reason.by.handle + " )";
 		} else {
-			document.getElementsByClassName("PostText")[0].innerHTML = post.post.record.text;
+			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.post.record.text;
 			document.getElementsByClassName("Handle")[0].innerHTML = post.post.author.handle;
 		}
 		// Show the image if it exists.
 		if (post.post.record.hasOwnProperty("embed")) {
-			if (post.post.record.embed.$type == "app.bsky.embed.images") {
-				for (let i of post.post.embed.images) {
-					var Blobby = await BlueskyAPI.GetBlob(post.post.author.did, post.post.record.embed.images[0].image.ref.$link);
-					var ObjectURL = URL.createObjectURL(Blobby)
-					document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<img src=" + ObjectURL + " alt='" + i.alt + "'/>";
-				}
-			} else if (post.post.record.embed.$type == "app.bsky.embed.video") {
-				let i = post.post.embed.playlist;
-				var Blobby = await BlueskyAPI.GetBlob(post.post.author.did, post.post.record.embed.video.ref.$link);
-				var ObjectURL = URL.createObjectURL(Blobby)
-				document.getElementsByClassName("Images")[0].innerHTML = document.getElementsByClassName("Images")[0].innerHTML + "<video controls src=" + ObjectURL + "></video>";
-			}
+			await CreateMedia(post.post.record, document.getElementsByClassName("Images Regular")[0], post.post.author.did);
 		}
 		// We don't need to update the post with new information. The repos are seperate.
 		// Set the texts. It's opposite because "setting" causes it to switch.
@@ -106,24 +131,71 @@ async function GetPost() {
 		}
 		SetFavorite();
 		SetBoost();
+		// Now time to see if there are any parents.
+		if (post.hasOwnProperty("reply")) {
+			var AnotherPost = await BlueskyAPI.GetRecord(post.reply.parent.uri.split("/")[2], post.reply.parent.uri.split("/")[3], post.reply.parent.uri.split("/")[4]);
+			console.log(AnotherPost);
+			document.getElementsByClassName("PostText Parent")[0].innerHTML = AnotherPost.value.text;
+			if (AnotherPost.value.hasOwnProperty("embed")) {
+				await CreateMedia(AnotherPost.value, document.getElementsByClassName("Images Parent")[0], post.reply.parent.author.did);
+			}
+			// Now time to see if there are any grandparents.
+			if (AnotherPost.value.hasOwnProperty("reply")) {
+				var AnotherAnotherPost = await BlueskyAPI.GetRecord(AnotherPost.value.reply.parent.uri.split("/")[2], AnotherPost.value.reply.parent.uri.split("/")[3], AnotherPost.value.reply.parent.uri.split("/")[4]);
+				document.getElementsByClassName("PostText GrandParent")[0].innerHTML = AnotherAnotherPost.value.text;
+				if (AnotherAnotherPost.value.hasOwnProperty("embed")) {
+					await CreateMedia(AnotherAnotherPost.value, document.getElementsByClassName("Images GrandParent")[0], post.reply.grandparentAuthor.did);
+				}
+			}
+		}
 	} else {
 		document.getElementsByClassName("PostText")[0].innerHTML = "Nothing to load.";
 	}
 }
 
-function CreateMedia(Media) {
+async function CreateMedia(Media, Element, Author = undefined) {
 	// Check to see if the image is on the same server.
-	if (Media.type == "image") {
-		if (Media.remote_url == null) {
-			document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + Media.url + " alt='" + Media.description + "'/>";
-		} else {
-			document.getElementsByClassName("Images")[0].innerHTML += "<img src=" + Media.remote_url + " alt='" + Media.description + "'/>";
+	if (website == "Mastodon") {
+		if (Media.type == "image") {
+			if (Media.remote_url == null) {
+				Element.innerHTML += "<img src=" + Media.url + " alt='" + Media.description + "'/>";
+			} else {
+				Element.innerHTML += "<img src=" + Media.remote_url + " alt='" + Media.description + "'/>";
+			}
+		} else if (Media.type == "video") {
+			if (Media.remote_url == null) {
+				Element.innerHTML += "<video controls src=" + Media.url + " alt='" + Media.description + "'></video>";
+			} else {
+				Element.innerHTML += "<video controls src=" + Media.remote_url + " alt='" + Media.description + "'></video>";
+			}
 		}
-	} else if (Media.type == "video") {
-		if (Media.remote_url == null) {
-			document.getElementsByClassName("Images")[0].innerHTML += "<video controls src=" + Media.url + " alt='" + Media.description + "'></video>";
-		} else {
-			document.getElementsByClassName("Images")[0].innerHTML += "<video controls src=" + Media.remote_url + " alt='" + Media.description + "'></video>";
+	} else if (website == "Bluesky") {
+		if (Media.embed.$type == "app.bsky.embed.record") {
+			var Texty = await BlueskyAPI.GetPosts([Media.embed.record.uri]);
+			console.log(Texty);
+			Element.innerHTML += "<p class='Embed'>" + Texty.posts[0].record.text + "</p><br/>";
+			if (Texty.posts[0].embed.$type == "app.bsky.embed.images") {
+				for (let i of Texty.posts[0].embed.images) {
+					var Blobby = await BlueskyAPI.GetBlob(Author, i.image.ref.$link);
+					var ObjectURL = URL.createObjectURL(Blobby);
+					Element.innerHTML += "<img src=" + ObjectURL + " alt='" + i.alt + "'/>";
+				}
+			} else if (Media.embed.$type == "app.bsky.embed.video") {
+				var Blobby = await BlueskyAPI.GetBlob(Author, Texty.posts[0].embed.video.ref.$link);
+				var ObjectURL = URL.createObjectURL(Blobby);
+				Element.innerHTML += "<video controls src=" + ObjectURL + "></video>";
+			}
+		// It's not an embed, continue...
+		} else if (Media.embed.$type == "app.bsky.embed.images") {
+			for (let i of Media.embed.images) {
+				var Blobby = await BlueskyAPI.GetBlob(Author, i.image.ref.$link);
+				var ObjectURL = URL.createObjectURL(Blobby);
+				Element.innerHTML += "<img src=" + ObjectURL + " alt='" + i.alt + "'/>";
+			}
+		} else if (Media.embed.$type == "app.bsky.embed.video") {
+			var Blobby = await BlueskyAPI.GetBlob(Author, Media.embed.video.ref.$link);
+			var ObjectURL = URL.createObjectURL(Blobby);
+			Element.innerHTML += "<video controls src=" + ObjectURL + "></video>";
 		}
 	}
 }
-- 
2.45.3


From 5dbc2a2b44357af5dd68f2c965278a1ae6edd4c5 Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Thu, 22 May 2025 15:52:19 -0700
Subject: [PATCH 15/16] Threads and a few bug fixes with links

---
 HTML/expanded.html |  8 ++++++++
 JS/expanded.js     | 38 ++++++++++++++++++++++++++++++--------
 JS/index.js        | 25 +++++++++++++++++++++++--
 3 files changed, 61 insertions(+), 10 deletions(-)

diff --git a/HTML/expanded.html b/HTML/expanded.html
index 391a069..1c5dc91 100644
--- a/HTML/expanded.html
+++ b/HTML/expanded.html
@@ -13,10 +13,18 @@
 
 	<body style="margin: 0px; text-align: center;">
 		<!-- Grandparent is a reply post above the reply post above the regular, clicked post. -->
+		<header>
+			<h1 class="Handle GrandParent"></h1>
+			<h2 class="Origin GrandParent"></h2>
+		</header>
 		<p class="PostText GrandParent"></p>
 		<div class="Images GrandParent"></div>
 		<hr/>
 		<!-- Parent is a reply post above the regular, clicked post. -->
+		<header>
+			<h1 class="Handle Parent"></h1>
+			<h2 class="Origin Parent"></h2>
+		</header>
 		<p class="PostText Parent"></p>
 		<div class="Images Parent"></div>
 		<hr/>
diff --git a/JS/expanded.js b/JS/expanded.js
index 910a430..ab48295 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -15,7 +15,7 @@ let BoostFlipper = false;
 let website = document.location.href.split("website=")[1];
 let post = JSON.parse(localStorage.getItem("post"));
 
-document.getElementsByClassName("Origin")[0].innerHTML = website;
+document.getElementsByClassName("Origin Regular")[0].innerHTML = website;
 GetPost();
 
 // Button stuff
@@ -47,7 +47,7 @@ async function GetPost() {
 		// Check for a reblog.
 		if (post.reblog != null) {
 			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.reblog.content;
-			document.getElementsByClassName("Handle")[0].innerHTML = post.reblog.account.username + " ( R: " + post.account.username + " )";
+			document.getElementsByClassName("Handle Regular")[0].innerHTML = post.reblog.account.username + " ( R: " + post.account.username + " )";
 			if (post.reblog.media_attachments.length != 0) {
 				for (let i of post.reblog.media_attachments) {
 					await CreateMedia(i, document.getElementsByClassName("Images Regular")[0]);
@@ -55,7 +55,7 @@ async function GetPost() {
 			}
 		} else {
 			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.content;
-			document.getElementsByClassName("Handle")[0].innerHTML = post.account.username;
+			document.getElementsByClassName("Handle Regular")[0].innerHTML = post.account.username;
 			// Show the image if it exists.
 			if (post.media_attachments.length != 0) {
 				for (let i of post.media_attachments) {
@@ -71,6 +71,7 @@ async function GetPost() {
 		// Now time to see if there are any parents
 		if (post.in_reply_to_id != null) {
 			var AnotherPost = await MastodonAPI.GetStatus(post.in_reply_to_id);
+			document.getElementsByClassName("Origin Parent")[0].innerHTML = website;
 			if (AnotherPost.reblog != null) {
 				document.getElementsByClassName("PostText Parent")[0].innerHTML = AnotherPost.reblog.content;
 				if (AnotherPost.reblog.media_attachments.length != 0) {
@@ -89,6 +90,7 @@ async function GetPost() {
 			// Now time to see if there are any grandparents
 			if (AnotherPost.in_reply_to_id != null) {
 				var AnotherAnotherPost = await MastodonAPI.GetStatus(AnotherPost.in_reply_to_id);
+				document.getElementsByClassName("Origin GrandParent")[0].innerHTML = website;
 				if (AnotherAnotherPost.reblog != null) {
 					document.getElementsByClassName("PostText GrandParent")[0].innerHTML = AnotherAnotherPost.reblog.content;
 					if (AnotherAnotherPost.reblog.media_attachments.length != 0) {
@@ -109,12 +111,28 @@ async function GetPost() {
 	} else if (website == "Bluesky") {
 		// Check for a reblog.
 		if (post.hasOwnProperty("reason") && post.reason.$type == "app.bsky.feed.defs#reasonRepost") {
-			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.post.record.text;
-			document.getElementsByClassName("Handle")[0].innerHTML = post.post.author.handle + " ( R: " + post.reason.by.handle + " )";
+			document.getElementsByClassName("Handle Regular")[0].innerHTML = post.post.author.handle + " ( R: " + post.reason.by.handle + " )";
 		} else {
-			document.getElementsByClassName("PostText Regular")[0].innerHTML = post.post.record.text;
-			document.getElementsByClassName("Handle")[0].innerHTML = post.post.author.handle;
+			document.getElementsByClassName("Handle Regular")[0].innerHTML = post.post.author.handle;
 		}
+		// Text. This will be modified later.
+		var Text = post.post.record.text;
+		// Check for facets. Facets are things that change what the text does or looks like.
+		if (post.post.record.hasOwnProperty("facets")) {
+			for (let i of post.post.record.facets) {
+				if (i.features[0].$type == "app.bsky.richtext.facet#link") {
+					var EmojiRegex = /\p{Emoji_Modifier_Base}\p{Emoji_Modifier}?|\p{Emoji_Presentation}|\p{Emoji}\uFE0F/gu;
+					var EmojiObjects = Text.match(EmojiRegex);
+					var SubtractNumber = 0;
+					if (EmojiObjects != null) {
+						SubtractNumber = EmojiObjects.length * 2;
+					}
+					Text = Text.substring(0, i.index.byteStart - SubtractNumber) + "<a href='" + i.features[0].uri + "'>" + Text.substring(i.index.byteStart - SubtractNumber, i.index.byteEnd - SubtractNumber) + "</a>" + Text.substring(i.index.byteEnd - SubtractNumber, Text.length - 1);
+				}
+			}
+		}
+		// Place the text.
+		document.getElementsByClassName("PostText Regular")[0].innerHTML = Text;
 		// Show the image if it exists.
 		if (post.post.record.hasOwnProperty("embed")) {
 			await CreateMedia(post.post.record, document.getElementsByClassName("Images Regular")[0], post.post.author.did);
@@ -134,14 +152,18 @@ async function GetPost() {
 		// Now time to see if there are any parents.
 		if (post.hasOwnProperty("reply")) {
 			var AnotherPost = await BlueskyAPI.GetRecord(post.reply.parent.uri.split("/")[2], post.reply.parent.uri.split("/")[3], post.reply.parent.uri.split("/")[4]);
-			console.log(AnotherPost);
+			document.getElementsByClassName("Origin Parent")[0].innerHTML = website;
+			document.getElementsByClassName("Handle Parent")[0].innerHTML = post.reply.parent.author.handle;
 			document.getElementsByClassName("PostText Parent")[0].innerHTML = AnotherPost.value.text;
 			if (AnotherPost.value.hasOwnProperty("embed")) {
 				await CreateMedia(AnotherPost.value, document.getElementsByClassName("Images Parent")[0], post.reply.parent.author.did);
 			}
+			
 			// Now time to see if there are any grandparents.
 			if (AnotherPost.value.hasOwnProperty("reply")) {
 				var AnotherAnotherPost = await BlueskyAPI.GetRecord(AnotherPost.value.reply.parent.uri.split("/")[2], AnotherPost.value.reply.parent.uri.split("/")[3], AnotherPost.value.reply.parent.uri.split("/")[4]);
+				document.getElementsByClassName("Origin GrandParent")[0].innerHTML = website;
+				document.getElementsByClassName("Handle Parent")[0].innerHTML = post.reply.grandparentAuthor.handle;
 				document.getElementsByClassName("PostText GrandParent")[0].innerHTML = AnotherAnotherPost.value.text;
 				if (AnotherAnotherPost.value.hasOwnProperty("embed")) {
 					await CreateMedia(AnotherAnotherPost.value, document.getElementsByClassName("Images GrandParent")[0], post.reply.grandparentAuthor.did);
diff --git a/JS/index.js b/JS/index.js
index 21b84a6..93a595c 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -213,6 +213,10 @@ async function PosterContainerUpdate(Direction) {
 						}
 					}
 				}
+				// Check for a thread.
+				if (MastodonLoadedFeed[CurrentThing + counter].in_reply_to_id != null) {
+					i.getElementsByClassName("PostContent")[0].innerHTML += "This post is a thread!<br/>";
+				}
 				// Content warning. Don't show the content unless clicked!!!
 				if (MastodonLoadedFeed[CurrentThing + counter].spoiler_text != "") {
 					i.getElementsByClassName("PostContent")[0].innerHTML += "<b>WARNING: " + MastodonLoadedFeed[CurrentThing + counter].spoiler_text + "</b>";
@@ -248,6 +252,10 @@ async function PosterContainerUpdate(Direction) {
 						i.getElementsByClassName("PostContent")[0].innerHTML += "This post has a video!<br/>";
 					}
 				}
+				// Check for a thread.
+				if (BlueskyLoadedFeed[CurrentThing + counter].hasOwnProperty("reply")) {
+					i.getElementsByClassName("PostContent")[0].innerHTML += "This post is a thread!<br/>";
+				}
 				// Labels
 				if (BlueskyLoadedFeed[CurrentThing + counter].post.labels.length != 0) {
 					i.getElementsByClassName("PostContent")[0].innerHTML += "<b>LABELS APPLIED: ";
@@ -260,12 +268,25 @@ async function PosterContainerUpdate(Direction) {
 				}
 				// Check for a reblog
 				if (BlueskyLoadedFeed[CurrentThing + counter].hasOwnProperty("reason") && BlueskyLoadedFeed[CurrentThing + counter].reason.$type == "app.bsky.feed.defs#reasonRepost") {
-					i.getElementsByClassName("PostContent")[0].innerHTML += BlueskyLoadedFeed[CurrentThing + counter].post.record.text;
 					i.getElementsByClassName("Username")[0].innerHTML = BlueskyLoadedFeed[CurrentThing + counter].post.author.handle + " ( R: " + BlueskyLoadedFeed[CurrentThing + counter].reason.by.handle + " )";
 				} else {
-					i.getElementsByClassName("PostContent")[0].innerHTML += BlueskyLoadedFeed[CurrentThing + counter].post.record.text;
 					i.getElementsByClassName("Username")[0].innerHTML = BlueskyLoadedFeed[CurrentThing + counter].post.author.handle;
 				}
+				var TempText = BlueskyLoadedFeed[CurrentThing + counter].post.record.text;
+				if (BlueskyLoadedFeed[CurrentThing + counter].post.record.hasOwnProperty("facets")) {
+					for (let i of BlueskyLoadedFeed[CurrentThing + counter].post.record.facets) {
+						if (i.features[0].$type == "app.bsky.richtext.facet#link") {
+							var EmojiRegex = /\p{Emoji_Modifier_Base}\p{Emoji_Modifier}?|\p{Emoji_Presentation}|\p{Emoji}\uFE0F/gu;
+							var EmojiObjects = TempText.match(EmojiRegex);
+							var SubtractNumber = 0;
+							if (EmojiObjects != null) {
+								SubtractNumber = EmojiObjects.length * 2;
+							}
+							TempText = TempText.substring(0, i.index.byteStart - SubtractNumber) + "<a href='" + i.features[0].uri + "'>" + TempText.substring(i.index.byteStart - SubtractNumber, i.index.byteEnd - SubtractNumber) + "</a>" + TempText.substring(i.index.byteEnd - SubtractNumber, TempText.length - 1);
+						}
+					}
+				}
+				i.getElementsByClassName("PostContent")[0].innerHTML += TempText;
 				break;
 			case 2:
 				WebsiteAPIType.push("Nothing");
-- 
2.45.3


From 5eb0527d7000e39c59ace25eccf0f6ba50a290bc Mon Sep 17 00:00:00 2001
From: CatAClock <CatAClock@proton.me>
Date: Thu, 22 May 2025 16:00:22 -0700
Subject: [PATCH 16/16] fixed a linebreak bug

---
 JS/expanded.js | 4 ++++
 JS/index.js    | 1 +
 2 files changed, 5 insertions(+)

diff --git a/JS/expanded.js b/JS/expanded.js
index ab48295..931b266 100644
--- a/JS/expanded.js
+++ b/JS/expanded.js
@@ -117,6 +117,9 @@ async function GetPost() {
 		}
 		// Text. This will be modified later.
 		var Text = post.post.record.text;
+		console.log(Text);
+		var TestText = Text.replace(/\r?\n|\r/g, "");
+		console.log(TestText);
 		// Check for facets. Facets are things that change what the text does or looks like.
 		if (post.post.record.hasOwnProperty("facets")) {
 			for (let i of post.post.record.facets) {
@@ -132,6 +135,7 @@ async function GetPost() {
 			}
 		}
 		// Place the text.
+		Text = Text.replace(/\r?\n|\r/g, "<br/>");
 		document.getElementsByClassName("PostText Regular")[0].innerHTML = Text;
 		// Show the image if it exists.
 		if (post.post.record.hasOwnProperty("embed")) {
diff --git a/JS/index.js b/JS/index.js
index 93a595c..9df50e3 100644
--- a/JS/index.js
+++ b/JS/index.js
@@ -286,6 +286,7 @@ async function PosterContainerUpdate(Direction) {
 						}
 					}
 				}
+				TempText = TempText.replace(/\r?\n|\r/g, "<br/>");
 				i.getElementsByClassName("PostContent")[0].innerHTML += TempText;
 				break;
 			case 2:
-- 
2.45.3