Skip to content

Instantly share code, notes, and snippets.

@siers
Last active June 3, 2025 08:59
Show Gist options
  • Save siers/dc5b5517888e9027316e9d7502635686 to your computer and use it in GitHub Desktop.
Save siers/dc5b5517888e9027316e9d7502635686 to your computer and use it in GitHub Desktop.
local dual wiktionary viewer
<!DOCTYPE html>
<meta charset="utf-8">
<script>
let counter = 0
function wordChange() {
counter += 1
let lastCounter = counter
setTimeout(() => { if (lastCounter == counter) applyWord() }, 300)
}
function setAnchor(anchor) {
location.href = "#" + anchor
}
function setWord(word) {
document.querySelector(".word").value = word
}
function applyWord() {
let en = document.querySelector(".en")
let de = document.querySelector(".de")
let wordEnc = encodeURI(document.querySelector(".word").value)
en.src = `https://en.wiktionary.org/wiki/${wordEnc}#German`
de.src = `https://de.wiktionary.org/wiki/${wordEnc}#${wordEnc}_(Deutsch)`
setAnchor(wordEnc)
}
let useAnchor = (event) => {
if (location.hash.length > 2) {
setWord(decodeURI(location.hash.substr(1)))
applyWord()
}
}
addEventListener("DOMContentLoaded", useAnchor)
addEventListener("hashchange", useAnchor)
</script>
<style>
.word { display: block; width: 300px; margin: 20px auto; }
.container { display: flex; height: calc(100vh - 60px); flex-direction: column; }
.en, .de { flex-grow: 1; border: 0; }
.en { background: #f5f5f5; }
.de { background: #f9f9f9; }
</style>
<body>
<input class="word" type="text" onkeyup="wordChange()">
<div class="container">
<iframe class="en"></iframe>
<iframe class="de"></iframe>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment