wip timeline

flabk/src/servek/html.rs

@@ -38,9 +38,25 @@ impl Server {
             )
             .route("/@/:username", routing::get(Self::profile))
             .route("/static/*file", routing::get(Self::static_handler))
+            .route("/!", routing::get(Self::timeline))
             .fallback(routing::get(Self::handler_404))
     }
 
+    fn get_auth(&self, cookies: Cookies) -> Result<Claims, ServerError> {
+        match cookies.get(AUTH_COOKIE_NAME) {
+            Some(cookie) => self
+                .auth
+                .get_claims(cookie.value().to_owned())
+                .map_err(|e| {
+                    if e.expired() {
+                        cookies.remove(Cookie::new(AUTH_COOKIE_NAME, ""));
+                    }
+                    e.into()
+                }),
+            None => Err(ServerError::NotLoggedIn),
+        }
+    }
+
     fn from_cookies(&self, cookies: Cookies) -> Result<WithNav<Option<Claims>>, ServerError> {
         const LOGGED_OUT: Result<WithNav<Option<Claims>>, ServerError> = Ok(WithNav {
             obj: None,
@@ -201,6 +217,18 @@ impl Server {
         ))
     }
 
+    async fn timeline(
+        cookies: Cookies,
+        Extension(srv): Extension<Server>,
+    ) -> Result<impl IntoResponse, ServerError> {
+        let claims = srv.get_auth(cookies)?;
+
+        Ok((
+            StatusCode::OK,
+            response::Html(srv.hb.render("timeline", &())?),
+        ))
+    }
+
     async fn create_user(
         Extension(srv): Extension<Server>,
         Form(body): Form<CreateProfileRequest>,

flabk/src/servek/servek.rs

@@ -43,6 +43,11 @@ impl Server {
             .expect("index");
         hb.register_template_string("err404", include_str!("../../templates/html/404.html"))
             .expect("err404");
+        hb.register_template_string(
+            "timeline",
+            include_str!("../../templates/html/loggedin/timeline.html"),
+        )
+        .expect("timeline");
         hb.register_partial(
             "LoggedOut",
             include_str!("../../templates/html/nav-loggedout.html"),
@@ -79,6 +84,7 @@ impl Server {
 pub(super) enum ServerError {
     Internal(String),
     NotFound,
+    NotLoggedIn,
     BadRequest(String),
 }
 
@@ -126,6 +132,7 @@ impl IntoResponse for ServerError {
             )
                 .into_response(),
             ServerError::BadRequest(err) => (StatusCode::BAD_REQUEST, err).into_response(),
+            ServerError::NotLoggedIn => (StatusCode::UNAUTHORIZED, "unauthorized").into_response(),
         }
     }
 }

flabk/src/svc/auth.rs

@@ -103,8 +103,8 @@ pub enum AuthError {
 }
 
 impl AuthError {
-    pub fn expired(self) -> bool {
+    pub fn expired(&self) -> bool {
-        self == Self::Expired
+        *self == Self::Expired
     }
 }
 

flabk/static/style/main.css

@@ -72,7 +72,7 @@ a {
 	font-weight: bold;
 }
 
-.avatar {
+.profile-avatar {
 	width: 128px;
 	height: 128px;
 	border: 3px solid rebeccapurple;
@@ -152,10 +152,21 @@ nav ul li {
 }
 
 nav>ul>li>a {
-	/* color: #aaa; */
-	/* background-color:#FF0; */
 	display: block;
 	line-height: 2em;
 	padding: 0.5em 0.5em;
 	text-decoration: none;
 }
+
+.avatar {
+	width: 42px;
+	height: 42px;
+}
+
+button {
+	background-color: rgba(102, 51, 153, 0.75);
+	color: rgb(204, 179, 230);
+	border-color: rgba(102, 51, 153, 0.25);
+	border-style: initial;
+	font-size: large;
+}

flabk/static/style/timeline.css

@@ -0,0 +1,69 @@
+#postbox {
+	/* border: 3px solid rebeccapurple; */
+	/* padding: 5px; */
+	margin: 0 0 30px 0;
+	height: fit-content;
+	display: flex;
+	/* text-align: left; */
+}
+
+#timeline {
+	margin: 0;
+	padding: 0;
+}
+
+#timeline li {
+	display: grid;
+	list-style-type: none;
+	width: 85vw;
+}
+
+#post-content {
+	color: rgb(204, 179, 230);
+	background-color: rebeccapurple;
+	border-width: 0px;
+	height: 60px;
+	width: 85vw;
+}
+
+.note {
+	display: flex;
+}
+
+.content {
+	display: inline-flex;
+	flex-direction: column;
+}
+
+div>p {
+	font-size: small;
+	margin-left: 2px;
+	margin-right: 2px;
+}
+
+.display-name {
+	font-weight: bold;
+}
+
+.username {
+	color: rgba(102, 51, 153, 0.5);
+}
+
+.user-info {
+	display: inline-flex;
+	margin-top: 0px;
+}
+
+#timeline-box {
+	color: rgb(204, 179, 230);
+	display: flex;
+	flex-direction: column;
+}
+
+.note:nth-child(even) {
+	background: rgba(102, 51, 153, 0.25);
+}
+
+.note:nth-child(odd) {
+	background: rgba(102, 51, 153, 0.125);
+}

flabk/templates/html/loggedin/timeline.html

@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+	<title>timeline - flabk</title>
+	<link rel="stylesheet" href="/static/style/main.css">
+	<link rel="stylesheet" href="/static/style/timeline.css">
+	<link rel="icon" type="image/svg+xml" href="/favicon.svg">
+</head>
+
+<body>
+	{{> LoggedIn }}
+	<div class="main" id="timeline-box">
+		<div id="postbox">
+			<textarea id="post-content" placeholder="im tosti"></textarea>
+			<button>send</button>
+		</div>
+		<div id="timeline">
+			<div class="note">
+				<img class="avatar" src="/favicon.svg" alt="example" />
+				<div class="content">
+					<div class="user-info">
+						<p class="display-name">Big Duck</p>
+						<p class="username">@emilis@flab.k</p>
+					</div>
+					<p class="post-text">this is gay :puffrage:</p>
+				</div>
+			</div>
+			<div class="note">
+				<img class="avatar" src="/favicon.svg" alt="example" />
+				<div class="content">
+					<div class="user-info">
+						<p class="display-name">Big Duck</p>
+						<p class="username">@emilis@flab.k</p>
+					</div>
+					<p class="post-text">im posting agen</p>
+				</div>
+			</div>
+			<div class="note">
+				<img class="avatar" src="/favicon.svg" alt="example" />
+				<div class="content">
+					<div class="user-info">
+						<p class="display-name">Big Duck</p>
+						<p class="username">@emilis@flab.k</p>
+					</div>
+					<p class="post-text">just landed in piss</p>
+				</div>
+			</div>
+		</div>
+	</div>
+</body>
+
+</html>

flabk/templates/html/profile.html

@@ -12,7 +12,7 @@
 	<div class="main">
 		<div class="profile">
 			<div class="profile-header">
-				<img class="avatar" src="{{obj.user.avatar_uri}}" alt="{{obj.user.username}}'s avatar" />
+				<img class="profile-avatar" src="{{obj.user.avatar_uri}}" alt="{{obj.user.username}}'s avatar" />
 				<p class="name">{{obj.user.display_name}}</p>
 			</div>
 			<div class="profile-bio">