DatePicker add-on as SlashCommand

After a chat with @Platinum yesterday about this specific Logseq feature missing in SB.
I had a little spare time today, to make this datepicker slash-command as a SIlverbullet Library

You can find it in Mr-xRed Silverbullet Library Repo

By adding this to your repo sources:

https://github.com/Mr-xRed/silverbullet-libraries/blob/main/Repository/Mr-xRed.md

6 Likes

@Mr.Red have tried “github:deepkn/silverbullet-nldates/nldates.plug.js” it’s amazing to manage dates.

So totally cool @Mr.Red, thank you for sharing this lightning fast!

I’m asking GPT to add keyboard navigation to the dates now!

They both have very different use cases:

  • DatePicker means one doesn’t have to type out a date, even a natural one
  • a lot of people also work visually, which DatePicker solves for neatly
  • and finally, I tried nldates, but found it somewhat limited because I never know what it’s going to recognize and what it’s not. It doesn’t use AI, so it’s limited to what’s coded in it. “First Friday in December” doesn’t work for example.

Done:

  • focus shifts automatically to modal on pop up
  • keyboard navigation:
    • h/j/k/l and arrow keys for changing dates
    • pageup/pagedown for changing months
    • Shift-pageup/down for changing years
    • t to go back to today
  • focus shifts automatically back to editor on close
  • week start day configurable (search for WEEK_START)
  • parameterize the pre/post strings so one can define slash commands to insert [[2025-12-28]], or 2025-12-28 or [scheduled: 2025-12-28] etc.

Here it is.

Now, one can type - [ ] Buy soap /scheduled, and with only a single keystroke (enter), schedule it for today, or use your favorite keys to visually pick a date, and end up with - [ ] Buy soap [scheduled: 2025-12-28]! So cool.

Thank you so much again @Mr.Red, this is terrific!

2 Likes

here is a quick feedback to your version:

:lady_beetle: the arrow key navigation will also move the cursor on the page, making the insertion inacurate and in other place where the slashcommand was inserted… (h/j/k/l works well)

:white_question_mark: this wasn’t an issue in my version.

:lady_beetle: if you change the week to start on Sundays, only the header is changed and everything else stays the same:

:white_check_mark: This is a great addition and flexible approach!

if you correct these bugs, and if you want I can add your changes to my library.

1 Like

Love seeing this collaboration! Very nice.

2 Likes

Much appreciate the feedback @Mr.Red !

Oops on the WEEK_START bug, will fix, probably later today.

The arrow key navigation is not affecting me. Perhaps because it’s doing what you say, but I save and restore the cursor in my latest version? Wouldn’t h/j/k/l also cause the same problem for someone using vim keys in their main editor?

Focus shifting back: hmm, it seemed like a problem for me, perhaps because I was using arrow keys in an earlier version and unwittingly causing focus to go away?

On these two issues, suggestions appreciated, as I know next to nothing about web related things.

1 Like

vim user here so this is very much appreciated.

1 Like

Oh wow, this was a nasty bug. WEEK_START did not work only when set to 0. Feel free to critique my code, first time writing Javascript.

      // old, did not work:
      // const WEEK_START = ]] .. tostring(WEEK_START) .. [[;

      // fixed:
      // Coerce WEEK_START to a number
      const WEEK_START = Number(]] .. tostring(WEEK_START or 0) .. [[) || 0;

Other than this, everything else works at my end @Mr.Red. Feel free to let me know if the arrow keys is still an issue or if not, feel free to merge this code to your repo. Thank you!

Haha i would never do that :stuck_out_tongue:
I also doesn’t consider myself a pro in JS or in any language to be honest. I mostly use LLM to code, and do some debuging and styling by hand. i understand code when i read it, but i couldnt write it without LLM’s :robot:

Yep, I wouldn’t have either. But when set to zero, the injected JS has weekday set to NaN as it somehow doesn’t recognize it.

instead f numbers i would use: true/false for example:
WeekStartSun = true
or something like that, imho better approach than 0/1

It’s actually designed to be configurable to any day, and so, it accepts values between 0 and 6 (can’t be a boolean).

The root issue is how the lua->JS injection is done which necessitated the check for 0 alone as a special case. Apparently this is a common pattern. I’ll leave it this way :slight_smile:

BTW, wondering if you’ve considered picking a license for your repo?