Process lyrics HTML in Genius util

This commit is contained in:
TC
2022-04-09 15:02:06 +02:00
parent 2f218ef108
commit d0532d691e
4 changed files with 164 additions and 23 deletions

View File

@ -2,6 +2,7 @@ const { join } = require("path");
const { ipcMain } = require("electron");
const is = require("electron-is");
const { convert } = require("html-to-text");
const fetch = require("node-fetch");
const { cleanupName } = require("../../providers/song-info");
@ -12,15 +13,14 @@ module.exports = async (win) => {
ipcMain.on("search-genius-lyrics", async (event, extractedSongInfo) => {
const metadata = JSON.parse(extractedSongInfo);
const queryString = `${cleanupName(metadata.artist)} ${cleanupName(
metadata.title
)}`;
event.returnValue = await fetchFromGenius(queryString);
event.returnValue = await fetchFromGenius(metadata);
});
};
const fetchFromGenius = async (queryString) => {
const fetchFromGenius = async (metadata) => {
const queryString = `${cleanupName(metadata.artist)} ${cleanupName(
metadata.title
)}`;
let response = await fetch(
`https://genius.com/api/search/multi?per_page=5&q=${encodeURI(queryString)}`
);
@ -46,5 +46,24 @@ const fetchFromGenius = async (queryString) => {
return null;
}
return await response.text();
const html = await response.text();
const lyrics = convert(html, {
baseElements: {
selectors: ['[class^="Lyrics__Container"]', ".lyrics"],
},
selectors: [
{
selector: "a",
format: "linkFormatter",
},
],
formatters: {
// Remove links by keeping only the content
linkFormatter: (elem, walk, builder) => {
walk(elem.children, builder);
},
},
});
return lyrics;
};

View File

@ -17,11 +17,11 @@ module.exports = () => {
let hasLyrics = true;
const html = ipcRenderer.sendSync(
const lyrics = ipcRenderer.sendSync(
"search-genius-lyrics",
extractedSongInfo
);
if (!html) {
if (!lyrics) {
// Delete previous lyrics if tab is open and couldn't get new lyrics
checkLyricsContainer(() => {
hasLyrics = false;
@ -34,16 +34,6 @@ module.exports = () => {
console.log("Fetched lyrics from Genius");
}
const wrapper = document.createElement("div");
wrapper.innerHTML = html;
const lyrics = [...wrapper.querySelectorAll('[class^="Lyrics__Container"]')].map(d => d.innerHTML).join('<br>')
|| wrapper.querySelector(".lyrics")?.innerHTML;
if (!lyrics) {
return;
}
enableLyricsTab();
setTabsOnclick(enableLyricsTab);
@ -73,9 +63,12 @@ module.exports = () => {
}
function setLyrics(lyricsContainer) {
lyricsContainer.innerHTML =
`<div id="contents" class="style-scope ytmusic-section-list-renderer description ytmusic-description-shelf-renderer genius-lyrics">
${hasLyrics ? lyrics : 'Could not retrieve lyrics from genius'}
lyricsContainer.innerHTML = `<div id="contents" class="style-scope ytmusic-section-list-renderer description ytmusic-description-shelf-renderer genius-lyrics">
${
hasLyrics
? lyrics.replace(/(?:\r\n|\r|\n)/g, "<br/>")
: "Could not retrieve lyrics from genius"
}
</div>
<yt-formatted-string class="footer style-scope ytmusic-description-shelf-renderer" style="align-self: baseline"></yt-formatted-string>`;