heimcontrol.js
heimcontrol.js copied to clipboard
Output button removal for relay use
I wanted to ask is there any option to remove one button from output tab and reprogram button that left for alternately switching GPIO pins (i want to alternately turn on and off relays from GPIO pins using only one web-based button ) Thanks for your time in advance.
Sorry, can you rephrase that? Am I understanding you correctly that you want a single button that will toggle between the two states "pin x on, pin y off" and "pin x off, pin y on"?
No problem. Im not good speaker in english. So i want one button and after pressing it should turn on 3.3 v on gpio pin. After another press it should turn off pin to 0v. I know how it sounds. Heh. Button press pin high next press on the same button pin goes low. Thanks for your reply. So it means exacly what you wrote earlier. 27 sie 2015 21:49 "Tom Janson" [email protected] napisał(a):
Sorry, can you rephrase that? Am I understanding you correctly that you want a single button that will toggle between the two states "pin x on, pin y off" and "pin x off, pin y on"?
— Reply to this email directly or view it on GitHub https://github.com/ni-c/heimcontrol.js/issues/125#issuecomment-135534229 .
Ah, that’s simpler than I thought. That would be called a toggle.
Yes, you could modify plugins/gpio/public/js/gpio.js
.
However, there’s a reason for the current design: The state of the GPIO pin may have changed in the mean time (e.g., if another program changes it). I’m not even sure whether they’re initialized to “off” at when Heimcontrol starts – I think they just stay in whatever state they’re in.
This may not be a problem if you only access the GPIOs with Heimcontrol (which is pretty likely).
But again to be clear: This might lead to a situation where only the “On” button is shown even though the device is already on; clicking it at that point would have no effect (but would bring the system back into a consistent state).
If this is not a problem, or you’re brave enough to try it anyway, do this:
-
Add the following lines to the
gpio-output
event callback ( here):$('button[data-id="' + data.id + '"]').removeClass('hide'); $('button[data-id="' + data.id + '"][data-value="' + data.value + '"]').addClass('hide');
-
Then try adding the CSS class
hide
to the Jade template, here, like so (note the change at the very end):button.btn.btn-inverse.btn-large.socket(type="button", data-socket="gpio-toggle", data-id="#{item._id}", data-value="0", class=(item.value == '0' ? 'active hide' : ''))
(The result may not look pretty; I’ll leave those improvements to you.)
Thank you very much. I'll try these modifications after my work. 28 sie 2015 01:13 "Tom Janson" [email protected] napisał(a):
Ah, that’s simpler than I thought. That would be called a toggle.
Yes, you could modify plugins/gpio/public/js/gpio.js.
However, there’s a reason for the current design: The state of the GPIO pin may have changed in the mean time (e.g., if another program changes it). I’m not even sure whether they’re initialized to “off” at when Heimcontrol starts – I think they just stay in whatever state they’re in.
This may not be a problem if you only access the GPIOs with Heimcontrol (which is pretty likely).
But again to be clear: This might lead to a situation where only the “On” button is shown even though the device is already on; clicking it at that point would have no effect (but would bring the system back into a
consistent state).
If this is not a problem, or you’re brave enough to try it anyway, do this:
Add the following lines to the gpio-output event callback ( here) https://github.com/ni-c/heimcontrol.js/blob/master/plugins/gpio/public/js/gpio.js#L26-L32 :
$('button[data-id="' + data.id + '"]').removeClass('hide'); $('button[data-id="' + data.id + '"][data-value="' + data.value + '"]').addClass('hide');
Then try adding the CSS class hide to the Jade template (i.e., hide the button at startup), here https://github.com/ni-c/heimcontrol.js/blob/master/plugins/gpio/views/item.jade#L22-L27, like so:
button.btn.btn-inverse.btn-large.socket(type="button", data-socket="gpio-toggle", data-id="#{item._id}", data-value="0", class=(item.value == '0' ? 'active hide' : ''))
(The result may not look pretty; I’ll leave those improvements to you.)
— Reply to this email directly or view it on GitHub https://github.com/ni-c/heimcontrol.js/issues/125#issuecomment-135580220 .
Worked like a charm Tom. Looks really good .Now i only have to make button blank (no 'on' and 'off' ) Is there any way to list outputs on left column , inputs on right ? Adding output, input, output, input really takes some space.
Tom, Is there anyway to do this for a single RF switch? One of the switches I'm using only has one tri state code that toggles the power making on/off a little redundant.
However I have several other devices that require the on/off function so I wouldn't want it for them all.
Thanks, Pete
Sorry for the late reply, I’ve been a bit busy.
@scrobel: There isn’t any built-in way to do this, but you can modify the Jade template I refered to earlier to achieve whatever cosmetic changes you desire. (See Jade website, in the end it’s just HTML.)
@pete54321: Again there's no built-in way to do this, but you could customize the Jade template. In this case, you’d need some conditional that applies only to that tri-state switch. (Something like if (item.description == 'your description')
.) Best way would probably be to add a new CSS class based on this and use that to style the button.
Off the top of my head, it could look something like this:
Jade template:
button.btn.btn-inverse.btn-large.socket(type="button", data-socket="gpio-toggle", data-id="#{item._id}", data-value="0", class=(item.value == '0' ? (item.description == 'something' ? 'active hide-active' : 'active') : ''))
JS as described in my earlier comment.
CSS:
.active.hide-active { display: none; }
Let me know if you need more details, but it might take a while for me to answer.