summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorAlex Yatskov <alex@foosoft.net>2016-04-24 20:50:27 -0700
committerAlex Yatskov <alex@foosoft.net>2016-04-24 20:50:27 -0700
commitf466fe721885877d473e66d22caef060919524ea (patch)
tree08f27ea2a89794da5ab376401e1ce743f12d6d20
parent62c2120286ddc39110b8ab01c4248ab5a8604b66 (diff)
Styling work
-rw-r--r--ext/bg/js/templates.js43
-rw-r--r--ext/fg/css/frame.css10
-rw-r--r--ext/fg/js/client.js4
-rw-r--r--util/tmpl/kanji.html50
4 files changed, 54 insertions, 53 deletions
diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js
index 08708535..092d4e64 100644
--- a/ext/bg/js/templates.js
+++ b/ext/bg/js/templates.js
@@ -19,38 +19,37 @@ templates['header.html'] = template({"compiler":[7,">= 4.0.0"],"main":function(c
templates['kanji.html'] = template({"1":function(container,depth0,helpers,partials,data) {
var stack1;
- return " <dt>Kunyomi:</dt>\n"
- + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.kunyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "");
+ return " <dl class=\"kanji-info\">\n <dt>Meanings</dt>\n"
+ + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + " </dl>\n";
},"2":function(container,depth0,helpers,partials,data) {
- var stack1;
-
- return " <dd>"
+ return " <dd>"
+ container.escapeExpression(container.lambda(depth0, depth0))
- + ((stack1 = helpers.unless.call(depth0 != null ? depth0 : {},(data && data.last),{"name":"unless","hash":{},"fn":container.program(3, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ "</dd>\n";
-},"3":function(container,depth0,helpers,partials,data) {
- return ", ";
-},"5":function(container,depth0,helpers,partials,data) {
+},"4":function(container,depth0,helpers,partials,data) {
var stack1;
- return " <dt>Onyomi:</dt>\n"
- + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.onyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "");
-},"7":function(container,depth0,helpers,partials,data) {
- return " <li><span>"
- + container.escapeExpression(container.lambda(depth0, depth0))
- + "</span></li>\n";
+ return " <dl class=\"kanji-info\">\n <dt>Kun</dt>\n"
+ + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.kunyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + " </dl>\n";
+},"6":function(container,depth0,helpers,partials,data) {
+ var stack1;
+
+ return " <dl class=\"kanji-info\">\n <dt>On</dt>\n"
+ + ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.onyomi : depth0),{"name":"each","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + " </dl>\n";
},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
var stack1, helper, alias1=depth0 != null ? depth0 : {};
- return "<div class=\"definition\">\n <div class=\"kanji\">"
+ return "<div class=\"definition\">\n <div class=\"kanji-info kanji-glyph\">"
+ container.escapeExpression(((helper = (helper = helpers.character || (depth0 != null ? depth0.character : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(alias1,{"name":"character","hash":{},"data":data}) : helper)))
- + "</div>\n\n <div class=\"readings\">\n <dl>\n"
- + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.kunyomi : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + "</div>\n\n"
+ + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.glossary : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ "\n"
- + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.onyomi : depth0),{"name":"if","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
- + " </dl>\n </div>\n\n <div class=\"glossary\">\n <ol>\n"
- + ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(7, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
- + " </ol>\n </div>\n</div>\n";
+ + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.kunyomi : depth0),{"name":"if","hash":{},"fn":container.program(4, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + "\n"
+ + ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.onyomi : depth0),{"name":"if","hash":{},"fn":container.program(6, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
+ + "</div>\n</div>\n";
},"useData":true});
templates['kanji-link.html'] = template({"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
var helper;
diff --git a/ext/fg/css/frame.css b/ext/fg/css/frame.css
index ace8aae1..832e189a 100644
--- a/ext/fg/css/frame.css
+++ b/ext/fg/css/frame.css
@@ -43,18 +43,16 @@ body {
display: inline-block;
}
-.kanji {
- background-color: #eee;
- display: inline-block;
+.kanji-glyph {
font-family: "KanjiStrokeOrders";
font-size: 140px;
line-height: 140px;
vertical-align: top;
}
-.readings {
- display: inline-block;
- vertical-align: top;
+.kanji-info {
+ float: left;
+ display: inline-block;
}
.tag {
diff --git a/ext/fg/js/client.js b/ext/fg/js/client.js
index 2355cf81..fdb46acb 100644
--- a/ext/fg/js/client.js
+++ b/ext/fg/js/client.js
@@ -82,7 +82,9 @@ class Client {
displayKanji: this.displayKanji
};
- handlers[action].call(this, data);
+ if (handlers.hasOwnProperty(action)) {
+ handlers[action].call(this, data);
+ }
}
searchAt(point) {
diff --git a/util/tmpl/kanji.html b/util/tmpl/kanji.html
index d9e7ffcf..603872ae 100644
--- a/util/tmpl/kanji.html
+++ b/util/tmpl/kanji.html
@@ -1,29 +1,31 @@
<div class="definition">
- <div class="kanji">{{character}}</div>
+ <div class="kanji-info kanji-glyph">{{character}}</div>
- <div class="readings">
- <dl>
- {{#if kunyomi}}
- <dt>Kunyomi:</dt>
- {{#each kunyomi}}
- <dd>{{.}}{{#unless @last}}, {{/unless}}</dd>
- {{/each}}
- {{/if}}
+ {{#if glossary}}
+ <dl class="kanji-info">
+ <dt>Meanings</dt>
+ {{#each glossary}}
+ <dd>{{.}}</dd>
+ {{/each}}
+ </dl>
+ {{/if}}
- {{#if onyomi}}
- <dt>Onyomi:</dt>
- {{#each onyomi}}
- <dd>{{.}}{{#unless @last}}, {{/unless}}</dd>
- {{/each}}
- {{/if}}
- </dl>
- </div>
+ {{#if kunyomi}}
+ <dl class="kanji-info">
+ <dt>Kun</dt>
+ {{#each kunyomi}}
+ <dd>{{.}}</dd>
+ {{/each}}
+ </dl>
+ {{/if}}
- <div class="glossary">
- <ol>
- {{#each glossary}}
- <li><span>{{.}}</span></li>
- {{/each}}
- </ol>
- </div>
+ {{#if onyomi}}
+ <dl class="kanji-info">
+ <dt>On</dt>
+ {{#each onyomi}}
+ <dd>{{.}}</dd>
+ {{/each}}
+ </dl>
+ {{/if}}
+</div>
</div>