Adding SVG images to cards

Wow that looks awesome as well!

I also haven’t worked with svg nearly as much as I’d like to, very interesting stuff indeed.

Wow, that’s amazing! Just look at this little guy http://mbilbille.github.io/dmak/#魑魅魍魎 :rofl:

2 Likes

That’s an oddly specific word :stuck_out_tongue: Just looking at it already causes horror

1 Like

Quite a “demonic experience” there :slight_smile:

I made a userscript that uses DMAK in Wanikani if someone missed it :wink: I was playing around with using other data sources for the strokes for nicer calligraphy, but there were too many changes necessary …


@Neicudi, the only thing left for this request is to style something based on a data field, like making a prefecture red as a question or answer.

1 Like

That’s possible with the last update :stuck_out_tongue:

it adds correctclick as a class to the matching elements in the id list. You can combine this with the new styling options to create specific styles during lessons/reviews/lesson-quiz/back/front/correct/incorrect states.

so

.lessons.front .correctclick path{
fill: yellow !important;
}

should work for you to color the prefecture when it’s showing the front during lessons.

Ah, I get it :slight_smile:

Can you use the text input field at the same time? One question type is “please type the name of the highlighted prefecture”, wouldn’t that mean that you can just click it instead of type something?

1 Like

Tried it out ^

Ah yeah that’s correct. The {{addclass:fieldname}} type is coming up after my vacation :slight_smile:

1 Like

I was testing the click functionality a bit, there is something weird (maybe I don’t get it).

Where are you supposed to add {{click:fieldname}}? If I add it to the front only nothing at all gets the correctclick class. If I add it to the back only or both it works on the front side. But on the back side nothing gets correctclick in any case.

I added it to both sides of the card in my tests. Are you testing in lessons or in reviews?

I was testing lessons, it also happens for me in quiz. Searching in the elements gives no elements with class correctclick on the back side for me.

1 Like

I’ll take a look later tonight or tomorrow. Probably a small bug or something

1 Like

Finally I have some time for more test!

Is this still working? When I use it I don’t see the customstyle class appearing anywhere. In addition, using {{type:XX}} and addclass together (on the back side, front works) prevents the transition to the next card somehow, you are stuck.

1 Like

I’ll take a look to see if I can get it fixed with the next update

1 Like

Thanks for all your support! I reworked the design a bit for a “borderless sea”, most things are now in place for a test version where you can play around.

1 Like

Nice! That will definitely make it easier to debug :slight_smile:

Should I share it as fast as possible and just use all the elements as I think they should work, or wait a bit until it is at least a bit usable? You probably some additional description of what is supposed to be visible, I edited quite a bit manually in the mockup :slight_smile:

And can you access the layouts easily?

1 Like

I can access your account through admin rights and check it from there. I’d wait a bit with sharing until this is all figured out :slight_smile:

If you could list everything that you think is missing/not working well, I can look at it point by point

I can’t wait to binge this deck :heart_eyes:

I prepared the deck a bit, there are only three prefecture cards active now. The name is SVG Test Deck. Don’t know how the admin mode works, feel free to mess around with the settings and SRS levels :slight_smile:

There are two type of cards, (1.) a prefecture marked on the map with addclass and you have to type the name in an input field, and (2.) you get the prefecture name and a blank map and you have to click the prefecture, which is styled on the back via .correctclick to show what was expected.

Direct functional problems:

  • addclass doesn’t add a class, so you don’t know what answer is expected in (1.). You can see it by inspecting the input field.
  • for type (1.), a click shouldn’t do anything, but it counts as a (always wrong) answer.

Open issues:

  • I like placeholder texts for the input box :slight_smile:
  • Always lightning mode for (2.) at the moment :stuck_out_tongue:

Other things:

  • I think that addclass is not powerful enough, you only get one customstyle across all your layouts. It would be good to have either a clue which layout you are on during the reviews for appropriate styling, or add an arbitrary classname in the {{addclass}} to style in an arbitrary way.

[I hope I didn’t add some errors to the deck that produce these symptoms, jetlag is affecting me a bit ;-)]


There are only 47 prefectures, the binge will be a short one :smiley:

3 Likes