Hi Sharptools tribe, I would like for some help, about this issue:
-
I made a custom tile (supported by chatgpt) to handle a virtual device associated to an Air Conditioner by IFTTT (Midea Air applet). The connection works fine ST-IFFT-Air Conditioner.
-
The custom tile has 4 clicks, 1 for ON/OFF and 3 buttons for power off program (2h, 4h and 6h)
-
When a buttons for power off program is clicked it sends a value to a Sharptools variable, AATimer b.e. (2, 4 or 6 numeric values).
-
There is a rule that triggers when variable changes and start a cycle each hour to check if device is still on (if user did not power it off before the programmed time), subtracts 1 to variable until it gets a 0 value, then power off the device.
-
The custom tile works fine to ON-OFF the device
-
The custom tile works fine to Power Off program in my iPhone (buttons activates, and variable is set with correct value 2, 4 or 6), rule runs right, and device is powered off on time.
-
PROBLEM: When custom tile is inserted on my daughters mobiles dashboards the On/Off function works right, but when a button is clicked, it is activated on the custom tile, but the value is not set in the variable, variable stills on 0. Custom tile works fine setting the variable in my iPhone, but not set the variable in my daughters phones (one Android and other iPhone).
Checking in Chat GPT and recommends update chrome, delete cache, authorize java script, etc. I already done all recommendations but still the same. Also I double check correct variable is set on the custom tile.
I think this is the command is not working for my daughters Huawei.
if (acTimerVar) acTimerVar.setValue(hours);
Any idea? ..This is the seeting and code:
{"type": "VARIABLE","name": "acTimerVar","label": "AC Timer Variable","filters": {"type": "Number"}}
And set the value:
function scheduleOff(hours, btn) {
if (currentTimerButton) currentTimerButton.classList.remove(“on”);
btn.classList.add(“on”);
currentTimerButton = btn;
if (acTimerVar) acTimerVar.setValue(hours); // <— AQUÍ SE ENVÍA EL VALOR A LA VARIABLE
}
This is the complete code if anyone wants to use it, I like it very much:
<!-- Tile Settings: permite seleccionar el dispositivo y la variable -->
<script type="application/json" id="tile-settings">
{
"schema": "0.2.0",
"settings": [
{
"type": "THING",
"name": "acDevice",
"label": "Select your AC device",
"filters": {"capabilities": ["switch"]}
},
{
"type": "VARIABLE",
"name": "acTimerVar",
"label": "AC Timer Variable",
"filters": {"type": "Number"}
}
],
"name": "AA Control",
"dimensions": {"height": 2, "width": 2}
}
</script>
<!-- SharpTools Library -->
<script src="https://cdn.sharptools.io/js/custom-tiles/0.2.1/stio.js"></script>
<!-- Estilos -->
<style>
body { margin: 0; padding: 0; }
.tile {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
background: #000000;
border-radius: 8px;
color: #ffffff;
font-size: 0.75em;
}
.info {
margin: 2px;
font-size: 1.1em;
}
.button {
margin: 2px;
padding: 4px 8px;
border-radius: 5px;
cursor: pointer;
background-color: #ccc;
color: #000;
font-size: 0.8em;
}
.button.on {
background-color: #46CDFF;
color: #fff;
}
.timer-buttons {
display: flex;
flex-direction: row;
margin-top: 4px;
}
.icon-container {
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.icon {
width: 50px;
height: 50px;
transform: translateY(0px);
}
</style>
<!-- HTML -->
<div class="tile">
<div class="info" id="status">Loading...</div>
<div class="icon-container">
<img id="stateIcon" class="icon" src="" alt="State Icon">
</div>
<div class="timer-buttons" id="timerButtons">
<div class="button" onclick="scheduleOff(2, this)">Off 2h</div>
<div class="button" onclick="scheduleOff(4, this)">Off 4h</div>
<div class="button" onclick="scheduleOff(6, this)">Off 6h</div>
</div>
</div>
<!-- JavaScript -->
<script>
let acDevice;
let acTimerVar;
let currentTimerButton = null;
const ICON_ON = "https://firebasestorage.googleapis.com/v0/b/sharptools-default.appspot.com/o/users%2FaoR6XW3JjLcjzEGS0yy9BsJLMyV2%2Fuploads%2Ficons%2FAA%20On.gif?alt=media&token=28af3378-6e8b-4b9e-a91e-c3efdb3fab91";
const ICON_OFF = "https://firebasestorage.googleapis.com/v0/b/sharptools-default.appspot.com/o/users%2FaoR6XW3JjLcjzEGS0yy9BsJLMyV2%2Fuploads%2Ficons%2FAA%20Off.png?alt=media&token=7717bfd1-8792-4e17-a484-38944019394e";
stio.ready(data => {
acDevice = data.settings.acDevice;
acTimerVar = data.settings.acTimerVar;
if (!acDevice || !acDevice.attributes["switch"]) {
document.getElementById("status").innerText = "⚠️ Device or switch capability not found.";
return;
}
// Listener para el cambio de estado ON/OFF
acDevice.subscribe("switch");
acDevice.attributes["switch"].onValue(val => {
updateUI(val);
if (val === "off") {
clearTimerSelection();
if (acTimerVar) acTimerVar.setValue(0);
}
});
updateUI(acDevice.attributes["switch"].value);
// AcciĂłn manual sobre Ăcono
document.getElementById("stateIcon").onclick = () => {
const currentState = acDevice.attributes["switch"].value;
const command = currentState === "on" ? "off" : "on";
acDevice.sendCommand(command);
if (command === "off") {
clearTimerSelection();
if (acTimerVar) acTimerVar.setValue(0);
}
};
});
function updateUI(state) {
const statusDiv = document.getElementById("status");
const stateIcon = document.getElementById("stateIcon");
if (state === "on") {
statusDiv.innerText = "AA ON";
stateIcon.src = ICON_ON;
} else {
statusDiv.innerText = "AA OFF";
stateIcon.src = ICON_OFF;
clearTimerSelection();
}
}
function scheduleOff(hours, btn) {
if (currentTimerButton) currentTimerButton.classList.remove("on");
btn.classList.add("on");
currentTimerButton = btn;
if (acTimerVar) acTimerVar.setValue(hours);
}
function clearTimerSelection() {
if (currentTimerButton) {
currentTimerButton.classList.remove("on");
currentTimerButton = null;
}
}
</script>