offset audio after playback and add songs

src/utils/Sheet.js

@@ -5,6 +5,7 @@ import DeleteAccountModal from '../components/modal/DeleteAccountModal'
 import DeletePlaybackModal from '../components/modal/DeletePlaybackModal'
 import DeleteAudioModal from '../components/modal/DeleteAudioModal'
 import PlaylistModal from '../components/modal/PlaylistModal'
+import PlaylistAddTracksModal from '../components/modal/PlaylistAddTracksModal'
 import PlaybackPickerModal from '../components/modal/PlaybackPickerModal'
 import ShareModal from '../components/modal/ShareModal'
 import ReportModal from '../components/modal/ReportModal'
@@ -16,6 +17,7 @@ registerSheet('DeleteAccount', DeleteAccountModal)
 registerSheet('DeletePlayback', DeletePlaybackModal)
 registerSheet('DeleteAudio', DeleteAudioModal)
 registerSheet('Playlist', PlaylistModal)
+registerSheet('PlaylistAddTracks', PlaylistAddTracksModal)
 registerSheet('PlaybackPicker', PlaybackPickerModal)
 registerSheet('Share', ShareModal)
 registerSheet('Report', ReportModal)

src/utils/playbackSync.js

@@ -0,0 +1,59 @@
+export const MAX_SYNC_OFFSET_MS = 2000
+export const SYNC_OFFSET_STEP_MS = 50
+
+const toFiniteNumber = (value) => {
+  const numericValue = Number(value ?? 0)
+  return Number.isFinite(numericValue) ? numericValue : 0
+}
+
+export const clampSyncOffsetMs = (value, maxOffsetMs = MAX_SYNC_OFFSET_MS) => {
+  const safeMax = Math.max(0, toFiniteNumber(maxOffsetMs))
+  const safeValue = toFiniteNumber(value)
+  return Math.min(safeMax, Math.max(-safeMax, safeValue))
+}
+
+export const snapSyncOffsetMs = (
+  value,
+  stepMs = SYNC_OFFSET_STEP_MS,
+  maxOffsetMs = MAX_SYNC_OFFSET_MS
+) => {
+  const safeStep = Math.max(1, Math.round(toFiniteNumber(stepMs) || 1))
+  const clampedValue = clampSyncOffsetMs(value, maxOffsetMs)
+  return clampSyncOffsetMs(Math.round(clampedValue / safeStep) * safeStep, maxOffsetMs)
+}
+
+export const getSyncTrimMs = (syncOffsetMs = 0) => {
+  const safeOffsetMs = clampSyncOffsetMs(syncOffsetMs)
+  return {
+    audioTrimMs: safeOffsetMs < 0 ? Math.abs(safeOffsetMs) : 0,
+    videoTrimMs: safeOffsetMs > 0 ? safeOffsetMs : 0,
+  }
+}
+
+export const getTimelinePositionMs = (audioPositionMs = 0, syncOffsetMs = 0) => {
+  const { audioTrimMs } = getSyncTrimMs(syncOffsetMs)
+  return Math.max(0, toFiniteNumber(audioPositionMs) - audioTrimMs)
+}
+
+export const getTimelineDurationMs = (audioDurationMs = 0, syncOffsetMs = 0) => {
+  const { audioTrimMs } = getSyncTrimMs(syncOffsetMs)
+  return Math.max(0, toFiniteNumber(audioDurationMs) - audioTrimMs)
+}
+
+export const getAudioPositionMs = (timelinePositionMs = 0, syncOffsetMs = 0) => {
+  const { audioTrimMs } = getSyncTrimMs(syncOffsetMs)
+  return Math.max(0, toFiniteNumber(timelinePositionMs) + audioTrimMs)
+}
+
+export const getVideoPositionMs = (timelinePositionMs = 0, syncOffsetMs = 0) => {
+  const { videoTrimMs } = getSyncTrimMs(syncOffsetMs)
+  return Math.max(0, toFiniteNumber(timelinePositionMs) + videoTrimMs)
+}
+
+export const formatSyncOffsetMs = (value) => {
+  const safeValue = snapSyncOffsetMs(value)
+  if (safeValue === 0) return '0 ms'
+  return `${safeValue > 0 ? '+' : ''}${safeValue} ms`
+}
+
+export const toSyncOffsetSeconds = (value) => clampSyncOffsetMs(value) / 1000