separate yomichan into user.js patch and sentence-export plugin

5 files changed, 144 insertions, 0 deletions

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();
+