Media Ranker Keyboard Navigation
I'm working on a program that allows users to create ranked lists of content to be aggregated and drive a recommendation engine.
I'm fleshing out the UI at the moment & one of my goals is for it to be completely mobile & keyboard navigable.
Currently, here's where I'm at in my planning of functions:
•
?: (Display|Hide) these shortcuts.
• ↑ | ↓: Highlight the (previous|next) entry.
• enter: (Expand|Collapse) the highlighted entry.
• e: Edit the title of the highlighted entry.
• c: Copy the highlighted entry to a different list.
• x / delete / backspace: Delete the highlighted entry.
• s | n: (Save|Load) the current configuration (to|from) Neo4j.
• j: Jump to a specific entry number.
• m, (↑ | ↓), enter: Move the selected entry (up|down).
• d | l: (Down)?Load the congfiguration as JSON5.
• p: Publish a CBOR representation of the list to IPFS pub/sub.
• a: Add local files to the list (removing duplicates).
• v: View all entries.
• h: Hide all entries.
• u | r: (Un|Re)do the last change.
• space:
• If the highlighted entry is collapsed, expand it.
• If the expanded entry is media, (play|pause) it.
• If the expanded entry is not media, collapse it.
• z: Zoom in on the highlighted entry:
• z / escape: Zoom out.
• ctrl ➕ → / → ⨯ 2 / enter / swipe →: View the next entry.
• ctrl ➕ ← / ← ⨯ 2 / swipe ←: View the previous entry.
• (pan)? → | (pan)? ←: Seek (forward|back) by 2 seconds.
• → ⨯ 2, →+ | ← ⨯ 2, →+: Seek (forward|back) by 1 minute.
• (→ | ←) ≥ 2sec: Seek (forward|back) by 2½% for each additional 1½ second held.
• 0–9: Seek to 0–90% of the way through the media.
• ↑ | ↓: (In|De)crease the volume by ⅕.
• ctrl ➕ (↑ | ↓): (In|De)crease the volume by 75%.
• space: (Play|Pause) media.
• m: (Un)?Mute media.
• f: Toggle fullscreen.
Is my notation consistent? I'm pretty sure I found all my formatting errors. 😸
Can you think of other operations you'd want to do when browsing media collections and ranking the elements?
One of my initial use cases is porn collections ala. FunnyJunk's NSFW section, so you ought to be able to do all the important stuff with one hand. :smirk_imp:
I'm about ⅗ way through implementing these commands. I'd recommend you try the program out, but it relies on API access to an IPFS Kubo endpoint (which isn't too hard to set up locally using IPFS Desktop, but I haven't written instructions yet).
Most of what's left are the repetition and timing-based tasks.
There'll be a nav menu with buttons to perform the tasks that can't be done by touch on mobile.GitHub
GitHub - MetaFam/mimis: A Universal Public Collaborative Composable...
A Universal Public Collaborative Composable Filesystem - MetaFam/mimis
GitHub
GitHub - ipfs/kubo: An IPFS implementation in Go
An IPFS implementation in Go. Contribute to ipfs/kubo development by creating an account on GitHub.
5 Replies
x / delete / backspace: Delete the highlighted entry.
Fair enough. It was sorta redundant in any case.
The goal is to serve someone wanting to quickly seek deep into the media regardless of it's length.
Using a fixed percentage it'll take the same amount of time to seek through a video regardless of it's length.
Though that'll be 100% / 2½% ⨯ 1½sec = 60sec to go through the entire thing, so it should be more like 5%.
using the arrows and that complicated system won't be helpful, since most players use 5, 10 or 15 second jumps
you can do what youtube does: 1-0 jumps to different parts of the video
1 jumps to the beginning, 0 jumps to the end
2, 3, 4 ... jump to 10% increments
I was thinking about that, though I was going to do the more intuitive numerically, if not kinematically, 0 = beginning to 9 = end, with each space being 100⁄9% = 11.̅1%.
maybe youtube does like that 🤔
it's an huge improvement over the arrows doing 2.5%