Skip to content
This repository has been archived by the owner on Mar 20, 2024. It is now read-only.

Commit

Permalink
chore: ability to toggle the english language (#41)
Browse files Browse the repository at this point in the history
  • Loading branch information
Foxandxss authored and Wassim Chegham committed Jul 15, 2016
1 parent 8875446 commit 92fcb7e
Show file tree
Hide file tree
Showing 6 changed files with 158 additions and 2 deletions.
3 changes: 3 additions & 0 deletions public/_includes/_main-nav.jade
Expand Up @@ -13,3 +13,6 @@ md-toolbar(class="main-nav background-regal l-pinned-top l-layer-5",scroll-y-off
li.l-left <a class="main-nav-button" href="/events.html" md-button>Events</a>
li.l-left <a class="main-nav-button" href="/news.html" md-button>News</a>
li.l-right <a class="main-nav-button" href="/docs/ts/latest/quickstart.html" md-button>Get Started</a>
li.l-right
a.main-nav-button.md-button.ng-cloak(ng-click="appCtrl.toggleSource($event)", href)
span {{appCtrl.sourceVisible?'Hide English':'Show English'}}
3 changes: 2 additions & 1 deletion public/_includes/_scripts-include.jade
Expand Up @@ -20,6 +20,7 @@ script(src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular


<!-- Angular.io Site JS -->
script(src="/localization/translate.js")
script(src="/resources/js/site.js")
script(src="/resources/js/util.js")
script(src="/resources/js/controllers/app-controller.js")
Expand Down Expand Up @@ -64,4 +65,4 @@ script(src="//www.gstatic.com/feedback/api.js" type="text/javascript")

<!-- Twitter Widget -->
script.
(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}})(document,"script","twitter-wjs");
(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}})(document,"script","twitter-wjs");
124 changes: 124 additions & 0 deletions public/localization/translate.js
@@ -0,0 +1,124 @@
var sourceVisible = localStorage.getItem('source-visible') === 'true';

(function ($) {
function addOriginalToggler() {
var nodes = document.querySelectorAll('p, li, h1, h2, h3, h4, h5, h6, header, a, button, small');
_.each(nodes, function (node) {
var $node = $(node);

if (isLink(node) || isButton(node)) {
$node.on('click', function (event) {
event.stopPropagation();
});

if (/^http?s:\/\//.test($node.attr('href')) && !$node.attr('target')) {
$node.attr('target', '_blank');
}
}

var prevNode = node.previousElementSibling;
var $prevNode = $(prevNode);

if (!prevNode) {
return;
}

if (isTranslationResult(node, prevNode)) {
if ($prevNode.hasClass('nav-list-item') ||
$prevNode.hasClass('l-right') ||
$prevNode.hasClass('l-left')) {
return;
}
if ($node.text() === $prevNode.text()) {
return;
}

$node.attr('id', prevNode.id);
$node.addClass('translated');
$prevNode.removeAttr('id');
$prevNode.addClass('original-english');
if (!sourceVisible) {
$prevNode.addClass('hidden');
}
if (!isLink(node) && !isButton(node)) {
var isDragging = false;
$node.on('mousedown', function () {
$(window).on('mousemove', function () {
isDragging = true;
$(window).unbind('mousemove');
});
});
$prevNode.on('mousedown', function () {
$(window).on('mousemove', function () {
isDragging = true;
$(window).unbind('mousemove');
});
});
$node.on('mouseup', function () {
var wasDragging = isDragging;
isDragging = false;
$(window).unbind('mousemove');
if (!wasDragging) {
$prevNode.toggleClass('hidden');
}
});
$prevNode.on('mouseup', function () {
var wasDragging = isDragging;
isDragging = false;
$(window).unbind('mousemove');
if (!wasDragging) {
$prevNode.addClass('hidden');
}
});
}
$node.after($prevNode);
}
})
}

function attributesToString(node) {
return _.chain(node.attributes)
.map(function (value) {
if (value.name === 'id') {
return '';
} else {
return value.name + '=' + value.value;
}
})
.sortBy()
.value()
.join(';');
}

function isLink(node) {
return node.tagName.toUpperCase() === 'A';
}

function isButton(node) {
return node.tagName.toUpperCase() === 'BUTTON';
}

function isClonedNode(node1, node2) {
return node1.tagName === node2.tagName &&
attributesToString(node1) === attributesToString(node2);
}

function indexOfSameType(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, prevNode) {
return indexOfSameType(node) % 2 === 1 && isClonedNode(node, prevNode);
}

addOriginalToggler();
})(angular.element);
12 changes: 12 additions & 0 deletions public/resources/css/_translate.scss
@@ -0,0 +1,12 @@
.original-english {
border-top: 1px dashed $regal;
&.hidden {
display: none !important;
}
}

td, th {
> p:last-child {
margin-bottom: 0;
}
}
1 change: 1 addition & 0 deletions public/resources/css/main.scss
Expand Up @@ -9,6 +9,7 @@
@import 'theme';
@import 'base/reset';
@import 'base/type';
@import 'translate';
@import 'angular';


Expand Down
17 changes: 16 additions & 1 deletion public/resources/js/controllers/app-controller.js
Expand Up @@ -62,4 +62,19 @@ angularIO.controller('AppCtrl', ['$mdDialog', '$timeout', '$http', '$sce', funct

// TRIGGER PRETTYPRINT AFTER DIGEST LOOP COMPLETE
$timeout(prettyPrint, 1);
} ]);

// TOGGLE TRANSLATIONS
vm.sourceVisible = localStorage.getItem('source-visible') === 'true';
vm.toggleSource = function ($event) {
$event.preventDefault();
vm.sourceVisible = !vm.sourceVisible;
var nodes = document.querySelectorAll('.original-english');
var $nodes = angular.element(nodes);
if (vm.sourceVisible) {
$nodes.removeClass('hidden');
} else {
$nodes.addClass('hidden');
}
localStorage.setItem('source-visible', vm.sourceVisible);
}
} ]);

0 comments on commit 92fcb7e

Please sign in to comment.