diff --git a/ui/src/i18n/en.json b/ui/src/i18n/en.json index 15a513aa8..c0e671b0f 100644 --- a/ui/src/i18n/en.json +++ b/ui/src/i18n/en.json @@ -564,6 +564,18 @@ "shareUrl": "Share URL", "aplayerEmbedUrl": "APlayer Embed URL", "navidromeMusicPlayer": "Navidrome Music Player", + "embedCode": "Embed Code", + "copyCode": "Copy Code", + "codeCopied": "Code copied to clipboard", + "embedTip": "Tip: Copy this code and paste it into your webpage HTML to use", + "floatingPlayerLeft": "Bottom Left Floating Player", + "floatingPlayerLeftDesc": "Collapsible floating player in bottom left corner, users can click to expand/collapse", + "basicIframe": "Basic iframe", + "basicIframeDesc": "Simple iframe embed, suitable for fixed position display", + "responsiveIframe": "Responsive iframe", + "responsiveIframeDesc": "16:9 responsive layout, adapts to different screen widths", + "floatingPlayerRight": "Bottom Right Floating Player", + "floatingPlayerRightDesc": "Collapsible floating player in bottom right corner (alternative position)", "remove_missing_content": "Are you sure you want to remove the selected missing files from the database? This will remove permanently any references to them, including their play counts and ratings.", "remove_all_missing_title": "Remove all missing files", "remove_all_missing_content": "Are you sure you want to remove all missing files from the database? This will permanently remove any references to them, including their play counts and ratings.", diff --git a/ui/src/share/EmbedCodeField.jsx b/ui/src/share/EmbedCodeField.jsx index c8df4c2ac..8b3cfb485 100644 --- a/ui/src/share/EmbedCodeField.jsx +++ b/ui/src/share/EmbedCodeField.jsx @@ -9,6 +9,7 @@ import { makeStyles, Snackbar, } from '@material-ui/core' +import { useTranslate } from 'react-admin' import FileCopyIcon from '@material-ui/icons/FileCopy' const useStyles = makeStyles((theme) => ({ @@ -52,6 +53,7 @@ const TabPanel = ({ children, value, index, ...other }) => { export const EmbedCodeField = ({ url, title = 'Music Player' }) => { const classes = useStyles() + const translate = useTranslate() const [tabValue, setTabValue] = useState(0) const [snackbarOpen, setSnackbarOpen] = useState(false) @@ -209,31 +211,31 @@ document.addEventListener('click', function(event) { const embedOptions = [ { - label: '左下角悬浮播放器', + label: translate('message.floatingPlayerLeft'), code: floatingPlayerEmbed, - description: '可折叠的左下角悬浮播放器,用户可点击展开/收起', + description: translate('message.floatingPlayerLeftDesc'), }, { - label: '基础 iframe', + label: translate('message.basicIframe'), code: iframeEmbed, - description: '简单的 iframe 嵌入,适合固定位置显示', + description: translate('message.basicIframeDesc'), }, { - label: '响应式 iframe', + label: translate('message.responsiveIframe'), code: responsiveEmbed, - description: '16:9 响应式布局,自适应不同屏幕宽度', + description: translate('message.responsiveIframeDesc'), }, { - label: '右下角悬浮播放器', + label: translate('message.floatingPlayerRight'), code: floatingPlayerRightEmbed, - description: '可折叠的右下角悬浮播放器(备选位置)', + description: translate('message.floatingPlayerRightDesc'), }, ] return ( - 嵌入代码 (Embed Code) + {translate('message.embedCode')} handleCopy(option.code)} color="primary" size="small" - title="复制代码" + title={translate('message.copyCode')} > - 提示:将此代码复制并粘贴到您的网页 HTML 中即可使用 + {translate('message.embedTip')} ))} @@ -293,7 +295,7 @@ document.addEventListener('click', function(event) { open={snackbarOpen} autoHideDuration={2000} onClose={handleSnackbarClose} - message="代码已复制到剪贴板" + message={translate('message.codeCopied')} /> )