From a10f82c3852d7b769c43f2b8142702487ad16bb7 Mon Sep 17 00:00:00 2001
From: octospacc <octo@tutamail.com>
Date: Tue, 18 Apr 2023 16:12:12 +0200
Subject: [PATCH] Upd

---
 Friendiiverse.html | 130 +++++++++++++++++++++++++++++++++++++++------
 1 file changed, 113 insertions(+), 17 deletions(-)
diff --git a/Friendiiverse.html b/Friendiiverse.html
index b324cbc..2708729 100644
--- a/Friendiiverse.html
+++ b/Friendiiverse.html
@@ -6,35 +6,131 @@
 		<title></title>
 		<style>
 img, video { max-width: 100%; }
-#Target { white-space: break-spaces; }
-.Post { border: 4px solid purple; margin: 12px; }
+#DataView { white-space: break-spaces; }
+.PostView { border: 4px solid purple; margin: 12px; }
 		</style>
+		<script>
+// Credentials hardcoding for now
+var MastodonUrl = 'https://mastodon.uno';
+var FriendicaUrl = 'https://poliverso.org';
+var FriendicaCredentials = 'redacted:redacted';
+
+// Development
+var Debug = true;
+var UseFakeApi = true;
+		</script>
 	</head>
 	<body>
-		<div id=Media></div>
-		<xmp id=Target></xmp>
+		<div id=CoverView>
+			LOGO
+			Loading...
+		</div>
+		<div id=NoscriptView>
+			No Script!
+		</div>
+		<div id=PlazasView></div>
+		<div id=TimelineView></div>
+		<xmp id=DataView></xmp>
 		<script>
-var ApiBase = 'https://poliverso.org/api';
-var Req = new XMLHttpRequest();
-Req.onreadystatechange = function(){
-	if (this.readyState == 4 && this.status != 404) {
-		Target.innerHTML = this.responseText;
-		console.log(JSON.parse(Target.innerHTML));
-		JSON.parse(Target.innerHTML).forEach(function(Item){
+NoscriptView.remove();
+
+var FakeApi = {};
+FakeApi.F = {};
+FakeApi.My = {};
+
+function LogDebug(Data, Status) {
+	if (Debug) {
+		for (var i=0; i<Data.length; i++) {
+			try {
+				Data[i] = JSON.parse(Data[i]);
+			} catch(_){};
+		};
+		console[{l: "log", e: "error"}[Status]](Data);
+	};
+};
+
+function ApiCall(Data) {
+	// Data = {Target: "Friendica", Method: "...", Data: {}, Call: (), CallFine: (), CallFail: ()}
+	var Req = new XMLHttpRequest();
+	Req.onreadystatechange = function(){
+		if (this.readyState == 4) {
+			var Status = String(this.status);
+			if (Data.Call) Data.Call(this);
+			if (Status.startsWith(4) || Status.startsWith(5)) {
+				if (Data.CallFail) Data.CallFail(this);
+				LogDebug([Status, this.responseText], 'e');
+			} else {
+				if (Data.CallFine) Data.CallFine(this);
+				LogDebug([Status, this.responseText], 'l');
+			};
+		};
+	};
+	if (Data.Target == 'Mastodon') {
+		Req.open('GET', `${MastodonUrl}/api/v1/${Data.Method}`, true);
+	};
+	if (Data.Target == 'Friendica') {
+		Req.open('GET', `${FriendicaUrl}/api/${Data.Method}.json`, true);
+		Req.setRequestHeader('Authorization', `Basic ${btoa(FriendicaCredentials)}`);
+	};
+	Req.send();
+};
+
+function MastodonParse(Data, Type) {
+	{
+		Status: function(Data){
+			
+		},
+	}[Type](Data);
+};
+
+/*
+function DisplayMastodonTimeline(Timeline) {
+	ApiCall({Target: "Mastodon", Method: Timeline, CallFine: function(Res){
+		DataView.innerHTML = Res.responseText;
+		JSON.parse(DataView.innerHTML).forEach(function(Item){
+			TimelineView.innerHTML += `<div class=PostView>
+				<a href="${Item.external_url}">${Item.created_at}</a>
+				${Item.friendica_author.url}
+				${Item.friendica_html}
+			</div>`;
+		});
+	}});
+};
+*/
+
+function DisplayFriendicaTimeline(Timeline) {
+	ApiCall({Target: "Friendica", Method: Timeline, CallFine: function(Res){
+		DataView.innerHTML = Res.responseText;
+		JSON.parse(DataView.innerHTML).forEach(function(Item){
 			var Title = Item.friendica_title ? `<h2>${Item.friendica_title}</h2>` : '';
-			Media.innerHTML += `<div class=Post>
+			TimelineView.innerHTML += `<div class=PostView>
 				<a href="${Item.external_url}">${Item.created_at}</a>
 				${Item.friendica_author.url}
 				${Title}
 				${Item.friendica_html}
 			</div>`;
 		});
-	};
+	}});
 };
-Req.open('GET', ApiBase + '/statuses/public_timeline.json', true);
-//Req.open('GET', 'https://poliverso.org/api/search?q=octt', true);
-Req.setRequestHeader('Authorization', `Basic ${btoa('redacted:redacted')}`);
-Req.send();
+
+PlazasView.innerHTML = `
+<div>
+	<h3>Featured</h3>
+	<ul>
+		<li onclick="DisplayFriendicaTimeline('statuses/networkpublic_timeline');">Federation</li>
+		<li onclick="DisplayFriendicaTimeline('statuses/public_timeline');">${FriendicaUrl}</li>
+		<li onclick="DisplayMastodonTimeline('timelines/public');">${MastodonUrl}</li>
+	</ul>
+</div>
+<div>
+	<h3>Categories</h3>
+	<ul>
+		<li>Testing</li>
+		<li>#fediverse</li>
+	</ul>
+</div>
+`;
 		</script>
+		<script src="https://cdn.jsdelivr.net/npm/eruda" onload="eruda.init();" defer async></script>
 	</body>
 </html>
