Skip to content

feat(synced-lyrics): Add Simplified/Traditional Chinese converter and improve Romanization to display tone #4111

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
heinthanth wants to merge 4 commits into
base: master
Choose a base branch
from
Open

feat(synced-lyrics): Add Simplified/Traditional Chinese converter and improve Romanization to display tone #4111

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6b38e36
feat(synced-lyrics): add simplified/traditional Chinese converter
heinthanth Nov 26, 2025
d16a516
feat(synced-lyrics): improve Chinese romanization to display tones
heinthanth Nov 26, 2025
3c98be3
chore(format): Format codes
heinthanth Nov 26, 2025
ae9640b
Update src/plugins/synced-lyrics/menu.ts
heinthanth Nov 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,7 @@
"bgutils-js": "3.2.0",
"butterchurn": "3.0.0-beta.5",
"butterchurn-presets": "3.0.0-beta.4",
"chinese-conv": "^4.0.0",
"color": "5.0.0",
"conf": "14.0.0",
"custom-electron-prompt": "1.5.8",
Expand Down Expand Up @@ -121,6 +122,7 @@
"node-html-parser": "7.0.1",
"node-id3": "0.2.9",
"peerjs": "1.5.5",
"pinyin-pro": "^3.27.0",
"semver": "7.7.2",
"serve": "14.2.5",
"socks": "2.8.7",
Expand All @@ -129,7 +131,6 @@
"solid-js": "1.9.9",
"solid-styled-components": "0.28.5",
"solid-transition-group": "0.3.0",
"tiny-pinyin": "1.3.2",
"tinyld": "1.3.4",
"virtua": "0.42.3",
"vudio": "2.1.1",
Expand Down
25 changes: 17 additions & 8 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

