[Userscript] Vertical Reviews

Hello,

I wanted to get some practice reading words vertically, so I made a script that will randomly make short words appear vertically.

There are 3 modes:

  • Always show vertical text (changes the UI a bit to make things fit well - I have not tested this with othe ruserscripts)
  • Only show short words (up to 3 characters vertically)
  • Randomly show short words horizontally and vertically)

Use the box at the bottom of the page to switch views

Link
WaniKani Vertical: Alternates short words about vertical on wani kani, to give vertical reading practice · GitHub and click on “Raw”

It’s just a regular userscript, no need for the framework script.

Screenshots:

2021-06-27_15-35-03

18 Likes

Neat! I’ll try it on my 3pm reviews. I’ve installed a few scripts that change the way the kanji/vocab looks because I noticed how much I struggle recognising even those I know well in the wild.

Thanks

Cool idea! Can we see some screenshots? :slight_smile:

2 Likes

Good point - I really should have added one. (I have done so now)

1 Like

Hiya @lon !
Worked well and totally threw me off so it’s a good thing. I disabled it once and when I re-enabled, it stopped working. I reinstalled, logged out and back in… the usual but it won’t work again. Using chrome on windows 10 and same scripts as before installing yours. The only thing I did was toggling the vertical mode off then back on.

Wish I’d taken some screen shots before. It looks really neat. It would look even better if I installed some font with a handwritten feel to them but maybe I struggle enough as it is.

Edit: Once I got the first vocab done, it started working but not all the time. I took a few screenshots (pardon the quality I was racing to time 100 reviews!). To try also worked for meaning but not reading. At first I thought it was size but black and white is short. I don’t see how font could affect it, but it could be that. I’ll to pay attention to the font when I get a horizontal word.

Also, it looks a bit off for word enders with a ~. I don’t really mind though.

1 Like

@saibaneko
yea, it looks really strange with ~endings. I don’t think there’s really a way around that. The natural thing for the font to do in a vertical scenario is to make a vertical ~. In normal vertical text it’s just an ending and there is no ~ to display, so I guess it’s not something you would really see used often.

As for toggling it on and off, I’m not sure what happens. It uses a random (half) chance of showing shorter words vertically, so maybe you’ve just got incredibly unlucky and it’s always picking the horizontal version.

If you are comfortable editing code, the 16th line says const chance = 0.5; . The Higher this number is, the more likely vertical text will be used for short words. It can go all the way to 1.0.

1 Like

Thanks for the tip. It took me ages to realise that it was random vert vs horizontal. I just thought they would all be vertical. I probably did not read correctly. It felt like most were vertical once started because I probably don’t even notice when it’s not.

I’ll play around with that. I really enjoy it. It’s funny how the brain works. On two part kanji in vocab, I can really feel the adjustment needed in my brain.

1 Like

Great idea for a script. It always throws me kinda off when I try reading something vertically (I got some childrens books with fairy tails) as opposed to the “normal” western left-to-right-system.
I’ll try it out with my 1am review.

EDIT: works great. :slight_smile: Though now I got to pay extra attention because i nearly mistook 室 for two kanji being placed vertically (the different font from the font randomizer probably added to the confusion). ^^’

is this updated to accept more than 3 characters now?

Not right now, to make it work well I’d need to re-organise what the page looks like (I imagine it would need a vertical column). That would make things more difficult to display and to find a way to not cause people eye strain as things randomly move around the page.

If anyone wants to have a go at this, feel free to have a go, and share it. the code is free for you to edit.

Maybe if you set it so stuff doesn’t move around the page once the script is enabled. That is to say, if script is on, the probability of vertical text and layout is 1. So people can use it to get used to vertical text and the layout is your version of an adapted layout so it works with all items.

Thoughts?

Due to popular demand, I’ve updated the script. It now has options where you can switch between the current mode (randomly showing short words vertically) to an always-on mode where all words show vertically. Or you can keep it so just short words always show vertically, and not change the UI too much.

Do let me know if you find this update useful, or if things need tweaking.

3 Likes

still limited to 3 characters?

It has an options drop down at the bottom of the page, next to the little buttons. If you set it to “always”, then there is no character limit.

1 Like

sometimes it shows like this, any idea how to fix?

Do you run any other userscripts?

yes, I have others like advanced context sentence, that shows sentences during reviews and jitai, as you see in the picture, for handwriting.

For me, the vertical review items looked like this, they were squashed together against the top of the window. I’m not sure if it has something to do with another userscript i’m using (just Wanikani Override and Lightning Mode) or if it’s only happening in Firefox or on Mac (which i’m using).

I fixed this by adding a min-height to the last css definition in the script:

body:not(.lonm-alwaysvertical) #character.vocabulary.vertical {
  ...
   min-height: 35vh;
}

Edit: Thanks for the script btw, it’s a good idea!

1 Like

noticed this script hasn’t been working … not a programmer (don’t know if it’s other scripts or wk updates) just pointing it out

It’s working for me. Here’s some info that could help me diagnose it:

  • Your web browser (+version)
  • how you install the script
  • any other scripts you use
  • any browser extensions you use
  • if you right click > “inspect” while on the reviews page > go to console > any red messages

If you give me that info I can take a look at it when I get a free moment