From 34ea3829e7cb435a4357b43fcfff514fdd39083e Mon Sep 17 00:00:00 2001
From: lonkaars <loek@pipeframe.xyz>
Date: Sun, 29 Jan 2023 16:46:15 +0100
Subject: separate yomichan into user.js patch and sentence-export plugin

---
 yomichan-user/copy.svg            |  3 ++
 yomichan-user/custom.css          | 23 +++++++++++
 yomichan-user/readme.md           | 32 +++++++++++++++
 yomichan-user/sentence-export.css |  1 +
 yomichan-user/sentence-export.js  | 85 +++++++++++++++++++++++++++++++++++++++
 yomichan/copy.svg                 |  3 --
 yomichan/custom.css               | 23 -----------
 yomichan/makefile                 | 63 +++++++++++++++++------------
 yomichan/readme.md                | 32 ---------------
 yomichan/script.svg               |  3 ++
 yomichan/search.html.diff         | 17 ++++++++
 yomichan/sentence-export.css      |  1 -
 yomichan/sentence-export.js       | 85 ---------------------------------------
 yomichan/settings.html.diff       | 69 +++++++++++++++++++++++++++++++
 yomichan/userscript-loader.js     |  6 +++
 yomichan/userscript-settings.css  | 11 +++++
 16 files changed, 288 insertions(+), 169 deletions(-)
 create mode 100644 yomichan-user/copy.svg
 create mode 100644 yomichan-user/custom.css
 create mode 100644 yomichan-user/readme.md
 create mode 100644 yomichan-user/sentence-export.css
 create mode 100644 yomichan-user/sentence-export.js
 delete mode 100644 yomichan/copy.svg
 delete mode 100644 yomichan/custom.css
 delete mode 100644 yomichan/readme.md
 create mode 100644 yomichan/script.svg
 create mode 100644 yomichan/search.html.diff
 delete mode 100644 yomichan/sentence-export.css
 delete mode 100644 yomichan/sentence-export.js
 create mode 100644 yomichan/settings.html.diff
 create mode 100644 yomichan/userscript-loader.js
 create mode 100644 yomichan/userscript-settings.css

diff --git a/yomichan-user/copy.svg b/yomichan-user/copy.svg
new file mode 100644
index 0000000..ff2f5a9
--- /dev/null
+++ b/yomichan-user/copy.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 2C2 1.17157 2.67157 0.5 3.5 0.5H10.5V2L3.5 2V12H2V2ZM4.5 4.5C4.5 3.67157 5.17157 3 6 3H12.5C13.3284 3 14 3.67157 14 4.5V14.25C14 15.0784 13.3284 15.75 12.5 15.75H6C5.17157 15.75 4.5 15.0784 4.5 14.25V4.5ZM12.5 4.5H6V14.25H12.5V4.5Z" fill="currentColor"/>
+</svg>
diff --git a/yomichan-user/custom.css b/yomichan-user/custom.css
new file mode 100644
index 0000000..7ce95f8
--- /dev/null
+++ b/yomichan-user/custom.css
@@ -0,0 +1,23 @@
+.search-header { margin-top: 12px; }
+.search-options { display: none; }
+:root[data-theme=dark] #content-body { background-color: #000000; }
+:root[data-theme=light] #content-body { background-color: #ffffff; }
+.tag .tag-label { background-color: unset; }
+.tag {
+    border: 2px solid var(--tag-color);
+    border-radius: 6px;
+}
+.frequency-group-tag .tag { border: none !important; }
+.tag .tag-body::before { display: none; }
+.frequency-value { font-weight: bold; }
+:root[data-theme=dark] .frequency-value { color: var(--tag-color); }
+.search-textbox-container {
+    border-radius: 6px;
+    overflow: hidden;
+}
+@media (hover: none) {
+    .entry .actions .action-button { padding: 16px; }
+    .search-header .search-button { width: 48px; }
+}
+:root[data-theme=light] { --tag-text-color: #333; }
+
diff --git a/yomichan-user/readme.md b/yomichan-user/readme.md
new file mode 100644
index 0000000..e82bb00
--- /dev/null
+++ b/yomichan-user/readme.md
@@ -0,0 +1,32 @@
+# yomichan stuff
+
+## custom css
+
+this is just a custom theme, and can be easily installed by pasting the
+contents of [custom.css](custom.css) into yomichan's settings.
+
+## sentence export
+
+this patches the yomichan plugin files to add an export button to the search
+bar for copying a sentence with furigana into my custom anki card template.
+
+![new copy button in yomichan search bar](../assets/copy-button-yomichan.png)
+![copied sentence in anki](../assets/copy-button-anki.png)
+
+### set-up
+
+to download the latest yomichan version and patch it, leaving all files exposed
+for later updating (unpacked extension), run the following command:
+
+```
+make patch
+```
+
+to patch yomichan and convert it back to a zip (packed extension, non-signed,
+for use with kiwi browser), run:
+
+```
+make yomichan-chrome-patched.zip
+```
+
+if you want to update the patch or zip, replace `make` with `make -B`.
diff --git a/yomichan-user/sentence-export.css b/yomichan-user/sentence-export.css
new file mode 100644
index 0000000..eb2ecea
--- /dev/null
+++ b/yomichan-user/sentence-export.css
@@ -0,0 +1 @@
+.icon[data-icon=copy] { --icon-image: url(/images/copy.svg); }
diff --git a/yomichan-user/sentence-export.js b/yomichan-user/sentence-export.js
new file mode 100644
index 0000000..3b2a476
--- /dev/null
+++ b/yomichan-user/sentence-export.js
@@ -0,0 +1,85 @@
+async function getClipboardSettings() {
+	return (await yomichan.api.getSettings([{
+		scope: "profile",
+		optionsContext: { current: true },
+		path: 'clipboard'
+	}]))[0].result;
+}
+
+async function setClipboardSettings(settings) {
+	await yomichan.api.modifySettings([{
+		scope: "profile",
+		optionsContext: { current: true },
+		path: 'clipboard',
+		action: 'set',
+		value: settings
+	}]);
+}
+
+async function exportSentence() {
+	var inputHTML = document.getElementById("query-parser-content");
+	var output = "";
+
+	for (var child of inputHTML.children) {
+		for (var subchild of child.childNodes) {
+			if (subchild.nodeName == '#text') {
+				output += subchild.textContent;
+				continue;
+			}
+			if (subchild.nodeName == 'RUBY') {
+				output += `[${subchild.childNodes[0].innerText}](${subchild.childNodes[1].innerText})`;
+				continue;
+			}
+		}
+	}
+
+	var userClipboardSettings = await getClipboardSettings();
+	var tempSettings = {
+		enableBackgroundMonitor: false,
+		enableSearchPageMonitor: false,
+		autoSearchContent: false,
+		maximumSearchLength: userClipboardSettings.maximumSearchLength,
+	};
+	await setClipboardSettings(tempSettings);
+
+	navigator.clipboard.writeText(output);
+
+	// execute on next JS event loop
+	setTimeout(async () => await setClipboardSettings(userClipboardSettings), 0);
+
+	return output;
+}
+
+function patchSearchBar() {
+	var searchBarOuter = document.getElementsByClassName("search-textbox-container")[0];
+	var button = document.createElement("button");
+	button.id = "anki-sentence-export-button";
+	button.classList.add("search-button");
+	button.onclick = exportSentence;
+	var icon = document.createElement("span");
+	icon.classList.add("icon");
+	icon.setAttribute("data-icon", "copy");
+	button.appendChild(icon);
+	searchBarOuter.insertBefore(button, searchBarOuter.childNodes[2]);
+}
+
+function patchCSS() {
+	var csslink = document.createElement("link");
+	csslink.setAttribute("rel", "stylesheet");
+	csslink.setAttribute("type", "text/css");
+	csslink.setAttribute("href", "/css/sentence-export.css");
+	document.head.appendChild(csslink);
+}
+
+function run() {
+	if (document.body.classList.contains("patched")) return;
+
+	patchSearchBar();
+	patchCSS();
+
+	document.body.classList.add("patched");
+}
+
+run();
+window.onload = () => run();
+
diff --git a/yomichan/copy.svg b/yomichan/copy.svg
deleted file mode 100644
index ff2f5a9..0000000
--- a/yomichan/copy.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M2 2C2 1.17157 2.67157 0.5 3.5 0.5H10.5V2L3.5 2V12H2V2ZM4.5 4.5C4.5 3.67157 5.17157 3 6 3H12.5C13.3284 3 14 3.67157 14 4.5V14.25C14 15.0784 13.3284 15.75 12.5 15.75H6C5.17157 15.75 4.5 15.0784 4.5 14.25V4.5ZM12.5 4.5H6V14.25H12.5V4.5Z" fill="currentColor"/>
-</svg>
diff --git a/yomichan/custom.css b/yomichan/custom.css
deleted file mode 100644
index 7ce95f8..0000000
--- a/yomichan/custom.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.search-header { margin-top: 12px; }
-.search-options { display: none; }
-:root[data-theme=dark] #content-body { background-color: #000000; }
-:root[data-theme=light] #content-body { background-color: #ffffff; }
-.tag .tag-label { background-color: unset; }
-.tag {
-    border: 2px solid var(--tag-color);
-    border-radius: 6px;
-}
-.frequency-group-tag .tag { border: none !important; }
-.tag .tag-body::before { display: none; }
-.frequency-value { font-weight: bold; }
-:root[data-theme=dark] .frequency-value { color: var(--tag-color); }
-.search-textbox-container {
-    border-radius: 6px;
-    overflow: hidden;
-}
-@media (hover: none) {
-    .entry .actions .action-button { padding: 16px; }
-    .search-header .search-button { width: 48px; }
-}
-:root[data-theme=light] { --tag-text-color: #333; }
-
diff --git a/yomichan/makefile b/yomichan/makefile
index c4bd45e..cc8b50d 100644
--- a/yomichan/makefile
+++ b/yomichan/makefile
@@ -1,11 +1,23 @@
-all: sentence-export.min.js
+all:
 
-.PHONY: clean patch
+.PHONY: clean patch download backup
 
 include ../common.mk
 
-yomichan/js/user.js: yomichan sentence-export.min.js
-	ln -sf ../../sentence-export.min.js $@
+yomichan/images/%.svg: %.svg
+	cp $< $@
+
+yomichan/css/%.css: %.css
+	cp $< $@
+
+yomichan/js/%.js: %.js
+	cp $< $@
+
+yomichan/%.patched: %.diff
+	patch -so - $(@:.patched=) < $< > $@
+
+yomichan/%.bak: yomichan/%
+	cp $< $@
 
 yomichan-chrome.zip:
 	curl https://github.com/FooSoft/yomichan/releases/latest/download/$@ -Lso- > $@
@@ -19,29 +31,30 @@ yomichan/manifest.json.bak:
 yomichan/search.html.bak:
 	cp yomichan/search.html $@
 
-yomichan/manifest-patched.json: yomichan/manifest.json.bak
-	jq '.content_scripts[0].js[.content_scripts[0].js | length] |= .+ "js/user.js"' $< > $@
-
-yomichan/search-patched.html: yomichan/search.html.bak
-	sed 's#</body>#<script defer src="/js/user.js"></script>\n</body>#' $< > $@
-
-yomichan/images/%.svg: %.svg
-	ln -sf ../../copy.svg $@
-
-yomichan/css/%.css: %.css
-	ln -sf ../../$< $@
-
-patch: yomichan
-patch: yomichan/search-patched.html
-patch: yomichan/manifest-patched.json
-patch: yomichan/js/user.js
-patch: yomichan/images/copy.svg
-patch: yomichan/css/sentence-export.css
+yomichan/search.html.patched: search.html.diff
+yomichan/settings.html.patched: settings.html.diff
+yomichan/manifest.json.patched: yomichan/manifest.json.bak
+	jq '.content_scripts[0].js[.content_scripts[0].js | length] |= .+ "js/userscript-loader.js"' $< > $@
+	jq '.content_security_policy |= .+ "'"; script-src 'self' 'unsafe-eval'"'"' $< > $@
+
+download: yomichan
+backup: download
+backup: yomichan/manifest.json.bak
+backup: yomichan/search.html.bak
+backup: yomichan/settings.html.bak
+patch: backup
+patch: yomichan/js/userscript-loader.js
+patch: yomichan/images/script.svg
+patch: yomichan/css/userscript-settings.css
+patch: yomichan/search.html.patched
+patch: yomichan/settings.html.patched
+patch: yomichan/manifest.json.patched
 patch:
-	ln -sf search-patched.html yomichan/search.html
-	ln -sf manifest-patched.json yomichan/manifest.json
+	mv yomichan/search.html.patched yomichan/search.html
+	mv yomichan/settings.html.patched yomichan/settings.html
+	mv yomichan/manifest.json.patched yomichan/manifest.json
 
-yomichan-chrome-patched.zip: yomichan patch
+yomichan-chrome-patched.zip: patch
 	zip -qr $@ $<
 
 clean:
diff --git a/yomichan/readme.md b/yomichan/readme.md
deleted file mode 100644
index e82bb00..0000000
--- a/yomichan/readme.md
+++ /dev/null
@@ -1,32 +0,0 @@
-# yomichan stuff
-
-## custom css
-
-this is just a custom theme, and can be easily installed by pasting the
-contents of [custom.css](custom.css) into yomichan's settings.
-
-## sentence export
-
-this patches the yomichan plugin files to add an export button to the search
-bar for copying a sentence with furigana into my custom anki card template.
-
-![new copy button in yomichan search bar](../assets/copy-button-yomichan.png)
-![copied sentence in anki](../assets/copy-button-anki.png)
-
-### set-up
-
-to download the latest yomichan version and patch it, leaving all files exposed
-for later updating (unpacked extension), run the following command:
-
-```
-make patch
-```
-
-to patch yomichan and convert it back to a zip (packed extension, non-signed,
-for use with kiwi browser), run:
-
-```
-make yomichan-chrome-patched.zip
-```
-
-if you want to update the patch or zip, replace `make` with `make -B`.
diff --git a/yomichan/script.svg b/yomichan/script.svg
new file mode 100644
index 0000000..721a36c
--- /dev/null
+++ b/yomichan/script.svg
@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9 3C7.34315 3 6 4.34315 6 6V23H20.8027C21.681 21.4817 23.2054 20.384 25 20.083V7V6C25 5.44772 25.4477 5 26 5C26.5523 5 27 5.44772 27 6V7H29V6C29 4.34315 27.6569 3 26 3H25H24H9ZM3 25H20.083C20.0284 25.3252 20 25.6593 20 26C20 27.0929 20.2922 28.1175 20.8027 29H6C4.34315 29 3 27.6569 3 26V25ZM22 7H9V9H22V7ZM21 11H9V13H21V11ZM9 15H19V17H9V15ZM29 26L24 23V29L29 26Z" fill="black"/>
+</svg>
diff --git a/yomichan/search.html.diff b/yomichan/search.html.diff
new file mode 100644
index 0000000..75f815c
--- /dev/null
+++ b/yomichan/search.html.diff
@@ -0,0 +1,17 @@
+--- yomichan-original/search.html	2022-10-30 12:39:42.000000000 +0100
++++ yomichan/search.html	2023-01-29 15:40:23.336897401 +0100
+@@ -16,6 +16,7 @@
+     <link rel="stylesheet" type="text/css" href="/css/display-pronunciation.css">
+     <link rel="stylesheet" type="text/css" href="/css/structured-content.css">
+     <link rel="stylesheet" type="text/css" href="/css/search.css">
++		<script defer src="/js/userscript-loader.js"></script>
+ </head>
+ <body>
+ 
+@@ -128,6 +129,5 @@
+ <script src="/js/templates/template-renderer-proxy.js"></script>
+ 
+ <script src="/js/display/search-main.js"></script>
+-
+ </body>
+ </html>
diff --git a/yomichan/sentence-export.css b/yomichan/sentence-export.css
deleted file mode 100644
index eb2ecea..0000000
--- a/yomichan/sentence-export.css
+++ /dev/null
@@ -1 +0,0 @@
-.icon[data-icon=copy] { --icon-image: url(/images/copy.svg); }
diff --git a/yomichan/sentence-export.js b/yomichan/sentence-export.js
deleted file mode 100644
index 3b2a476..0000000
--- a/yomichan/sentence-export.js
+++ /dev/null
@@ -1,85 +0,0 @@
-async function getClipboardSettings() {
-	return (await yomichan.api.getSettings([{
-		scope: "profile",
-		optionsContext: { current: true },
-		path: 'clipboard'
-	}]))[0].result;
-}
-
-async function setClipboardSettings(settings) {
-	await yomichan.api.modifySettings([{
-		scope: "profile",
-		optionsContext: { current: true },
-		path: 'clipboard',
-		action: 'set',
-		value: settings
-	}]);
-}
-
-async function exportSentence() {
-	var inputHTML = document.getElementById("query-parser-content");
-	var output = "";
-
-	for (var child of inputHTML.children) {
-		for (var subchild of child.childNodes) {
-			if (subchild.nodeName == '#text') {
-				output += subchild.textContent;
-				continue;
-			}
-			if (subchild.nodeName == 'RUBY') {
-				output += `[${subchild.childNodes[0].innerText}](${subchild.childNodes[1].innerText})`;
-				continue;
-			}
-		}
-	}
-
-	var userClipboardSettings = await getClipboardSettings();
-	var tempSettings = {
-		enableBackgroundMonitor: false,
-		enableSearchPageMonitor: false,
-		autoSearchContent: false,
-		maximumSearchLength: userClipboardSettings.maximumSearchLength,
-	};
-	await setClipboardSettings(tempSettings);
-
-	navigator.clipboard.writeText(output);
-
-	// execute on next JS event loop
-	setTimeout(async () => await setClipboardSettings(userClipboardSettings), 0);
-
-	return output;
-}
-
-function patchSearchBar() {
-	var searchBarOuter = document.getElementsByClassName("search-textbox-container")[0];
-	var button = document.createElement("button");
-	button.id = "anki-sentence-export-button";
-	button.classList.add("search-button");
-	button.onclick = exportSentence;
-	var icon = document.createElement("span");
-	icon.classList.add("icon");
-	icon.setAttribute("data-icon", "copy");
-	button.appendChild(icon);
-	searchBarOuter.insertBefore(button, searchBarOuter.childNodes[2]);
-}
-
-function patchCSS() {
-	var csslink = document.createElement("link");
-	csslink.setAttribute("rel", "stylesheet");
-	csslink.setAttribute("type", "text/css");
-	csslink.setAttribute("href", "/css/sentence-export.css");
-	document.head.appendChild(csslink);
-}
-
-function run() {
-	if (document.body.classList.contains("patched")) return;
-
-	patchSearchBar();
-	patchCSS();
-
-	document.body.classList.add("patched");
-}
-
-run();
-window.onload = () => run();
-
diff --git a/yomichan/settings.html.diff b/yomichan/settings.html.diff
new file mode 100644
index 0000000..2644ab3
--- /dev/null
+++ b/yomichan/settings.html.diff
@@ -0,0 +1,69 @@
+--- yomichan-original/settings.html	2022-10-30 12:39:42.000000000 +0100
++++ yomichan/settings.html	2023-01-29 15:42:10.643564451 +0100
+@@ -14,6 +14,8 @@
+     <link rel="stylesheet" type="text/css" href="/css/material.css">
+     <link rel="stylesheet" type="text/css" href="/css/settings.css">
+     <link rel="stylesheet" type="text/css" href="/css/display-pronunciation.css">
++    <link rel="stylesheet" type="text/css" href="/css/icons.css">
++    <link rel="stylesheet" type="text/css" href="/css/userscript-settings.css">
+ </head>
+ <body>
+ 
+@@ -39,6 +41,7 @@
+             <a href="#!backup"           class="button outline-item"><span class="outline-item-left"><span class="outline-item-icon icon" data-icon="backup"></span></span><span class="outline-item-label">Backup</span></a>
+             <a href="#!accessibility"    class="button outline-item"><span class="outline-item-left"><span class="outline-item-icon icon" data-icon="accessibility"></span></span><span class="outline-item-label">Accessibility</span></a>
+             <a href="#!security"         class="button outline-item advanced-only"><span class="outline-item-left"><span class="outline-item-icon icon" data-icon="lock"></span></span><span class="outline-item-label">Security</span></a>
++            <a href="#!userscript"         class="button outline-item advanced-only"><span class="outline-item-left"><span class="outline-item-icon icon" data-icon="script"></span></span><span class="outline-item-label">User script</span></a>
+         </div>
+         <div class="sidebar-bottom">
+             <label class="button outline-item"><span class="outline-item-left">
+@@ -2152,6 +2155,19 @@
+         </div>
+     </div>
+ 
++    <div class="heading-container advanced-only">
++        <div class="heading-container-icon"><span class="icon" data-icon="script"></span></div>
++        <div class="heading-container-left"><h2 id="userscript"><a href="#!userscript">User script</a></h2></div>
++    </div>
++    <div class="settings-group advanced-only">
++        <div class="settings-item settings-item-button" data-modal-action="show,user-script"><div class="settings-item-inner">
++            <div class="settings-item-left"><div class="settings-item-label">Configure user.js&hellip;</div></div>
++            <div class="settings-item-right open-panel-button-container">
++                <button class="icon-button"><span class="icon-button-inner"><span class="icon" data-icon="material-right-arrow"></span></span></button>
++            </div>
++        </div></div>
++    </div>
++
+     <div class="footer-padding"></div>
+ 
+ </div>
+@@ -3802,6 +3818,29 @@
+ </div></template>
+ 
+ 
++<div id="user-script-modal" class="modal modal-left" tabindex="-1" role="dialog" hidden><div class="modal-content-container1">
++    <div class="modal-content-container2 modal-content-dimmer"><div class="modal-content">
++        <div class="modal-header">
++            <div class="modal-title">User script</div>
++            <div class="modal-header-button-container">
++                <div class="modal-header-button-group">
++                    <button class="icon-button modal-header-button" data-modal-action="expand"><span class="icon-button-inner"><span class="icon" data-icon="expand"></span></span></button>
++                    <button class="icon-button modal-header-button" data-modal-action="collapse"><span class="icon-button-inner"><span class="icon" data-icon="collapse"></span></span></button>
++                </div>
++            </div>
++        </div>
++        <div class="modal-body" id="user-script-container">
++            <div class="user-script-header">user.js (runs on search page and in popup frame)</div>
++            <textarea class="no-wrap" autocomplete="off" spellcheck="false" id="user-script-editor" data-setting="general.userScript" data-tab-action="indent,4"></textarea>
++        </div>
++        <div class="modal-footer">
++            <button data-modal-action="hide">Close</button>
++        </div>
++    </div></div>
++    <div class="modal-content-container1-fade"></div>
++</div></div>
++
++
+ <!-- Scripts -->
+ <script src="/lib/wanakana.min.js"></script>
+ 
diff --git a/yomichan/userscript-loader.js b/yomichan/userscript-loader.js
new file mode 100644
index 0000000..b9d9120
--- /dev/null
+++ b/yomichan/userscript-loader.js
@@ -0,0 +1,6 @@
+(async () => eval((await yomichan.api.getSettings([{
+	scope: "profile",
+	optionsContext: { current: true },
+	path: 'general.userScript'
+}]))[0].result))();
+
diff --git a/yomichan/userscript-settings.css b/yomichan/userscript-settings.css
new file mode 100644
index 0000000..422096f
--- /dev/null
+++ b/yomichan/userscript-settings.css
@@ -0,0 +1,11 @@
+.icon[data-icon=script] { --icon-image: url(/images/script.svg); }
+
+#user-script-container {
+	display: flex;
+	flex-flow: column nowrap;
+}
+#user-script-header { font-size: var(--font-size-small); }
+#user-script-editor {
+	width: 100%;
+	flex: 1 1 auto;
+}
-- 
cgit v1.2.3