Stardance Mult Utility

I added the code walkthrough!

• I used Nueglow for the syntax highlighting because it’s quick and easy and I like it.
• I only annotated the two most relevant files because I didn’t want to flood the page with a bunch of walkthroughs of tangentially-related code snippets, so I had to draw the line somewhere.

I have mixed feelings about MathML.

I’d never used MathML before, and I was a little worried that it would be extremely complicated and difficult. But really, it was just tedious and verbose. The opaque syntax took a while to get used to, but it’s fairly straightforward.

I added a new section to the site, which renders the formula step-by-step using MathML, substituting the percentile and mult from the other tools.

So when you change the calculator, it also updates the formula. Once I implement the graph, moving the point along the graph will update the calculator and the formula. So it’ll all be unified.

Anyways, now I have a 340+ line Svelte file mostly comprised of a bunch of repetitive MathML tags. Usually I want to refactor really long files, but I don’t think I really can in this case.

I implemented the mult formula!

• I added the percentileToMult() function which basically just reimplements the Ruby code in TypeScript
• I added the multToPercentile() function, which performs the exact mathematical inverse of percentileToMult()
• I added 25 tests to make sure that my formula implementation was correct. I’m glad I tested it, because on my first attempt at the inverse function, I used a logarithm instead of a root 🤦
• I made a Calculator.svelte component and put it on the site, which uses the functions I made

Next I think I’ll work on the annotated Ruby code walkthrough. I also have an idea to use <math> tags to render the steps to compute the formula, which I think would be interesting.

I’ve started working on the site!

You can check it out at https://ethmarks.github.io/sdmu/

I decided that I am going to use SvelteKit, because it gets the job done and I have the most experience with it.

As usual (if you’ve seen any of my other projects, I do this a lot), I’m using a classless CSS stylesheet for the base site styles. I decided to try out Bahunya this time, because it fits the aesthetic that I’m going for.

So far, the only actual functionality is that I embedded the Desmos graph as an iframe. I plan on replacing it with my own graph ASAP, but it’ll stay for now.

Next, I think I’ll work on re-implementing the formula in TypeScript. It’s like 5 operators of basic arithmetic, so it shouldn’t take long at all, though I’ll try to make the code modular so that later I can easily implement the modifiers like blessed and cursed.

Do you wish there was a way to predict how much Stardust your project will get?

Well look no further: @The_Craw made a tool to do that over two months ago: https://www.desmos.com/calculator/ww5xp3gi52. It’s been mentioned literally multiple dozens of times in the Slack.

But do you wish that the graph had more features? No? Well too bad, because I’m making it anyways.

Here are some of the planned features of Stardance Mult Utility:

• Interactive graph of percentile vs multiplier. Like the Desmos graph, but not using Desmos. Idk what I’m going to use instead. Probably some kind of graphing component.
• Exact/direct calculator. This is for if you want an exact value rather than just estimating via the graph. If you want to know what multiplier a specific percentile will earn, then you just type it into the little box and it’ll output an answer. But it also works in the other direction, if you want to know what percentile you’ll need for a specific multiplier.
• Annotated walkthrough of the actual Ruby code that the Stardance codebase uses, so you can learn exactly how it works behind the scenes.
• Percentile calculator. I’m only like 70% clear on the exact method that Stardance uses to calculate percentile from the category ratings, so I’ll have to look through the codebase more thoroughly to figure it out. But once I do, I hope to have a way that you can convert the ratings in each category (Originality, Technicality, Usability, Storytelling) into a percentile, and then into a multiplier.
• Blessed/cursed/viral modifiers. These will modify the other tools to show what’ll happen if your ship is blessed, cursed, or viral.
• 30x max mult simulator. Did you know that the max mult used to be 30x before they changed it to 20x when they added blessed/cursed/viral modifiers?

I don’t know what tech stack I’m going to use. I haven’t thought that far ahead, lol. It’s definitely going to be a web project, and I’ll probably use SvelteKit. but I don’t know what library/component I’ll use to make the interactive graph, because I’ve never done anything like this before, so I’ll have to research it along the way.