mirror of https://github.com/espruino/BangleApps
Improve web interface: use interface instead of custom, fix loading and saving of JSON
Draw left/right arrow in UI if further triggers are availablepull/2488/head
Marco H
parent
4a7b525a94
commit
108fc1e207
|
|
@ -6,3 +6,4 @@
|
||||||
0.06: Updated clkinfo icon.
|
0.06: Updated clkinfo icon.
|
||||||
0.07: Update clock_info to avoid a redraw
|
0.07: Update clock_info to avoid a redraw
|
||||||
0.08: Allow swiping to switch triggers
|
0.08: Allow swiping to switch triggers
|
||||||
|
0.09: Improve web interface
|
||||||
|
|
|
||||||
|
|
@ -1,51 +0,0 @@
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<link rel="stylesheet" href="../../css/spectre.min.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h3>Upload Tigger</h3>
|
|
||||||
<p><textarea id="triggers" style="width:500px; height:300px">
|
|
||||||
[
|
|
||||||
{"display": "Open", "trigger": "OPEN_DOOR", "icon":"door"},
|
|
||||||
{"display": "Office", "trigger": "TOGGLE_LIGHT", "icon":"light"},
|
|
||||||
{"display": "Living Room", "trigger": "OVEN", "icon":"fire"}
|
|
||||||
]</textarea></p>
|
|
||||||
<p><button id="upload" class="btn btn-primary">Upload</button></p>
|
|
||||||
|
|
||||||
<script src="../../core/lib/customize.js"></script>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
/*
|
|
||||||
* Load trigger from BangleJs
|
|
||||||
*/
|
|
||||||
console.log("Loading trigger from BangleJs...");
|
|
||||||
try {
|
|
||||||
Puck.eval(`require("Storage").read(${JSON.stringify("ha.trigger.json")})`,data=>{
|
|
||||||
if(data.length > 0){
|
|
||||||
document.getElementById("triggers").innerHTML = data;
|
|
||||||
console.log("Loaded trigger from BangleJs.");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} catch(ex) {
|
|
||||||
console.log("(Warning) Could not load trigger from BangleJs.");
|
|
||||||
console.log(ex);
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Upload trigger to BangleJs
|
|
||||||
*/
|
|
||||||
document.getElementById("upload").addEventListener("click", function() {
|
|
||||||
// get the text to add
|
|
||||||
var triggerText = document.getElementById("triggers").value;
|
|
||||||
// send finished app (in addition to contents of app.json)
|
|
||||||
sendCustomizedApp({
|
|
||||||
storage:[
|
|
||||||
{name:"ha.trigger.json", url:"ha.trigger.json", content:triggerText},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
console.log("Sent ha.trigger.json!");
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -17,15 +17,26 @@ function draw() {
|
||||||
|
|
||||||
g.setFontAlign(-1,-1);
|
g.setFontAlign(-1,-1);
|
||||||
var icon = trigger.getIcon();
|
var icon = trigger.getIcon();
|
||||||
g.setColor(g.theme.fg).drawImage(icon, 12, H/5-2);
|
g.setColor(g.theme.fg).drawImage(icon, 12, H/5-2-5);
|
||||||
g.drawString("Home", icon.width + 20, H/5);
|
g.drawString("Home", icon.width + 20, H/5-5);
|
||||||
g.drawString("Assistant", icon.width + 18, H/5+24);
|
g.drawString("Assistant", icon.width + 18, H/5+24-5);
|
||||||
|
|
||||||
g.setFontAlign(0,0);
|
g.setFontAlign(0,0);
|
||||||
var ypos = H/5*3+20;
|
var ypos = H/5*3+23;
|
||||||
g.drawRect(W/2-w/2-8, ypos-h/2-8, W/2+w/2+5, ypos+h/2+5);
|
g.drawRect(W/2-w/2-8, ypos-h/2-8, W/2+w/2+5, ypos+h/2+5);
|
||||||
g.fillRect(W/2-w/2-6, ypos-h/2-6, W/2+w/2+3, ypos+h/2+3);
|
g.fillRect(W/2-w/2-6, ypos-h/2-6, W/2+w/2+3, ypos+h/2+3);
|
||||||
g.setColor(g.theme.bg).drawString(trigger.display, W/2, ypos);
|
g.setColor(g.theme.bg).drawString(trigger.display, W/2, ypos);
|
||||||
|
|
||||||
|
// draw arrows
|
||||||
|
g.setColor(g.theme.fg);
|
||||||
|
if (position > 0) {
|
||||||
|
g.drawLine(10, H/2, 20, H/2 - 10);
|
||||||
|
g.drawLine(10, H/2, 20, H/2 + 10);
|
||||||
|
}
|
||||||
|
if (position < triggers.length -1) {
|
||||||
|
g.drawLine(W - 10, H/2, W - 20, H/2 - 10);
|
||||||
|
g.drawLine(W - 10, H/2, W - 20, H/2 + 10);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function toLeft() {
|
function toLeft() {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<link rel="stylesheet" href="../../css/spectre.min.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h3>Home Assistant trigger config</h3>
|
||||||
|
<p><textarea id="triggers" style="width:500px; height:300px">
|
||||||
|
[
|
||||||
|
{"display": "Open", "trigger": "OPEN_DOOR", "icon":"door"},
|
||||||
|
{"display": "Office", "trigger": "TOGGLE_LIGHT", "icon":"light"},
|
||||||
|
{"display": "Living Room", "trigger": "OVEN", "icon":"fire"}
|
||||||
|
]</textarea></p>
|
||||||
|
<p><button id="upload" class="btn btn-primary">Upload trigger</button></p>
|
||||||
|
|
||||||
|
<script src="../../core/lib/interface.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
function onInit(){
|
||||||
|
/*
|
||||||
|
* Load trigger from Bangle.js
|
||||||
|
*/
|
||||||
|
console.log("Loading trigger from Bangle.js...");
|
||||||
|
try {
|
||||||
|
Util.readStorage("ha.trigger.json", data=>{
|
||||||
|
if(data.length > 0){
|
||||||
|
document.getElementById("triggers").innerHTML = data;
|
||||||
|
console.log("Loaded trigger from Bangle.js.");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch(ex) {
|
||||||
|
console.log("(Warning) Could not load trigger from Bangle.js.");
|
||||||
|
console.log(ex);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Upload trigger to Bangle.js
|
||||||
|
*/
|
||||||
|
document.getElementById("upload").addEventListener("click", function() {
|
||||||
|
// get the text to add
|
||||||
|
var triggerText = document.getElementById("triggers").value;
|
||||||
|
|
||||||
|
Util.showModal("Saving...");
|
||||||
|
Util.writeStorage("ha.trigger.json", JSON.stringify(triggerText), ()=>{
|
||||||
|
Util.hideModal();
|
||||||
|
});
|
||||||
|
console.log("Sent ha.trigger.json!");
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -1,14 +1,14 @@
|
||||||
{
|
{
|
||||||
"id": "ha",
|
"id": "ha",
|
||||||
"name": "Home Assistant",
|
"name": "Home Assistant",
|
||||||
"version": "0.08",
|
"version": "0.09",
|
||||||
"description": "Integrates your Bangle.js into Home Assistant.",
|
"description": "Integrates your Bangle.js into Home Assistant.",
|
||||||
"icon": "ha.png",
|
"icon": "ha.png",
|
||||||
"type": "app",
|
"type": "app",
|
||||||
"tags": "tool,clkinfo",
|
"tags": "tool,clkinfo,bluetooth",
|
||||||
"readme": "README.md",
|
"readme": "README.md",
|
||||||
"supports": ["BANGLEJS2"],
|
"supports": ["BANGLEJS2"],
|
||||||
"custom": "custom.html",
|
"interface": "interface.html",
|
||||||
"screenshots": [
|
"screenshots": [
|
||||||
{"url":"screenshot.png"},
|
{"url":"screenshot.png"},
|
||||||
{"url":"screenshot_2.png"},
|
{"url":"screenshot_2.png"},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue