translatable
This commit is contained in:
parent
bec3f354c7
commit
e378f2dcc8
|
@ -317,6 +317,23 @@ b, strong{
|
||||||
#sound[mute=yes] > #sound_off{
|
#sound[mute=yes] > #sound_off{
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
#translations{
|
||||||
|
position: absolute;
|
||||||
|
top: 14px;
|
||||||
|
left: calc(50% - 400px);
|
||||||
|
width: 800px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 16px;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
}
|
||||||
|
#translations a{
|
||||||
|
color: #ff4040;
|
||||||
|
}
|
||||||
|
#translations a:hover{
|
||||||
|
color: #ff6060;
|
||||||
|
}
|
||||||
#navigation{
|
#navigation{
|
||||||
|
|
||||||
display: none;
|
display: none;
|
||||||
|
|
15
index.html
15
index.html
|
@ -127,6 +127,7 @@ MY "WHY" FOR MAKING THIS:
|
||||||
<span id="nav_bubble"></span>
|
<span id="nav_bubble"></span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div id="translations"></div>
|
||||||
<div id="social"></div>
|
<div id="social"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -831,6 +832,17 @@ MY "WHY" FOR MAKING THIS:
|
||||||
<words id="sim_stop">
|
<words id="sim_stop">
|
||||||
reset & re-draw
|
reset & re-draw
|
||||||
</words>
|
</words>
|
||||||
|
<words id="translations_exist">
|
||||||
|
Fan-made translations:
|
||||||
|
</words>
|
||||||
|
<words id="translations_do_not_exist">
|
||||||
|
<!-- There's no need to translate this line since, you know, -->
|
||||||
|
<!-- it'll only show up if no translations exist -->
|
||||||
|
What the, no fan-made translations exist yet?!
|
||||||
|
</words>
|
||||||
|
<words id="translations_add">
|
||||||
|
(add your own!)
|
||||||
|
</words>
|
||||||
|
|
||||||
<!-- - - - - - - -->
|
<!-- - - - - - - -->
|
||||||
<!-- BONUS BOXES -->
|
<!-- BONUS BOXES -->
|
||||||
|
@ -1063,7 +1075,7 @@ MY "WHY" FOR MAKING THIS:
|
||||||
</b> by Vi Hart and Nicky Case (2014).
|
</b> by Vi Hart and Nicky Case (2014).
|
||||||
A story about how harmless choices can create a harmful world.
|
A story about how harmless choices can create a harmful world.
|
||||||
Based off a Nobel Prize-winning game theorist's work,
|
Based off a Nobel Prize-winning game theorist's work,
|
||||||
this interactive shows how discrimination and/or diversity can arise from the bottom up.
|
this interactive shows how discrimination and diversity can arise from the bottom up.
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -1542,6 +1554,7 @@ MY "WHY" FOR MAKING THIS:
|
||||||
<script src="js/slideshow/SandboxUI.js"></script>
|
<script src="js/slideshow/SandboxUI.js"></script>
|
||||||
<script src="js/slideshow/Modal.js"></script>
|
<script src="js/slideshow/Modal.js"></script>
|
||||||
<script src="js/slideshow/Preloader.js"></script>
|
<script src="js/slideshow/Preloader.js"></script>
|
||||||
|
<script src="js/slideshow/Translations.js"></script>
|
||||||
|
|
||||||
<script src="js/sim/Peep.js"></script>
|
<script src="js/sim/Peep.js"></script>
|
||||||
<script src="js/sim/Connection.js"></script>
|
<script src="js/sim/Connection.js"></script>
|
||||||
|
|
|
@ -40,7 +40,8 @@ subscribe("START", function(){
|
||||||
SOUNDS.bg_music.loop(true);
|
SOUNDS.bg_music.loop(true);
|
||||||
SOUNDS.bg_music.play();
|
SOUNDS.bg_music.play();
|
||||||
|
|
||||||
// Show Navigation
|
// Hide translations, show navigation
|
||||||
|
$("#translations").style.display = "none";
|
||||||
$("#navigation").style.display = "block";
|
$("#navigation").style.display = "block";
|
||||||
|
|
||||||
// Show Skip Button
|
// Show Skip Button
|
||||||
|
|
|
@ -20,12 +20,14 @@ subscribe("key/down/escape", function(){
|
||||||
});
|
});
|
||||||
|
|
||||||
window.Modal = {
|
window.Modal = {
|
||||||
|
currentlyShowing: "",
|
||||||
show: function(large){
|
show: function(large){
|
||||||
$("#modal_container").setAttribute("show","yes");
|
$("#modal_container").setAttribute("show","yes");
|
||||||
$("#modal").setAttribute("size", large ? "large" : "small");
|
$("#modal").setAttribute("size", large ? "large" : "small");
|
||||||
$("#modal_content_container").scrollTop = 0; // scroll to top
|
$("#modal_content_container").scrollTop = 0; // scroll to top
|
||||||
},
|
},
|
||||||
hide: function(){
|
hide: function(){
|
||||||
|
Modal.currentlyShowing = "";
|
||||||
publish("sound/button");
|
publish("sound/button");
|
||||||
$("#modal_container").removeAttribute("show");
|
$("#modal_container").removeAttribute("show");
|
||||||
},
|
},
|
||||||
|
@ -49,8 +51,45 @@ $("#modal_close").onclick = Modal.hide;
|
||||||
|
|
||||||
// Show big collected modals
|
// Show big collected modals
|
||||||
subscribe("modal/bonus", function(){
|
subscribe("modal/bonus", function(){
|
||||||
Modal.showAll("bonus");
|
if(Modal.currentlyShowing == "bonus"){
|
||||||
|
Modal.hide();
|
||||||
|
}else{
|
||||||
|
Modal.currentlyShowing = "bonus";
|
||||||
|
Modal.showAll("bonus");
|
||||||
|
}
|
||||||
});
|
});
|
||||||
subscribe("modal/references", function(){
|
subscribe("modal/references", function(){
|
||||||
Modal.showAll("reference");
|
if(Modal.currentlyShowing == "reference"){
|
||||||
});
|
Modal.hide();
|
||||||
|
}else{
|
||||||
|
Modal.currentlyShowing = "reference";
|
||||||
|
Modal.showAll("reference");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Translations
|
||||||
|
subscribe("modal/translations", function(){
|
||||||
|
|
||||||
|
if(Modal.currentlyShowing == "translations"){
|
||||||
|
Modal.hide();
|
||||||
|
}else{
|
||||||
|
Modal.currentlyShowing = "translations";
|
||||||
|
|
||||||
|
// Translation HTML
|
||||||
|
var html = "";
|
||||||
|
if(window.TRANSLATIONS.length>0){
|
||||||
|
html += getWords("translations_exist");
|
||||||
|
}else{
|
||||||
|
html += getWords("translations_do_not_exist");
|
||||||
|
}
|
||||||
|
html += " <a target='_blank' href='"+window.ADD_YOUR_OWN_LINK+"'>"+getWords("translations_add")+"</a>";
|
||||||
|
html += "<br>";
|
||||||
|
html += _createLinks(" · ");
|
||||||
|
$("#modal_content").innerHTML = html;
|
||||||
|
|
||||||
|
// Show in large box
|
||||||
|
Modal.show(false);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
|
@ -21,9 +21,11 @@ subscribe("prepreload", function(){
|
||||||
var pre_preloader = $("#pre_preloader");
|
var pre_preloader = $("#pre_preloader");
|
||||||
pre_preloader.parentNode.removeChild(pre_preloader);
|
pre_preloader.parentNode.removeChild(pre_preloader);
|
||||||
|
|
||||||
//slideshow.gotoChapter("Preloader");
|
slideshow.gotoChapter("Preloader");
|
||||||
|
/*
|
||||||
slideshow.gotoChapter("Credits");
|
slideshow.gotoChapter("Credits");
|
||||||
$("#navigation").style.display = "block";
|
$("#navigation").style.display = "block";
|
||||||
|
*/
|
||||||
|
|
||||||
publish("preload");
|
publish("preload");
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,54 @@
|
||||||
|
window.TRANSLATIONS = [];
|
||||||
|
window.ADD_YOUR_OWN_LINK = "http://derp";
|
||||||
|
|
||||||
|
var r = new XMLHttpRequest();
|
||||||
|
r.open("GET", "translations.txt", true);
|
||||||
|
r.onreadystatechange = function () {
|
||||||
|
|
||||||
|
if(r.readyState != 4 || r.status != 200) return;
|
||||||
|
|
||||||
|
// Parse available translations
|
||||||
|
// Only lines of the form "nn: name"
|
||||||
|
var response = r.responseText;
|
||||||
|
var lines = response.split("\n");
|
||||||
|
var available = lines.filter(function(line){
|
||||||
|
return (/^\w\w\:?\s+(.+)/).test(line); // ww: wwwwww
|
||||||
|
});
|
||||||
|
for(var i=0; i<available.length; i++){
|
||||||
|
var a = available[i];
|
||||||
|
var code = a.match(/\w\w/)[0];
|
||||||
|
var lang = a.match(/^\w\w\:?\s+(.+)/)[1];
|
||||||
|
if(code=="en") continue; // English is just an example
|
||||||
|
TRANSLATIONS.push({
|
||||||
|
code: code,
|
||||||
|
lang: lang
|
||||||
|
});
|
||||||
|
}
|
||||||
|
TRANSLATIONS = TRANSLATIONS.sort(function(a,b){
|
||||||
|
return a.lang>b.lang;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Show translations (if any)
|
||||||
|
if(TRANSLATIONS.length>0){
|
||||||
|
var html = "";
|
||||||
|
html += getWords("translations_exist").toLowerCase();
|
||||||
|
html += " <a target='_blank' href='"+window.ADD_YOUR_OWN_LINK+"'>"+getWords("translations_add")+"</a>";
|
||||||
|
html += " | ";
|
||||||
|
html += _createLinks(" · ");
|
||||||
|
$("#translations").innerHTML = html;
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
r.send();
|
||||||
|
|
||||||
|
function _createLinks(separator){
|
||||||
|
var html = "";
|
||||||
|
for(var i=0; i<TRANSLATIONS.length; i++){
|
||||||
|
var t = TRANSLATIONS[i];
|
||||||
|
if(i>0) html+=separator;
|
||||||
|
html += "<a href='"+t.code+".html' style='text-decoration:none'>";
|
||||||
|
html += t.lang;
|
||||||
|
html += "</a>";
|
||||||
|
}
|
||||||
|
return html;
|
||||||
|
}
|
|
@ -1,7 +1,27 @@
|
||||||
|
// Once you've finished your translation,
|
||||||
|
// the website needs to "know" it exists!
|
||||||
|
// This text file is how the website "knows".
|
||||||
//
|
//
|
||||||
// herp derp
|
// First, look up the language you're translating to on this page:
|
||||||
// herp derp derp
|
// https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
|
||||||
//
|
//
|
||||||
//
|
// Then, at the bottom of this file, enter on a new line:
|
||||||
|
// [two-letter code]: [native name of language]
|
||||||
|
// For example:
|
||||||
|
// en: English
|
||||||
|
// de: Deutsch
|
||||||
|
// zh: 中文
|
||||||
|
// ar: العربية
|
||||||
|
//
|
||||||
|
// (Note: if you paste the native name of a right-to-left language here,
|
||||||
|
// it might show up as reversed here, but it'll show correctly on the website)
|
||||||
|
// Also, make sure the .html file of your translation
|
||||||
|
// uses the two-letter code, like "en.html", "de.html", "zh.html"
|
||||||
|
//
|
||||||
|
// Thank you again so much! :)
|
||||||
|
|
||||||
en: English
|
/////////////////////////////
|
||||||
|
// AVAILABLE TRANSLATIONS: //
|
||||||
|
/////////////////////////////
|
||||||
|
|
||||||
|
en: English
|
||||||
|
|
Loading…
Reference in New Issue