18 changes: 18 additions & 0 deletions src/i18n/resources/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -862,6 +862,24 @@
"show-time-codes": {
"label": "Show time codes",
"tooltip": "Show the time codes next to the lyrics"
},
"convert-chinese-character": {
"label": "Convert Chinese character",
"submenu": {
"disabled": {
"label": "Disabled",
"tooltip": "Disable Chinese character conversion"
},
"simplified-to-traditional": {
"label": "Simplified to Traditional",
"tooltip": "Convert Simplified Chinese to Traditional Chinese"
},
"traditional-to-simplified": {
"label": "Traditional to Simplified",
"tooltip": "Convert Traditional Chinese to Simplified Chinese"
}
},
"tooltip": "Convert Chinese character to Traditional or Simplified"
}
},
"name": "Synced Lyrics",
Expand Down
7 changes: 6 additions & 1 deletion src/menu.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -481,7 +481,12 @@ export const mainMenuTemplate = async (
availableLanguages
.map(
(lang): Electron.MenuItemConstructorOptions => ({
label: `${langResources[lang].translation.language?.name ?? 'Unknown'} (${langResources[lang].translation.language?.['local-name'] ?? 'Unknown'})`,
label: `${
langResources[lang].translation.language?.name ?? 'Unknown'
} (${
langResources[lang].translation.language?.['local-name'] ??
'Unknown'
})`,
type: 'checkbox',
checked: (config.get('options.language') ?? 'en') === lang,
click() {
Expand Down
56 changes: 56 additions & 0 deletions src/plugins/synced-lyrics/menu.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,62 @@ export const menu = async (
});
},
},
{
label: t('plugins.synced-lyrics.menu.convert-chinese-character.label'),
toolTip: t(
'plugins.synced-lyrics.menu.convert-chinese-character.tooltip',
),
type: 'submenu',
submenu: [
{
label: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.disabled.label',
),
toolTip: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.disabled.tooltip',
),
type: 'radio',
checked:
config.convertChineseCharacter === 'disabled' ||
config.convertChineseCharacter === undefined,
click() {
ctx.setConfig({
convertChineseCharacter: 'disabled',
});
},
},
{
label: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.simplified-to-traditional.label',
),
toolTip: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.simplified-to-traditional.tooltip',
),
type: 'radio',
checked: config.convertChineseCharacter === 'simplifiedToTraditional',
click() {
ctx.setConfig({
convertChineseCharacter: 'simplifiedToTraditional',
});
},
},
{
label: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.traditional-to-simplified.label',
),
toolTip: t(
'plugins.synced-lyrics.menu.convert-chinese-character.submenu.traditional-to-simplified.tooltip',
),
type: 'radio',
checked: config.convertChineseCharacter === 'traditionalToSimplified',
click() {
ctx.setConfig({
convertChineseCharacter: 'traditionalToSimplified',
});
},
},
],
},
{
label: t('plugins.synced-lyrics.menu.show-time-codes.label'),
toolTip: t('plugins.synced-lyrics.menu.show-time-codes.tooltip'),
Expand Down
23 changes: 18 additions & 5 deletions src/plugins/synced-lyrics/renderer/components/PlainLyrics.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,11 @@
import { createEffect, createSignal, Show } from 'solid-js';
import { createEffect, createMemo, createSignal, Show } from 'solid-js';

import { canonicalize, romanize, simplifyUnicode } from '../utils';
import {
canonicalize,
convertChineseCharacter,
romanize,
simplifyUnicode,
} from '../utils';
import { config } from '../renderer';

interface PlainLyricsProps {
Expand All @@ -9,11 +14,19 @@ interface PlainLyricsProps {

export const PlainLyrics = (props: PlainLyricsProps) => {
const [romanization, setRomanization] = createSignal('');
const text = createMemo(() => {
let line = props.line;
const convertChineseText = config()?.convertChineseCharacter;
if (convertChineseText && convertChineseText !== 'disabled') {
line = convertChineseCharacter(line, convertChineseText);
}
return line;
});

createEffect(() => {
if (!config()?.romanization) return;

const input = canonicalize(props.line);
const input = canonicalize(text());
romanize(input).then((result) => {
setRomanization(canonicalize(result));
});
Expand All @@ -31,13 +44,13 @@ export const PlainLyrics = (props: PlainLyricsProps) => {
>
<yt-formatted-string
text={{
runs: [{ text: props.line }],
runs: [{ text: text() }],
}}
/>
<Show
when={
config()?.romanization &&
simplifyUnicode(props.line) !== simplifyUnicode(romanization())
simplifyUnicode(text()) !== simplifyUnicode(romanization())
}
>
<yt-formatted-string
Expand Down
16 changes: 14 additions & 2 deletions src/plugins/synced-lyrics/renderer/components/SyncedLine.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,12 @@ import { type LineLyrics } from '@/plugins/synced-lyrics/types';
import { config, currentTime } from '../renderer';
import { _ytAPI } from '..';

import { canonicalize, romanize, simplifyUnicode } from '../utils';
import {
canonicalize,
convertChineseCharacter,
romanize,
simplifyUnicode,
} from '../utils';

interface SyncedLineProps {
scroller: VirtualizerHandle;
Expand Down Expand Up @@ -81,7 +86,14 @@ const EmptyLine = (props: SyncedLineProps) => {
};

export const SyncedLine = (props: SyncedLineProps) => {
const text = createMemo(() => props.line.text.trim());
const text = createMemo(() => {
let line = props.line.text;
const convertChineseText = config()?.convertChineseCharacter;
if (convertChineseText && convertChineseText !== 'disabled') {
line = convertChineseCharacter(line, convertChineseText);
}
return line;
Copy link

Copilot AI Dec 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The .trim() call was removed when refactoring this line to support Chinese character conversion. This means text with leading or trailing whitespace will no longer be trimmed before display. Consider adding .trim() to the end of the text processing to maintain the original behavior.

Suggested change
return line;
return line.trim();

Copilot uses AI. Check for mistakes.
});

const [romanization, setRomanization] = createSignal('');
createEffect(() => {
Expand Down
23 changes: 19 additions & 4 deletions src/plugins/synced-lyrics/renderer/utils.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,11 @@ import KuromojiAnalyzer from 'kuroshiro-analyzer-kuromoji';
import Kuroshiro from 'kuroshiro';
import { romanize as esHangulRomanize } from 'es-hangul';
import hanja from 'hanja';
import * as pinyin from 'tiny-pinyin';
import { pinyin } from 'pinyin-pro';
import { romanize as romanizeThaiFrag } from '@dehoist/romanize-thai';
import { lazy } from 'lazy-var';
import { detect } from 'tinyld';
import { sify, tify } from 'chinese-conv';

import { waitForElement } from '@/utils/wait-for-element';
import { LyricsRenderer, setIsVisible } from './renderer';
Expand Down Expand Up @@ -84,6 +85,22 @@ export const canonicalize = (text: string) => {
);
};

export const convertChineseCharacter = (
text: string,
mode: 'simplifiedToTraditional' | 'traditionalToSimplified',
) => {
if (!hasChinese([text])) return text;

switch (mode) {
case 'simplifiedToTraditional':
return tify(text);
case 'traditionalToSimplified':
return sify(text);
default:
return text;
}
};

export const simplifyUnicode = (text?: string) =>
text
? text
Expand Down Expand Up @@ -165,9 +182,7 @@ export const romanizeHangul = (line: string) =>
esHangulRomanize(hanja.translate(line, 'SUBSTITUTION'));

export const romanizeChinese = (line: string) => {
return line.replaceAll(/[\u4E00-\u9FFF]+/g, (match) =>
pinyin.convertToPinyin(match, ' ', true),
);
return line.replaceAll(/[\u4E00-\u9FFF]+/g, (match) => pinyin(match));
Copy link

Copilot AI Dec 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The original implementation used pinyin.convertToPinyin(match, ' ', true) which explicitly added spaces between pinyin syllables. The new implementation uses pinyin(match) without specifying a separator. Verify that the pinyin-pro library's default behavior includes appropriate spacing between syllables, otherwise the romanized text may be difficult to read. If needed, consider using options like pinyin(match, { separator: ' ' }) to ensure proper spacing.

Suggested change
return line.replaceAll(/[\u4E00-\u9FFF]+/g, (match) => pinyin(match));
return line.replaceAll(/[\u4E00-\u9FFF]+/g, (match) =>
pinyin(match, { separator: ' ' }),
);

Copilot uses AI. Check for mistakes.
};

const thaiSegmenter = Intl.Segmenter.supportedLocalesOf('th').includes('th')
Expand Down
4 changes: 4 additions & 0 deletions src/plugins/synced-lyrics/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ export type SyncedLyricsPluginConfig = {
showLyricsEvenIfInexact: boolean;
lineEffect: LineEffect;
romanization: boolean;
convertChineseCharacter:
Copy link

Copilot AI Dec 19, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The convertChineseCharacter field should be marked as optional (with ?) since existing configurations won't have this field, and the menu code already handles the undefined case by treating it as 'disabled'. Change the type definition to convertChineseCharacter?: to match the actual runtime behavior.

Suggested change
convertChineseCharacter:
convertChineseCharacter?:

Copilot uses AI. Check for mistakes.
| 'simplifiedToTraditional'
| 'traditionalToSimplified'
| 'disabled';
};

export type LineLyricsStatus = 'previous' | 'current' | 'upcoming';
Expand Down
Loading