Merge pull request #522 from Zagrios/bugfix/495/bug-custom-map-runtime-not-displaying-correctly-in-bsmanager

[bugfix] fix sometimes maps duration were wrong
This commit is contained in:
MathieuG-P
2024-07-21 15:41:10 +02:00
committed by GitHub
8 changed files with 39 additions and 24 deletions
+8 -2
View File
@@ -1,12 +1,12 @@
{
"name": "bs-manager",
"version": "1.5.0",
"version": "1.5.0-alpha.1",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "bs-manager",
"version": "1.5.0",
"version": "1.5.0-alpha.1",
"hasInstallScript": true,
"license": "MIT",
"dependencies": {
@@ -27,6 +27,7 @@
"electron-store": "^8.1.0",
"electron-updater": "^6.2.1",
"fast-deep-equal": "^3.1.3",
"format-duration": "^3.0.2",
"framer-motion": "^11.2.6",
"fs-extra": "^11.2.0",
"got": "^14.4.1",
@@ -12763,6 +12764,11 @@
"node": ">= 18"
}
},
"node_modules/format-duration": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/format-duration/-/format-duration-3.0.2.tgz",
"integrity": "sha512-pKzJDSRgK2lqAiPW3uizDaIJaJnataZclsahz25UMwfdryBGDa+1HlbXGjzpMvX/2kMh4O0sNevFXKaEfCjHsA=="
},
"node_modules/formdata-polyfill": {
"version": "4.0.10",
"resolved": "https://registry.npmjs.org/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz",
+1
View File
@@ -248,6 +248,7 @@
"electron-store": "^8.1.0",
"electron-updater": "^6.2.1",
"fast-deep-equal": "^3.1.3",
"format-duration": "^3.0.2",
"framer-motion": "^11.2.6",
"fs-extra": "^11.2.0",
"got": "^14.4.1",
@@ -2,8 +2,7 @@ import { BsvMapDetail, MapFilter, MapRequirement, MapSpecificity, MapStyle, MapT
import { motion } from "framer-motion";
import { MutableRefObject, useEffect, useRef, useState } from "react";
import { BsmCheckbox } from "../../shared/bsm-checkbox.component";
import { minToS } from "../../../../shared/helpers/time.helpers";
import dateFormat from "dateformat";
import { minToS, sToMs } from "../../../../shared/helpers/time.helpers";
import { BsmRange } from "../../shared/bsm-range.component";
import { useTranslation } from "renderer/hooks/use-translation.hook";
import { MAP_DIFFICULTIES_COLORS } from "shared/models/maps/difficulties-colors";
@@ -13,6 +12,7 @@ import clone from "rfdc";
import { GlowEffect } from "../../shared/glow-effect.component";
import { BsmLocalMap } from "shared/models/maps/bsm-local-map.interface";
import { SongDetails } from "shared/models/maps";
import formatDuration from "format-duration";
export type Props = {
className?: string;
@@ -60,9 +60,8 @@ export function FilterPanel({ className, ref, playlist = false, filter, localDat
if (sec === MAX_DURATION) {
return "∞";
}
const date = new Date(0);
date.setSeconds(sec);
return sec > 3600 ? dateFormat(date, "h:MM:ss") : dateFormat(date, "MM:ss");
const ms = sToMs(sec);
return formatDuration(ms, { leading: true });
})();
return renderLabel(textValue, sec === MAX_DURATION);
@@ -4,7 +4,7 @@ import { BsmLink } from "../../shared/bsm-link.component";
import { BsmIcon } from "../../svgs/bsm-icon.component";
import { BsmButton } from "../../shared/bsm-button.component";
import { AnimatePresence, motion } from "framer-motion";
import { useState, Fragment, useRef } from "react";
import { useState, Fragment, useRef, useMemo } from "react";
import { LinkOpenerService } from "renderer/services/link-opener.service";
import dateFormat from "dateformat";
import { AudioPlayerService } from "renderer/services/audio-player.service";
@@ -30,6 +30,8 @@ import { BsmCheckbox } from "renderer/components/shared/bsm-checkbox.component";
import { BPListDifficulty } from "shared/models/playlists/playlist.interface";
import { useOnUpdate } from "renderer/hooks/use-on-update.hook";
import { cn } from "renderer/helpers/css-class.helpers";
import { sToMs } from "shared/helpers/time.helpers";
import formatDuration from "format-duration";
export type MapItemComponentProps<T = unknown> = {
hash: string;
@@ -106,14 +108,13 @@ export function MapItemComponent <T = unknown>({ hash, title, autor, songAutor,
return dateFormat(date, "d mmm yyyy");
});
const durationText = (() => {
const durationText = useMemo(() => {
if (!duration) {
return null;
}
const date = new Date(0);
date.setSeconds(duration);
return duration > 3600 ? dateFormat(date, "h:MM:ss") : dateFormat(date, "MM:ss");
})();
const durationMs = sToMs(duration);
return formatDuration(durationMs, { leading: true });
}, [duration]);
const parseDiffLabel = (diffLabel: string) => {
if (MAP_DIFFICULTIES.includes(diffLabel as SongDiffName)) {
@@ -3,9 +3,9 @@ import { Dispatch, SetStateAction, useState } from "react";
import { BsmRange } from "renderer/components/shared/bsm-range.component";
import { cn } from "renderer/helpers/css-class.helpers"
import { useTranslation } from "renderer/hooks/use-translation.hook";
import dateFormat from "dateformat";
import { hourToS, sToMs } from "shared/helpers/time.helpers";
import { useOnUpdate } from "renderer/hooks/use-on-update.hook";
import formatDuration from "format-duration";
type Props = {
className?: string;
@@ -81,7 +81,8 @@ export function LocalPlaylistFilterPanel({ className, filter, onChange }: Props)
return "∞";
}
return sec > 3600 ? dateFormat(sToMs(sec), "h:MM:ss") : dateFormat(sToMs(sec), "MM:ss");
const ms = sToMs(sec);
return formatDuration(ms, { leading: true });
})();
return renderLabel(textValue, sec === MAX_DURATION);
@@ -5,7 +5,6 @@ import { ClockIcon } from 'renderer/components/svgs/icons/clock-icon.component';
import { MapIcon } from 'renderer/components/svgs/icons/map-icon.component';
import { PersonIcon } from 'renderer/components/svgs/icons/person-icon.component';
import { useThemeColor } from 'renderer/hooks/use-theme-color.hook';
import dateFormat from 'dateformat';
import { NpsIcon } from 'renderer/components/svgs/icons/nps-icon.component';
import { GlowEffect } from 'renderer/components/shared/glow-effect.component';
import { memo, useState } from 'react';
@@ -18,6 +17,8 @@ import { BsmBasicSpinner } from 'renderer/components/shared/bsm-basic-spinner/bs
import defaultImage from "../../../../../assets/images/default-version-img.jpg";
import equal from 'fast-deep-equal';
import { useTranslation } from 'renderer/hooks/use-translation.hook';
import { sToMs } from 'shared/helpers/time.helpers';
import formatDuration from 'format-duration';
export type PlaylistItemComponentProps = {
title?: string;
@@ -79,10 +80,14 @@ export const PlaylistItem = memo(({ title,
const showNps = minNps !== undefined && maxNps !== undefined;
const durationText = (() => {
console.log("DURATION", duration);
if (!duration) {
return null;
}
return duration > 3600 ? dateFormat(duration * 1000, "h:MM:ss") : dateFormat(duration * 1000, "MM:ss");
const durationMs = sToMs(duration);
return formatDuration(durationMs, { leading: true });
})();
return (
@@ -27,7 +27,6 @@ import { MapIcon } from "renderer/components/svgs/icons/map-icon.component";
import { PersonIcon } from "renderer/components/svgs/icons/person-icon.component";
import { ClockIcon } from "renderer/components/svgs/icons/clock-icon.component";
import { NpsIcon } from "renderer/components/svgs/icons/nps-icon.component";
import dateFormat from 'dateformat';
import { getCorrectTextColor } from "renderer/helpers/correct-text-color";
import { BPList, BPListDifficulty, PlaylistSong } from "shared/models/playlists/playlist.interface";
import { EditPlaylistInfosModal } from "./edit-playlist-infos-modal.component";
@@ -37,6 +36,8 @@ import { BsmImage } from "renderer/components/shared/bsm-image.component";
import BeatWaiting from "../../../../../../../assets/images/apngs/beat-waiting.png";
import BeatConflict from "../../../../../../../assets/images/apngs/beat-conflict.png";
import { findHashInString } from "shared/helpers/string.helpers";
import { sToMs } from "shared/helpers/time.helpers";
import formatDuration from "format-duration";
type Props = {
maps$: Observable<BsmLocalMap[]>;
@@ -362,6 +363,7 @@ export const EditPlaylistModal: ModalComponent<BPList, Props> = ({ resolver, opt
const playlistDuration = useMemo(() => {
if(!playlistMaps || Object.keys(playlistMaps).length === 0){ return "0:00"; }
const durations = Object.values(playlistMaps ?? {}).map(playlistMap => {
if(!playlistMap?.map){ return 0; }
@@ -380,8 +382,8 @@ export const EditPlaylistModal: ModalComponent<BPList, Props> = ({ resolver, opt
return 0;
}).filter(duration => !Number.isNaN(duration));
const totalDuration = durations.reduce((acc, duration) => acc + duration, 0);
return totalDuration > 3600 ? dateFormat(totalDuration * 1000, "H:MM:ss") : dateFormat(totalDuration * 1000, "MM:ss");
const totalDuration = sToMs(durations.reduce((acc, duration) => acc + duration, 0));
return formatDuration(totalDuration, { leading: true });
}, [playlistMaps]);
const [playlistMinNps, playlistMaxNps] = useMemo(() => {
@@ -1,6 +1,5 @@
import { ReactNode } from "react"
import { BsmImage } from "renderer/components/shared/bsm-image.component";
import dateFormat from "dateformat";
import { MapIcon } from "renderer/components/svgs/icons/map-icon.component";
import { PersonIcon } from "renderer/components/svgs/icons/person-icon.component";
import { ClockIcon } from "renderer/components/svgs/icons/clock-icon.component";
@@ -9,6 +8,8 @@ import { useThemeColor } from "renderer/hooks/use-theme-color.hook";
import { ThemeColorGradientSpliter } from "renderer/components/shared/theme-color-gradient-spliter.component";
import { CrossIcon } from "renderer/components/svgs/icons/cross-icon.component";
import { useTranslation } from "renderer/hooks/use-translation.hook";
import { sToMs } from "shared/helpers/time.helpers";
import formatDuration from "format-duration";
export type PlaylistDetailsTemplateProps = {
title: string;
@@ -40,9 +41,8 @@ export function PlaylistDetailsTemplate({title, imagebase64, imageUrl, author, d
if (!duration) {
return null;
}
const date = new Date(0);
date.setSeconds(duration);
return duration > 3600 ? dateFormat(date, "h:MM:ss") : dateFormat(date, "MM:ss");
const durationMs = sToMs(duration);
return formatDuration(durationMs, { leading: true });
})();
return (