初步实现了对照翻译功能:自动隐藏原文,并把原文的文本内容设置为译文的title

This commit is contained in:
Zhicheng Wang 2016-05-13 13:00:21 +08:00
parent 9824aca0fe
commit 3634128fff
7 changed files with 66 additions and 21 deletions

View File

@ -15,6 +15,7 @@ script(src="/resources/js/vendor/angular-material.min.js")
<!-- Angular.io Site JS -->
script(src="/resources/js/translate.js")
script(src="/resources/js/site.js")
script(src="/resources/js/controllers/app-controller.js")
script(src="/resources/js/directives/cheatsheet.js")

View File

@ -8,6 +8,7 @@
making web development feel effortless. We believe that writing
beautiful apps should be joyful and fun. We're building a
platform for the future.
p.text-body.
Angular由一个工程师组织打造我们拥有共同的热情 —— 让Web开发变得更简单。我们深信写漂亮的程序快乐而有趣。
我们正在构建一个面向未来的平台。

View File

@ -53,9 +53,9 @@ figure.image-display
在此日程中,我们将会看到很多代码块。它们都很容易拷贝和粘贴:
code-example(format='.', language='html').
Click the glyph on the right to copy code snippets to the clipboard ⇨⇨⇨⇨⇨⇨⇨⇨⇨⇨
Click the glyph on the right to copy code snippets to the clipboard ==========>
点击右边的图标来把代码片段拷贝到剪贴板 ⇨⇨⇨⇨⇨⇨⇨⇨⇨⇨
点击右边的图标来把代码片段拷贝到剪贴板 ==========>
button(class="verbose off md-primary md-button md-ink-ripple", type="button", onclick="verbose(false)").
Hide explanations
@ -82,6 +82,7 @@ a(id="devenv")
## 开发环境
We need to set up our development environment:
我们要设置开发环境:
* install node and npm
* 安装 node 和 npm

View File

@ -0,0 +1,3 @@
.hidden {
display: none !important;
}

View File

@ -9,6 +9,7 @@
@import 'theme';
@import 'base/reset';
@import 'base/type';
@import "translate";
@import 'angular';

View File

@ -0,0 +1,38 @@
(function () {
var targets = document.querySelectorAll('p, li, h1, h2, h3, h4, h5, h6, header, a, button');
_.each(targets, function (node) {
if (isTranslationResult(node)) {
var prevNode = node.previousElementSibling;
if (prevNode && !prevNode.classList.contains('nav-list-item')) {
prevNode.classList.add('hidden');
}
node.title = prevNode.innerText;
}
});
function isOriginalEnglish(text) {
return /[\1-\255⇨]/.test(text);
}
function isClonedNode(node1, node2) {
return node1.parentNode === node2.parentNode && node1.tagName === node2.tagName && node1.className === node2.className;
}
function indexOf(node) {
var i = 0;
var aNode = node.parentNode.firstChild;
while (aNode !== node) {
++i;
if (aNode.tagName !== node.tagName) {
i = 0;
}
aNode = aNode.nextElementSibling;
}
return i;
}
function isTranslationResult(node) {
var prevNode = node.previousElementSibling;
return indexOf(node) % 2 === 1 && prevNode && isClonedNode(node, prevNode) && isOriginalEnglish(prevNode.innerText);
}
})();