Atlas48/pointvec
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improved save/load

Browse Source
This commit is contained in:
Devine Lu Linvega
2018-01-12 16:22:50 +13:00
parent 47151452b4
commit 06968a57d2
4 changed files with 114 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

90
sources/scripts/theme.js
View File

@@ -1,70 +1,60 @@
function Theme()
{
this.el = document.createElement("style");
this.active = null;
this.default = { background: "#222", f_high: "#fff", f_med: "#777", f_low: "#444", f_inv: "#affec7", b_high: "#000", b_med: "#affec7", b_low: "#000", b_inv: "#affec7" }
this.el.type = 'text/css';
this.default = { background: "#222", f_high: "#fff", f_med: "#777", f_low: "#444", f_inv: "#000", b_high: "#000", b_med: "#affec7", b_low: "#000", b_inv: "#affec7" }
this.active = this.default;
this.start = function()
{
if(localStorage.theme && is_json(localStorage.theme)){
console.log("Theme","Found in localStorage")
this.install(JSON.parse(localStorage.theme));
}
else{
console.log("Theme","Creating new")
this.install(this.default);
}
this.load(localStorage.theme ? localStorage.theme : this.default);
document.head.appendChild(this.el)
window.addEventListener('drop', dotgrid.theme.drag);
}
this.save = function()
this.load = function(t)
{
localStorage.setItem("theme", JSON.stringify(this.active));
console.log("Theme","Saved");
}
var theme = is_json(t) ? JSON.parse(t) : t;
this.load = function(theme_str)
{
if(is_json(theme_str)){
this.install(JSON.parse(theme_str));
}
console.log("Theme","Loaded");
}
if(!theme.background){ return; }
this.install = function(theme)
{
var html = "";
var css = `
:root {
--background: ${theme.background};
--f_high: ${theme.f_high};
--f_med: ${theme.f_med};
--f_low: ${theme.f_low};
--f_inv: ${theme.f_inv};
--b_high: ${theme.b_high};
--b_med: ${theme.b_med};
--b_low: ${theme.b_low};
--b_inv: ${theme.b_inv};
}`;
this.active = theme;
html += "body { background:"+theme.background+" !important }\n";
html += ".fh { color:"+theme.f_high+" !important; stroke:"+theme.f_high+" !important }\n";
html += ".fm { color:"+theme.f_med+" !important ; stroke:"+theme.f_med+" !important }\n";
html += ".fl { color:"+theme.f_low+" !important ; stroke:"+theme.f_low+" !important }\n";
html += ".f_inv { color:"+theme.f_inv+" !important ; stroke:"+theme.f_inv+" !important }\n";
html += ".f_inv { color:"+theme.f_inv+" !important ; stroke:"+theme.f_inv+" !important }\n";
html += ".bh { background:"+theme.b_high+" !important; fill:"+theme.b_high+" !important }\n";
html += ".bm { background:"+theme.b_med+" !important ; fill:"+theme.b_med+" !important }\n";
html += ".bl { background:"+theme.b_low+" !important ; fill:"+theme.b_low+" !important }\n";
html += ".b_inv { background:"+theme.b_inv+" !important ; fill:"+theme.b_inv+" !important }\n";
html += ".icon { color:"+theme.f_high+" !important; stroke:"+theme.f_high+" !important }\n";
html += "#dotgrid svg.vector { fill:"+theme.f_high+" }\n";
html += "#dotgrid #preview { stroke:"+theme.f_low+" !important} \n";
html += "#dotgrid #cursor { border-color:"+theme.f_med+"}\n";
html += "#dotgrid #cursor_from { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n";
html += "#dotgrid #cursor_to { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n";
html += "#dotgrid #cursor_end { background:"+theme.f_low+"; border-color:"+theme.f_low+"}\n";
this.el.innerHTML = html;
this.save();
this.el.textContent = css;
localStorage.setItem("theme", JSON.stringify(theme));
}
this.reset = function()
{
console.log("Theme","reset");
this.install(this.default);
this.load(this.default);
}
this.drag = function(e)
{
e.preventDefault();
e.stopPropagation();
var file = e.dataTransfer.files[0];
if(!file.name || !file.name.indexOf(".thm") < 0){ console.log("Theme","Not a theme"); return; }
var reader = new FileReader();
reader.onload = function(e){
dotgrid.theme.load(e.target.result);
};
reader.readAsText(file);
}
function is_json(text)