From 3f74d11ebfef90b5f92dadfb79cb03da90fe336a Mon Sep 17 00:00:00 2001 From: jingjingxyk Date: Wed, 6 Jul 2022 20:40:39 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8F=AF=E6=9B=B4=E6=8D=A2?= =?UTF-8?q?=20=E6=90=9C=E7=B4=A2=E5=BC=95=E6=93=8E=20=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- tools/chromium_extension/js/app/components.js | 82 +++++----- tools/chromium_extension/js/app/init.js | 152 +++++++++--------- .../js/app/search-engine.js | 3 +- tools/chromium_extension/js/app/utils.js | 22 +-- 4 files changed, 129 insertions(+), 130 deletions(-) diff --git a/tools/chromium_extension/js/app/components.js b/tools/chromium_extension/js/app/components.js index 396946c..3729d95 100644 --- a/tools/chromium_extension/js/app/components.js +++ b/tools/chromium_extension/js/app/components.js @@ -12,37 +12,37 @@ let styleConfig = () => { let customElement = () => { let link = document.createElement("link"); link.setAttribute( - "href", - chrome.runtime.getURL("web-components/x-custom-box.html") + "href", + chrome.runtime.getURL("web-components/x-custom-box.html") ); document.head.appendChild(link); }; let getIframe = () => { let box = document.querySelector( - "#chinese-programmer-wrong-pronunciation-custom-iframe-box" + "#chinese-programmer-wrong-pronunciation-custom-iframe-box" ); let iframe = null; if (!box) { let custom_box = document.createElement( - "x-chinese-programmer-wrong-pronunciation-custom-box" + "x-chinese-programmer-wrong-pronunciation-custom-box" ); let aside = document.createElement("aside"); aside.setAttribute( - "id", - "chinese-programmer-wrong-pronunciation-custom-iframe-box" + "id", + "chinese-programmer-wrong-pronunciation-custom-iframe-box" ); aside.setAttribute( - "class", - "chinese-programmer-wrong-pronunciation-custom-iframe-box" + "class", + "chinese-programmer-wrong-pronunciation-custom-iframe-box" ); aside.setAttribute("draggable", "true"); let tool_bar = document.createElement("div"); tool_bar.setAttribute( - "class", - "chinese-programmer-wrong-pronunciation-custom-tool-bar" + "class", + "chinese-programmer-wrong-pronunciation-custom-tool-bar" ); tool_bar.addEventListener("click", (event) => { event.preventDefault(); @@ -52,16 +52,16 @@ let getIframe = () => { let window_close_icon = document.createElement("span"); window_close_icon.innerText = "❌"; window_close_icon.setAttribute( - "class", - "chinese-programmer-wrong-pronunciation-custom-window-close-icon" + "class", + "chinese-programmer-wrong-pronunciation-custom-window-close-icon" ); window_close_icon.addEventListener("click", closeSearchWindow); tool_bar.appendChild(window_close_icon); iframe = document.createElement("iframe"); iframe.setAttribute( - "id", - "chinese-programmer-wrong-pronunciation-custom-iframe" + "id", + "chinese-programmer-wrong-pronunciation-custom-iframe" ); iframe.setAttribute("security", "restricted"); //iframe.setAttribute('sandbox',"") @@ -77,18 +77,18 @@ let getIframe = () => { showSetSearchEngine(tool_bar, window_close_icon); } else { if ( - hasClass( - box, - "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" - ) + hasClass( + box, + "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" + ) ) { removeClass( - box, - "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" + box, + "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" ); } iframe = box.querySelector( - "#chinese-programmer-wrong-pronunciation-custom-iframe" + "#chinese-programmer-wrong-pronunciation-custom-iframe" ); iframe.setAttribute("src", "about:blank"); //iframe.contentDocument.close() @@ -96,8 +96,8 @@ let getIframe = () => { iframe = document.createElement("iframe"); iframe.setAttribute( - "id", - "chinese-programmer-wrong-pronunciation-custom-iframe" + "id", + "chinese-programmer-wrong-pronunciation-custom-iframe" ); iframe.setAttribute("security", "restricted"); box.appendChild(iframe); @@ -115,10 +115,10 @@ let showSetSearchEngine = (box, window_close_icon) => { { let search_engin_provider = { - "goToYouDaoSearch": "有道", - "goToGoogleSearch": "谷歌", - "goToBingDictSearch": "必应词典", - "goToBingSearch": "必应", + goToYouDaoSearch: "有道", + goToGoogleSearch: "谷歌", + goToBingDictSearch: "必应词典", + goToBingSearch: "必应", }; let select = document.createElement("select"); select.setAttribute("name", "search_engin_provider"); @@ -139,8 +139,8 @@ let showSetSearchEngine = (box, window_close_icon) => { } { let search_engin_provider_tab = { - "current_tab": "当前标签展示结果", - "new_tab": "新标签展示结果", + current_tab: "当前标签展示结果", + new_tab: "新标签展示结果", }; let select = document.createElement("select"); select.setAttribute("class", "search_engin_provider_tab"); @@ -162,8 +162,8 @@ let showSetSearchEngine = (box, window_close_icon) => { let div = document.createElement("span"); div.setAttribute( - "class", - "chinese-programmer-wrong-pronunciation-custom-tool-bar-setup" + "class", + "chinese-programmer-wrong-pronunciation-custom-tool-bar-setup" ); div.innerText = `⚙`; // box.insertBefore(div,select) @@ -172,23 +172,23 @@ let showSetSearchEngine = (box, window_close_icon) => { //关闭窗口 let closeSearchWindow = () => { let box = document.querySelector( - "#chinese-programmer-wrong-pronunciation-custom-iframe-box" + "#chinese-programmer-wrong-pronunciation-custom-iframe-box" ); console.log(box); if ( - box && - !hasClass( - box, - "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" - ) + box && + !hasClass( + box, + "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" + ) ) { addClass( - box, - "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" + box, + "chinese-programmer-wrong-pronunciation-custom-iframe-box-hidden" ); } let iframe = box.querySelector( - "#chinese-programmer-wrong-pronunciation-custom-iframe" + "#chinese-programmer-wrong-pronunciation-custom-iframe" ); iframe.setAttribute("src", "about:blank"); }; @@ -233,7 +233,7 @@ let setupConfig = (search_engine_name, tab) => { let cleanOpener = () => { sessionStorage.removeItem(opener_key); - console.log("重置扩展搜索结果打开方式配置---ok"); + console.log("重置搜索结果打开方式配置---ok"); }; export { diff --git a/tools/chromium_extension/js/app/init.js b/tools/chromium_extension/js/app/init.js index a06dbbe..2671d11 100644 --- a/tools/chromium_extension/js/app/init.js +++ b/tools/chromium_extension/js/app/init.js @@ -1,84 +1,84 @@ import box from "./box.js"; let init = () => { - let URLObj = new URL(location.href); - console.log(URLObj); - if (document.querySelector("#readme table tbody")) { - //载入自定义组件样式 - box.styleConfig(); - //载入自定义组件 - box.customElement(); + let URLObj = new URL(location.href); + console.log(URLObj); + if (document.querySelector("#readme table tbody")) { + //载入自定义组件样式 + box.styleConfig(); + //载入自定义组件 + box.customElement(); - let audio_player = new Audio(); - audio_player.setAttribute("autoplay", "true"); - document - .querySelector("#readme table tbody") - .addEventListener("click", (event) => { - //console.log(event.target) - // console.log(event.target.nodeType) - // console.log(event.target.nodeName); - let parentElement = event.target.parentElement; - if (parentElement && parentElement.nodeName === "TR") { - if (parentElement.firstElementChild === event.target) { - //使用搜索引擎查询发音 - box.goToSearchPronounce(event.target.innerText); - } - } - event.preventDefault(); - event.stopPropagation(); - let audio_url = null; - if (event.target.nodeName === "TD") { - let aTag = event.target.querySelector("a"); - if (aTag) { - audio_url = aTag.getAttribute("href"); - } - } - if (event.target.nodeName === "IMG") { - let aTag = event.target.parentNode.parentNode; - audio_url = aTag.getAttribute("href"); - } - if (audio_url) { - let desURL = new URL(audio_url); - //console.log(desURL.protocol); - if (desURL.protocol === "http:") { - //skip http - location.href = audio_url; - } else { - // console.log("audio_url:", audio_url); - audio_player.setAttribute("src", audio_url); - } - } - }); - document - .querySelector("#readme table tbody") - .addEventListener("mouseover", (event) => { - let parentElement = event.target.parentElement; - if (parentElement && parentElement.nodeName === "TR") { - if (parentElement.firstElementChild === event.target) { - event.target.setAttribute("title", "点击我打开搜索引擎检索"); - event.target.style.cursor = "pointer"; - } - } - }); - let table = document.querySelector("#readme table"); - let parent = table.parentNode; - let note = document.createElement("span"); - note.innerText = `⚪重置扩展提供的搜索结果打开方式⚪`; - note.setAttribute( - "class", - "chinese-programmer-wrong-pronunciation-custom-note-reset" - ); + let audio_player = new Audio(); + audio_player.setAttribute("autoplay", "true"); + document + .querySelector("#readme table tbody") + .addEventListener("click", (event) => { + //console.log(event.target) + // console.log(event.target.nodeType) + // console.log(event.target.nodeName); + let parentElement = event.target.parentElement; + if (parentElement && parentElement.nodeName === "TR") { + if (parentElement.firstElementChild === event.target) { + //使用搜索引擎查询发音 + box.goToSearchPronounce(event.target.innerText); + } + } + event.preventDefault(); + event.stopPropagation(); + let audio_url = null; + if (event.target.nodeName === "TD") { + let aTag = event.target.querySelector("a"); + if (aTag) { + audio_url = aTag.getAttribute("href"); + } + } + if (event.target.nodeName === "IMG") { + let aTag = event.target.parentNode.parentNode; + audio_url = aTag.getAttribute("href"); + } + if (audio_url) { + let desURL = new URL(audio_url); + //console.log(desURL.protocol); + if (desURL.protocol === "http:") { + //skip http + location.href = audio_url; + } else { + // console.log("audio_url:", audio_url); + audio_player.setAttribute("src", audio_url); + } + } + }); + document + .querySelector("#readme table tbody") + .addEventListener("mouseover", (event) => { + let parentElement = event.target.parentElement; + if (parentElement && parentElement.nodeName === "TR") { + if (parentElement.firstElementChild === event.target) { + event.target.setAttribute("title", "点击我打开搜索引擎检索"); + event.target.style.cursor = "pointer"; + } + } + }); + let table = document.querySelector("#readme table"); + let parent = table.parentNode; + let note = document.createElement("span"); + note.innerText = `⚪重置扩展提供的搜索结果打开方式⚪`; + note.setAttribute( + "class", + "chinese-programmer-wrong-pronunciation-custom-note-reset" + ); - note.addEventListener("click", (event) => { - //重置配置 - event.preventDefault(); - event.stopPropagation(); - box.cleanOpener(); - }); - parent.insertBefore(note, table); - } else { - console.log("no found README.md table"); - } + note.addEventListener("click", (event) => { + //重置配置 + event.preventDefault(); + event.stopPropagation(); + box.cleanOpener(); + }); + parent.insertBefore(note, table); + } else { + console.log("no found README.md table"); + } }; export { init }; diff --git a/tools/chromium_extension/js/app/search-engine.js b/tools/chromium_extension/js/app/search-engine.js index 88ea552..77a3776 100644 --- a/tools/chromium_extension/js/app/search-engine.js +++ b/tools/chromium_extension/js/app/search-engine.js @@ -15,10 +15,9 @@ let goToBingSearch = (word) => { return `https://cn.bing.com/search?q=how%20to%20pronounce%20${word}`; }; - export { goToYouDaoSearch, goToGoogleSearch, goToBingDictSearch, - goToBingSearch + goToBingSearch, }; diff --git a/tools/chromium_extension/js/app/utils.js b/tools/chromium_extension/js/app/utils.js index 01f403f..46280d4 100644 --- a/tools/chromium_extension/js/app/utils.js +++ b/tools/chromium_extension/js/app/utils.js @@ -18,7 +18,7 @@ function removeClass(el, className) { function getCookie(name) { let arr, - reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); + reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)"); if ((arr = document.cookie.match(reg))) { return decodeURIComponent(arr[2]); } else { @@ -33,16 +33,16 @@ function setCookie(name, value, second, domain) { var exp = new Date(); exp.setTime(exp.getTime() + second * 1000); document.cookie = - name + - "=" + - encodeURIComponent(value) + - ";expires=" + - exp.toGMTString() + - ";path=" + - path + - ";domain=" + - domain + - ";SameSite=None;Secure"; + name + + "=" + + encodeURIComponent(value) + + ";expires=" + + exp.toGMTString() + + ";path=" + + path + + ";domain=" + + domain + + ";SameSite=None;Secure"; } async function getCookies(domain) { let cookies = await cookieStore.getAll({ domain: domain });