Commit db6f1867 authored by Thomas Dennis's avatar Thomas Dennis

Re-organise JS files a bit + improve the kanji page.

parent 9fbe7c02
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="default.css">
<script src="js/util.js"></script>
<script src="js/util/string_methods.js"></script>
<title>naniJSore</title>
</head>
<body>
......@@ -16,6 +16,12 @@
<a href="conjugate.html">Conjugations</a>
<span class="custom-expand"></span>
</div>
<noscript>
<b>Warning:</b> These pages rely heavily on Javascript, so you'll need to
<a href="http://enable-javascript.com" target="_blank">enable scripts</a>
and<form class="force-inline"><button type="submit" class="pseudo-link">
reload the page </button></form>to make things work correctly.
</noscript>
<div class="body-content">
<!--yield-->
</div>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="default.css">
<script src="js/util.js"></script>
<script src="js/util/string_methods.js"></script>
<title>naniJSore</title>
</head>
<body>
......@@ -16,6 +16,12 @@
<a href="conjugate.html">Conjugations</a>
<span class="custom-expand"></span>
</div>
<noscript>
<b>Warning:</b> These pages rely heavily on Javascript, so you'll need to
<a href="http://enable-javascript.com" target="_blank">enable scripts</a>
and<form class="force-inline"><button type="submit" class="pseudo-link">
reload the page </button></form>to make things work correctly.
</noscript>
<div class="body-content">
<!--content-->
<h1>Verbs &amp; Adjectives</h1>
......@@ -37,18 +43,16 @@
<li>Learn about <b>adjectives</b> on <a href="http://japanese.about.com/library/weekly/aa040101b.htm" target="_blank">about.com</a></li>
<li>You can also look up words on <a href="http://www.csse.monash.edu.au/~jwb/cgi-bin/wwwjdic.cgi" target="_blank">WWWJDIC</a></li>
</ul>
<div id="quizarea">
<noscript>Javascript is disabled.</noscript>
</div>
<div id="quizarea"></div>
<div>
<a class="jslink jslink-primary" href="#top" onclick="check()">Check Results</a>
<a class="jslink" href="#top" onclick="reset()">Restart</a>
<a class="btn btn-primary" href="#top" onclick="check()">Check Results</a>
<a class="btn" href="#top" onclick="reset()">Restart</a>
<span id="score"></span>
</div>
<script src="js/verb_u.js"></script>
<script src="js/verb_eru.js"></script>
<script src="js/adjective_i.js"></script>
<script src="js/adjective_na.js"></script>
<script src="js/util/verb_u.js"></script>
<script src="js/util/verb_eru.js"></script>
<script src="js/util/adjective_i.js"></script>
<script src="js/util/adjective_na.js"></script>
<script src="js/conjugate.js"></script>
<!--content-->
</div>
......
......@@ -11,6 +11,20 @@ not possible to use this.
* { box-sizing: border-box; }
noscript {
display: block;
padding: 8px;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
border: 1px solid #B00;
border-top: none;
text-align: center;
background: #D00;
color: #FFF;
}
noscript a, noscript .pseudo-link { color: #FF0; }
h1 {
margin: 0;
text-align: center;
......@@ -45,12 +59,21 @@ input {
color: #000;
}
a {
a, .pseudo-link {
text-decoration: none;
color: #24B;
/* Fake links will often include various things that `a` elements don't... */
cursor: pointer;
font-size: inherit;
margin: 0px;
padding: 0px;
display: inline;
border: none;
background: none;
}
a:hover { text-decoration: underline; }
a:hover, .pseudo-link:hover { text-decoration: underline; }
code em {
text-decoration: underline;
......@@ -117,10 +140,14 @@ body {
/* Misc. */
.force-inline { display: inline; }
.half-width { width: 50%; }
.two-thirds { width: 67%; }
.full-width { width: 100%; }
.centred-box {
text-align: center;
margin-left: auto;
......@@ -129,7 +156,7 @@ body {
/* These classes are used to create button-like links, similar to Bootstrap. */
.jslink {
.btn {
cursor: pointer;
display: inline-block;
......@@ -146,26 +173,34 @@ body {
overflow: hidden;
}
.jslink:hover, .jslink:focus {
.btn:hover, .btn:focus {
text-decoration: none;
background: #EEE;
}
.jslink-huge {
.btn-huge {
font-size: 32pt;
font-weight: bold;
margin: 8px;
width: 100%;
}
.jslink-primary {
.btn-primary {
border-color: #148;
color: #FFF;
background: #37B;
font-weight: bold;
}
.jslink-primary:hover, .jslink-primary:focus { background: #48C; }
.btn-primary:hover, .btn-primary:focus { background: #48C; }
.btn-success {
border-color: #184;
color: #FFF;
background: #3B7;
}
.btn-success:hover, .btn-success:focus { background: #4C8; }
/* These classes are used for the kana grids on the kana page. */
......@@ -267,6 +302,15 @@ td.kana-blank { background: #888; }
.hidden-answer { display: none; }
/* Used on the Help page. */
.revealed-answer {
padding: 8px;
border-radius: 8px;
border: 1px solid #184;
background: #FFF;
color: #000;
}
#convert_output { width:100%; }
.split:before {
color: #BBB;
content: " || ";
}
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="default.css">
<script src="js/util.js"></script>
<script src="js/util/string_methods.js"></script>
<title>naniJSore</title>
</head>
<body>
......@@ -16,6 +16,12 @@
<a href="conjugate.html">Conjugations</a>
<span class="custom-expand"></span>
</div>
<noscript>
<b>Warning:</b> These pages rely heavily on Javascript, so you'll need to
<a href="http://enable-javascript.com" target="_blank">enable scripts</a>
and<form class="force-inline"><button type="submit" class="pseudo-link">
reload the page </button></form>to make things work correctly.
</noscript>
<div class="body-content">
<!--content-->
<h1>Help</h1>
......@@ -47,12 +53,12 @@
</p>
<!-- TODO: This needs to look nicer (and shouldn't use a table). -->
<table>
<tr><td><input id='convert_input'></td><td id='convert_output'></td></tr>
<tr><td><input id='convert_input'></td><td id='convert_output' class="full-width"></td></tr>
<tr><td colspan="2" class="centred-box">
<span class="jslink" id="convert_toKataKana">Hiragana to Katakana</span>
<span class="jslink" id="convert_toHiragana">Katakana to Hiragana</span>
<span class="jslink" id="convert_toRomaji">Kana to Romaji</span>
<span class="jslink" id="convert_toKana">Romaji to Kana</span>
<span class="btn" id="convert_toKataKana">Hiragana to Katakana</span>
<span class="btn" id="convert_toHiragana">Katakana to Hiragana</span>
<span class="btn" id="convert_toRomaji">Kana to Romaji</span>
<span class="btn" id="convert_toKana">Romaji to Kana</span>
</td></tr>
</table>
<script src="js/help.js"></script>
......
......@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="default.css">
<script src="js/util.js"></script>
<script src="js/util/string_methods.js"></script>
<title>naniJSore</title>
</head>
<body>
......@@ -16,6 +16,12 @@
<a href="conjugate.html">Conjugations</a>
<span class="custom-expand"></span>
</div>
<noscript>
<b>Warning:</b> These pages rely heavily on Javascript, so you'll need to
<a href="http://enable-javascript.com" target="_blank">enable scripts</a>
and<form class="force-inline"><button type="submit" class="pseudo-link">
reload the page </button></form>to make things work correctly.
</noscript>
<div class="body-content">
<!--content-->
<div class="logo-text">nani<span>JS</span>ore</div>
......@@ -25,11 +31,11 @@
the language in a way that aims to be more fun than simply reading a textbook.
</p>
<div class="half-width centred-box">
<a class="jslink jslink-huge jslink-primary" href="kana.html">Kana</a><br>
<a class="jslink jslink-huge jslink-primary" href="kanji.html">Kanji</a><br>
<a class="jslink jslink-huge jslink-primary" href="nouns.html">Nouns</a><br>
<a class="jslink jslink-huge jslink-primary" href="particles.html">Particles</a>
<a class="jslink jslink-huge jslink-primary" href="conjugate.html">Conjugations</a><br>
<a class="btn btn-huge btn-primary" href="kana.html">Kana</a><br>
<a class="btn btn-huge btn-primary" href="kanji.html">Kanji</a><br>
<a class="btn btn-huge btn-primary" href="nouns.html">Nouns</a><br>
<a class="btn btn-huge btn-primary" href="particles.html">Particles</a>
<a class="btn btn-huge btn-primary" href="conjugate.html">Conjugations</a><br>
</div>
<!--content-->
</div>
......
......@@ -18,8 +18,8 @@ function kana_change(katakana)
var btns = document.querySelectorAll(".js-hiragana-btn, .js-katakana-btn");
for (var b = 0; b < btns.length; ++b)
{
var c = btns[b].getAttribute("class").replace("jslink-primary", "").trim();
if (katakana != (c.indexOf("js-katakana-btn") < 0)) c += " jslink-primary";
var c = btns[b].getAttribute("class").replace("btn-primary", "").trim();
if (katakana != (c.indexOf("js-katakana-btn") < 0)) c += " btn-primary";
btns[b].setAttribute("class", c);
}
......
This diff is collapsed.
......@@ -5,6 +5,8 @@
"use strict";
var LANGUAGE = {};
// This defines the question set:
var CATEGORIES = {
"animal": ["bird", "cat", "cow", "dog", "horse", "mouse", "pig", "rabbit", "tiger"],
......@@ -90,7 +92,7 @@ function setup()
body.appendChild(document.createTextNode(" "));
var a = body.appendChild(document.createElement("a"));
a.href = "#top";
a.className = "jslink";
a.className = "btn";
a.setAttribute("onclick", "check('" + lang + "')");
a.appendChild(flag(lang))
......
General Javascript
==================
The files in this directory store the "main" JS code for the corresponding HTML
page in the top-level directory. They handle the actual DOM manipulation, etc.
/**
@file
@brief Kanji dictionary data. Currently incomplete.
This was originally based on various dictionaries, but now uses the jouyou list
for simplicity; Non-jouyou readings are no longer included.
@todo Possibly include non-jouyou kanji?
@todo Possibly include nanori readings here too?
*/
"use strict";
/**
@brief A list of kanji, including on/kun readings and Englishs.
This is organised by Jouyou grade, with index zero being used for "S" grade.
Kana which aren't actually "part of" a kanji are separated with a ・ character.
@todo Possibly allow translations in languages other than English?
*/
var KANJI_DICTIONARY =
//===========
[/*GRADE-S*/{
//===========
//ANIMALS
"":{
"on":["ビョウ"],
"kun":["ねこ"],
"English":["cat"]
}
//============
},/*GRADE-1*/{
//============
//ANIMALS
"":{
"on":["ケン"],
"kun":["いぬ"],
"English":["dog"]
},
"":{
"kun":["かい"],
"English":["shellfish"]
},
"":{
"on":["チュウ"],
"kun":["むし"],
"English":["insect"]
},
//BODYPARTS
"":{
"on":["モク","ボク"],
"kun":["",""],
"English":["eye"]
},
"":{
"on":[""],
"kun":["みみ"],
"English":["ear"]
},
"":{
"on":["コウ",""],
"kun":["くち"],
"English":["mouth"]
},
"":{
"on":["シュ"],
"kun":["",""],
"English":["hand"]
},
"":{
"on":["ソク"],
"kun":["あし","た・す","た・る","た・りる"],
"English":["foot"]
},
//COLOURS
"":{
"on":["セキ","シャク"],
"kun":["あか・い","あか・らむ","あか・らめる"],
"English":["red"]
},
"":{
"on":["セイ","ショウ"],
"kun":["あお・い"],
"English":["blue"]
},
"":{
"on":["ハク","ビャク"],
"kun":["しろ・い","しら"],
"English":["white"]
},
//DIRECTIONS/POSITIONS
"":{
"on":[""],
"kun":["ひだり"],
"English":["left"]
},
"":{
"on":["ユウ",""],
"kun":["みぎ"],
"English":["right"]
},
"":{
"on":["ショウ","ジョウ"],
"kun":["うえ","うわ","かみ","のぼ","あ・げる","あ・がる","のぼ・す","のぼ・る","のぼ・せる"],
"English":["up","raise","above"]
},
"":{
"on":["",""],
"kun":["した","しも","もと","さ・げる","さ・がる","くだ・す","くだ・る","くだ・さる","お・ろす","お・りる"],
"English":["down","lower","below"]
},
"":{
"on":["チュウ","ジュウ"],
"kun":["なか"],
"English":["middle","in","center","centre"]
},
//NUMBERS
"":{
"on":["イチ","イツ"],
"kun":["ひと","ひと・つ"],
"English":["1","one"]
},
"":{
"on":[""],
"kun":["ふた","ふた・つ"],
"English":["2","two"]
},
"":{
"on":["サン"],
"kun":["","み・つ","みっ・つ"],
"English":["3","three"]
},
"":{
"on":[""],
"kun":["","よ・つ","よっ・つ","よん"],
"English":["4","four"]
},
"":{
"on":[""],
"kun":["いつ","いつ・つ"],
"English":["5","five"]
},
"":{
"on":["ロク"],
"kun":["","む・つ","むっ・つ","むい"],
"English":["6","six"]
},
"":{
"on":["シチ"],
"kun":["なな","なな・つ","なの"],
"English":["7","seven"]
},
"":{
"on":["ハチ"],
"kun":["","や・つ","やっ・つ","よう"],
"English":["8","eight"]
},
"":{
"on":["キュウ",""],
"kun":["ここの","ここの・つ"],
"English":["9","nine"]
},
"":{
"on":["ジュウ","ジッ"],
"kun":["とお",""],
"English":["10","ten"]
},
"":{
"on":["ヒャク"],
"English":["100","hundred"]
},
"":{
"on":["セン"],
"kun":[""],
"English":["1000","thousand"]
},
//MATERIALS/ELEMENTS
"":{
"on":["チク"],
"kun":["たけ"],
"English":["bamboo"]
},
"":{
"on":["",""],
"kun":["つち"],
"English":["soil"]
},
"":{
"on":[""],
"kun":["",""],
"English":["fire"]
},
"":{
"on":["スイ"],
"kun":["みず"],
"English":["water"]
},
"":{
"on":["モク","ボク"],
"kun":["",""],
"English":["tree","wood"]
},
"":{
"on":["キン","コン"],
"kun":["かね","かな"],
"English":["gold","money"]
},
"":{
"on":["セキ","シャク","コク"],
"kun":["いし"],
"English":["stone"]
},
//PEOPLE
"":{
"on":["ニン","ジン"],
"kun":["ひと"],
"English":["person"]
},
"":{
"on":["ダン","ナン"],
"kun":["おとこ"],
"English":["man","male"]
},
"":{
"on":["ジョ","ニョ","ニョウ"],
"kun":["おんな",""],
"English":["woman","female"]
},
"":{
"on":["",""],
"kun":[""],
"English":["child"]
},
"":{
"on":["オウ"],
"English":["king"]
},
//SIZE/SHAPE
"":{
"on":["ショウ"],
"kun":["ちい・さい","",""],
"English":["small"]
},
"":{
"on":["タイ","ダイ"],
"kun":["おお","おお・きい","おお・いに"],
"English":["big","large"]
},
"":{
"on":["エン"],
"kun":["まる・い"],
"English":["yen","round"]
},
//TIME
"":{
"on":["ジツ","ニチ"],
"kun":["",""],
"English":["day","sun"]
},
"":{
"on":["ガツ","ゲツ"],
"kun":["つき"],
"English":["month","moon"]
},
"":{
"on":["ネン"],
"kun":["とし"],
"English":["year"]
},
"":{
"on":["セキ"],
"kun":["ゆう"],
"English":["evening"]
},
//MISCELLANEOUS
"":{
"on":["キュウ"],
"kun":["やす・む","やす・まる","やす・める"],
"English":["rest"]
},
"":{
"on":["ギョク"],
"kun":["たま"],
"English":["ball"]
},
"":{
"on":["クウ"],
"kun":["そら","あ・く","あ・ける","から"],
"English":["sky","empty"]
},
"":{
"on":["ケン"],
"kun":["み・る","み・える","み・せる"],
"English":["see"]
},
"":{
"on":["コウ"],
"English":["school"]
},
"":{
"on":["サン"],
"kun":["やま"],
"English":["mountain"]
},
"":{
"on":[""],
"kun":["いと"],
"English":["thread"]
},
"":{
"on":[""],
"kun":["あざ"],
"English":["character","letter"]
},
"":{
"on":["シャ"],
"kun":["くるま"],
"English":["car","vehicle","wheel"]
},
"":{
"on":["シュツ","スイ"],
"kun":["だ・す","で・る"],
"English":["exit"]
},
"":{
"on":["シン"],
"kun":["もり"],
"English":["forest"]
},
"":{
"on":["セイ","ショウ"],
"kun":["ただ・す","ただ・しい","まさ"],
"English":["correct"]
},
"":{
"on":["セイ","ショウ"],
"kun":["い・きる","い・かす","い・ける","う・まれる","う・む","お・う","は・える","は・やす","","なま"],
"English":["life"]
},
"":{
"on":["セン"],
"kun":["さき"],
"English":["previous","ahead"]
},
"":{
"on":["ソウ","サッ"],
"kun":["はや・い","はや・まる","はや・める"],
"English":["early"]
},
"":{
"on":["ソウ"],
"kun":["くさ"],
"English":["grass"]
},
"":{
"on":["ソン"],
"kun":["むら"],
"English":["village"]
},
"":{
"on":["チョウ"],
"kun":["まち"],
"English":["town"]
},
"":{
"on":["テン"],
"kun":["あま","あめ"],
"English":["heaven"]
},
"":{
"on":["ニュウ"],
"kun":["い・る","い・れる","はい・る"],
"English":["enter"]
},
"":{
"on":["ブン","モン"],
"kun":["ふみ"],
"English":["writing"]
},
"":{
"on":["メイ","ミョウ"],
"kun":[""],
"English":["name"]
},
"":{
"on":["リツ","リュウ"],
"kun":["た・つ","た・てる"],