feat: milthm chart support

package.json

@@ -57,7 +57,7 @@
     "tslib": "^2.8.1",
     "typescript": "^5.7.3",
     "typescript-eslint": "^8.22.0",
-    "vite": "^6.1.6"
+    "vite": "^6.4.1"
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "^6.7.2",
@@ -68,6 +68,7 @@
     "chart.js": "^4.4.7",
     "dompurify": "^3.2.4",
     "escape-goat": "^4.0.0",
+    "jszip": "^3.10.1",
     "object-to-formdata": "^4.5.1",
     "qrcode": "^1.5.4",
     "query-string": "^9.1.1",

src/lib/api/chart.ts

@@ -16,6 +16,7 @@ export enum ChartFormat {
   Pec,
   PhiZone,
   Phigrim,
+  Milthm,
   Unsupported,
 }
 
@@ -25,6 +26,10 @@ export enum ChartLevel {
   IN,
   AT,
   SP,
+  DZ,
+  SK,
+  CB,
+  CL,
 }
 
 export interface ChartDto {

src/lib/components/SongSubmissionForm.svelte

@@ -4,7 +4,7 @@
   import RangeSlider from 'svelte-range-slider-pips';
   import { superForm } from 'sveltekit-superforms';
 
-  import type { Bpm, ChartBundle, RpeJson } from '$lib/types';
+  import type { Bpm, ChartBundle, MilthmJson, RpeJson } from '$lib/types';
 
   import { page } from '$app/state';
   import Tag from '$lib/components/Tag.svelte';
@@ -75,32 +75,65 @@
 
   $effect(() => {
     (async () => {
-      const chart = await bundle.resources.chart.text();
-      const { BPMList, META }: RpeJson = JSON.parse(chart);
+      const chartText = await bundle.resources.chart.text();
+      const chartJson = JSON.parse(chartText);
 
       $form.Title = bundle.metadata.title;
       $form.Illustrator = bundle.metadata.illustrator ?? '';
-      $form.Offset = META.offset;
-
-      bpmList = BPMList;
-
-      let lastBpm = 0;
-      let lastBeat = 0;
-      let lastTimeSec = 0;
-      bpmList.forEach((bpm, i) => {
-        bpm.startBeat = toBeats(bpm.startTime);
-        bpm.startTimeSec =
-          i === 0 ? lastTimeSec : lastTimeSec + ((bpm.startBeat - lastBeat) / lastBpm) * 60;
-        lastBpm = bpm.bpm;
-        lastBeat = bpm.startBeat;
-        lastTimeSec = bpm.startTimeSec;
-      });
-
-      const bpmArr = bpmList.map((bpm) => bpm.bpm);
-      $form.MinBpm = Math.min(...bpmArr);
-      $form.MaxBpm = Math.max(...bpmArr);
-      if ($form.MinBpm === $form.MaxBpm) {
-        $form.Bpm = $form.MinBpm;
+
+      if ('META' in chartJson && 'BPMList' in chartJson) {
+        const { BPMList, META } = chartJson as RpeJson;
+        $form.Offset = META.offset;
+
+        bpmList = BPMList;
+
+        let lastBpm = 0;
+        let lastBeat = 0;
+        let lastTimeSec = 0;
+        bpmList.forEach((bpm, i) => {
+          bpm.startBeat = toBeats(bpm.startTime);
+          bpm.startTimeSec =
+            i === 0 ? lastTimeSec : lastTimeSec + ((bpm.startBeat - lastBeat) / lastBpm) * 60;
+          lastBpm = bpm.bpm;
+          lastBeat = bpm.startBeat;
+          lastTimeSec = bpm.startTimeSec;
+        });
+
+        const bpmArr = bpmList.map((bpm) => bpm.bpm);
+        $form.MinBpm = Math.min(...bpmArr);
+        $form.MaxBpm = Math.max(...bpmArr);
+        if ($form.MinBpm === $form.MaxBpm) {
+          $form.Bpm = $form.MinBpm;
+        }
+      } else if ('lines' in chartJson && 'meta' in chartJson) {
+        const { bpms, meta } = chartJson as MilthmJson;
+        $form.Offset = Math.round(meta.offset * 100);
+
+        bpmList = bpms.map((b) => ({
+          bpm: b.bpm,
+          startTime: b.time,
+          startBeat: 0,
+          startTimeSec: 0,
+        }));
+
+        let lastBpm = 0;
+        let lastBeat = 0;
+        let lastTimeSec = 0;
+        bpmList.forEach((bpm, i) => {
+          bpm.startBeat = toBeats(bpm.startTime);
+          bpm.startTimeSec =
+            i === 0 ? lastTimeSec : lastTimeSec + ((bpm.startBeat - lastBeat) / lastBpm) * 60;
+          lastBpm = bpm.bpm;
+          lastBeat = bpm.startBeat;
+          lastTimeSec = bpm.startTimeSec;
+        });
+
+        const bpmArr = bpmList.map((bpm) => bpm.bpm);
+        $form.MinBpm = Math.min(...bpmArr);
+        $form.MaxBpm = Math.max(...bpmArr);
+        if ($form.MinBpm === $form.MaxBpm) {
+          $form.Bpm = $form.MinBpm;
+        }
       }
     })();
   });

src/lib/constants.ts

@@ -15,7 +15,17 @@ export const USER_LEVELS = [
   { exp: 100000, level: 10 },
 ];
 
-export const LEVEL_TYPES = ['EZ', 'HD', 'IN', 'AT', 'SP'];
+export const LEVEL_TYPES = [
+  'EZ',
+  'HD',
+  'IN',
+  'AT',
+  'SP',
+  'DZ',
+  'SK',
+  'CB',
+  'CL',
+];
 
 export const SONG_MATCH_SCORE_THRESHOLD = 8e3;
 

src/lib/translations/en-US/common.json

@@ -105,7 +105,7 @@
     "song_preview": "Song Preview",
     "tips": {
       "audio": "MP3 / FLAC / WAV / OGG, no larger than 50 MB",
-      "chart": "Only charts made with PE / RPE are supported, no larger than 50 MB",
+      "chart": "Only charts created by PE / RPE / Rain Editor are supported, no larger than 50 MB",
       "chart_level": "EZ / HD / IN / AT / SP / FM / Custom / ……",
       "illustration": "JPG / JPEG / PNG / WEBP, no larger than 10 MB, 16:9, no smaller than 960×540",
       "image": "JPG / JPEG / PNG / WEBP, no larger than 10 MB",

src/lib/translations/en-US/studio.json

@@ -6,7 +6,7 @@
   "chart_submission": "Chart Submission",
   "chart_submissions": "Chart Submissions",
   "choose_chart": "Choose Chart",
-  "choose_chart_description": "Please select a compressed file (.pez or .zip) containing an RPE or PE chart. The file must include at least a chart file, an audio file, and an Illustration file.",
+  "choose_chart_description": "Only PE / RPE / Rain Editor created charts are supported, not larger than 50 MB",
   "collaboration": "Collaboration",
   "collaborations": "Collaborations",
   "collection_admission": "Collection Admission",
@@ -30,6 +30,7 @@
   },
   "session": {
     "chart_confirmation_notice": "Please verify the chart's performance and offset using PhiZone Player for this step. Once confirmed, click the \"Export\" button.",
+    "milthm_preview_not_supported": "Milthm chart preview is not supported yet",
     "pci_description": "Your submission might be restricted or rejected due to copyright issues. Listed are resource records whose copyright may have been potentially infringed by your submission.",
     "potential_copyright_infringements": "Potential Infringing Songs",
     "potential_song_duplicates": "Potential Duplicate Songs",

src/lib/translations/ja-JP/common.json

@@ -105,7 +105,7 @@
     "song_preview": "曲目预览",
     "tips": {
       "audio": "50 MB 又は更に小さい MP3 / FLAC / WAV / OGG",
-      "chart": "仅支持 PE / RPE 创作的谱面，不大于 50 MB",
+      "chart": "仅支持 PE / RPE / Rain Editor 创作的谱面，不大于 50 MB",
       "chart_level": "EZ / HD / IN / AT / SP / FM / Custom / ……",
       "illustration": "10 MB 又は更に小さい JPG / JPEG / PN / WEBP、比は 16:9、解像度は960x540 未満でなければなりません",
       "image": "10 MB 又は更に小さい JPG / JPEG / PNG / WEBP",

src/lib/translations/ja-JP/studio.json

@@ -6,7 +6,7 @@
   "chart_submission": "谱面稿件",
   "chart_submissions": "谱面稿件",
   "choose_chart": "选择谱面",
-  "choose_chart_description": "请在此处选择包含 RPE 或 PE 谱面的压缩包（.pez 或 .zip），并且须至少包含谱面、曲目、曲绘文件。",
+  "choose_chart_description": "PE / RPE / Rain Editor で作成された譜面のみ対応しています。50MB以下。",
   "collaboration": "合作邀请",
   "collaborations": "合作邀请",
   "collection_admission": "合集收录申请",

src/lib/translations/zh-CN/chart.json

@@ -33,7 +33,8 @@
     "1": "PhiEditer 谱面",
     "2": "PhiZone 谱面",
     "3": "Phigrim 谱面",
-    "4": "未受支持"
+    "4": "Milthm 谱面",
+    "5": "未受支持"
   },
   "gameplay": "游玩体验",
   "highest_difficulty": "最高定数",
@@ -56,7 +57,11 @@
     "1": "HD",
     "2": "IN",
     "3": "AT",
-    "4": "SP"
+    "4": "SP",
+    "5": "DZ",
+    "6": "SK",
+    "7": "CB",
+    "8": "CL"
   },
   "lowest_difficulty": "最低定数",
   "lowest_note_count": "最低物量",

src/lib/translations/zh-CN/common.json

@@ -105,7 +105,7 @@
     "song_preview": "曲目预览",
     "tips": {
       "audio": "50 MB 或更小的 MP3 / FLAC / WAV / OGG",
-      "chart": "仅支持 PE / RPE 创作的谱面，不大于 50 MB",
+      "chart": "仅支持 PE / RPE / Rain Editor 创作的谱面，不大于 50 MB",
       "chart_level": "EZ / HD / IN / AT / SP / FM / Custom / ……",
       "illustration": "10 MB 或更小的 JPG / JPEG / PNG / WEBP，长宽比须为 16:9，分辨率不得低于 960×540",
       "image": "10 MB 或更小的 JPG / JPEG / PNG / WEBP",

src/lib/translations/zh-CN/studio.json

@@ -6,7 +6,7 @@
   "chart_submission": "谱面稿件",
   "chart_submissions": "谱面稿件",
   "choose_chart": "选择谱面",
-  "choose_chart_description": "请在此处选择包含 RPE 或 PE 谱面的压缩包（.pez 或 .zip），并且须至少包含谱面、曲目、曲绘文件。",
+  "choose_chart_description": "仅支持 PE / RPE / Rain Editor 创作的谱面，不大于 50 MB",
   "collaboration": "合作邀请",
   "collaborations": "合作邀请",
   "collection_admission": "合集收录申请",
@@ -30,6 +30,7 @@
   },
   "session": {
     "chart_confirmation_notice": "请在本步骤使用 PhiZone Player 确认谱面的表现情况与谱面延迟。如完成确认，请点击“导出”按钮。",
+    "milthm_preview_not_supported": "暂不支持Milthm谱面预览",
     "pci_description": "你提交的稿件可能会因版权问题而受到限制或被退回。此处列出了你的稿件可能侵犯其版权的资源记录。",
     "potential_copyright_infringements": "疑似侵权的曲目",
     "potential_song_duplicates": "疑似重复的曲目",
@@ -128,4 +129,4 @@
   "upload_chart": "上传谱面",
   "upload_song": "上传曲目",
   "view_guide": "查看指南"
-}
+}

src/lib/translations/zh-TW/common.json

@@ -105,7 +105,7 @@
     "song_preview": "曲目預覽",
     "tips": {
       "audio": "50 MB 或更小的 MP3 / FLAC / WAV / OGG",
-      "chart": "僅支援 PE / RPE 創作的譜面，不大於 50 MB",
+      "chart": "僅支援 PE / RPE / Rain Editor 創作的譜面，不大於 50 MB",
       "chart_level": "EZ / HD / IN / AT / SP / FM / Custom / ……",
       "illustration": "10 MB 或更小的 JPG / JPEG / PNG / WEBP，長寬比必須為 16:9，解析度不得低於 960×540",
       "image": "10 MB 或更小的 JPG / JPEG / PNG / WEBP",

src/lib/translations/zh-TW/studio.json

@@ -6,7 +6,7 @@
   "chart_submission": "譜面稿件",
   "chart_submissions": "譜面稿件",
   "choose_chart": "选择谱面",
-  "choose_chart_description": "请在此处选择包含 RPE 或 PE 谱面的压缩包（.pez 或 .zip），并且须至少包含谱面、曲目、曲绘文件。",
+  "choose_chart_description": "僅支持 PE / RPE / Rain Editor 創作的譜面，不大於 50 MB",
   "collaboration": "合作邀請",
   "collaborations": "合作邀請",
   "collection_admission": "合集收錄申請",

src/lib/types.ts

@@ -49,3 +49,18 @@ export interface RpeJson {
   BPMList: Bpm[];
   META: RpeMeta;
 }
+
+export interface MilthmMeta {
+  offset: number;
+}
+
+export interface MilthmBpm {
+  bpm: number;
+  time: [number, number, number];
+}
+
+export interface MilthmJson {
+  meta: MilthmMeta;
+  bpms: MilthmBpm[];
+  lines: unknown[];
+}

src/lib/utils.ts

@@ -227,6 +227,16 @@ export const getLevelColor = (type: number | undefined) => {
       return 'btn-primary';
     case 3:
       return '';
+    case 4:
+      return 'btn-accent';
+    case 5:
+      return 'btn-success';
+    case 6:
+      return 'btn-info';
+    case 7:
+      return 'btn-error';
+    case 8:
+      return '';
     default:
       return 'btn-accent';
   }

src/routes/(app)/studio/chart-submissions/new/+page.svelte

@@ -2,6 +2,7 @@
   import { createQuery } from '@tanstack/svelte-query';
   import { superForm } from 'sveltekit-superforms';
 
+  import { browser } from '$app/environment';
   import type { SongSubmissionDto } from '$lib/api';
   import type { SongDto } from '$lib/api/song';
 
@@ -52,7 +53,7 @@
     createQuery(
       api.song.submission.listAll(
         { order: ['dateCreated'], desc: [true] },
-        { enabled: !songSwitch },
+        { enabled: browser && !songSwitch },
       ),
     ),
   );
@@ -194,7 +195,7 @@
                 type="file"
                 id="file"
                 name="File"
-                accept=".json, .pec"
+                accept=".json, .pec, .zip"
                 class={`w-1/3 file:mr-4 file:py-2 file:border-0 file:btn ${
                   $errors.File
                     ? 'input-error file:btn-error'