Nico/nazeka-chromium
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style options

Browse Source
This commit is contained in:
wareya committed 2017-12-17 18:16:17 -05:00
1 parent a61930e4c1
commit e75dc5f3c2
3 files changed
+87 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

options.html
+30 -10
View File
@@ -10,16 +10,36 @@
<div class=panel>
<form name=optform>
<div class="panel-section panel-section-formElements browser-style">
<input id="enabled" type="checkbox" name=enabled class=panel-formElements-item/><label for=enabled class=panel-formElements-item>Enabled</label><br>
<input id="compact" type="checkbox" name=compact class=panel-formElements-item/><label for=compact class=panel-formElements-item>Compact</label><br>
<input id="showoriginal" type="checkbox" name=showoriginal class=panel-formElements-item/><label for=showoriginal class=panel-formElements-item>Show original text</label><br>
<input id="superborder" type="checkbox" name=superborder class=panel-formElements-item/><label for=superborder class=panel-formElements-item>Super border</label><br>
<input id="fixedwidth" type="checkbox" name=fixedwidth class=panel-formElements-item/><label for=fixedwidth class=panel-formElements-item>Fixed width</label><br>
<input id="fixedwidthpositioning" type="checkbox" name=fixedwidthpositioning class=panel-formElements-item/><label for=fixedwidthpositioning class=panel-formElements-item>Position as though fixed width</label><br>
<input id="length" type="number" min="6" max="100" value="25" name=length class=panel-formElements-item/><label for=length class=panel-formElements-item>Search length (characters) (default 25, sane values are from 25 to 50)</label><br>
<input id="scale" type="number" min="0.1" max="64" value="1" name=scale class=panel-formElements-item step="0.1"/><label for=scale class=panel-formElements-item>Lookup popup scale</label><br>
<input id="width" type="number" min="100" max="10000" value="600" name=width class=panel-formElements-item/><label for=width class=panel-formElements-item>Lookup popup width (before scaling)</label><br>
<input id="lookuprate" type="number" min="1" max="1000" value="8" name=lookuprate class=panel-formElements-item/><label for=lookuprate class=panel-formElements-item>Lookup throttle (milliseconds)</label><br>
<input id="enabled" type="checkbox" name=enabled/>
<label for=enabled class=panel-formElements-item>Enabled</label><br>
<input id="compact" type="checkbox" name=compact/>
<label for=compact class=panel-formElements-item>Compact</label><br>
<input id="showoriginal" type="checkbox" name=showoriginal/>
<label for=showoriginal class=panel-formElements-item>Show original text</label><br>
<input id="superborder" type="checkbox" name=superborder/>
<label for=superborder class=panel-formElements-item>Super border</label><br>
<input id="fixedwidth" type="checkbox" name=fixedwidth/>
<label for=fixedwidth class=panel-formElements-item>Fixed width</label><br>
<input id="fixedwidthpositioning" type="checkbox" name=fixedwidthpositioning/>
<label for=fixedwidthpositioning class=panel-formElements-item>Position as though fixed width</label><br>
<input id="length" type="number" min="6" max="100" value="25" name=length/>
<label for=length class=panel-formElements-item>Search length (characters) (default 25, sane values are from 25 to 50)</label><br>
<input id="scale" type="number" min="0.1" max="64" value="1" name=scale step="0.1"/>
<label for=scale class=panel-formElements-item>Lookup popup scale</label><br>
<input id="width" type="number" min="100" max="10000" value="600" name=width/>
<label for=width class=panel-formElements-item>Lookup popup width (before scaling)</label><br>
<input id="lookuprate" type="number" min="1" max="1000" value="8" name=lookuprate/>
<label for=lookuprate class=panel-formElements-item>Lookup throttle (milliseconds)</label><br>
<input id="bgcolor" name=bgcolor type="color" value="#111111"/>
<label for=bgcolor class=panel-formElements-item>Background color</label>
<input id="fgcolor" name=fgcolor type="color" value="#CCCCCC"/>
<label for=fgcolor class=panel-formElements-item>Foreground color</label>
<input id="hlcolor" name=hlcolor type="color" value="#99DDFF"/>
<label for=hlcolor class=panel-formElements-item>Highlight color</label>
<input id="font" name=font type="text" value=""/>
<label for=font class=panel-formElements-item>Font override (without trailing comma)</label>
<input id="hlfont" name=hlfont type="text" value=""/>
<label for=hlfont class=panel-formElements-item>Font override (highlighted text only) (without trailing comma)</label>
<p>This extension uses JMdict, which is Copyright © 2017 The Electronic Dictionary Research and Development Group and licensed under the <a href="https://creativecommons.org/licenses/by-sa/3.0/">CC BY-SA 3.0</a> license.</p>
<p>This extension is otherwise licensed under the <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License, version 2.0</a>.</p>
<div><p>Meanings of abbreviations follow. From JMdict. Some may be unused. Unsorted.<p>
options.js
+26 -2
View File
@@ -10,6 +10,11 @@ function restoreListeners()
document.querySelector("#fixedwidthpositioning").addEventListener("change", setOptions);
document.querySelector("#superborder").addEventListener("change", setOptions);
document.querySelector("#showoriginal").addEventListener("change", setOptions);
document.querySelector("#bgcolor").addEventListener("change", setOptions);
document.querySelector("#fgcolor").addEventListener("change", setOptions);
document.querySelector("#hlcolor").addEventListener("change", setOptions);
document.querySelector("#font").addEventListener("change", setOptions);
document.querySelector("#hlfont").addEventListener("change", setOptions);
}
function removeListeners()
{
@@ -23,6 +28,11 @@ function removeListeners()
document.querySelector("#fixedwidthpositioning").removeEventListener("change", setOptions);
document.querySelector("#superborder").addEventListener("change", setOptions);
document.querySelector("#showoriginal").addEventListener("change", setOptions);
document.querySelector("#bgcolor").addEventListener("change", setOptions);
document.querySelector("#fgcolor").addEventListener("change", setOptions);
document.querySelector("#hlcolor").addEventListener("change", setOptions);
document.querySelector("#font").addEventListener("change", setOptions);
document.querySelector("#hlfont").addEventListener("change", setOptions);
}
async function restoreOptions()
@@ -46,6 +56,11 @@ async function restoreOptions()
let fixedwidthpositioning = await getvar("fixedwidthpositioning", false);
let superborder = await getvar("superborder", false);
let showoriginal = await getvar("showoriginal", true);
let bgcolor = await getvar("bgcolor", "#111111");
let fgcolor = await getvar("fgcolor", "#CCCCCC");
let hlcolor = await getvar("hlcolor", "#99DDFF");
let font = await getvar("font", "");
let hlfont = await getvar("hlfont", "");
removeListeners();
document.querySelector("#enabled").checked = enabled?true:false;
document.querySelector("#compact").checked = compact?true:false;
@@ -57,8 +72,12 @@ async function restoreOptions()
document.querySelector("#fixedwidthpositioning").checked = fixedwidthpositioning?true:false;
document.querySelector("#superborder").checked = superborder?true:false;
document.querySelector("#showoriginal").checked = showoriginal?true:false;
}
catch (error){}
document.querySelector("#bgcolor").value = bgcolor?bgcolor:"#111111";
document.querySelector("#fgcolor").value = fgcolor?fgcolor:"#CCCCCC";
document.querySelector("#hlcolor").value = hlcolor?hlcolor:"#99DDFF";
document.querySelector("#font").value = font?font:"";
document.querySelector("#hlfont").value = hlfont?hlfont:"";
} catch (error) {}
removeListeners();
restoreListeners();
}
@@ -94,6 +113,11 @@ function setOptions()
fixedwidthpositioning: document.querySelector("#fixedwidthpositioning").checked,
superborder: document.querySelector("#superborder").checked,
showoriginal: document.querySelector("#showoriginal").checked,
bgcolor: document.querySelector("#bgcolor").value,
fgcolor: document.querySelector("#fgcolor").value,
hlcolor: document.querySelector("#hlcolor").value,
font: document.querySelector("#font").value,
hlfont: document.querySelector("#hlfont").value,
}).then(()=>{fixicon();},()=>{});
}
texthook.js
+31 -13
View File
@@ -33,6 +33,11 @@ showoriginal: true,
scale: 1,
width: 600,
lookuprate: 8,
bgcolor: "#111111",
fgcolor: "#CCCCCC",
hlcolor: "#99DDFF",
font: "",
hlfont: "",
};
let last_time_display = Date.now();
@@ -52,14 +57,16 @@ function delete_div ()
function display_div (middle, x, y, time)
{
let bordercolor = undefined;
if(settings.superborder)
bordercolor = "white";
else
bordercolor = "#CCC";
middle.style = "background-color: #111; border-radius: 2.5px; border: 1px solid #111;";
middle.firstChild.style = "border: 1px solid " + bordercolor + "; border-radius: 2px; padding: 2px; background-color: #111; color: #CCC; font-family: Arial, sans-serif; font-size: 13px; text-align: left;";
//let bordercolor = undefined;
//if(settings.superborder)
// bordercolor = "white";
//else
// bordercolor = "#CCC";
let font = settings.font.trim();
if(font != "")
font += ",";
middle.style = `background-color: ${settings.bgcolor}; border-radius: 2.5px; border: 1px solid ${settings.bgcolor};`;
middle.firstChild.style = `border: 1px solid ${settings.fgcolor}; border-radius: 2px; padding: 2px; background-color: ${settings.bgcolor}; color: ${settings.fgcolor}; font-family: ${font} Arial, sans-serif; font-size: 13px; text-align: left;`;
let find_root = window;
let newx = x;
@@ -83,9 +90,9 @@ function display_div (middle, x, y, time)
styletext += "position: absolute; top: 0; left: 0; ";
if(settings.superborder)
styletext += "background-color: " + bordercolor + "; border-radius: 3px; border: 1px solid " + bordercolor + "; z-index: 100000;";
styletext += `background-color: ${settings.fgcolor}; border-radius: 3px; border: 1px solid ${settings.fgcolor}; z-index: 100000;`;
else
styletext += "border-radius: 3px; background-color: #111; z-index: 100000;";
styletext += `border-radius: 3px; background-color: ${settings.bgcolor}; z-index: 100000;`;
let other = mydoc.body.getElementsByClassName(div_class);
let outer = undefined;
@@ -162,11 +169,16 @@ function build_div (text, result)
// TODO: link to this instead of hardcoding it; work on unhardcoding other CSS too
let style = document.createElement("style");
style.type = "text/css";
let font = settings.hlfont.trim();
if(font != "")
font += ",";
if(settings.font.trim() != "")
font += settings.font.trim() + ",";
style.textContent =
".nazeka_main_keb{font-family: IPAGothic,TakaoGothic,Noto Sans CJK JP Regular,Meiryo,sans-serif;font-size:18px;color:#9DF}\
.nazeka_main_reb{font-family: IPAGothic,TakaoGothic,Noto Sans CJK JP Regular,Meiryo,sans-serif;font-size:18px;color:#9DF}\
`.nazeka_main_keb{font-family: ${font}IPAGothic,TakaoGothic,Noto Sans CJK JP Regular,Meiryo,sans-serif;font-size:18px;color:${settings.hlcolor}}\
.nazeka_main_reb{font-family: ${font}IPAGothic,TakaoGothic,Noto Sans CJK JP Regular,Meiryo,sans-serif;font-size:18px;color:${settings.hlcolor}}\
.nazeka_original{float: right; margin-right: 2px; margin-left:4px; opacity:0.7;}\
";
`;
temp.appendChild(style);
if(settings.showoriginal)
{
@@ -565,6 +577,12 @@ async function settings_init()
getvar("superborder", false);
getvar("showoriginal", true);
getvar("bgcolor", "#111111");
getvar("fgcolor", "#CCCCCC");
getvar("hlcolor", "#99DDFF");
getvar("font", "");
getvar("hlfont", "");
if(!settings.enabled && exists_div())
delete_div();
} catch(err) {} // options not stored yet