This commit is contained in:
Михаил Капелько
2025-04-02 08:14:37 +03:00
parent 8c7fb2c3e0
commit 31c41047eb

View File

@@ -10,6 +10,14 @@
margin-left: 8px;
margin-bottom: 50px;
}
/* Blur transcript by default */
.transcript {
filter: blur(2px);
}
/* Show transcript when holding the mouse over */
.transcript:active {
filter: blur(0px);
}
body {
font-family: sans-serif;
}
@@ -18,15 +26,18 @@
<body>
</body>
<p><a href="https://www.matrixfans.net/movies/the-matrix/transcript/">Matrix 1 full transcript</a></p>
<!-- Templates -->
<script>
var itemTemplate = `
<div class = "item">
<h3 id="en-%ID%"></h3>
<!--<h1><span id="who-%ID%"></span>: <a id="zh-%ID%" href="https://translate.google.com/?tl=en&text=%ZH%" target="_blank"><a></h1>-->
<h1><span id="who-%ID%"></span>: <a id="zh-%ID%" href="https://www.archchinese.com/chinese_english_dictionary.html?find=%ZH%" target="_blank"><a></h1>
<img id="img-%ID%" />
<p id="zh-%ID%"></p>
<p id="tr-%ID%"></p>
<p><audio id="audio-%ID%" controls autoplay></audio></p>
<p id="en-%ID%"></p>
<p id="tr-%ID%" class="transcript"></p>
<p><audio id="audio-%ID%" style="display: none" controls autoplay></audio></p>
</div>
`
</script>
@@ -35,22 +46,26 @@
<script>
var texts = {
1: {
en: "Cypher: Yeah",
who: "Cypher",
en: "Yeah",
zh: "是我",
tr: "shi wo",
},
2: {
en: "Trinity: Is everything in place?",
who: "Trinity",
en: "Is everything in place?",
zh: "都准备好了吗",
tr: "dou zhunbei hao le ma",
},
3: {
en: "Cypher: You weren't supposed to relieve me",
who: "Cypher",
en: "You weren't supposed to relieve me",
zh: "不该是你接我的班",
tr: "bugai shi ni jie wodeban",
},
4: {
en: "Trinity: I know, but I felt like taking your shift",
who: "Trinity",
en: "I know, but I felt like taking your shift",
zh: "可是我想要接你的班",
tr: "keshi wo xiangyao jie nideban",
},
@@ -164,8 +179,26 @@
<!-- Configure the page -->
<script>
// Create items in HTML.
for (var i = 1; i <= 16; ++i) {
document.body.innerHTML += itemTemplate.replaceAll("%ID%", i);
for (var i in texts) {
document.body.innerHTML += itemTemplate
.replaceAll("%ID%", i)
.replaceAll("%ZH%", texts[i]["zh"]);
}
// Assign texts.
for (var i in texts) {
var whoId = "who-" + i;
var enId = "en-" + i;
var zhId = "zh-" + i;
var trId = "tr-" + i;
var who = document.getElementById(whoId);
var en = document.getElementById(enId);
var zh = document.getElementById(zhId);
var tr = document.getElementById(trId);
who.textContent = i + '. ' + texts[i]["who"];
zh.textContent = texts[i]["zh"];
en.textContent = texts[i]["en"];
tr.textContent = texts[i]["tr"];
}
// Assign audios.
@@ -173,6 +206,8 @@
var id = "audio-" + i;
var elem = document.getElementById(id);
elem.src = "data:audio/aac;base64," + b64Audios[i];
// Make item visible to work around default state of being hidden.
elem.style.display = "block";
}
// Assign images.
@@ -181,18 +216,5 @@
var elem = document.getElementById(id);
elem.src = "data:image/jpeg;base64," + b64Images[i];
}
// Assign texts.
for (var i in texts) {
var enId = "en-" + i;
var zhId = "zh-" + i;
var trId = "tr-" + i;
var en = document.getElementById(enId);
var zh = document.getElementById(zhId);
var tr = document.getElementById(trId);
en.textContent = i + '. ' + texts[i]["en"];
zh.textContent = texts[i]["zh"];
tr.textContent = texts[i]["tr"];
}
</script>
</html>