![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
![[site community profile]](https://www.dreamwidth.org/img/comm_staff.png){kind=small}
[dreamwidth/dw-free] 225139: Sort the array returned by $userpic->keywords
Branch: refs/heads/master Home: https://github.com/dreamwidth/dw-free Commit: 2251399a8c22d57f19ceca5e3fcfc1601d35d863 https://github.com/dreamwidth/dw-free/commit/2251399a8c22d57f19ceca5e3fcfc1601d35d863 Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M cgi-bin/LJ/Userpic.pm
Log Message:
Sort the array returned by $userpic->keywords
There's an original order for the submitted keywords stored somewhere... but because we sort alphabetically when building the text field for changing the icon's keywords, that order effectively does not exist. Since it doesn't exist, we should expose it Nowhere, and consistently alphabetize.
Commit: a4e558d720f737b29f0e7cfe7005cb92b3d03371 https://github.com/dreamwidth/dw-free/commit/a4e558d720f737b29f0e7cfe7005cb92b3d03371 Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M bin/upgrading/proplists.dat M cgi-bin/DW/Controller/Entry.pm M cgi-bin/DW/Controller/RPC/IconBrowserOptions.pm M cgi-bin/LJ/Talk.pm M cgi-bin/LJ/User/Permissions.pm M cgi-bin/LJ/Web.pm M htdocs/js/jquery.replyforms.js M views/entry/form.tt M views/journal/quickreply.tt M views/journal/talkform.tt
Log Message:
New userprop: iconbrowser_keyword order
This commit adds a new prop for sorting the icon browser by keyword instead of date, and wires it through all of the perl and TT stuff for things that invoke the icon browser or act on that userprop.
Commit: 026efca1fedd8e0221b0b7f5648b2923692579f9 https://github.com/dreamwidth/dw-free/commit/026efca1fedd8e0221b0b7f5648b2923692579f9 Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M htdocs/js/components/jquery.icon-browser.js M htdocs/scss/components/icon-browser.scss M views/components/icon-browser.tt
Log Message:
Icon browser: Enable sort by keyword order, change toggles to radio buttons
Bask in the analog warmth of plain-ass web controls. Ahhhh.
I'm using custom events to trigger the sorting, due to the slightly odd design of that Options object -- it holds a reference to the modal's HTML element, but can't access very much of its internal state, so it needs to send a message indirectly if it's doing anything wilder than just setting a CSS class on the container.
Commit: 9da1bafeaa6116bb825421edb9262713ee3bcacd https://github.com/dreamwidth/dw-free/commit/9da1bafeaa6116bb825421edb9262713ee3bcacd Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M htdocs/js/components/jquery.icon-browser.js M views/journal/quickreply.tt M views/journal/talkform.tt
Log Message:
Icon browser: Focus message body after dismissal, for comments
For the create entries page, I'm leaving focus on the icon selector, since the page is more spread out and modularized.
Commit: c0d5c7ede49daa819869fcc0f65133eebf02f6a0 https://github.com/dreamwidth/dw-free/commit/c0d5c7ede49daa819869fcc0f65133eebf02f6a0 Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M htdocs/js/components/jquery.icon-browser.js M htdocs/scss/components/icon-browser.scss
Log Message:
Icon browser: Visual and behavioral revisions
No text means no text: Yank the keywords menu that appeared below the active icon in no-text mode. This was there to support a workflow that the browser's previous design also bent over backwards to enable (picking a specific keyword for a multi-keyword icon while in no-text mode), but on investigation with some of the userbase, it turned out maybe no one actually wanted that workflow.
Yes text means less text: Yank the "comment" text, which wastes a ton of precious space and which (while interesting in its home context on the icons page) isn't relevant to choosing which icon to use for this post.
One-click and done: As best as I can tell, the icon browser's two-clicks-to-finish interaction was only ever there to accommodate the "pick specific keyword from no-text" workflow, which is now gone. So let's cut the clicks in half: clicking an icon selects its first keyword, and clicking a keyword in yes-text mode selects that keyword. This also lets us remove the "Select" button entirely, which saves some space and kills off a source of jump-around annoyance.
Revised markup: we're now using normal button elements to represent the clickable icon and keyword buttons, instead of mutant
<a>elements with an aria role set. This gives better tab and focus behavior in some browsers (Firefox uses a better focus ring style for buttons than for mutant tabbables), and ought to yield better accessibility. Required a mass of knock-on changes everywhere in the JS and CSS, naturally.Focus previous icon: Previous design was to focus the search field when summoning the icon browser (except it was unreliable so I fixed it). This amends that, so that if you already selected an icon (either with the browser or the menu), that icon's button gets focused when summoning the browser again. That way, you can use tab to navigate nearby icons. AS A WILD BONUS, it turns out that in some browsers (desktop FF and Safari, so far) this scrolls the currently selected icon into view, so if you accidentally chose the wrong icon when you wanted the one next to it, you're in perfect position to switch your pick if you open the browser again.
Minor filter tweaks: Now that we're doing one-click-and-done, the intermediate "selected" state doesn't really mean anything (except when indicating the current value of the actual form element). So I changed the search filter to not change the "selected" state. For an all-keyboard flow, just tab out of the search field to focus the desired icon instead of filtering down to exactly one and hitting enter.
Visual updates: Centering and aligning things a bit more nicely, and revising the "small + text" mode to hopefully waste less space.
Commit: 140ffda28a92fe32dcb889afe9f10caefaac2797 https://github.com/dreamwidth/dw-free/commit/140ffda28a92fe32dcb889afe9f10caefaac2797 Author: Nick Fagerlund nick.fagerlund@gmail.com Date: 2020-08-09 (Sun, 09 Aug 2020)
Changed paths: M cgi-bin/DW/Controller/Entry.pm M cgi-bin/LJ/Talk.pm M cgi-bin/LJ/Web.pm
Log Message:
Tidy
Compare: https://github.com/dreamwidth/dw-free/compare/2aae96e56d69...140ffda28a92