feat: Add Custom JS (#104)

* Add Custom JS

* Resolve requested changes
This commit is contained in:
WmeLuna 2023-10-11 16:01:03 -04:00 committed by GitHub
parent bd10df45ee
commit 0ec307eab6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 8 deletions

View file

@ -24,6 +24,7 @@ export class CustomFrame {
this.frame.addEventListener("dom-ready", () => {
this.frame.setZoomFactor(this.data.zoomLevel);
this.frame.insertCSS(this.data.customCss);
this.frame.executeJavaScript(this.data.customJs)
});
this.frame.addEventListener("destroyed", () => {
// recreate the webview if it was moved to a new window

View file

@ -149,6 +149,22 @@ export class CustomFramesSettingTab extends PluginSettingTab {
await this.plugin.saveSettings();
});
});
new Setting(content)
.setName("Additional JavaScript")
.setDesc(createFragment(f => {
f.createSpan({ text: "A snippet of additional JavaScript that should be applied to this frame." });
f.createEl("br");
f.createEl("em", { text: "Note that this is only applied on Desktop." });
}))
.addTextArea(t => {
t.inputEl.rows = 5;
t.inputEl.cols = 50;
t.setValue(frame.customJs);
t.onChange(async v => {
frame.customJs = v;
await this.plugin.saveSettings();
});
});
new ButtonComponent(content)
.setButtonText("Remove Frame")
.onClick(async () => {

View file

@ -12,7 +12,8 @@ export const presets: Record<string, CustomFrameSettings> = {
openInCenter: true,
zoomLevel: 1,
forceIframe: false,
customCss: ""
customCss: "",
customJs: ""
},
"detexify": {
url: "https://detexify.kirelabs.org/classify.html",
@ -27,7 +28,8 @@ export const presets: Record<string, CustomFrameSettings> = {
#classify--info-area,
.adsbygoogle {
display: none !important
}`
}`,
customJs: ""
},
"calendar": {
url: "https://calendar.google.com/calendar",
@ -45,7 +47,8 @@ div[style*="min-width: 238px"] {
}
div[style*="min-width: 238px"] span[role*="heading"] {
display: none !important;
}`
}`,
customJs: ""
},
"keep": {
url: "https://keep.google.com",
@ -60,7 +63,8 @@ div[style*="min-width: 238px"] span[role*="heading"] {
html > body > div:nth-child(2) > div:nth-child(2) > div:first-child,
html > body > div:first-child > header:first-child > div > div:first-child > div > div:first-child > a:first-child > span {
display: none !important;
}`
}`,
customJs: ""
},
"todoist": {
url: "https://todoist.com",
@ -87,7 +91,8 @@ html > body > div:first-child > header:first-child > div > div:first-child > div
.undo_toast {
width: 95%;
}`
}`,
customJs: ""
},
"notion": {
url: "https://www.notion.so/",
@ -98,7 +103,8 @@ html > body > div:first-child > header:first-child > div > div:first-child > div
openInCenter: true,
zoomLevel: 1,
forceIframe: false,
customCss: ""
customCss: "",
customJs: ""
},
"twitter": {
url: "https://twitter.com",
@ -109,7 +115,8 @@ html > body > div:first-child > header:first-child > div > div:first-child > div
openInCenter: false,
zoomLevel: 1,
forceIframe: false,
customCss: ""
customCss: "",
customJs: ""
},
"tasks": {
url: "https://tasks.google.com/embed/?origin=https://calendar.google.com&fullWidth=1",
@ -120,7 +127,8 @@ html > body > div:first-child > header:first-child > div > div:first-child > div
openInCenter: false,
zoomLevel: 1,
forceIframe: false,
customCss: ""
customCss: "",
customJs: ""
}
};
@ -139,6 +147,7 @@ export interface CustomFrameSettings {
zoomLevel: number;
forceIframe: boolean;
customCss: string;
customJs: string;
}
export function getIcon(settings: CustomFrameSettings) {