diff --git a/frontend/src/EpisodeFile/MediaInfo.js b/frontend/src/EpisodeFile/MediaInfo.js index 75b264d58..fa6f87f04 100644 --- a/frontend/src/EpisodeFile/MediaInfo.js +++ b/frontend/src/EpisodeFile/MediaInfo.js @@ -1,12 +1,37 @@ +import _ from 'lodash'; import PropTypes from 'prop-types'; import React from 'react'; import * as mediaInfoTypes from './mediaInfoTypes'; +function formatLanguages(languages) { + if (!languages) { + return null; + } + + const splitLanguages = _.uniq(languages.split(' / ')); + + if (splitLanguages.length > 3) { + return ( + + {splitLanguages.slice(0, 2).join(', ')}, {splitLanguages.length - 2} more + + ); + } + + return ( + + {splitLanguages.join(', ')} + + ); +} + function MediaInfo(props) { const { type, audioChannels, audioCodec, + audioLanguages, + subtitles, videoCodec } = props; @@ -31,6 +56,14 @@ function MediaInfo(props) { ); } + if (type === mediaInfoTypes.AUDIO_LANGUAGES) { + return formatLanguages(audioLanguages); + } + + if (type === mediaInfoTypes.SUBTITLES) { + return formatLanguages(subtitles); + } + if (type === mediaInfoTypes.VIDEO) { return ( @@ -46,6 +79,8 @@ MediaInfo.propTypes = { type: PropTypes.string.isRequired, audioChannels: PropTypes.number, audioCodec: PropTypes.string, + audioLanguages: PropTypes.string, + subtitles: PropTypes.string, videoCodec: PropTypes.string }; diff --git a/frontend/src/EpisodeFile/mediaInfoTypes.js b/frontend/src/EpisodeFile/mediaInfoTypes.js index 5e5a78e64..425b3d98b 100644 --- a/frontend/src/EpisodeFile/mediaInfoTypes.js +++ b/frontend/src/EpisodeFile/mediaInfoTypes.js @@ -1,2 +1,4 @@ export const AUDIO = 'audio'; +export const AUDIO_LANGUAGES = 'audioLanguages'; +export const SUBTITLES = 'subtitles'; export const VIDEO = 'video'; diff --git a/frontend/src/Series/Details/EpisodeRow.css b/frontend/src/Series/Details/EpisodeRow.css index 6ef47cdba..d63349b67 100644 --- a/frontend/src/Series/Details/EpisodeRow.css +++ b/frontend/src/Series/Details/EpisodeRow.css @@ -37,6 +37,13 @@ width: 100px; } +.audioLanguages, +.subtitles { + composes: cell from '~Components/Table/Cells/TableRowCell.css'; + + width: 165px; +} + .releaseGroup { composes: cell from '~Components/Table/Cells/TableRowCell.css'; diff --git a/frontend/src/Series/Details/EpisodeRow.js b/frontend/src/Series/Details/EpisodeRow.js index bdb2dee7b..9b62045be 100644 --- a/frontend/src/Series/Details/EpisodeRow.js +++ b/frontend/src/Series/Details/EpisodeRow.js @@ -196,6 +196,34 @@ class EpisodeRow extends Component { ); } + if (name === 'audioLanguages') { + return ( + + + + ); + } + + if (name === 'subtitleLanguages') { + return ( + + + + ); + } + if (name === 'videoCodec') { return (