BangleApps/apps/contourclock/custom.html

69 lines
2.2 KiB
HTML
Raw Normal View History

2022-02-11 11:26:19 +00:00
<html>
<head>
<link rel="stylesheet" href="../../css/spectre.min.css">
<style>
input[type=checkbox] {
opacity:0;
}
input[type=checkbox] + label {
opacity:0.2;
}
input[type=checkbox]:checked + label {
opacity:1;
}
</style>
</head>
<body>
2023-01-15 02:27:46 +00:00
<h1>&nbsp;&nbsp;&nbsp;Select Fonts to upload:</h1>
2022-02-11 11:26:19 +00:00
<form>
2023-01-15 01:32:25 +00:00
<script src="../../core/lib/customize.js"></script>
2022-12-10 09:13:06 +00:00
<script>
2023-01-15 00:37:22 +00:00
console.log("TEST");
2022-12-12 18:40:04 +00:00
const FontList = ["Teko", "LuckiestGuy", "Bangers", "RubikOne", "Oswald", "Anton", "TitanOne", "BarlowCond", "BebasNeue", "Dekko", "DinAlternate",
2022-12-10 09:13:06 +00:00
"Impact", "Nunito", "OpenSansEC", "Phosphate", "Quicksand", "SairaEC",
2023-01-22 01:43:47 +00:00
"Yumaro", "YuseiMagic", "MouseMemoirs", "ArchivoNarrow", "FjallaOne", "NerkoOne"];
2022-12-10 09:13:06 +00:00
for (fontName of FontList) {
var cb = document.createElement('input');
cb.type = 'checkbox';
cb.id = fontName;
2022-12-10 10:39:48 +00:00
cb.name = "font"
2022-12-10 09:13:06 +00:00
var lb = document.createElement('label');
2022-12-10 10:39:48 +00:00
lb.setAttribute("for",fontName);
2022-12-10 09:13:06 +00:00
var img1 = document.createElement('img')
img1.src = "fonts/"+fontName+"-p1.png";
var img2 = document.createElement('img')
img2.src = "fonts/"+fontName+"-p2.png";
lb.appendChild(img1);
lb.appendChild(img2);
2022-12-10 10:39:48 +00:00
document.forms[0].appendChild(cb);
2022-12-10 09:13:06 +00:00
document.forms[0].appendChild(lb);
document.forms[0].appendChild(document.createElement('br'));
}
2022-12-10 21:38:18 +00:00
btn=document.createElement('button');
btn.id="upload";
btn.innerHTML="Upload selected Fonts";
btn.addEventListener("click", function() {
2022-02-11 11:26:19 +00:00
var n=0;
var fonts = [];
2022-12-10 10:39:48 +00:00
for (fontElement of document.getElementsByName("font")) {
if (fontElement.checked==true) {
2022-02-11 11:26:19 +00:00
fonts.push({
name:"contourclock-"+n+".json",
2022-12-10 21:42:47 +00:00
url:"fonts/font-"+fontElement.id+".json"
2022-02-11 11:26:19 +00:00
});
n++;
2022-02-11 08:24:57 +00:00
}
2022-02-11 11:26:19 +00:00
}
2023-01-15 00:37:22 +00:00
if (n>0) {
2023-01-15 02:12:58 +00:00
fonts.push({name:"contourclock-install.json", content:"{\"n\":"+n+"}"});
2023-01-15 01:10:53 +00:00
sendCustomizedApp({storage:fonts});
2023-01-15 00:37:22 +00:00
} else {
2022-02-11 11:26:19 +00:00
alert("Please select at least one Font!");
2023-01-15 00:37:22 +00:00
}
2022-02-11 11:26:19 +00:00
});
2022-12-10 21:38:18 +00:00
document.forms[0].appendChild(btn);
2022-02-11 11:26:19 +00:00
</script>
</form>
</body>
</html>