Implement mousewheel scrolling for song list

src/game/select.ts

@@ -32,6 +32,11 @@ export class SelectScreen implements Screen {
     this.songInfo = util.getElement(container, '#song-info');
     this.songList = util.getElement(container, '#song-list');
 
+    this.songList.addEventListener('wheel', (event) => {
+      event.preventDefault();
+      this.activeListController.handleScroll(event.deltaY);
+    });
+
     this.listControllers = [];
     this.levelSets.forEach((levelSet) => {
       let controller = new SongListController(
@@ -203,6 +208,14 @@ class SongListController {
     }
   }
 
+  handleScroll(deltaY: number): void {
+    if (deltaY > 0) {
+      this.scroll(1);
+    } else if (deltaY < 0) {
+      this.scroll(-1);
+    }
+  }
+
   scroll(offset: number) {
     let target = this.currentIndex + offset;
     target = Math.max(0, Math.min(this.levels.length - 1, target));

src/style.css

@@ -136,6 +136,11 @@
   left: 18.75em;
 }
 
+#container div#song-list {
+  /* override default */
+  pointer-events: auto;
+}
+
 #folder-info {
   grid-column: start / left;
   grid-row: top / header;