See the JS tab for the code and browser console for messages
Click this button to change the value of the roomname signal to "kitchen"
Click this button to change the value of the roomname signal to "bedroom"
Click this button to decrease the temperature
Click this button to increase the temperature
The red bordered element contains the value of the subscribeStateScript function for the following template string
'"{{s.roomname}}" + ":" + ({{n.temperature}}/10).toFixed(1) + "C"';
{#You will need to change both roomname and temperature in order for the value to change from the default one.#}
Click this button to unsubscribe from the updates
<p>See the JS tab for the code and browser console for messages</p> <p> Click this button to change the value of the <b>roomname</b> signal to "kitchen" <ch5-button label="Btn1" sendEventOnClick="trig1"></ch5-button> </p> <p> Click this button to change the value of the <b>roomname</b> signal to "bedroom" <ch5-button label="Btn2" sendEventOnClick="trig2"></ch5-button> </p> <p> Click this button to decrease the temperature <ch5-button label="Btn3" sendEventOnClick="trig3"></ch5-button> </p> <p> Click this button to increase the temperature <ch5-button label="Btn4" sendEventOnClick="trig4"></ch5-button> </p> <p> The red bordered element contains the value of the subscribeStateScript function for the following template string <code>'"{{s.roomname}}" + ":" + ({{n.temperature}}/10).toFixed(1) + "C"';</code> {#You will need to change both <b>roomname</b> and <b>temperature</b> in order for the value to change from the default one.#} </p> <p> Click this button to unsubscribe from the updates <ch5-button id="btn-cleanup" label="Cleanup" type="danger"></ch5-button> </p> <div id="updated-element" style="border:1px solid blue"></div>
(function(CrComLib){ var el = document.getElementById('updated-element'); // String signals must be quoted if they want to be used as their string value. var signalScriptTemplate = '"{{s.roomname}}" + ":" + ({{n.temperature}}/10).toFixed(1) + "C"'; // An alternate way of declaring the above template: // var signalScriptTemplate='CrComLib.textformat(" {1} : {2} C","{{s.roomname}}",({{n.temperature}}/10).toFixed(1))'; var sigScriptSub = CrComLib.subscribeStateScript(signalScriptTemplate, updateCallback, 'defaultValue'); var unsubBtn = document.querySelector('#btn-cleanup'); unsubBtn.removeEventListener('click',cleanup); unsubBtn.addEventListener('click',cleanup); function updateCallback(update){ console.log("Update received: " + update); el.textContent = update; } function cleanup(){ CrComLib.unsubscribeStateScript(sigScriptSub); } })(CrComLib);