Compare commits

...

5 Commits

Author SHA1 Message Date
a035ea3201 merge + fix a bit 2022-06-10 01:18:38 +02:00
57ea079eaf add. ime for real 2022-06-09 02:29:42 +02:00
9c513f8319 add ime =w= 2022-06-09 02:29:36 +02:00
af8a9e6763 dark mode 2022-06-09 02:18:01 +02:00
a4f1a04c72 basic but better search results, 2022-06-09 02:03:14 +02:00
6 changed files with 84 additions and 15 deletions

3
.gitmodules vendored Normal file
View File

@ -0,0 +1,3 @@
[submodule "heonian-ime"]
path = heonian-ime
url = https://git.succubi.services/heonian.org/heonian-ime

1
heonian-ime Submodule

@ -0,0 +1 @@
Subproject commit 76bc6baf11f2b21f365e6f2ef36c05b00ea04c84

View File

@ -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>

View File

@ -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);
--grey: rgb(226, 226, 226);
--darkgrey: rgb(150, 150, 150);
--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(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
View File

@ -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();
}

View File

@ -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"
}
],
"" : [