Navigation plugin: inject HTML once CSS is loaded

This commit is contained in:
TC
2021-03-24 23:06:35 +01:00
parent 6395dfe425
commit b1665c880b
4 changed files with 23 additions and 13 deletions

View File

@ -4,7 +4,10 @@ const { injectCSS, listenAction } = require("../utils");
const { ACTIONS, CHANNEL } = require("./actions.js"); const { ACTIONS, CHANNEL } = require("./actions.js");
function handle(win) { function handle(win) {
injectCSS(win.webContents, path.join(__dirname, "style.css")); injectCSS(win.webContents, path.join(__dirname, "style.css"), () => {
win.webContents.send("navigation-css-ready");
});
listenAction(CHANNEL, (event, action) => { listenAction(CHANNEL, (event, action) => {
switch (action) { switch (action) {
case ACTIONS.NEXT: case ACTIONS.NEXT:

View File

@ -1,15 +1,19 @@
const { ipcRenderer } = require("electron");
const { ElementFromFile, templatePath } = require("../utils"); const { ElementFromFile, templatePath } = require("../utils");
function run() { function run() {
const forwardButton = ElementFromFile( ipcRenderer.on("navigation-css-ready", () => {
templatePath(__dirname, "forward.html") const forwardButton = ElementFromFile(
); templatePath(__dirname, "forward.html")
const backButton = ElementFromFile(templatePath(__dirname, "back.html")); );
const menu = document.querySelector("ytmusic-pivot-bar-renderer"); const backButton = ElementFromFile(templatePath(__dirname, "back.html"));
const menu = document.querySelector("ytmusic-pivot-bar-renderer");
if (menu) { if (menu) {
menu.prepend(backButton, forwardButton); menu.prepend(backButton, forwardButton);
} }
});
} }
module.exports = run; module.exports = run;

View File

@ -20,7 +20,7 @@
preserveAspectRatio="xMidYMid meet" preserveAspectRatio="xMidYMid meet"
focusable="false" focusable="false"
class="style-scope iron-icon" class="style-scope iron-icon"
style="pointer-events: none; display: block; width: 100%; height: 100%;" style="pointer-events: none; display: block; width: 100%; height: 100%"
> >
<g class="style-scope iron-icon"> <g class="style-scope iron-icon">
<path <path

View File

@ -42,9 +42,12 @@ module.exports.fileExists = (path, callbackIfExists) => {
}); });
}; };
module.exports.injectCSS = (webContents, filepath) => { module.exports.injectCSS = (webContents, filepath, cb = undefined) => {
webContents.on("did-finish-load", () => { webContents.on("did-finish-load", async () => {
webContents.insertCSS(fs.readFileSync(filepath, "utf8")); await webContents.insertCSS(fs.readFileSync(filepath, "utf8"));
if (cb) {
cb();
}
}); });
}; };