Kbin Usability Pack 0.2.2 - Now with settings!
Kbin Usability Pack 0.2.2 - Now with settings!
What is this?
So after tinkering for a while with my Subscriptions Panel (please feel free to try that one out too, btw!), I thought I'd take a go at cleaning up some of my other experiments that I have been playing around with and share them with the world.
That's how the Kbin Usability Pack was born, which is a growing very opinionated collection of enhancements and tweaks that I'm using myself.
Features
- Inline preview of Kbin articles.
- Improved media preview.
- Drag to resize media preview (only images, currently).
- Larger preview buttons
- Keyboard shortcuts for upvoting, downvoting, boosting, opening article and previews.
- Fixed mobile menu to respect default homepage instead of just always linking to "/".
- Changed logo behaviour on mobile to navigate to home instead of opening mobile menu. Hamburger menu still opens menu.
- Moved thumbnails to the left.
- Slight tweaking to general CSS, especially on mobile.
- Infinitely scrolling comments.
- Subheader on articles showing the full link URL (also opens link in new tab when clicked)
- Overhauled settings panel with new components and asynchronous changes.
Keyboard shortcuts
Feed
A: Upvote.
Z: Downvote.
B: Boost.
O: Open article.
Enter: Enter article selection.
Enter, when article is selected: Toggle previews (press once to open article preview, twice to open media preview and three times to close previews).
Up/down arrow: Move between selected articles.
Escape: Exit article selection.
A selected article is indicated by a dotted border.
Article page
A: Upvote article.
Z: Downvote article.
B: Boost article.
O: Open link in new tab.
Enter: Toggle media preview.
Todo
This project is still absolutely in its infancy so do expect some bugs and occasional weirdness.
The following things are currently in the immediate pipeline:
- Further media preview enhancements.
- Handle more built-in settings like auto media preview.
Screenshots
Inline preview of an article (0.0.1)
New media preview and article preview (0.0.1)
Some fancy preview in a preview (0.0.1)
Updates
0.1.0
- Added keybind ("O") to open article.
- Added kebindings to article page (toggle preview, open link in new tab, vote, boost).
- Improved article preview styling.
- Changed comment link in feed to link to article instead of the comment section.
- Added enhanced media preview to article page.
- Added subheader to article page to show full link URL (also opens link in new tab if clicked).
- Added infinite scroll to article comments.
- Added logo, because why not?
0.1.1
- Fixed article previews in compact mode
- Fixed some layout quirkiness.
- Fixed missing get parameters in URL subheader.
0.1.2
- Fixed thumbnails missing rounded corners.
0.2.0
Added settings enhancements
-
New components for toggles and enums.
-
Settings save in the background without reload (reload is still required for some settings to apply, though).
-
Compatible with existing settings and any third party settings, like for Kbin Enhancement Script.
-
Fallback for custom settings types.
-
Collapsable sections (hold shift to toggle all)
-
Support for live changes that apply immediately without reload (currently only KUP settings).
-
Support for settings descriptions (currently only KUP settings)
Enhancements that can be toggled in settings
-
URL subheader
-
Article preview button
-
Remove anchor from comment links.
0.2.1
- Fixed issue with handling third party settings
0.2.2
-
Increased compatibility with other scripts that modify the settings panel.
-
Added Compatibility Mode setting to disable the KUP settings enhancement to legacy settings.
-
Added setting to toggle infinite comment scroll.
-
Added setting to always expand settings sections.
-
Added anchor to comment sorting panel to automatically scroll back to the comments section after reload.
-
Fixed styling of settings switches in Safari.
0.3.0 and beyond
0.3.0 has been released and further discussions can be found here:
You're viewing a single thread.
This is great, thanks for releasing it.
For anyone wondering if this plays nice with the enhancement script I can say I haven't noticed any issues.
I'm struggling to understand the usefulness of this one tho;
Subheader on articles showing the full link URL (also opens link in new tab when clicked)
It just seems to waste a bit of space by adding another link that's the same as the header?
You can just hover/hold on the header to see the full url.I can see it being useful in the feed where you don't actually have a direct link to the content currently but it's not displayed there.
Thanks! I really appreciate the feedback. Everything is very experimental by nature, so it’s great to hear what works and and doesn’t.
I will of course add some settings soon so that most of these changes can be toggled off, but here’s the reasoning for this one:
- I felt that I wanted more clearly distinguish between articles with links and without. By default, links to articles, websites, cross posts on Kbin and even articles without links are visually very similar. Even more so, links can include both an article and an attached image, making it very confusing what one is clicking on.
By adding the sub header, I hoped to make it more clear what you are clicking on before you do it.
-
The information is of course already available when hovering over the link, but at least I felt that was unnecessarily cumbersome to do every time and that also doesn’t work well on tablets and mobiles.
-
I definitely want to add it to the feed too, but sadly I don’t have access to that data there without fetching it separately (which is infeasible to do for every entry in the feed).
Technically, I already populate the article object when generate the preview, so maybe I can figure out something smart.
- I tried to keep the sub header as slim as possible, so it should hopefully have a minimal impact on the total vertical height of the header.
I hope that makes sense. I’m not claiming I’m necessarily right, but that’s my reasoning at least. :)
Edit: Also I definitely recommend the enhancement script too. I’m using it myself and I’ve deliberately opted to not include features already present there, even when I had my own solution. Maybe I’ll rethink that later, but that is not my focus right now.
Ah I can see your reasoning now, that does make sense so you can see if there even is a link attached at all.
Also, I am currently running my own script which does fetch the content link for every post and replaces the header link in the feed with the content link, it's not ideal for sure but I'm not a fan of having to click so much to get to the content.
I've now released an update so that you can turn off the subheader if you prefer. :)
Great work :)