貼住暫時code
// Add yellow highlight on hover
const highlight = (event) => {
event.target.style.backgroundColor = "yellow";
};
// Remove yellow highlight on hover out
const unhighlight = (event) => {
event.target.style.backgroundColor = "";
};
// chrome.storage.local.clear(function() {
// console.log("Chrome storage local has been cleared.");
// });
chrome.storage.local.get(function(items) { console.log(items) });
// Convert Japanese text to Hiragana
const convertToHiragana = async (text) => {
const response = await fetch("http://localhost:3000/convert", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: [text] }),
});
const data = await response.json();
await extractKanjiAndHiragana(data.hiragana[0]);
return data.hiragana[0];
};
// Revert back to original text
const revertToOriginal = (event) => {
event.target.removeEventListener("click", revertToOriginal);
event.target.innerHTML = event.target.dataset.original;
event.target.addEventListener("click", addHiragana);
};
// Add Hiragana
const addHiragana = async (event) => {
if (!event.target.dataset.original) {
event.target.dataset.original = event.target.innerHTML;
}
event.target.innerHTML = await convertToHiragana(event.target.innerHTML);
event.target.removeEventListener("click", addHiragana);
event.target.addEventListener("click", revertToOriginal);
};
async function updateElements() {
const elements = document.querySelectorAll("p, li, h1, h2, h3");
for (const element of elements) {
element.innerHTML = await setTextColor(element.innerHTML);
element.addEventListener("mouseover", highlight);
element.addEventListener("mouseout", unhighlight);
element.addEventListener("click", addHiragana);
}
}
updateElements();
async function setTextColor(text) {
return new Promise((resolve) => {
let coloredText = text;
chrome.storage.local.get(null, function(result) {
let keys = Object.keys(result);
keys.sort((a, b) => b.length - a.length);
let foundKeys = [];
for (let i = 0; i < keys.length; i++) {
let key = keys[i];
let index = coloredText.indexOf(key);
if (key === "") {
continue;
}
let skip = false;
foundKeys.forEach(fKey => {
if (fKey.includes(key)) {
skip = true;
}
});
if (skip) {
continue;
}
if (index !== -1) {
foundKeys.push(key);
let data = result[key];
let color = data.mastered ? "green" : "orange";
let beforeText = coloredText.substring(0, index);
let afterText = coloredText.substring(index + key.length);
coloredText = beforeText + "<span style='color:" + color + "'>" + key + "</span>" + afterText;
}
}
console.log(coloredText)
resolve(coloredText);
});
});
}
const saveToStorage = async (kanji, hiragana) => {
const data = { hiragana, mastered: false, archived: false };
if (kanji === "") return;
chrome.storage.local.set({ [kanji]: JSON.stringify(data) }, function () {
console.log("Data is stored for " + kanji + " as " + hiragana);
});
};
const extractKanjiAndHiragana = async (sentence) => {
const kanjiRegex = /[\u4e00-\u9faf]/;
const hiraganaRegex = /[\u3040-\u309f]/;
let kanji = "";
let hiragana = "";
for (const char of sentence) {
if (char === "(") {
hiragana = "";
} else if (char === ")") {
await saveToStorage(kanji, hiragana);
kanji = "";
hiragana = "";
} else if (kanjiRegex.test(char)) {
kanji += char;
} else if (hiraganaRegex.test(char)) {
hiragana += char;
}
}
await saveToStorage(kanji, hiragana);
};
