Skip to content

Commit

Permalink
plugin: Synced Lyrics (th-ch#2207)
Browse files Browse the repository at this point in the history
* Added Plugin File

* Added Logic

* Known issue

* Finished Backend part

* Before cleanup

* Added Style
Removed log

* Fixed time and visibility issues

* Changed lyrics style

* Changed way lyrics are selected

* Fix

* Added style lyrics options

* Cleanup

* Fix lyrics styling
Changed how lyrics status are changed

* Moved code to make file more readable

* Change Tab Size

* Fixed issue with overlapping lyrics

* Removed debug console.log

* Added style adaptation for music videos

* Changed file indent

* Revered back to original pnpm file

* Removed unnecessary option

* Fix lyrics status bug
Removed leftover logs

* Started to implement fetching for genius lyrics

* feat(synced-lyrics): add `addedVersion` field

* Made changes according to feedbacks

* fix: add a delay of 300ms to the current time

- Since the transition takes 300ms, we need to add a delay of 300ms to the current time

* Removed test about genius.com scraping

* Removed 300ms delay

* chore: cleaned up the code

* Specified path and variable

* chore: always enable lyrics tab

* chore: use SolidJS to render the lyrics

* chore: remove useless signal

* chore: feature-parity with original PR (+some nice stuff)

* recreate lock file

* show json decode error

* feat(synced-lyrics): improve ui
- Change type assertion code
- Replace span to `yt-formatted-string`
- Add refetch button

* chore: make the lyric styling a solidjs effect

* feat: i18n

* chore: apply suggestion

---------

Co-authored-by: Su-Yong <[email protected]>
Co-authored-by: JellyBrick <[email protected]>
Co-authored-by: Angelos Bouklis <[email protected]>
  • Loading branch information
4 people authored and iryis committed Aug 1, 2024
1 parent 2f8752f commit 3543b8d
Show file tree
Hide file tree
Showing 19 changed files with 977 additions and 26 deletions.
19 changes: 14 additions & 5 deletions electron.vite.config.mts
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
import { resolve, dirname, join } from 'node:path';
import { fileURLToPath } from 'node:url';

import { UserConfig } from 'vite';
import { defineConfig, defineViteConfig } from 'electron-vite';
import builtinModules from 'builtin-modules';
import viteResolve from 'vite-plugin-resolve';
import Inspect from 'vite-plugin-inspect';
import solidPlugin from 'vite-plugin-solid';

import { pluginVirtualModuleGenerator } from './vite-plugins/plugin-importer.mjs';
import pluginLoader from './vite-plugins/plugin-loader.mjs';

import type { UserConfig } from 'vite';
import { i18nImporter } from './vite-plugins/i18n-importer.mjs';
import solidPlugin from 'vite-plugin-solid';

const __dirname = dirname(fileURLToPath(import.meta.url));

Expand Down Expand Up @@ -52,7 +52,10 @@ export default defineConfig({

if (mode === 'development') {
commonConfig.plugins?.push(
Inspect({ build: true, outputDir: join(__dirname, '.vite-inspect/backend') }),
Inspect({
build: true,
outputDir: join(__dirname, '.vite-inspect/backend'),
}),
);
return commonConfig;
}
Expand Down Expand Up @@ -96,7 +99,10 @@ export default defineConfig({

if (mode === 'development') {
commonConfig.plugins?.push(
Inspect({ build: true, outputDir: join(__dirname, '.vite-inspect/preload') }),
Inspect({
build: true,
outputDir: join(__dirname, '.vite-inspect/preload'),
}),
);
return commonConfig;
}
Expand Down Expand Up @@ -143,7 +149,10 @@ export default defineConfig({

if (mode === 'development') {
commonConfig.plugins?.push(
Inspect({ build: true, outputDir: join(__dirname, '.vite-inspect/renderer') }),
Inspect({
build: true,
outputDir: join(__dirname, '.vite-inspect/renderer'),
}),
);
return commonConfig;
}
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -164,6 +164,7 @@
"@foobar404/wave": "2.0.5",
"@jellybrick/electron-better-web-request": "1.0.4",
"@jellybrick/mpris-service": "2.1.4",
"@skyra/jaro-winkler": "^1.1.1",
"@xhayper/discord-rpc": "1.1.4",
"async-mutex": "0.5.0",
"butterchurn": "3.0.0-beta.4",
Expand Down
23 changes: 16 additions & 7 deletions pnpm-lock.yaml

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

43 changes: 30 additions & 13 deletions src/i18n/resources/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -418,19 +418,19 @@
"presets": "Presets",
"skip-existing": "Skip existing files",
"download-finish-settings": {
"label": "Download on finish",
"submenu": {
"enabled": "Enabled",
"mode": "Time mode",
"seconds": "Seconds",
"percent": "Percent",
"advanced": "Advanced"
},
"prompt": {
"title": "Configure when to download",
"last-seconds": "Last x seconds",
"last-percent": "After x percent"
}
"label": "Download on finish",
"submenu": {
"enabled": "Enabled",
"mode": "Time mode",
"seconds": "Seconds",
"percent": "Percent",
"advanced": "Advanced"
},
"prompt": {
"title": "Configure when to download",
"last-seconds": "Last x seconds",
"last-percent": "After x percent"
}
}
},
"name": "Downloader",
Expand Down Expand Up @@ -668,6 +668,23 @@
"description": "Automatically Skips non-music parts like intro/outro or parts of music videos where the song isn't playing",
"name": "SponsorBlock"
},
"synced-lyrics": {
"description": "Provides synced lyrics to songs, using providers like LRClib.",
"name": "Synced Lyrics",
"errors": {
"fetch": "⚠️ - An error occurred while fetching the lyrics. Please try again later.",
"not-found": "⚠️ - No lyrics found for this song."
},
"warnings": {
"instrumental": "⚠️ - This is an instrumental song",
"inexact": "⚠️ - The lyrics for this song may not be exact",
"duration-mismatch": "⚠️ - The lyrics may be out of sync due to a duration mismatch."
},
"refetch-btn": {
"normal": "Refetch lyrics",
"fetching": "Fetching..."
}
},
"taskbar-mediacontrol": {
"description": "Control playback from your Windows taskbar",
"name": "Taskbar Media Control"
Expand Down
2 changes: 2 additions & 0 deletions src/plugins/lyrics-genius/renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,7 @@ export const onRendererLoad = ({
applyLyricsTabState();
}
};

const applyLyricsTabState = () => {
if (lyrics) {
tabs.lyrics.removeAttribute('disabled');
Expand All @@ -86,6 +87,7 @@ export const onRendererLoad = ({
tabs.lyrics.setAttribute('aria-disabled', '');
}
};

const lyricsTabHandler = () => {
const tabContainer = document.querySelector('ytmusic-tab-renderer');
if (!tabContainer) return;
Expand Down
28 changes: 28 additions & 0 deletions src/plugins/synced-lyrics/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import style from './style.css?inline';
import { createPlugin } from '@/utils';

import { SyncedLyricsPluginConfig } from './types';

import { menu } from './menu';
import { renderer } from './renderer';

import { t } from '@/i18n';

export default createPlugin({
name: () => t('plugins.synced-lyrics.name'),
description: () => t('plugins.synced-lyrics.description'),
authors: ['Non0reo', 'ArjixWasTaken'],
restartNeeded: true,
addedVersion: '3.4.X',
config: {
preciseTiming: true,
showLyricsEvenIfInexact: true,
showTimeCodes: false,
defaultTextString: '♪',
lineEffect: 'scale',
} as SyncedLyricsPluginConfig,

menu,
renderer,
stylesheets: [style],
});
138 changes: 138 additions & 0 deletions src/plugins/synced-lyrics/menu.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,138 @@
import { MenuItemConstructorOptions } from 'electron';

import { MenuContext } from '@/types/contexts';
import { SyncedLyricsPluginConfig } from './types';

export const menu = async ({
getConfig,
setConfig,
}: MenuContext<SyncedLyricsPluginConfig>): Promise<
MenuItemConstructorOptions[]
> => {
const config = await getConfig();

return [
{
label: 'Make the lyrics perfectly synced',
toolTip:
'Calculate to the milisecond the display of the next line (can have a small impact on performance)',
type: 'checkbox',
checked: config.preciseTiming,
click(item) {
setConfig({
preciseTiming: item.checked,
});
},
},
{
label: 'Line effect',
toolTip: 'Choose the effect to apply to the current line',
type: 'submenu',
submenu: [
{
label: 'Scale',
toolTip: 'Scale the current line',
type: 'radio',
checked: config.lineEffect === 'scale',
click() {
setConfig({
lineEffect: 'scale',
});
},
},
{
label: 'Offset',
toolTip: 'Offset on the right the current line',
type: 'radio',
checked: config.lineEffect === 'offset',
click() {
setConfig({
lineEffect: 'offset',
});
},
},
{
label: 'Focus',
toolTip: 'Make only the current line white',
type: 'radio',
checked: config.lineEffect === 'focus',
click() {
setConfig({
lineEffect: 'focus',
});
},
},
],
},
{
label: 'Default character between lyrics',
toolTip: 'Choose the default string to use for the gap between lyrics',
type: 'submenu',
submenu: [
{
label: '♪',
type: 'radio',
checked: config.defaultTextString === '♪',
click() {
setConfig({
defaultTextString: '♪',
});
},
},
{
label: '[SPACE]',
type: 'radio',
checked: config.defaultTextString === ' ',
click() {
setConfig({
defaultTextString: ' ',
});
},
},
{
label: '...',
type: 'radio',
checked: config.defaultTextString === '...',
click() {
setConfig({
defaultTextString: '...',
});
},
},
{
label: '———',
type: 'radio',
checked: config.defaultTextString === '———',
click() {
setConfig({
defaultTextString: '———',
});
},
},
],
},
{
label: 'Show time codes',
toolTip: 'Show the time codes next to the lyrics',
type: 'checkbox',
checked: config.showTimeCodes,
click(item) {
setConfig({
showTimeCodes: item.checked,
});
},
},
{
label: 'Show lyrics even if inexact',
toolTip:
'If the song is not found, the plugin tries again with a different search query.\nThe result from the second attempt may not be exact.',
type: 'checkbox',
checked: config.showLyricsEvenIfInexact,
click(item) {
setConfig({
showLyricsEvenIfInexact: item.checked,
});
},
},
];
};
Loading

0 comments on commit 3543b8d

Please sign in to comment.