Brian Schrameck
30bb3f7b43
* BPM metadata enhancement Related to #1036. Adds BPM to the stored metadata about MediaFiles. Displays BPM in the following locations: - Listing songs in the song list (desktop, sortable) - Listing songs in playlists (desktop, sortable) - Listing songs in albums (desktop) - Expanding song details When listing, shows a blank field if no BPM is present. When showing song details, shows a question mark. Updates test MP3 file to have BPM tag. Updated test to ensure tag is read correctly. Updated localization files. Most languages just use "BPM" as discovered during research on Wikipedia. However, a couple use some different nomenclature. Spanish uses PPM and Japanese uses M.M. * Enhances support for BPM metadata extraction - Supports reading floating point BPM (still storing it as an integer) and FFmpeg as the extractor - Replaces existing .ogg test file with one that shouldn't fail randomly - Adds supporting tests for both FFmpeg and TagLib * Addresses various issues with PR #1087. - Adds index for BPM. Removes drop column as it's not supported by SQLite (duh). - Removes localizations for BPM as those will be done in POEditor. - Moves BPM before Comment in Song Details and removes BPM altogether if it's empty. - Omits empty BPM in JSON responses, eliminating need for FunctionField. - Fixes copy/paste error in ffmpeg_test.
78 lines
2.5 KiB
JavaScript
78 lines
2.5 KiB
JavaScript
import React from 'react'
|
|
import Paper from '@material-ui/core/Paper'
|
|
import Table from '@material-ui/core/Table'
|
|
import TableBody from '@material-ui/core/TableBody'
|
|
import TableCell from '@material-ui/core/TableCell'
|
|
import TableContainer from '@material-ui/core/TableContainer'
|
|
import TableRow from '@material-ui/core/TableRow'
|
|
import {
|
|
BooleanField,
|
|
DateField,
|
|
TextField,
|
|
NumberField,
|
|
useTranslate,
|
|
} from 'react-admin'
|
|
import inflection from 'inflection'
|
|
import { BitrateField, SizeField } from './index'
|
|
import { MultiLineTextField } from './MultiLineTextField'
|
|
import { makeStyles } from '@material-ui/core/styles'
|
|
|
|
const useStyles = makeStyles({
|
|
tableCell: {
|
|
width: '17.5%',
|
|
},
|
|
})
|
|
|
|
export const SongDetails = (props) => {
|
|
const classes = useStyles()
|
|
const translate = useTranslate()
|
|
const { record } = props
|
|
const data = {
|
|
path: <TextField record={record} source="path" />,
|
|
album: <TextField record={record} source="album" />,
|
|
discSubtitle: <TextField record={record} source="discSubtitle" />,
|
|
albumArtist: <TextField record={record} source="albumArtist" />,
|
|
genre: <TextField record={record} source="genre" />,
|
|
compilation: <BooleanField record={record} source="compilation" />,
|
|
bitRate: <BitrateField record={record} source="bitRate" />,
|
|
size: <SizeField record={record} source="size" />,
|
|
updatedAt: <DateField record={record} source="updatedAt" showTime />,
|
|
playCount: <TextField record={record} source="playCount" />,
|
|
bpm: <NumberField record={record} source="bpm" />,
|
|
comment: <MultiLineTextField record={record} source="comment" />,
|
|
}
|
|
if (!record.discSubtitle) {
|
|
delete data.discSubtitle
|
|
}
|
|
if (!record.comment) {
|
|
delete data.comment
|
|
}
|
|
if (!record.bpm) {
|
|
delete data.bpm
|
|
}
|
|
if (record.playCount > 0) {
|
|
data.playDate = <DateField record={record} source="playDate" showTime />
|
|
}
|
|
return (
|
|
<TableContainer component={Paper}>
|
|
<Table aria-label="song details" size="small">
|
|
<TableBody>
|
|
{Object.keys(data).map((key) => {
|
|
return (
|
|
<TableRow key={`${record.id}-${key}`}>
|
|
<TableCell scope="row" className={classes.tableCell}>
|
|
{translate(`resources.song.fields.${key}`, {
|
|
_: inflection.humanize(inflection.underscore(key)),
|
|
})}
|
|
:
|
|
</TableCell>
|
|
<TableCell align="left">{data[key]}</TableCell>
|
|
</TableRow>
|
|
)
|
|
})}
|
|
</TableBody>
|
|
</Table>
|
|
</TableContainer>
|
|
)
|
|
}
|