fix ui issues

immersive-translate · Nov 9, 2022 · c4dac3c · c4dac3c
1 parent 1b9e946
commit c4dac3c
Show file tree

Hide file tree

Showing 10 changed files with 123 additions and 81 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,13 @@
 # Change Log
 
+
+## 0.0.18
+
+- Better for Reddit and old.reddit.com
+- Suppor manifest v3, get ready to submit to chrome store and edge store
+- Fix some ui issue
+
+
 ## 0.0.16.2
 
 - Support Github

diff --git a/PRIVACY b/PRIVACY
@@ -3,4 +3,4 @@ The only communication is with Google (translate.google.com and translate.google
 These translation services (Google, Yandex, Bing and DeepL) can collect data to improve their services.
 To translate, all content on the page is sent to Google, Yandex, Bind or DeepL servers.
 For text to speech (tts) the text will be sent to Google.
-The source code is available on <a href="https://github.com/theowenyoung/Traduzir-paginas-web">Github</a>.
+The source code is available on <a href="https://github.com/immersive-translate/immersive-translate">Github</a>.
diff --git a/docs/application.md b/docs/application.md
@@ -0,0 +1,82 @@
+# Application to Store
+
+
+## Purpose
+
+This extension is used to translate web pages, as well as selected text. Unlike other translation extensions, this extension supports bilingual display at the same time, and translates only the important content of the web page instead of the whole web page, it is like the browser's reading mode, designed to improve the user experience and help user to learn the target language when reading translated pages. It supports most websites out of the box, but has special adaptations for Twitter, Reddit and other information flow websites to make it a better experience.
+
+
+## Storage
+
+Since web page translation requires a lot of requests, we cache the parts that are translated as a way to save unnecessary requests, and I provide a storage management page in the plugin's options to help users manage the plugin's cache.
+
+
+## ActiveTab
+
+We need ActiveTab access to get the pages and text that the user wants to translate.
+
+## ContextMenu
+
+We provide a quick translation of this page menu item in the menu
+
+## Request
+
+We need web request permission to get the translated results from network.
+
+
+## web navigation
+
+This is an optional option that we provide for the user to set to automatically translate the target page when the link to the page is clicked, this is an optional option to request this permission only when the user opens this setting.
+
+
+## Host permission
+
+This is a translation plugin, it may be requested by any host, so we need the permission of any host.
+
+
+## description cn:
+
+让我们体验一下沉浸式的网页翻译，双语同时显示，只翻译重要内容！
+
+这个插件与其他翻译插件的不同之处在于：
+
+1. 双语显示，按段落分割
+2. 只翻译页面的内容区域，大大增强了翻译的阅读体验，而不像其他插件，所有元素都被翻译，它就像浏览器的阅读模式，但是是翻译。所以该插件被命名为 "沉浸式翻译"
+3. 我希望这个插件有足够的通用性，不需要为大多数网站定制，但往往有一些网站是不规范的，或者是非内容网站，这些网站单独优化后效果更好，所以我会对这类网站做单独的适配，不好的地方是，如果网站有更新，优化可能会失效，所以这里需要持续的跟进，如果你有一个常用的网站翻译体验不好，请随时在 https://github.com/immersive-translate/immersive-translate/issues 提出。
+4. 支持PDF文件的双语翻译
+5. 与https://1paragraph.app/ 等epub在线阅读网站配合，实现国外电子书的双语阅读
+
+这个插件比较关注经常需要阅读外文的用户，让他们在阅读外文网页时有一个好的体验（我想做这个插件是因为我经常需要在https://www.buzzing.cc，浏览大量的外媒文章），所以这个插件的目标群体是：
+
+1. 经常阅读国外的长篇文章、论文
+2. 阅读外文PDF、外文电子书
+3. 希望快速浏览Twitter、Reddit、Hacker News、Github Issue和其他外国论坛网站
+4. 希望显示两种语言来学习目标语言
+5. 希望同时显示双语，以平衡一些机器翻译的不可知性
+6. 希望尽快摆脱这个扩展，这对你来说是一个过渡的助手
+
+该扩展支持（依赖）Google翻译引擎或Yandex翻译引擎，同时也支持使用Bing、Deepl进行文本选中翻译，该插件完全免费，希望大家都能尽可能平等的获得知识，感谢原扩展：https://github.com/FilipePS/Traduzir-paginas-weboriginal，感谢他为这个项目付出的巨大努力。
+
+
+## description en
+
+Let's experience immersive web translation, with bilingual simultaneous display and translation of only the important content. 
+
+What makes this plugin different from other translation plugins is that:
+
+1. Bilingual display, split by paragraph
+2. Translation of only the content area of the page, which greatly enhances the reading experience of the translation, instead of the previous one where all elements of the page are translated, similar to the browser reading mode, so the plugin was named "Immersive Translation"
+3. I hope this plugin is universal enough that it does not need to be customized for most websites, but there are often some websites that are not standardized, or non-content websites, and these websites are better after separate optimization, so we will do separate adaptations for such websites, and the downside is that the website may not work at any time. The bad thing is that the website may fail at any time with the update of the website, so here I will continue to optimize. If you have a commonly used website that does not translate well, please feel free to ask in https://github.com/immersive-translate/immersive-translate/issues
+4. Support bilingual translation of PDF files
+5. Cooperate with epub online reading website like https://1paragraph.app/ , to realize bilingual reading of foreign e-books
+
+This plugin is more concerned about users who often need to read foreign languages to have a good experience when reading foreign language pages (I want to do this plugin because I often need to browse a lot of foreign media articles on https://www.buzzing.cc ), so the target group of this plugin is:
+
+1. You often read long articles, papers from abroad
+2. Read foreign language PDF, foreign language e-books
+3. You want to quickly browse Twitter, Reddit, Hacker News, Github Issue and other foreign forum sites
+4. You want to display both languages to learn the target language
+5. You hope to display bilingualism at the same time to balance the unknowingness of some machine translation
+6. You hope to get rid of this extension as soon as possible, which is an excessive assistant for users who are directly used to reading the original language
+
+The extension also supports (relies on) Google translation engine or Yandex translation engine, while supporting the use of Bing, Deepl for text selection translation, the plug-in is completely free, I hope we can all get knowledge as equally as possible, thanks to the original extension: https://github.com/FilipePS/Traduzir-paginas-weboriginal for the great effort he put into this project.
diff --git a/readme.md b/readme.md
@@ -12,7 +12,7 @@ Let's experience immersive web translation, with bilingual simultaneous display
 
 - 双语显示，按照段落分割
 - 只翻译网页里的内容区域，这极大的增强了翻译的阅读体验，而不是像之前那样网页的所有元素都被翻译，类似浏览器的阅读模式，所以该插件被重新命名为“沉浸式翻译”
-- 为常用网站做了定制优化，比如推特，Reddit，Hacker News等，我希望这个插件足够通用，不需要为绝大多数网站做定制，但是往往有一些网站由于不规范，或者非内容类网站，这些网站在单独优化后体验更好，所以我们会对这类网站做单独适配，同时坏处就是可能随时网站的更新而失效，所以这里我会持续优化。如果有常用的网站翻译显示不佳，欢迎在[Isuee](https://github.com/theowenyoung/Traduzir-paginas-web/issues)或[Telegram群组](https://t.me/+rq848Z09nehlOTgx)中提出。
+- 为常用网站做了定制优化，比如推特，Reddit，Hacker News等，我希望这个插件足够通用，不需要为绝大多数网站做定制，但是往往有一些网站由于不规范，或者非内容类网站，这些网站在单独优化后体验更好，所以我们会对这类网站做单独适配，同时坏处就是可能随时网站的更新而失效，所以这里我会持续优化。如果有常用的网站翻译显示不佳，欢迎在[Isuee](https://github.com/immersive-translate/immersive-translate/issues)或[Telegram群组](https://t.me/+rq848Z09nehlOTgx)中提出。
 - 支持PDF文件双语对照翻译
 - 配合epub在线阅读网站<https://1paragraph.app/> 即可实现双语阅读国外电子书
 
@@ -31,15 +31,15 @@ Let's experience immersive web translation, with bilingual simultaneous display
 
 ### Firefox 
 
-已发布到商店，可以[直接下载](https://addons.mozilla.org/en-US/firefox/addon/immersive-translate/)。如果你想最快体验到新版，也可以直接在[Release页面](https://github.com/theowenyoung/Traduzir-paginas-web/releases)下载最新构建的版本，已签名，可以直接安装。
+已发布到商店，可以[直接下载](https://addons.mozilla.org/en-US/firefox/addon/immersive-translate/)。如果你想最快体验到新版，也可以直接在[Release页面](https://github.com/immersive-translate/immersive-translate/releases)下载最新构建的版本，已签名，可以直接安装。
 
 
 
 ### Chrome/Edge
 
 chrome,edge商店的升级和发布正在进行中，目前需要手动安装：
 
-1. 在[这里](https://github.com/theowenyoung/Traduzir-paginas-web/releases)下载chrome的压缩包
+1. 在[这里](https://github.com/immersive-translate/immersive-translate/releases)下载chrome的压缩包
 2. 解压到一个以后不会删除的文件夹
 3. 打开扩展管理窗口，`chrome://extensions`
 4. 激活开发者模式
@@ -51,7 +51,7 @@ chrome,edge商店的升级和发布正在进行中，目前需要手动安装：
 
 目前依然处于Alpha阶段，但是常用内容网站在使用上已经没有问题，同时在[Telegram 沉浸式插件讨论组](https://t.me/+rq848Z09nehlOTgx)中经常得到很多有用的反馈，如果你有反馈，也可以在[群里](https://t.me/+rq848Z09nehlOTgx)提出。
 
-在[Release页面](https://github.com/theowenyoung/Traduzir-paginas-web/releases)会有一个nightly版本被频繁的构建，建议喜欢体验最新版/或者想帮忙测试的同学，可以手动安装nightly版本，firefox的扩展包已签名，可以直接下载后作为扩展文件安装。
+在[Release页面](https://github.com/immersive-translate/immersive-translate/releases)会有一个nightly版本被频繁的构建，建议喜欢体验最新版/或者想帮忙测试的同学，可以手动安装nightly版本，firefox的扩展包已签名，可以直接下载后作为扩展文件安装。
 
 > 现在还没有任何选项可以设置,欢迎加入一起开发呀～
 
@@ -103,7 +103,7 @@ This extension Forks from the [TWP](https://github.com/FilipePS/Traduzir-paginas
 
 - Bilingual display, split by paragraph
 - Translation of only the content area of the page, which greatly enhances the reading experience of the translation, instead of the previous one where all elements of the page are translated, similar to the browser reading mode, so the plugin was renamed "Immersive Translation"
-- I hope this plugin is universal enough that it does not need to be customized for most websites, but there are often some websites that are not standardized, or non-content websites, and these websites are better after separate optimization, so we will do separate adaptations for such websites, and the downside is that the website may not work at any time. The bad thing is that the website may fail at any time with the update of the website, so here I will continue to optimize. If you have a commonly used website that does not translate well, please feel free to ask in [Isuee](https://github.com/theowenyoung/Traduzir-paginas-web/issues) or [Telegram group](https://t.me/+rq848Z09nehlOTgx ).
+- I hope this plugin is universal enough that it does not need to be customized for most websites, but there are often some websites that are not standardized, or non-content websites, and these websites are better after separate optimization, so we will do separate adaptations for such websites, and the downside is that the website may not work at any time. The bad thing is that the website may fail at any time with the update of the website, so here I will continue to optimize. If you have a commonly used website that does not translate well, please feel free to ask in [Isuee](https://github.com/immersive-translate/immersive-translate/issues) or [Telegram group](https://t.me/+rq848Z09nehlOTgx ).
 - Support bilingual translation of PDF files
 - Cooperate with epub online reading website <https://1paragraph.app/> to realize bilingual reading of foreign e-books
 
@@ -146,10 +146,10 @@ Some pages like [support.mozilla.org](https://support.mozilla.org/) and [addons.
 ## Todo
 
 
-- [ ] - adapt for Github
-- [ ] - backup默认文件名还是TWP
+- [x] - adapt for Github
+- [x] - backup默认文件名还是TWP
 - [ ] - option页面从extension中打开的显示问题 
-- [ ] - 版本号自动添加
-- [ ] - youtube comments
-- [ ] - better for github
+- [x] - 版本号自动添加
+- [x] - youtube comments
+- [x] - better for github
 
diff --git a/src/chrome_manifest.json b/src/chrome_manifest.json
@@ -2,8 +2,8 @@
     "manifest_version": 3,
     "default_locale": "en",
     "name": "Immersive Translate",
-    "description": "Let's experience immersive web translation, with bilingual simultaneous display and translation of only the important content. Think of the browser's reading mode, but in immersive translation.",
-    "version": "0.0.17.1",
+    "description": "Let's experience immersive web translation, with bilingual simultaneous display and translation of only the important content.",
+    "version": "0.0.18",
     "homepage_url": "https://github.com/immersive-translate/immersive-translate",
 
     "commands": {

diff --git a/src/contentScript/enhance.js b/src/contentScript/enhance.js
@@ -76,15 +76,20 @@ const translateSelectors = [
   {
     hostname:"www.reddit.com",
     selectors:[
-      "h3",
-      "p"
+      "[data-adclicklocation=title]",
+    ],
+    containerSelectors:[
+      "[data-testid=comment]",
+      "[data-adclicklocation=media]"
     ]
   },
   {
     hostname:"old.reddit.com",
     selectors:[
       "a.title",
-      ".usertext-body"
+    ],
+    containerSelectors:[
+      "[role=main] .md-container"
     ]
   },
   {
@@ -325,16 +330,17 @@ function getNodesThatNeedToTranslate(root,ctx,options){
         }
       }
     }
-  }else{
-   const originalRoot = root;
+  }
+
+
+  if((pageSpecialConfig && pageSpecialConfig.containerSelectors) || allBlocksSelectors.length === 0){
+    const originalRoot = root;
     const contentContainers = getContainers(root,pageSpecialConfig);
     let containers = [root]
     if(contentContainers && Array.isArray(contentContainers)){
       containers = contentContainers;
     }  
-
     for(const root of containers){
-
       for(const blockTag of blockElements){
         const paragraphs = root.querySelectorAll(blockTag.toLowerCase());
         for (const paragraph of paragraphs) {

diff --git a/src/lib/config.js b/src/lib/config.js
@@ -3,7 +3,7 @@
 const twpConfig = (function () {
   /** @type {function[]} */
   const observers = [];
-  const defaultTargetLanguages = ["en", "es", "de"];
+  const defaultTargetLanguages = ["zh-CN", "zh-TW",'en'];
   /**
    * all configName available
    * @typedef {"pageTranslatorService" | "textTranslatorService" | "ttsSpeed" | "enableDeepL" | "targetLanguage" | "targetLanguageTextTranslation" | "targetLanguages" | "alwaysTranslateSites" | "neverTranslateSites" | "sitesToTranslateWhenHovering" | "langsToTranslateWhenHovering" | "alwaysTranslateLangs" | "neverTranslateLangs" | "customDictionary" | "showTranslatePageContextMenu" | "showTranslateSelectedContextMenu" | "showButtonInTheAddressBar" | "showOriginalTextWhenHovering" | "showTranslateSelectedButton" | "showPopupMobile" | "useOldPopup" | "darkMode" | "popupBlueWhenSiteIsTranslated" | "popupPanelSection" | "showReleaseNotes" | "dontShowIfPageLangIsTargetLang" | "dontShowIfPageLangIsUnknown" | "dontShowIfSelectedTextIsTargetLang" | "dontShowIfSelectedTextIsUnknown" | "hotkeys" | "expandPanelTranslateSelectedText" | "translateTag_pre" | "dontSortResults" | "translateDynamicallyCreatedContent" | "autoTranslateWhenClickingALink" | "translateSelectedWhenPressTwice" | "translateTextOverMouseWhenPressTwice" | "translateClickingOnce"} DefaultConfigNames
@@ -33,7 +33,7 @@ const twpConfig = (function () {
     darkMode: "auto", // auto yes no
     popupBlueWhenSiteIsTranslated: "yes",
     popupPanelSection: 1,
-    showReleaseNotes: "yes",
+    showReleaseNotes: "no",
     dontShowIfPageLangIsTargetLang: "no",
     dontShowIfPageLangIsUnknown: "no",
     dontShowIfSelectedTextIsTargetLang: "no",

diff --git a/src/manifest.json b/src/manifest.json
@@ -2,8 +2,8 @@
     "manifest_version": 2,
     "default_locale": "en",
     "name": "Immersive Translate",
-    "description": "Let's experience immersive web translation, with bilingual simultaneous display and translation of only the important content. Think of the browser's reading mode, but in immersive translation.",
-    "version": "0.0.17.1",
+    "description": "Let's experience immersive web translation, with bilingual simultaneous display and translation of only the important content.",
+    "version": "0.0.18",
     "homepage_url": "https://github.com/immersive-translate/immersive-translate",
 
     "browser_specific_settings": {