Compare commits
5 Commits
a2e7559f5d
...
a035ea3201
Author | SHA1 | Date | |
---|---|---|---|
a035ea3201 | |||
57ea079eaf | |||
9c513f8319 | |||
af8a9e6763 | |||
a4f1a04c72 |
3
.gitmodules
vendored
Normal file
3
.gitmodules
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
[submodule "heonian-ime"]
|
||||
path = heonian-ime
|
||||
url = https://git.succubi.services/heonian.org/heonian-ime
|
1
heonian-ime
Submodule
1
heonian-ime
Submodule
@ -0,0 +1 @@
|
||||
Subproject commit 76bc6baf11f2b21f365e6f2ef36c05b00ea04c84
|
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>heonian web dictionary</title>
|
||||
@ -37,6 +37,7 @@
|
||||
|
||||
</main>
|
||||
|
||||
<script src="./heonian-ime/ime.js"></script>
|
||||
<script src="./main.js"></script>
|
||||
</body>
|
||||
</html>
|
42
main.css
42
main.css
@ -32,19 +32,33 @@
|
||||
:root {
|
||||
--font: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
--font-h: "heonian", "Helvatica Neue", Helvetica, Arial, sans-serif;
|
||||
--nice-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
--fg: rgb(0,0,0);
|
||||
--bg: rgb(255,255,255);
|
||||
--grey: rgb(152, 152, 152);
|
||||
--darkgrey: rgb(100, 100, 100);
|
||||
--link: rgb(27 120 151);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--fg: rgb(255,255,255);
|
||||
--bg: rgb(0,0,0);
|
||||
--grey: rgb(226, 226, 226);
|
||||
--darkgrey: rgb(150, 150, 150);
|
||||
--darkgrey: rgb(215, 215, 215);
|
||||
--link: rgb(27 120 151);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: var(--font);
|
||||
color: var(--fg);
|
||||
background-color: var(--bg);
|
||||
}
|
||||
|
||||
a {
|
||||
color: rgb(119, 205, 233);
|
||||
color: var(--link);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@ -87,6 +101,9 @@ header #search button {
|
||||
text-align: center;
|
||||
height: 2rem;
|
||||
border-left: 1px solid var(--grey);
|
||||
color: var(--grey);
|
||||
transition: 0.3s color ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
header input {
|
||||
@ -100,6 +117,8 @@ header input {
|
||||
font-weight: 100;
|
||||
transition: border-color 0.3s;
|
||||
width: calc(100% - 52px - 24px);
|
||||
background-color: var(--bg);
|
||||
color: var(--fg);
|
||||
}
|
||||
|
||||
header input:focus {
|
||||
@ -145,7 +164,9 @@ main {
|
||||
opacity: 0;
|
||||
max-width: 600px;
|
||||
margin: auto;
|
||||
margin-top: 1rem;
|
||||
margin-top: calc(1rem + 24px);
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.main-animation {
|
||||
@ -166,6 +187,10 @@ main {
|
||||
border-bottom: 1px solid var(--darkgrey);
|
||||
}
|
||||
|
||||
.result:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.result-meaning {
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
@ -192,13 +217,22 @@ main {
|
||||
content: ". ";
|
||||
}
|
||||
|
||||
.result-notes {
|
||||
font-size: 0.85rem;
|
||||
color: var(--darkgrey);
|
||||
margin-top: 6px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.result summary {
|
||||
margin-top: 4px;
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.result details p {
|
||||
margin-top: 4px;
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
/* todo. organize this file better. this is a fucking mess */
|
40
main.js
40
main.js
@ -5,6 +5,19 @@ let searchDictionary = {};
|
||||
let header = null;
|
||||
let main = null;
|
||||
|
||||
let ime = null;
|
||||
|
||||
function toggleIME() {
|
||||
if (ime == null) {
|
||||
ime = new HeonianIME(header.querySelector("input"));
|
||||
header.querySelector("#search button").style.color = "var(--fg)";
|
||||
} else {
|
||||
ime.imeDetach();
|
||||
ime = null;
|
||||
header.querySelector("#search button").style.color = "var(--grey)";
|
||||
}
|
||||
}
|
||||
|
||||
function animateHeader(inout = false) {
|
||||
//todo: debounce this
|
||||
if (inout) {
|
||||
@ -47,10 +60,14 @@ document.addEventListener("keydown", (e) => {
|
||||
if (!header.querySelector("input").matches(":focus") && !header.classList.contains("fullscreen")) {
|
||||
e.preventDefault();
|
||||
animateHeader(true);
|
||||
} else if (header.querySelector("input").matches(":focus") && ime != null) {
|
||||
toggleIME();
|
||||
} else if (header.querySelector("input").matches(":focus")) {
|
||||
header.querySelector("input").value = "";
|
||||
}
|
||||
}
|
||||
if (e.keyCode === 13) {
|
||||
if (header.querySelector("input").matches(":focus")) {
|
||||
if (header.querySelector("input").matches(":focus") && ime == null) {
|
||||
//search
|
||||
e.preventDefault();
|
||||
if (header.classList.contains("fullscreen")) {
|
||||
@ -62,7 +79,7 @@ document.addEventListener("keydown", (e) => {
|
||||
});
|
||||
|
||||
function stripWord(word) {
|
||||
return word.replace(/[^a-zA-Z-]/gu, "");
|
||||
return word.replace(/[^a-zA-Z-]/gu, "").toLowerCase();
|
||||
}
|
||||
|
||||
heonianVowels = {
|
||||
@ -231,14 +248,26 @@ function doSearch() {
|
||||
meaning.innerHTML += "<br><details><summary>Translation</summary><p>"+json[results[i]][o]["translation"]+"</p></details>";
|
||||
}
|
||||
//example
|
||||
if (json[results[i]][o]["example"] != undefined) {
|
||||
//todo
|
||||
if (json[results[i]][o]["examples"] != undefined) {
|
||||
let temp = ""
|
||||
temp += "<details><summary>Examples</summary><p>";
|
||||
for (let e in json[results[i]][o]["examples"]) {
|
||||
temp += "<span class='heonian'>"+e+"</span> - "+json[results[i]][o]["examples"][e];
|
||||
}
|
||||
temp += "</p></details>";
|
||||
meaning.innerHTML += temp;
|
||||
}
|
||||
//notes
|
||||
if (json[results[i]][o]["notes"] != undefined) {
|
||||
meaning.innerHTML += "<br><p class='result-notes'>"+json[results[i]][o]["notes"]+"</p>";
|
||||
meaning.innerHTML += "<p class='result-notes'>"+json[results[i]][o]["notes"]+"</p>";
|
||||
}
|
||||
//(source, etc)
|
||||
if (json[results[i]][o]["canon-etymology"] != undefined) {
|
||||
meaning.innerHTML += "<details><summary>Canon Etymology</summary><p>"+json[results[i]][o]["canon-etymology"]+"</p></details>";
|
||||
}
|
||||
if (json[results[i]][o]["meta-etymology"] != undefined) {
|
||||
meaning.innerHTML += "<details><summary>Meta Etymology</summary><p>"+json[results[i]][o]["meta-etymology"]+"</p></details>";
|
||||
}
|
||||
//todo
|
||||
result.appendChild(meaning); //y, yeah.
|
||||
}
|
||||
@ -250,5 +279,6 @@ function doSearch() {
|
||||
window.onload = () => {
|
||||
header = document.querySelector("header");
|
||||
main = document.querySelector("main");
|
||||
header.querySelector("#search button").onclick = () => {toggleIME();};
|
||||
loadDictionary();
|
||||
}
|
@ -227,7 +227,7 @@
|
||||
{
|
||||
"type": "modifier",
|
||||
"meaning": "Existing in plentiful supply.",
|
||||
"translation": "Abundant",
|
||||
"translation": "Abundant"
|
||||
},
|
||||
{
|
||||
"type": "pronoun",
|
||||
@ -262,12 +262,12 @@
|
||||
{
|
||||
"type": "verb",
|
||||
"meaning": "To deprive of life.",
|
||||
"translation": "To kill",
|
||||
"translation": "To kill"
|
||||
},
|
||||
{
|
||||
"type": "verb",
|
||||
"meaning": "To destroy a vitally essential quality in.",
|
||||
"translation": "To kill",
|
||||
"translation": "To kill"
|
||||
}
|
||||
],
|
||||
"" : [
|
||||
@ -295,7 +295,7 @@
|
||||
{
|
||||
"type": "modifier",
|
||||
"meaning": "Being such that every part of the surface or the circumference is equidistant from the center.",
|
||||
"translation": "Round",
|
||||
"translation": "Round"
|
||||
}
|
||||
],
|
||||
"" : [
|
||||
|
Loading…
Reference in New Issue
Block a user