city41/stepcharts

A modern website for DDR stepcharts. Think of them like guitar tabs, but for the songs's dance steps in the game.

Stepcharts

This is a website where Dance Dance Revolution players can browse step charts from the game. The goal is to eventually cover other games like In The Groove as well.

Deployed here: https://ddr.stepcharts.com

Status

A rather solid and decently featured version of the site is live and deployed.

Current features

• all official DDR arcade songs except for Ace for Aces and Chaos Terror Tech-Mix because those two songs require a ssc parser.
• Responsive design, stepcharts are easy to navigate and use on a phone
• printer friendly, printing a stepchart causes it to wrap into columns and utilize the space on the page effectively
• song analysis: jumps, freezes, gallops, stops, drills, tempo shifts, bpm
• all songs page with filtering and sorting
• link to a specific beat in a song, useful if asking for help on a certain part of a song

Still to come features

• ssc parser for the two missing songs
• an "adhoc" page where people can load their own songs, and also share them with other people (via storing the data in the url, this site has no backend)
• more song analysis: crossovers, freeze crossovers, spins, etc
• playlist creation: collect songs you are interested in into a playlist that (hopefully) can be loaded into stepmania
• normalize difficulties to the new scale using RemyWiki data

stretch goal: make stepcharts accurate

Since there are thousands of songs created by many people over the course of 20 years, the accuracy of stepmania stepcharts is in question. It'd be great if this site could grow to address this problem. Something like having a stepchart editor that enables people to make tweaks that fix inaccuracies, and ultimately this site becomes a source of truth on accurate step charts for all DDR mixes.

This is a big undertaking and unsure if it will ever come to fruition

Current effort/bandwidth

as of this writing (March 2, 2021), I have pulled back on working on this site. I will keep contributing but it's no longer a primary focus.

stepcharts's Issues

Print layout isn't working anymore

Hi! The multi-column print layout is currently broken. The page is laid out in single bars across the top of the page. I've reproduced this in desktop Firefox and Android Chromium, and a friend reproduced this in a very differently configured desktop Firefox.

I know you haven't had a chance to work on this project in over a year, so if there's anything I can do on my end to help narrow down the problem and make it easier to fix, let me know. I don't have a ton of web dev experience so I'm not sure I could fix it myself and send a patch...

Printing on Safari has every other page blank

When printing a stepchart in safari, every other page is blank, doubling the number of pages needed.

This does not occur in Chrome, Firefox or Edge.

add bpm sections

for songs that change bpm, show where this happens. perhaps each bpm section of a song should have a colored background

Freezes no longer have tails

Something happened and the tail images in freezes are no longer showing up.

better scroll offset implementation for beat permalinks

To work around the sticky header, beats have scroll-margin-top: 30vh set. This is pretty clunky, has the beat further down the page than desired, and any song with really long details could still cover the beat.

fix: determine how tall the header is, and scroll the chart accordingly.

bonus: this allows the safari specific hack to go away.

Support More Mixes

I noticed there's quite a few games missing here... sorry if this sounds rude:

• Dancing Stage featuring TRUE KiSS DESTiNATiON
• DDR A20+
• DDR A3
• For some reason DDR Solo BASS MIX only has 3 out of the 6 NONSTOP MEGAMIX! songs...?

That's all, love the site :)

Support parsing arbitrary stepchart files

@noahm's stepchart parsing package now makes it easy to parse charts in a browser setting. Comment here.

Look into adding this to stepcharts.

freeze arrow tails get mangled if they cross a section boundary

In this image, the freeze arrow tail looks messed up because it is straddling two sections. This is only a cosmetic problem, the freeze arrow is still stopping at the correct spot.

The fix is to figure out when the tail itself straddles a boundary and put a tail image in both sections accordingly. Sadly, that's pretty tedious.

(The stepchart is divided into sections mostly to enable printing. It allows more flexibility in how a chart is rendered, so allows the stepchart to be displayed in several columns when printed. Before printing was enabled, there were no sections and this bug did not exist)

Support phone portrait mode

The webpage says the page barely fits in landscape mode, just make the UI smaller

using it in landscape mode makes everything too zoomed in anyway

Just saying thanks! ❤

This is a really awesome project, and I appreciate it more each time I come back to read various bits of it. It's the only place I've found anybody publishing javascript code to parse stepfiles and that deserves major props!

I've been meaning to take your parser and extract it out to a separate package for a long time, and I finally did just that! It's over here:
https://www.npmjs.com/package/simfile-parser
https://github.com/noahm/simfile-parser

I already added some early SSC support on top of your code, and I'm using it to import ITG packs into my card draw app now: noahm/DDRCardDraw#86

I'm sure I wouldn't have bothered to take it this far and publish my very first npm package without your high quality starting point. So, thanks for sharing and open sourcing it!

Support 6-panel charts

Hi! This is a really well designed step chart viewer. Thank you so much for making it. I cannot emphasize enough how amazing it is to see a website that does one thing well and loads lightning fast too.

Would it be possible to support viewing the 6-panel charts for songs that have them? These are officially present in Solo Bass Mix, Solo 2000, 4th Mix, and 4th Plus, and there is unused support code in 5th Mix through Extreme but I believe only 5th Mix contains new 6-panel charts. (The charts are present in the data and accessible in a modified version of the game.)

SMX discord feedback

Some suggestions for your site.
1. After you choose a mix the song list is limited to just 2 columns regardless of width.  I'd recommend putting the mix at the top and allowing more columns with a flex-wrap that will adjust based on screen width.
2. Add a global search / dropdown for song title.
3. Add sorting options for songs within a mix based on difficulty, ie. Sort by hard descending.
4. You consider merging the song list with the individual song page.  In each card add another row with the feet icons as links with the number inside. (I think anyone looking up the charts knows what the colors of the feet mean)
feel free to take my suggestions with a grain of salt though =)

I love this!

Hi, not an issue, just grateful. :) I've been looking for a nice TexTage-equivalent for DDR for a while now, and this is it! Thank you so much.