You are a constitutional council ranking individual git commits for ownership allocation. Compare these two commits. Decide which contributed more lasting value to the project. Judge substance, not spectacle: - Prefer correct, lasting design and real bugfixes over churn, formatting, renames, or generated noise. - Prefer clarity and necessity over sheer line count. A small precise change can beat a large diffuse one. - Do not favor a side merely because its patch is longer or noisier. - Weight what the change does for the project, not the contributor's name. Return ONLY a JSON object: {"winner": "A" or "B", "ratio": "N:M", "explanation": "..."} The explanation must cite concrete differences in the patches (1-3 sentences). Side A — contributor: tommy-mor Side A — commit message: [78964dd7] nice Side A — unified diff (full patch): diff --git a/server/src/fetch/html.rs b/server/src/fetch/html.rs index 9b6c2d0964640a157bca2a6a64cb0820238d8e4f..3e0309ff1c2ac1b17923922d2340ba6710e0f9d1 100644 --- a/server/src/fetch/html.rs +++ b/server/src/fetch/html.rs @@ -11,6 +11,9 @@ use crate::{ }; fn entity_panel(node: &NodeState) -> Markup { + if let Some(markup) = crate::render::reddit::entity_markup(node) { + return markup; + } html! { @if let Some(data) = &node.data { div id="entity-panel" class="entity-card" { diff --git a/server/src/html/mod.rs b/server/src/html/mod.rs index e88cc43ddc9d8100f7994be6f5960ec4d8f22c55..3bf9fc7e92e50beed24e2c25106a77421038c90b 100644 --- a/server/src/html/mod.rs +++ b/server/src/html/mod.rs @@ -153,16 +153,21 @@ pub fn breadcrumb_path(item: &ItemId) -> Markup { } } -fn rank_list(label: &str, items: &[RankedItem], start_rank: usize) -> Markup { +fn rank_list(label: &str, items: &[RankedItem], start_rank: usize, tree: &GlobalTree) -> Markup { html! { @if !items.is_empty() { h3 class="rank-heading muted small" { (label) } ol class="rank-list" { @for (i, r) in items.iter().enumerate() { - li { + @let href = item_href(&r.item); + li class=(if crate::render::reddit::is_reddit_post(&r.item) { "reddit-post-row" } else { "" }) { span class="rank-num" { (start_rank + i) ". " } - a href=(item_href(&r.item)) { - strong { (display_label(&r.item)) } + @if let Some(row) = crate::render::reddit::child_row_markup(tree, &r.item, &href) { + (row) + } @else { + a href=(href) { + strong { (display_label(&r.item)) } + } } span class="muted" { " — " @@ -196,9 +201,14 @@ fn unranked_list(label: &str, items: &[ItemId], tree: &GlobalTree) -> Markup { h3 class="rank-heading muted small" { (label) } ul class="rank-list unranked" { @for it in items { - li { - a href=(item_href(it)) { - strong { (child_label(tree, it)) } + @let href = item_href(it); + li class=(if crate::render::reddit::is_reddit_post(it) { "reddit-post-row" } else { "" }) { + @if let Some(row) = crate::render::reddit::child_row_markup(tree, it, &href) { + (row) + } @else { + a href=(href) { + strong { (child_label(tree, it)) } + } } } } @@ -253,7 +263,7 @@ pub fn ranking_panel(item: &ItemId, node: &NodeState, tree: &GlobalTree) -> Mark } @else { @for (gi, ranked) in ranked_groups.iter().enumerate() { @let label = if multi { format!("Ranking group {}", gi + 1) } else { "Ranking".to_string() }; - (rank_list(&label, ranked, 1)) + (rank_list(&label, ranked, 1, tree)) } (unranked_list("Unranked", &unranked, tree)) } diff --git a/server/src/lib.rs b/server/src/lib.rs index 0677363e0ed21d244bfa065f7ec728549ddd9e50..da5f3ebecec1794b05a2a69cc78379551b2ad769 100644 --- a/server/src/lib.rs +++ b/server/src/lib.rs @@ -8,6 +8,7 @@ pub mod parser; pub mod path_types; pub mod ranking; pub mod reddit; +pub mod render; pub mod reducer; pub mod journal; pub mod state; diff --git a/server/src/reddit.rs b/server/src/reddit.rs index 69d979bc7e4a1cb078f70114dc539bdc1986b574..1168ec2afc77c092514eec91b513bac301cbe225 100644 --- a/server/src/reddit.rs +++ b/server/src/reddit.rs @@ -608,6 +608,8 @@ fn parse_subreddit_about(v: &Value) -> Option { author: None, body_html, thumb_url, + image_url: None, + link_url: None, }) } @@ -635,15 +637,64 @@ fn parse_post_listing(v: &Value) -> Option { .and_then(|t| t.as_str()) .filter(|s| s.starts_with("http")) .map(|s| s.to_string()); + let image_url = reddit_post_image_url(child); + let link_url = reddit_post_link_url(child); Some(crate::reducer::EntityData { title, author, body_html, thumb_url, + image_url, + link_url, }) } +fn reddit_post_link_url(data: &Value) -> Option { + for key in ["url_overridden_by_dest", "url"] { + if let Some(u) = data.get(key).and_then(|v| v.as_str()) { + if u.starts_with("http") { + return Some(u.to_string()); + } + } + } + None +} + +/// Full-size still for post detail: direct image `url`, else Reddit preview source. +fn reddit_post_image_url(data: &Value) -> Option { + for key in ["url", "url_overridden_by_dest"] { + if let Some(u) = data.get(key).and_then(|v| v.as_str()) { + if reddit_direct_image_url(u) { + return Some(u.to_string()); + } + } + } + reddit_preview_source_url(data) +} + +fn reddit_preview_source_url(data: &Value) -> Option { + data.pointer("/preview/images/0/source/url") + .and_then(|v| v.as_str()) + .filter(|s| s.starts_with("http")) + .map(str::to_string) +} + +fn reddit_direct_image_url(url: &str) -> bool { + let u = url.to_ascii_lowercase(); + if u.contains("redgifs.com") { + return false; + } + u.contains("i.redd.it") + || u.contains("preview.redd.it") + || u.contains("external-preview.redd.it") + || u.ends_with(".jpg") + || u.ends_with(".jpeg") + || u.ends_with(".png") + || u.ends_with(".gif") + || u.ends_with(".webp") +} + #[cfg(test)] mod tests { use super::*; @@ -672,4 +723,20 @@ mod tests { .unwrap(); assert_eq!(entity.title, "The Rust Programming Language"); } + + #[test] + fn parse_post_listing_extracts_thumb_and_full_preview() { + let json = include_str!("../../test/fixtures/reddit/post_preview.json"); + let v: Value = serde_json::from_str(json).unwrap(); + let id = ItemId::parse("reddit.com/r/nsfw/comments/1tpy6a1/angel_eyes").unwrap(); + let entity = entity_view_from_payload(&id, &v).unwrap(); + assert_eq!(entity.title, "Angel Eyes"); + assert!(entity.thumb_url.as_ref().unwrap().contains("width=140")); + assert!(entity.image_url.as_ref().unwrap().contains("auto=webp")); + assert!(!entity.image_url.as_ref().unwrap().contains("redgifs")); + assert_eq!( + entity.link_url.as_deref(), + Some("http://v3.redgifs.com/watch/impossibleprestigioushedgehog") + ); + } } diff --git a/server/src/reducer.rs b/server/src/reducer.rs index 4e42d0369dab50bb2f8ca664aa69b628292f6c07..336e78b77d3ab59361b89af5c9868e13da4ac962 100644 --- a/server/src/reducer.rs +++ b/server/src/reducer.rs @@ -122,7 +122,12 @@ pub struct EntityData { pub title: String, pub author: Option, pub body_html: Option, + /// Small preview (subreddit listing / child rows). pub thumb_url: Option, + /// Full-size still image for the post detail view. + pub image_url: Option, + /// Outbound link for link/video posts (`url` / `url_overridden_by_dest`). + pub link_url: Option, } /// One node in the fractal tree: entity + ranked children. diff --git a/server/src/render/mod.rs b/server/src/render/mod.rs new file mode 100644 index 0000000000000000000000000000000000000000..c2c41404abe01c671139658fcccdeced5be388e4 --- /dev/null +++ b/server/src/render/mod.rs @@ -0,0 +1,3 @@ +//! Domain-specific HTML fragments for imported entities. + +pub mod reddit; diff --git a/server/src/render/reddit.rs b/server/src/render/reddit.rs new file mode 100644 index 0000000000000000000000000000000000000000..4a18de93cf57d8395ded3caa373a708f39b3f43f --- /dev/null +++ b/server/src/render/reddit.rs @@ -0,0 +1,64 @@ +//! Reddit post cards: thumbnail in child lists, full image on the post page. + +use maud::{html, Markup}; + +use crate::{ + path_types::ItemId, + reducer::{EntityData, GlobalTree, NodeState}, +}; + +pub fn is_reddit_post(id: &ItemId) -> bool { + id.as_str().starts_with("reddit.com/") && id.as_str().contains("/comments/") +} + +/// Post detail card (`#entity-panel`). +pub fn entity_markup(node: &NodeState) -> Option { + if !is_reddit_post(&node.id) { + return None; + } + let data = node.data.as_ref()?; + Some(post_entity_card(data)) +} + +/// One row in a parent ranking list (thumbnail + title). +pub fn child_row_markup(tree: &GlobalTree, id: &ItemId, href: &str) -> Option { + if !is_reddit_post(id) { + return None; + } + let data = tree.get(id)?.data.as_ref()?; + Some(html! { + @if let Some(thumb) = &data.thumb_url { + a class="reddit-post-thumb-link" href=(href) { + img class="reddit-post-thumb" src=(thumb) alt="" loading="lazy"; + } + } + a href=(href) { + strong { (data.title) } + } + }) +} + +fn post_entity_card(data: &EntityData) -> Markup { + let image = data.image_url.as_ref().or(data.thumb_url.as_ref()); + html! { + div id="entity-panel" class="entity-card reddit-post" { + h2 { (data.title) } + @if let Some(author) = &data.author { + p class="muted small" { "by " (author) } + } + @if let Some(url) = &data.link_url { + p class="reddit-post-url muted small" { + a href=(url) rel="noopener noreferrer" { (url) } + } + } + @if let Some(src) = image { + figure class="reddit-post-figure" { + img class="reddit-post-image" src=(src) alt="" loading="lazy"; + } + } + @if let Some(body) = &data.body_html { + div class="entity-body" { (maud::PreEscaped(body)) } + } + } + } +} diff --git a/server/static/sorter.css b/server/static/sorter.css index 1f9f5158414902d43a380dd899232c70d8cf5d63..021918f8e778b84e4b3eac8559fab7d223a3d490 100644 --- a/server/static/sorter.css +++ b/server/static/sorter.css @@ -171,6 +171,41 @@ code { margin-top: 0; } +.reddit-post-row { + display: flex; + align-items: center; + gap: 0.6rem; +} + +.reddit-post-thumb-link { + flex-shrink: 0; + line-height: 0; +} + +.reddit-post-thumb { + width: 64px; + height: 64px; + object-fit: cover; + border-radius: 4px; + border: 1px solid var(--border); +} + +.reddit-post-url a { + word-break: break-all; +} + +.reddit-post-figure { + margin: 0.75rem 0; +} + +.reddit-post-image { + display: block; + max-width: 100%; + height: auto; + border-radius: 6px; + border: 1px solid var(--border); +} + .scope-name { color: var(--accent); font-weight: 600; diff --git a/test/fixtures/reddit/post_preview.json b/test/fixtures/reddit/post_preview.json new file mode 100644 index 0000000000000000000000000000000000000000..c6ed31ae397dc0f7b6e07e5e010e617df78d9c18 --- /dev/null +++ b/test/fixtures/reddit/post_preview.json @@ -0,0 +1,22 @@ +{ + "kind": "t3", + "data": { + "title": "Angel Eyes", + "permalink": "/r/nsfw/comments/1tpy6a1/angel_eyes/", + "author": "alice", + "thumbnail": "https://external-preview.redd.it/Kb6Nf5Q4RAucat-2RFcYMeQb2d6vgYNo5EPlf6kGLbs.jpeg?width=140&height=140&auto=webp&s=d7238240ebf191b954ef5f42b0cf61b67aecec88", + "url": "http://v3.redgifs.com/watch/impossibleprestigioushedgehog", + "post_hint": "rich:video", + "preview": { + "images": [ + { + "source": { + "url": "https://external-preview.redd.it/Kb6Nf5Q4RAucat-2RFcYMeQb2d6vgYNo5EPlf6kGLbs.jpeg?auto=webp&s=ccdabee3b81e46ef2d7cec072f6604a09f61dc9a", + "width": 480, + "height": 480 + } + } + ] + } + } +} Side B — contributor: tommy-mor Side B — commit message: [7964b28f] fix Side B — unified diff (full patch): diff --git a/Cargo.lock b/Cargo.lock index 8c43fb75c472b102e6e1d3b837dce3355be898f2..e55d87f32ab32064686431c7082ef8c9ca872d63 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -923,6 +923,15 @@ version = "0.2.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "439ee305def115ba05938db6eb1644ff94165c5ab5e9420d1c1bcedbba909391" +[[package]] +name = "ppv-lite86" +version = "0.2.21" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "85eae3c4ed2f50dcfe72643da4befc30deadb458a9b590d720cde2f2b1e97da9" +dependencies = [ + "zerocopy", +] + [[package]] name = "prettyplease" version = "0.2.37" @@ -980,6 +989,36 @@ version = "6.0.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "f8dcc9c7d52a811697d2151c701e0d08956f92b0e24136cf4cf27b57a6a0d9bf" +[[package]] +name = "rand" +version = "0.8.6" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "5ca0ecfa931c29007047d1bc58e623ab12e5590e8c7cc53200d5202b69266d8a" +dependencies = [ + "libc", + "rand_chacha", + "rand_core", +] + +[[package]] +name = "rand_chacha" +version = "0.3.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "e6c10a63a0fa32252be49d21e7709d4d4baf8d231c2dbce1eaa8141b9b127d88" +dependencies = [ + "ppv-lite86", + "rand_core", +] + +[[package]] +name = "rand_core" +version = "0.6.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "ec0be4795e2f6a28069bec0b5ff3e2ac9bafc99e6a9a7dc3547996c5c816922c" +dependencies = [ + "getrandom 0.2.17", +] + [[package]] name = "regex-automata" version = "0.4.14" @@ -1270,6 +1309,7 @@ dependencies = [ "dotenvy", "futures-util", "maud", + "rand", "reqwest", "serde", "serde_json", @@ -1280,6 +1320,7 @@ dependencies = [ "tower-http 0.5.2", "tracing", "tracing-subscriber", + "urlencoding", ] [[package]] @@ -1656,6 +1697,12 @@ dependencies = [ "serde", ] +[[package]] +name = "urlencoding" +version = "2.1.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "daf8dba3b7eb870caf1ddeed7bc9d2a049f3cfdfae7cb521b087cc33ae4c49da" + [[package]] name = "utf8_iter" version = "1.0.4" @@ -2052,6 +2099,26 @@ dependencies = [ "synstructure", ] +[[package]] +name = "zerocopy" +version = "0.8.50" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "3b065d4f0e55f82fae73202e189638116a87c55ab6b8e6c2721e13dd9d854ad1" +dependencies = [ + "zerocopy-derive", +] + +[[package]] +name = "zerocopy-derive" +version = "0.8.50" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "0b631b19d36a892ab55420c92dbc83ccd79274f25be714855d3074aa71cab639" +dependencies = [ + "proc-macro2", + "quote", + "syn", +] + [[package]] name = "zerofrom" version = "0.1.8" diff --git a/server/Cargo.toml b/server/Cargo.toml index c940acb687fb141d21760a3d6656172013cf6f41..6fb7bf52fa58f46f5e8fb0f7fd395247b57506d7 100644 --- a/server/Cargo.toml +++ b/server/Cargo.toml @@ -20,6 +20,8 @@ reqwest = { version = "0.12", features = ["json"] } dotenvy = "0.15" async-stream = "0.3" futures-util = { version = "0.3", default-features = false, features = ["std"] } +rand = "0.8" +urlencoding = "2" [dev-dependencies] reqwest = { version = "0.12", features = ["json"] } diff --git a/server/src/api/ui_html.rs b/server/src/api/ui_html.rs index e649a7d192feade465e19ce6187a829f6ec74372..06001212820101e0cc953d3687dea64f85e60787 100644 --- a/server/src/api/ui_html.rs +++ b/server/src/api/ui_html.rs @@ -47,6 +47,7 @@ pub async fn post_ui_html( ratio_left, ratio_right, scope, + next, } => { let parent = parent_from_scope(&scope); if let Err(e) = state @@ -56,9 +57,19 @@ pub async fn post_ui_html( return ui_js_warn(&e).into_response(); } let tree = state.tree.read().await; + if !next.trim().is_empty() { + drop(tree); + return JsBuilder::new() + .raw(&format!( + "window.location.href={};", + js_string_literal(next.trim()) + )) + .into_response(); + } let empty = crate::reducer::NodeState::default(); let node = tree.get(&parent).unwrap_or(&empty); let panel = ranking_panel(&parent, node, &tree); + drop(tree); JsBuilder::new() .morph_selector("#ranking-panel", panel) .into_response() @@ -126,6 +137,7 @@ mod tests { ratio_left: 3, ratio_right: 1, scope: String::new(), + next: String::new(), } ); } diff --git a/server/src/form_template.rs b/server/src/form_template.rs index b9bc3982a125e94e67c99175ea9055979541abba..bd4a7195a6eaabfed55333bab5640708ea108b81 100644 --- a/server/src/form_template.rs +++ b/server/src/form_template.rs @@ -7,19 +7,30 @@ pub fn template_json_compact(v: &T) -> serde_json::Result serde_json::to_string(v) } -/// Recursively walk the JSON AST and replace `{"$form": "key"}` with the submitted -/// string for `key` (empty if missing). Other keys are unchanged. +/// Recursively walk the JSON AST and replace form holes with submitted values. +/// +/// - `{"$form": "key"}` → string (empty if missing) +/// - `{"$form:i32": "key"}` → JSON number (0 if missing or unparseable) pub fn substitute_form_vars(val: &mut Value, form_data: &HashMap) { match val { Value::Object(map) => { if map.len() == 1 { - if let Some(Value::String(field_name)) = map.get("$form") { - let submitted = form_data - .get(field_name.as_str()) - .map(|s| s.as_str()) - .unwrap_or(""); - *val = Value::String(submitted.to_string()); - return; + if let Some((hole_key, Value::String(field_name))) = map.iter().next() { + if let Some(form_type) = hole_key.strip_prefix("$form") { + let submitted = form_data + .get(field_name.as_str()) + .map(|s| s.as_str()) + .unwrap_or(""); + *val = match form_type { + "" => Value::String(submitted.to_string()), + ":i32" => { + let n: i32 = submitted.trim().parse().unwrap_or(0); + Value::Number(n.into()) + } + _ => Value::String(submitted.to_string()), + }; + return; + } } } for v in map.values_mut() { @@ -62,6 +73,45 @@ mod tests { text: String, } + #[test] + fn i32_holes_become_numbers() { + let json = r#"{ + "ratio_left": {"$form:i32": "ratio_left"}, + "ratio_right": {"$form:i32": "ratio_right"} + }"#; + let mut form = HashMap::new(); + form.insert("ratio_left".into(), "75".into()); + form.insert("ratio_right".into(), "25".into()); + let v = fill_template_from_form(json, &form).unwrap(); + assert_eq!(v["ratio_left"], 75); + assert_eq!(v["ratio_right"], 25); + + #[derive(Debug, Deserialize, PartialEq, Eq)] + struct Ratios { + ratio_left: i32, + ratio_right: i32, + } + let r: Ratios = serde_json::from_value(v).unwrap(); + assert_eq!( + r, + Ratios { + ratio_left: 75, + ratio_right: 25, + } + ); + } + + #[test] + fn i32_hole_missing_or_bad_defaults_to_zero() { + let json = r#"{"n": {"$form:i32": "missing"}}"#; + let v = fill_template_from_form(json, &HashMap::new()).unwrap(); + assert_eq!(v["n"], 0); + let mut form = HashMap::new(); + form.insert("missing".into(), "nope".into()); + let v = fill_template_from_form(json, &form).unwrap(); + assert_eq!(v["n"], 0); + } + #[test] fn holes_become_strings() { let json = r#"{ diff --git a/server/src/html/mod.rs b/server/src/html/mod.rs index 3bf9fc7e92e50beed24e2c25106a77421038c90b..61cdbc094819ddedb755572c59456ec0d6617619 100644 --- a/server/src/html/mod.rs +++ b/server/src/html/mod.rs @@ -20,6 +20,8 @@ use crate::{ ui_action::UI_RPC_FIELD, }; +pub mod vote; + const SORTER_CSS: &str = include_str!("../../static/sorter.css"); const SORTER_UI_JS: &str = include_str!("../../static/sorter_ui.js"); @@ -131,7 +133,7 @@ fn layout(title: &str, body: Markup, views: u64) -> Markup { } } -fn item_href(id: &ItemId) -> String { +pub(crate) fn item_href(id: &ItemId) -> String { id.browse_href() } @@ -309,11 +311,23 @@ async fn item_page(state: AppState, uri: Uri, item: ItemId) -> Markup { let empty_node = NodeState::default(); let node = tree.get(&item).unwrap_or(&empty_node); + let child_count = node.children.len(); + let vote_link = if child_count >= 2 { + Some(vote::vote_href(&item)) + } else { + None + }; + let body = html! { h1 { "sorter" } (input_panel("", None)) (breadcrumb_path(&item)) (entity_section(&item, node, false)) + @if let Some(href) = vote_link { + p class="vote-cta" { + a class="btn-primary" href=(href) data-testid="vote-children" { "Vote on children" } + } + } (ranking_panel(&item, node, &tree)) }; layout("sorter2", body, views) diff --git a/server/src/lib.rs b/server/src/lib.rs index da5f3ebecec1794b05a2a69cc78379551b2ad769..7f7e28c8ac3758de87f1f8e073b24be4132d38da 100644 --- a/server/src/lib.rs +++ b/server/src/lib.rs @@ -4,6 +4,7 @@ pub mod events; pub mod fetch; pub mod form_template; pub mod html; +pub mod pair; pub mod parser; pub mod path_types; pub mod ranking; @@ -33,6 +34,7 @@ pub fn create_app(state: AppState) -> Router { .route("/static/:filename", get(crate::html::serve_static)) .route("/~/*item_path", get(crate::html::browse)) .route("/", get(crate::html::home)) + .route("/vote", get(crate::html::vote::vote_page)) .route("/ui", post(crate::api::ui_html::post_ui_html)) .with_state(state) .layer(TraceLayer::new_for_http()) diff --git a/server/src/ui_action.rs b/server/src/ui_action.rs index 2047713762c932ac9bc325fe15624f2aecb3364d..53581e1362bfcc5dfb4ae3069c41ea6f7be41437 100644 --- a/server/src/ui_action.rs +++ b/server/src/ui_action.rs @@ -31,6 +31,9 @@ pub enum HtmlUiAction { /// Parent node [`ItemId`] string; empty = tree root. #[serde(default)] scope: String, + /// After vote, navigate here (vote compare page). + #[serde(default)] + next: String, }, /// Parse pasted Reddit URL/path; redirect to subreddit ranking on success. ParseQuery { @@ -70,6 +73,36 @@ pub fn parse_html_ui_from_form( mod tests { use super::*; + #[test] + fn record_vote_round_trip_with_typed_ratio_holes() { + let template = serde_json::json!({ + "action": "record_vote", + "a": "x", + "b": "y", + "ratio_left": {"$form:i32": "ratio_left"}, + "ratio_right": {"$form:i32": "ratio_right"}, + "scope": "parent", + }); + let mut form = HashMap::new(); + form.insert( + UI_RPC_FIELD.to_string(), + serde_json::to_string(&template).unwrap(), + ); + form.insert("ratio_left".into(), "60".into()); + form.insert("ratio_right".into(), "40".into()); + assert_eq!( + parse_html_ui_from_form(&form).unwrap(), + HtmlUiAction::RecordVote { + a: "x".into(), + b: "y".into(), + ratio_left: 60, + ratio_right: 40, + scope: "parent".into(), + next: String::new(), + } + ); + } + #[test] fn record_vote_round_trip_with_form_holes() { let template = serde_json::json!({ @@ -96,6 +129,7 @@ mod tests { ratio_left: 2, ratio_right: 1, scope: "amitheasshole".into(), + next: String::new(), } ); } @@ -122,6 +156,7 @@ mod tests { ratio_left: 2, ratio_right: 1, scope: String::new(), + next: String::new(), } ); } diff --git a/server/static/sorter.css b/server/static/sorter.css index 021918f8e778b84e4b3eac8559fab7d223a3d490..3c2cec5cb5094013387147c621d75bd341bc06cc 100644 --- a/server/static/sorter.css +++ b/server/static/sorter.css @@ -224,4 +224,148 @@ code { h1 { margin: 0; +} + +.vote-cta { + margin: 0.75rem 0; +} + +.vote-compare-shell { + max-width: 960px; +} + +.vote-compare-scope { + margin: 0.5rem 0 1rem; +} + +.vote-compare-pair { + display: grid; + grid-template-columns: 1fr auto 1fr; + gap: 1rem; + align-items: start; + margin: 1rem 0; +} + +.vote-compare-vs { + align-self: center; + font-size: 1.25rem; + color: var(--muted); + font-weight: 600; +} + +.vote-compare-side { + background: var(--panel); + border: 1px solid var(--border); + border-radius: 8px; + padding: 1rem; + min-height: 120px; +} + +.vote-compare-item { + color: var(--accent); + text-decoration: none; + display: block; +} + +.vote-compare-item:hover { + text-decoration: underline; +} + +.vote-compare-figure { + margin: 0.75rem 0 0; +} + +.vote-compare-image { + display: block; + max-width: 100%; + height: auto; + border-radius: 6px; + border: 1px solid var(--border); +} + +.vote-compare-item-body { + margin-top: 0.75rem; + font-size: 0.9rem; +} + +.vote-compare-nav { + display: flex; + justify-content: space-between; + align-items: center; + gap: 1rem; + margin: 1rem 0; +} + +.vote-compare-next { + color: var(--accent); + text-decoration: none; +} + +.vote-compare-next.is-disabled { + color: var(--muted); +} + +.vote-compare-back { + text-decoration: none; +} + +.vote-compare-back:hover { + text-decoration: underline; +} + +.vote-compare-slider-label { + display: grid; + grid-template-columns: 1fr auto 1fr; + gap: 0.75rem; + align-items: center; + margin: 1.25rem 0; +} + +.vote-compare-slider-label input[type="range"] { + width: 100%; + min-width: 160px; +} + +#vote-slider-left-label { + text-align: right; +} + +#vote-slider-right-label { + text-align: left; +} + +.vote-edge-history-title { + margin: 1.5rem 0 0.5rem; + font-size: 1rem; +} + +.vote-edge-history { + list-style: none; + padding: 0; + margin: 0; +} + +.vote-edge-history-row { + margin-bottom: 0.75rem; +} + +.vote-edge-meta { + font-size: 0.875rem; + margin-bottom: 0.25rem; +} + +.ratio-bar { + display: flex; + height: 8px; + border-radius: 4px; + overflow: hidden; + background: var(--border); +} + +.ratio-left { + background: var(--accent); +} + +.ratio-right { + background: var(--muted); } \ No newline at end of file diff --git a/server/static/sorter_ui.js b/server/static/sorter_ui.js index 62c9158ecb3c2140b83efd2b27ea706a9e0ae127..c8d7c3ef2413399ced7898a7edb3e7a2c8e16163 100644 --- a/server/static/sorter_ui.js +++ b/server/static/sorter_ui.js @@ -81,7 +81,22 @@ }); } + function initVoteSlider() { + var slider = document.getElementById('vote-preference-slider'); + if (!slider) return; + var leftInput = document.getElementById('vote-ratio-left'); + var rightInput = document.getElementById('vote-ratio-right'); + function update() { + var v = parseInt(slider.value, 10); + if (leftInput) leftInput.value = String(v); + if (rightInput) rightInput.value = String(100 - v); + } + slider.addEventListener('input', update); + update(); + } + function initSorterUi() { + initVoteSlider(); document.addEventListener('submit', async function (e) { var f = e.target; if (!f || f.tagName !== 'FORM') return; @@ -89,10 +104,11 @@ if (f.getAttribute('data-navigate') === 'full') return; e.preventDefault(); await postUiForm(f); - if (f.id === 'vote-form') { + if (f.id === 'vote-form' || f.id === 'vote-compare-form') { f.reset(); - var firstField = f.querySelector('input[type="text"]'); - if (firstField) firstField.focus(); + var slider = f.querySelector('#vote-preference-slider'); + if (slider) slider.value = '50'; + initVoteSlider(); } }); }