diff --git a/src/preload/css.ts b/src/preload/css.ts index b363583..63feaa0 100644 --- a/src/preload/css.ts +++ b/src/preload/css.ts @@ -9,45 +9,39 @@ export default async () => { const style = document.createElement('style'); style.innerText = css` - header { + header, + body > c-wiz > div:first-child > div:first-child { margin-top: -1px !important; height: 0 !important; overflow: hidden !important; padding: 0 !important; } - #source { + c-wiz c-wiz c-wiz c-wiz > h2 ~ span > span > div, + c-wiz c-wiz c-wiz c-wiz > h2 ~ span > span > div > div:last-child { max-height: none !important; padding-right: 50px !important; } - *:not(.moremenu) { + * { box-shadow: none !important; } ::-webkit-scrollbar, - .gt-md-bg, - .gt-md, - .go-wrap, - .ad-panel, - .notification-area { + h1#i5 + div c-wiz > h2 ~ div[jsaction] > div[aria-label], + body > c-wiz nav + div { display: none !important; } :focus { outline: none !important; } - .frame { - height: 100vh !important; - } - .jfk-button-flat:focus { - border-color: transparent !important; - } - body { - background: transparent; - transform: translateX(100%); + background: transparent !important; + transform: translateX(100%) !important; } - .frame { - background: #f5f5f5; - margin: ${config.platform === 'win32' ? '20px' : '0'} 0 ${config.platform === 'linux' ? '20px' : '0'} 20px; - filter: drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 0.5px); + body > c-wiz[view] { + overflow: auto; + height: 100vh !important; + background: #f5f5f5 !important; + margin: ${config.platform === 'win32' ? '20px' : '0'} 0 ${config.platform === 'linux' ? '20px' : '0'} 20px !important; + filter: drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 0.5px) !important; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15) !important; } `; diff --git a/src/preload/index.ts b/src/preload/index.ts index 3892051..8485569 100644 --- a/src/preload/index.ts +++ b/src/preload/index.ts @@ -6,12 +6,12 @@ import { CUSTOM_EVENT } from '../consts'; import textBoxHistory from './textboxhistory'; import injectCSS from './css'; import lang from './lang'; -import { click, getTranslateString } from './utils'; +import { click, getTranslateString, dispatchInputEvent } from './utils'; import './shortcut'; import './animate'; -interface InitPageOption { +export interface InitPageOption { sourceTextArea: string; responseContainer: string; sourceTTS: string; @@ -21,11 +21,11 @@ interface InitPageOption { signOut: string; submit?: string; - sourceLabel?: string; - targetLabel?: string; - detectLabel?: string; - enLabel?: string; - zhLabel?: string; + sourceCurrentLabel?: string; + sourceDetectLabel?: string; + targetCurrentLabel?: string; + targetENLabel?: string; + targetZHCNLabel?: string; starButton?: string; } @@ -41,6 +41,7 @@ const initTranslatePage = async (opt: InitPageOption) => { sourceTextAreaEle.focus(); if (!arg) return; // 没有选择的文本 sourceTextAreaEle.value = getTranslateString(arg); + dispatchInputEvent(sourceTextAreaEle); }); window.addEventListener('keydown', e => { @@ -92,40 +93,46 @@ const initTranslatePage = async (opt: InitPageOption) => { } }); - if (opt.sourceLabel && opt.targetLabel && opt.enLabel && opt.zhLabel && opt.detectLabel) { + if ( + opt.sourceCurrentLabel && + opt.sourceDetectLabel && + opt.targetCurrentLabel && + opt.targetENLabel && + opt.targetZHCNLabel + ) { const i18n = lang(); - const sourceLabelEle = document.querySelector(opt.sourceLabel) as HTMLElement; - const targetLabelEle = document.querySelector(opt.targetLabel) as HTMLElement; - const enLabelEle = document.querySelector(opt.enLabel) as HTMLElement; - const zhLabelEle = document.querySelector(opt.zhLabel) as HTMLElement; - const detectLabelEle = document.querySelector(opt.detectLabel) as HTMLElement; + const sourceCurrentLabelEle = document.querySelector(opt.sourceCurrentLabel) as HTMLElement; + const sourceDetectLabelEle = document.querySelector(opt.sourceDetectLabel) as HTMLElement; + const targetCurrentLabelEle = document.querySelector(opt.targetCurrentLabel) as HTMLElement; + const targetENLabelEle = document.querySelector(opt.targetENLabel) as HTMLElement; + const targetZHCNLabelEle = document.querySelector(opt.targetZHCNLabel) as HTMLElement; + + sourceDetectLabelEle.click(); ipcRenderer.on(CUSTOM_EVENT.TRANSLATE, (_: any, arg: string) => { const { value } = sourceTextAreaEle; if (value === arg) return; sourceTextAreaEle.value = ''; - targetLabelEle.click(); - detectLabelEle.click(); + sourceDetectLabelEle.click(); sourceTextAreaEle.value = getTranslateString(value); + dispatchInputEvent(sourceTextAreaEle); }); const observer = new MutationObserver(() => { - const sourceMatch = sourceLabelEle.textContent?.match(i18n.detectReg); - const sourceStr = sourceMatch ? sourceMatch[1] : ''; - const targetStr = targetLabelEle.textContent; + const sourceStr = sourceCurrentLabelEle.textContent?.match(i18n.detectReg)?.[1]; + const targetStr = targetCurrentLabelEle.textContent; if (sourceStr && targetStr?.includes(sourceStr)) { - targetLabelEle.click(); if (sourceStr === i18n.detectZh) { - enLabelEle.click(); + targetENLabelEle.click(); } else { - zhLabelEle.click(); + targetZHCNLabelEle.click(); } } }); - observer.observe(sourceLabelEle, { - attributes: false, + observer.observe(sourceCurrentLabelEle, { + subtree: true, childList: true, - subtree: false, + characterData: true, }); } }; @@ -134,19 +141,21 @@ const { href } = window.location; if (href.startsWith(config.translateUrl) || href.startsWith(config.translateUrlFallback)) { injectCSS(); initTranslatePage({ - sourceTextArea: '#source', - responseContainer: '.tlid-translation', - sourceTTS: '.src-tts', - responseTTS: '.res-tts', - responseCopy: '.copybutton', - starButton: '.starbutton', + sourceTextArea: 'textarea[aria-autocomplete="list"]', + responseContainer: '[role="region"] > [jsaction][jsname] > [data-language] > div > span[lang][jsaction][jsname]', + sourceTTS: 'div[data-enable-toggle-playback-speed][data-location="1"] > button[aria-label][jscontroller][jsname]', + responseTTS: 'div[data-enable-toggle-playback-speed][data-location="2"] > button[aria-label][jscontroller][jsname]', + responseCopy: 'div[data-enable-toggle-playback-speed][data-location="2"] + button', + starButton: '[data-saved-translation-limit-reached] > button[aria-pressed]', signIn: 'a[href*="https://accounts.google.com/ServiceLogin"]', signOut: 'a[href*="https://accounts.google.com/Logout"]', - sourceLabel: '.tlid-open-small-source-language-list', - targetLabel: '.tlid-open-small-target-language-list', - detectLabel: '[onclick*=sl_list_auto]', - enLabel: '[onclick*=tl_list_en]', - zhLabel: '[onclick*=tl_list_zh-CN]', + sourceCurrentLabel: 'h1#i5 + div > div > c-wiz[jsmodel] > div[jsname][role="button"]:nth-of-type(1)', + sourceDetectLabel: 'div[data-auto-open-search] > div > div> div div[data-language-code="auto"]', + targetCurrentLabel: 'h1#i5 + div > div > c-wiz[jsmodel] > div[jsname][role="button"]:nth-of-type(3)', + targetENLabel: + 'h1#i5 + div + div + div > c-wiz > div:nth-of-type(2) > div[data-auto-open-search] > div > div> div div[data-language-code="en"]', + targetZHCNLabel: + 'h1#i5 + div + div + div > c-wiz > div:nth-of-type(2) > div[data-auto-open-search] > div > div> div div[data-language-code="zh-CN"]', }); ipcRenderer.sendToHost('header-background-change', 'white'); } else { diff --git a/src/preload/textboxhistory.ts b/src/preload/textboxhistory.ts index 7eb14df..11349cc 100644 --- a/src/preload/textboxhistory.ts +++ b/src/preload/textboxhistory.ts @@ -1,4 +1,4 @@ -import { getTranslateString, throttle } from './utils'; +import { getTranslateString, throttle, dispatchInputEvent } from './utils'; export default function(arg: HTMLTextAreaElement, submit?: string) { let isComposition = false; @@ -34,12 +34,14 @@ export default function(arg: HTMLTextAreaElement, submit?: string) { valueHistory.currentPosition -= 1; textarea.value = valueHistory.historyValuePool[valueHistory.currentPosition]; } + dispatchInputEvent(textarea); } function redo() { if (valueHistory.currentPosition + 1 < valueHistory.historyValuePool.length) { valueHistory.currentPosition += 1; textarea.value = valueHistory.historyValuePool[valueHistory.currentPosition]; + dispatchInputEvent(textarea); } } const throttleAddValueToHistory = throttle(addValueToHistory, 1000); @@ -87,6 +89,7 @@ export default function(arg: HTMLTextAreaElement, submit?: string) { const originStr = getTranslateString(newString); textarea.value = originStr; + dispatchInputEvent(textarea); addValueToHistory(originStr); } }); diff --git a/src/preload/utils.ts b/src/preload/utils.ts index 7360354..8a80fd3 100644 --- a/src/preload/utils.ts +++ b/src/preload/utils.ts @@ -59,3 +59,7 @@ export function click(ele: HTMLElement) { activeElement.focus(); } } + +export function dispatchInputEvent(ele: HTMLElement) { + ele.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true })); +}