From 5f74c473cef4564ad2040d9211f70b4f0ac048f1 Mon Sep 17 00:00:00 2001 From: Alex Yatskov Date: Thu, 14 Apr 2016 20:36:00 -0700 Subject: Switch to iframe --- ext/bg/js/templates.js | 31 +++++++++++++++++++++---------- ext/fg/css/client.css | 27 ++++----------------------- ext/fg/css/popup.css | 31 +++++++++++++++++++++++++++++++ ext/fg/js/client.js | 8 +++----- ext/manifest.json | 7 ++++--- 5 files changed, 63 insertions(+), 41 deletions(-) create mode 100644 ext/fg/css/popup.css (limited to 'ext') diff --git a/ext/bg/js/templates.js b/ext/bg/js/templates.js index ff146290..dfe52cd5 100644 --- a/ext/bg/js/templates.js +++ b/ext/bg/js/templates.js @@ -3,22 +3,26 @@ templates['defs.html'] = template({"1":function(container,depth0,helpers,partials,data) { var stack1; - return "
\n" - + ((stack1 = container.invokePartial(partials["term.html"],depth0,{"name":"term.html","data":data,"indent":" ","helpers":helpers,"partials":partials,"decorators":container.decorators})) != null ? stack1 : "") - + " " + return "
\n" + + ((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 : "") - + "\n
\n"; + + "\n
\n"; },"2":function(container,depth0,helpers,partials,data) { return "
"; },"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 "\n\n \n \n \n \n \n \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 : "") + + " \n\n"; },"usePartial":true,"useData":true}); 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; - return "
" + return "
" + 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.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) { var helper; - return "
" + return "
" + 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))) + "
\n"; },"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 "
  • " + container.escapeExpression(container.lambda(depth0, depth0)) + "
    • \n"; @@ -37,8 +46,10 @@ templates['term.html'] = template({"1":function(container,depth0,helpers,partial 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 : "") - + "\n
    \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 : "") + + "\n" + + ((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
      \n
        \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 : "") + "
      \n
      \n"; },"useData":true}); })(); \ No newline at end of file diff --git a/ext/fg/css/client.css b/ext/fg/css/client.css index d62839a4..e55ce2fd 100644 --- a/ext/fg/css/client.css +++ b/ext/fg/css/client.css @@ -16,35 +16,16 @@ * along with this program. If not, see . */ -.yomichan-popup { +iframe.yomichan-popup { all: initial; background-color: #fff; border: 1px solid #999; box-shadow: 0 0 10px rgba(0, 0, 0, .5); - color: #000; - font-family: sans-serif; - font-size: 12pt; - max-height: 300px; - max-width: 500px; - min-width: 200px; + height: 300px; + width: 500px; + resize: both; overflow-y: auto; - padding: 14px; position: fixed; visibility: hidden; 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; -} diff --git a/ext/fg/css/popup.css b/ext/fg/css/popup.css new file mode 100644 index 00000000..3eba23ee --- /dev/null +++ b/ext/fg/css/popup.css @@ -0,0 +1,31 @@ +/* + * Copyright (C) 2016 Alex Yatskov + * Author: Alex Yatskov + * + * 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 . + */ + +body { + font-family: sans-serif; + font-size: 12pt; +} + +.expression { + font-family: serif; + font-size: 18pt; +} + +.glossary { + font-size: 12pt; +} diff --git a/ext/fg/js/client.js b/ext/fg/js/client.js index 20838e10..ea18e41f 100644 --- a/ext/fg/js/client.js +++ b/ext/fg/js/client.js @@ -25,10 +25,8 @@ class Client { this.enabled = false; this.options = null; - this.popup = document.createElement('div'); + this.popup = document.createElement('iframe'); 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); chrome.runtime.onMessage.addListener(this.onMessage.bind(this)); @@ -109,8 +107,8 @@ class Client { this.hidePopup(); } else { range.setEnd(range.endContainer, range.startOffset + length); - renderText({defs: results}, 'defs.html', (html) => { - this.popup.innerHTML = html; + renderText({defs: results, root: chrome.extension.getURL('fg')}, 'defs.html', (html) => { + this.popup.setAttribute('srcdoc', html); this.showPopup(range); }); } diff --git a/ext/manifest.json b/ext/manifest.json index 11d00e5d..e5b21268 100644 --- a/ext/manifest.json +++ b/ext/manifest.json @@ -17,9 +17,10 @@ } }, - "background": {"page": "bg/background.html"}, - "options_page": "bg/options.html", - "permissions": ["storage"], + "background": {"page": "bg/background.html"}, + "options_page": "bg/options.html", + "permissions": ["storage"], + "web_accessible_resources": ["fg/css/popup.css"], "content_scripts": [{ "matches": ["*://*/*"], -- cgit v1.2.3