Wasted too much time on this...

164 views

Skip to first unread message

Russell Selkirk

unread,

Mar 6, 2019, 12:09:11 PM3/6/19

to WebIOPi

Can anyone figure out how to "decorate" a WebioPI button?

Here's what I have (working):

webiopi().ready(function() {
    webiopi().setFunction(21,"out");
    // Create a "Pulse" labeled button for GPIO 21
        button = webiopi().createSequenceButton("sos", "Cycle", 21, 500, "10"); // the last"01" vs "10" reverses action
     // Append button to HTML element with ID="controls" using jQuery
        $("#controls").append(button);
    // Refresh GPIO buttons
    // pass true to refresh repeatedly or false to refresh once
    webiopi().refreshGPIO(true);
});

And this:

  <!--Button-->
  <th>
    <div id="controls" align="center"></div>
  </th>

NOT this:

.controls.button {
  margin: 5px;
  background-color: #87CEFA;
  color: black;
  border-radius: 5px;
  text-align: center;
  width: 75px;
  height: 40px;
  font-size: 10pt;
}

I've tried ".controls", ".button", ".sos", and all combinations of these as the CSS identifier. Nothing will change the looks of it. This makes a functional, but very ugly button. I'll waste another day or two and move on to using Apache/python for this.

It's a shame there's practically ZERO support for this interface, it had potential. I guess Mr. Ptak has moved on to greener pastures...