Switch to iframe
This commit is contained in:
parent
ba3e0c6532
commit
5f74c473ce
@ -3,7 +3,7 @@
|
|||||||
templates['defs.html'] = template({"1":function(container,depth0,helpers,partials,data) {
|
templates['defs.html'] = template({"1":function(container,depth0,helpers,partials,data) {
|
||||||
var stack1;
|
var stack1;
|
||||||
|
|
||||||
return "<div class=\"yomichan-def\">\n"
|
return " <div class=\"definition\">\n"
|
||||||
+ ((stack1 = container.invokePartial(partials["term.html"],depth0,{"name":"term.html","data":data,"indent":" ","helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "")
|
+ ((stack1 = container.invokePartial(partials["term.html"],depth0,{"name":"term.html","data":data,"indent":" ","helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "")
|
||||||
+ " "
|
+ " "
|
||||||
+ ((stack1 = helpers.unless.call(depth0 != null ? depth0 : {},(data && data.last),{"name":"unless","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
|
+ ((stack1 = helpers.unless.call(depth0 != null ? depth0 : {},(data && data.last),{"name":"unless","hash":{},"fn":container.program(2, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
|
||||||
@ -11,14 +11,18 @@ templates['defs.html'] = template({"1":function(container,depth0,helpers,partial
|
|||||||
},"2":function(container,depth0,helpers,partials,data) {
|
},"2":function(container,depth0,helpers,partials,data) {
|
||||||
return "<br>";
|
return "<br>";
|
||||||
},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
|
},"compiler":[7,">= 4.0.0"],"main":function(container,depth0,helpers,partials,data) {
|
||||||
var stack1;
|
var stack1, helper, alias1=depth0 != null ? depth0 : {};
|
||||||
|
|
||||||
return ((stack1 = helpers.each.call(depth0 != null ? depth0 : {},(depth0 != null ? depth0.defs : depth0),{"name":"each","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "");
|
return "<!DOCTYPE html>\n<html lang=\"en\">\n <head>\n <meta charset=\"UTF-8\">\n <title></title>\n <link rel=\"stylesheet\" href=\""
|
||||||
|
+ container.escapeExpression(((helper = (helper = helpers.root || (depth0 != null ? depth0.root : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(alias1,{"name":"root","hash":{},"data":data}) : helper)))
|
||||||
|
+ "/css/popup.css\">\n </head>\n <body>\n"
|
||||||
|
+ ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.defs : depth0),{"name":"each","hash":{},"fn":container.program(1, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
|
||||||
|
+ " </body>\n</html>\n";
|
||||||
},"usePartial":true,"useData":true});
|
},"usePartial":true,"useData":true});
|
||||||
templates['term.html'] = template({"1":function(container,depth0,helpers,partials,data) {
|
templates['term.html'] = template({"1":function(container,depth0,helpers,partials,data) {
|
||||||
var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression;
|
var helper, alias1=depth0 != null ? depth0 : {}, alias2=helpers.helperMissing, alias3="function", alias4=container.escapeExpression;
|
||||||
|
|
||||||
return "<div class=\"yomichan-def-expression\"><ruby>"
|
return "<div class=\"expression\"><ruby>"
|
||||||
+ alias4(((helper = (helper = helpers.expression || (depth0 != null ? depth0.expression : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"expression","hash":{},"data":data}) : helper)))
|
+ alias4(((helper = (helper = helpers.expression || (depth0 != null ? depth0.expression : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"expression","hash":{},"data":data}) : helper)))
|
||||||
+ "<rt>"
|
+ "<rt>"
|
||||||
+ alias4(((helper = (helper = helpers.reading || (depth0 != null ? depth0.reading : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"reading","hash":{},"data":data}) : helper)))
|
+ alias4(((helper = (helper = helpers.reading || (depth0 != null ? depth0.reading : depth0)) != null ? helper : alias2),(typeof helper === alias3 ? helper.call(alias1,{"name":"reading","hash":{},"data":data}) : helper)))
|
||||||
@ -26,10 +30,15 @@ templates['term.html'] = template({"1":function(container,depth0,helpers,partial
|
|||||||
},"3":function(container,depth0,helpers,partials,data) {
|
},"3":function(container,depth0,helpers,partials,data) {
|
||||||
var helper;
|
var helper;
|
||||||
|
|
||||||
return "<div class=\"yomichan-def-expression\">"
|
return "<div class=\"expression\">"
|
||||||
+ container.escapeExpression(((helper = (helper = helpers.expression || (depth0 != null ? depth0.expression : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},{"name":"expression","hash":{},"data":data}) : helper)))
|
+ container.escapeExpression(((helper = (helper = helpers.expression || (depth0 != null ? depth0.expression : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},{"name":"expression","hash":{},"data":data}) : helper)))
|
||||||
+ "</div>\n";
|
+ "</div>\n";
|
||||||
},"5":function(container,depth0,helpers,partials,data) {
|
},"5":function(container,depth0,helpers,partials,data) {
|
||||||
|
var helper;
|
||||||
|
|
||||||
|
return container.escapeExpression(((helper = (helper = helpers.rules || (depth0 != null ? depth0.rules : depth0)) != null ? helper : helpers.helperMissing),(typeof helper === "function" ? helper.call(depth0 != null ? depth0 : {},{"name":"rules","hash":{},"data":data}) : helper)))
|
||||||
|
+ "\n";
|
||||||
|
},"7":function(container,depth0,helpers,partials,data) {
|
||||||
return " <li>"
|
return " <li>"
|
||||||
+ container.escapeExpression(container.lambda(depth0, depth0))
|
+ container.escapeExpression(container.lambda(depth0, depth0))
|
||||||
+ "</li>\n";
|
+ "</li>\n";
|
||||||
@ -37,8 +46,10 @@ templates['term.html'] = template({"1":function(container,depth0,helpers,partial
|
|||||||
var stack1, alias1=depth0 != null ? depth0 : {};
|
var stack1, alias1=depth0 != null ? depth0 : {};
|
||||||
|
|
||||||
return ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reading : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.program(3, data, 0),"data":data})) != null ? stack1 : "")
|
return ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.reading : depth0),{"name":"if","hash":{},"fn":container.program(1, data, 0),"inverse":container.program(3, data, 0),"data":data})) != null ? stack1 : "")
|
||||||
+ "\n<div class=\"yomichan-def-glossary\">\n <ol>\n"
|
+ "\n"
|
||||||
+ ((stack1 = helpers.each.call(alias1,(depth0 != null ? depth0.glossary : depth0),{"name":"each","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
|
+ ((stack1 = helpers["if"].call(alias1,(depth0 != null ? depth0.rules : depth0),{"name":"if","hash":{},"fn":container.program(5, data, 0),"inverse":container.noop,"data":data})) != null ? stack1 : "")
|
||||||
|
+ "\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";
|
+ " </ol>\n</div>\n";
|
||||||
},"useData":true});
|
},"useData":true});
|
||||||
})();
|
})();
|
@ -16,35 +16,16 @@
|
|||||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.yomichan-popup {
|
iframe.yomichan-popup {
|
||||||
all: initial;
|
all: initial;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border: 1px solid #999;
|
border: 1px solid #999;
|
||||||
box-shadow: 0 0 10px rgba(0, 0, 0, .5);
|
box-shadow: 0 0 10px rgba(0, 0, 0, .5);
|
||||||
color: #000;
|
height: 300px;
|
||||||
font-family: sans-serif;
|
width: 500px;
|
||||||
font-size: 12pt;
|
resize: both;
|
||||||
max-height: 300px;
|
|
||||||
max-width: 500px;
|
|
||||||
min-width: 200px;
|
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
padding: 14px;
|
|
||||||
position: fixed;
|
position: fixed;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
z-index: 256;
|
z-index: 256;
|
||||||
}
|
}
|
||||||
|
|
||||||
.yomichan-popup ol {
|
|
||||||
padding-left: 1.2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.yomichan-def-expression {
|
|
||||||
font-family: serif;
|
|
||||||
font-size: 18pt;
|
|
||||||
}
|
|
||||||
|
|
||||||
.yomichan-def-glossary {
|
|
||||||
clear: both;
|
|
||||||
font-size: 12pt;
|
|
||||||
padding-top: 0.8em;
|
|
||||||
}
|
|
||||||
|
31
ext/fg/css/popup.css
Normal file
31
ext/fg/css/popup.css
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (C) 2016 Alex Yatskov <alex@foosoft.net>
|
||||||
|
* Author: Alex Yatskov <alex@foosoft.net>
|
||||||
|
*
|
||||||
|
* This program is free software: you can redistribute it and/or modify
|
||||||
|
* it under the terms of the GNU General Public License as published by
|
||||||
|
* the Free Software Foundation, either version 3 of the License, or
|
||||||
|
* (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This program is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
* GNU General Public License for more details.
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU General Public License
|
||||||
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: sans-serif;
|
||||||
|
font-size: 12pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
.expression {
|
||||||
|
font-family: serif;
|
||||||
|
font-size: 18pt;
|
||||||
|
}
|
||||||
|
|
||||||
|
.glossary {
|
||||||
|
font-size: 12pt;
|
||||||
|
}
|
@ -25,10 +25,8 @@ class Client {
|
|||||||
this.enabled = false;
|
this.enabled = false;
|
||||||
this.options = null;
|
this.options = null;
|
||||||
|
|
||||||
this.popup = document.createElement('div');
|
this.popup = document.createElement('iframe');
|
||||||
this.popup.classList.add('yomichan-popup');
|
this.popup.classList.add('yomichan-popup');
|
||||||
this.popup.addEventListener('mousedown', (e) => e.stopPropagation());
|
|
||||||
this.popup.addEventListener('scroll', (e) => e.stopPropagation());
|
|
||||||
document.body.appendChild(this.popup);
|
document.body.appendChild(this.popup);
|
||||||
|
|
||||||
chrome.runtime.onMessage.addListener(this.onMessage.bind(this));
|
chrome.runtime.onMessage.addListener(this.onMessage.bind(this));
|
||||||
@ -109,8 +107,8 @@ class Client {
|
|||||||
this.hidePopup();
|
this.hidePopup();
|
||||||
} else {
|
} else {
|
||||||
range.setEnd(range.endContainer, range.startOffset + length);
|
range.setEnd(range.endContainer, range.startOffset + length);
|
||||||
renderText({defs: results}, 'defs.html', (html) => {
|
renderText({defs: results, root: chrome.extension.getURL('fg')}, 'defs.html', (html) => {
|
||||||
this.popup.innerHTML = html;
|
this.popup.setAttribute('srcdoc', html);
|
||||||
this.showPopup(range);
|
this.showPopup(range);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -20,6 +20,7 @@
|
|||||||
"background": {"page": "bg/background.html"},
|
"background": {"page": "bg/background.html"},
|
||||||
"options_page": "bg/options.html",
|
"options_page": "bg/options.html",
|
||||||
"permissions": ["storage"],
|
"permissions": ["storage"],
|
||||||
|
"web_accessible_resources": ["fg/css/popup.css"],
|
||||||
|
|
||||||
"content_scripts": [{
|
"content_scripts": [{
|
||||||
"matches": ["*://*/*"],
|
"matches": ["*://*/*"],
|
||||||
|
@ -1,6 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title></title>
|
||||||
|
<link rel="stylesheet" href="{{root}}/css/popup.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
{{#each defs}}
|
{{#each defs}}
|
||||||
<div class="yomichan-def">
|
<div class="definition">
|
||||||
{{> term.html}}
|
{{> term.html}}
|
||||||
{{#unless @last}}<br>{{/unless}}
|
{{#unless @last}}<br>{{/unless}}
|
||||||
</div>
|
</div>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
@ -1,10 +1,16 @@
|
|||||||
{{#if reading}}
|
{{#if reading}}
|
||||||
<div class="yomichan-def-expression"><ruby>{{expression}}<rt>{{reading}}</rt></ruby></div>
|
<div class="expression"><ruby>{{expression}}<rt>{{reading}}</rt></ruby></div>
|
||||||
{{else}}
|
{{else}}
|
||||||
<div class="yomichan-def-expression">{{expression}}</div>
|
<div class="expression">{{expression}}</div>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
<div class="yomichan-def-glossary">
|
<div class="rules">
|
||||||
|
{{#if rules}}
|
||||||
|
{{rules}}
|
||||||
|
{{/if}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="glossary">
|
||||||
<ol>
|
<ol>
|
||||||
{{#each glossary}}
|
{{#each glossary}}
|
||||||
<li>{{.}}</li>
|
<li>{{.}}</li>
|
||||||
|
Loading…
Reference in New Issue
Block a user