adding tab highlight and some more details in readme

This commit is contained in:
Jakub Doka 2024-10-15 12:46:36 +02:00
parent ea736d8824
commit 23b90b3dd7
No known key found for this signature in database
GPG key ID: C6E9A89936B8C143
4 changed files with 50 additions and 12 deletions

View file

@ -1,10 +1,14 @@
# Depell # Depell
Depell is a website that allows users to import/post/run hblang code and create huge dependency graphs Depell is a website that allows users to import/post/run hblang code and create huge dependency graphs.
## Local Development ## Local Development
Prerequirements:
- rust nigthly toolchain: install rust from [here](https://www.rust-lang.org/tools/install)
```bash ```bash
rustup default nightly
cargo xtask watch-depell-debug cargo xtask watch-depell-debug
# browser http://localhost:8080 # browser http://localhost:8080
``` ```

View file

@ -10,6 +10,7 @@ body {
--placeholder: #333333; --placeholder: #333333;
} }
body { body {
--small-gap: 5px; --small-gap: 5px;
--font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; --font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
@ -81,6 +82,7 @@ pre {
margin: 0px; margin: 0px;
font-family: var(--monospace); font-family: var(--monospace);
tab-size: 4; tab-size: 4;
overflow-x: auto;
} }
input { input {
@ -92,7 +94,7 @@ input {
} }
input:is(:hover, :focus) { input:is(:hover, :focus) {
background: white; background: var(--primary);
} }
button { button {
@ -103,7 +105,7 @@ button {
} }
button:hover:not(:active) { button:hover:not(:active) {
background: white; background: var(--primary);
} }
div#code-editor { div#code-editor {

View file

@ -331,6 +331,13 @@ function cacheInputs(target) {
} }
} }
function updaetTab() {
for (const elem of document.querySelectorAll("button[hx-push-url]")) {
if (elem instanceof HTMLButtonElement)
elem.disabled = elem.getAttribute("hx-push-url") === window.location.pathname;
}
}
if (window.location.hostname === 'localhost') { if (window.location.hostname === 'localhost') {
let id; setInterval(async () => { let id; setInterval(async () => {
let new_id = await fetch('/hot-reload').then(reps => reps.text()); let new_id = await fetch('/hot-reload').then(reps => reps.text());
@ -361,8 +368,17 @@ if (window.location.hostname === 'localhost') {
document.body.addEventListener('htmx:afterSwap', (ev) => { document.body.addEventListener('htmx:afterSwap', (ev) => {
if (!(ev.target instanceof HTMLElement)) never(); if (!(ev.target instanceof HTMLElement)) never();
wireUp(ev.target); wireUp(ev.target);
if (ev.target.tagName == "MAIN") updaetTab();
}); });
//document.body.addEventListener('htmx:beforeSend', (ev) => {
// const target = ev.target;
// if (target instanceof HTMLButtonElement && target.hasAttribute("hx-push-url")) {
//
// document.getElementById("extra-style").textContent = `[hx-push-url="${target.getAttribute("hx-push-url")}"]{background: var(--primary)}`
// }
//});
getFmtInstance().then(inst => { getFmtInstance().then(inst => {
document.body.addEventListener('htmx:configRequest', (ev) => { document.body.addEventListener('htmx:configRequest', (ev) => {
const details = ev['detail']; const details = ev['detail'];
@ -411,6 +427,6 @@ getFmtInstance().then(inst => {
Object.assign(window, { filterCodeDeps }); Object.assign(window, { filterCodeDeps });
}); });
updaetTab();
wireUp(document.body); wireUp(document.body);

View file

@ -3,7 +3,7 @@ use {
argon2::{password_hash::SaltString, PasswordVerifier}, argon2::{password_hash::SaltString, PasswordVerifier},
axum::{ axum::{
body::Bytes, body::Bytes,
extract::Path, extract::{OriginalUri, Path},
http::{header::COOKIE, request::Parts}, http::{header::COOKIE, request::Parts},
response::{AppendHeaders, Html}, response::{AppendHeaders, Html},
}, },
@ -349,8 +349,16 @@ impl Profile {
Profile { other: Some(name) }.render(&session) Profile { other: Some(name) }.render(&session)
} }
async fn get_other_page(session: Session, Path(name): Path<String>) -> Html<String> { async fn get_other_page(
base(|b| Profile { other: Some(name) }.render_to_buf(&session, b), Some(&session)) session: Session,
path: axum::extract::OriginalUri,
Path(name): Path<String>,
) -> Html<String> {
base(
|b| Profile { other: Some(name) }.render_to_buf(&session, b),
path.path(),
Some(&session),
)
} }
} }
@ -534,7 +542,7 @@ impl Signup {
} }
} }
fn base(body: impl FnOnce(&mut String), session: Option<&Session>) -> Html<String> { fn base(body: impl FnOnce(&mut String), path: &str, session: Option<&Session>) -> Html<String> {
let username = session.map(|s| &s.name); let username = session.map(|s| &s.name);
let nav_button = |f: &mut String, name: &str| { let nav_button = |f: &mut String, name: &str| {
@ -550,7 +558,12 @@ fn base(body: impl FnOnce(&mut String), session: Option<&Session>) -> Html<Strin
"<!DOCTYPE html>" "<!DOCTYPE html>"
<html lang="en"> <html lang="en">
<head> <head>
<meta name="charset" content="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/index.css"> <link rel="stylesheet" href="/index.css">
//<style id="extra-style">
// "[hx-push-url='" !path "']{background:var(--primary)}"
//</style>
</head> </head>
<body> <body>
<nav> <nav>
@ -751,8 +764,8 @@ trait PublicPage: Default {
Self::default().render() Self::default().render()
} }
async fn page(session: Option<Session>) -> Html<String> { async fn page(uri: OriginalUri, session: Option<Session>) -> Html<String> {
base(|s| Self::default().render_to_buf(s), session.as_ref()) base(|s| Self::default().render_to_buf(s), uri.path(), session.as_ref())
} }
} }
@ -769,10 +782,13 @@ trait Page: Default {
Self::default().render(&session) Self::default().render(&session)
} }
async fn page(session: Option<Session>) -> Result<Html<String>, axum::response::Redirect> { async fn page(
uri: OriginalUri,
session: Option<Session>,
) -> Result<Html<String>, axum::response::Redirect> {
match session { match session {
Some(session) => { Some(session) => {
Ok(base(|f| Self::default().render_to_buf(&session, f), Some(&session))) Ok(base(|f| Self::default().render_to_buf(&session, f), uri.path(), Some(&session)))
} }
None => Err(axum::response::Redirect::permanent("/login")), None => Err(axum::response::Redirect::permanent("/login")),
} }