Facility Control

 View Only
  • 1.  Toggle Button Question

    Posted 02-16-2021 18:33

    Is it possible to put a variable in for the  constraint key text block
    >CLICK FOR ON< in the example below?

    -Jerry

             <param access="1" constrainttype="INT_CHOICE" name="bname2" oid="bname2" precision="0" type="INT32" value="0" widget="toggle">
    <constraint key="0">CLICK FOR ON</constraint>
    <constraint key="1">CLICK FOROFF</constraint>
    </param>


  • 2.  RE: Toggle Button Question

    Posted 02-22-2021 21:16

    There is no way to put a variable directly into the source code.

    But you could utilize a script that changes your constraints. This could be ran from an api if needed to be ran at load time. See below...

    <abs contexttype="opengear" id="_top" keepalive="false">
    <meta>
    <params>
    <param access="1" constrainttype="INT_CHOICE" name="bname2" oid="bname2" precision="0" type="INT32" value="0" widget="toggle">
    <constraint key="0">CLICK FOR ON</constraint>
    <constraint key="1">CLICK FOR OFF</constraint>
    </param>
    </params>
    </meta>
    <param expand="true" height="266" left="101" oid="bname2" showlabel="false" top="86" width="309"/>
    <table height="343" left="121" top="441" width="1139">
    <tr>
    <button buttontype="push" colspan="1" fill="both" height="97" left="100" name="Change Constraints 0-1" rowspan="1" top="498" weightx="1.0" weighty="1.0" width="242">
    <task tasktype="ogscript">var choices = [];
    choices[0] = 'CLICK FOR ON';
    choices[1] = 'CLICK FOR OFF';

    var choiceConstraint = params.createIntChoiceConstraint(choices);

    params.replaceConstraint('bname2', choiceConstraint);
    </task>
    </button>
    <button buttontype="push" colspan="1" fill="both" height="97" left="573" name="Change Constraints 2-3" rowspan="1" top="497" weightx="1.0" weighty="1.0" width="242">
    <task tasktype="ogscript">var choices = [];
    choices[2] = 'CLICK FOR ON';
    choices[3] = 'CLICK FOR OFF';

    var choiceConstraint = params.createIntChoiceConstraint(choices);

    params.replaceConstraint('bname2', choiceConstraint);
    </task>
    </button>
    </tr>
    <tr>
    <button buttontype="push" colspan="2" fill="both" height="97" name="Get Constraints" rowspan="1" weightx="1.0" weighty="1.0" width="242">
    <task tasktype="ogscript">var numList = params.getConstraint("bname2");
    var choices = numList.getChoices();
    var output = "Constraints are:";
    for (var i = 0; i &lt; choices.length; i++) {
    output = output + "\nkey: " + choices[i].getValue() + " = " + choices[i].getName();
    }
    ogscript.rename("output", output);</task>
    </button>
    </tr>
    </table>
    <label height="292" id="output" left="621" style="style:timerLabel;txt-align:north;" top="78" width="800"/>
    </abs>

    #DashBoard


  • 3.  RE: Toggle Button Question

    Posted 02-23-2021 14:40

    Thanks for the response on this. 
    I guess this would be a feature request.
    It seems like a lot of hoops to jump through just to have a more flexible way to customize the label a toggle button.


    #DashBoard


  • 4.  RE: Toggle Button Question

    Posted 02-23-2021 19:41

    Yo dude!

    Here is a quick panel to help with toggling states.  while there are a million ways to do this, I hope some of this code helps you figure out a way that works for you.  I wrote a bunch of green text to help figure out what the code is doing.  Keep in mind that this won't be persistent so every time you close the panel and restart it the button will default to off. 

    <abs contexttype="opengear" id="_top" keepalive="false" style="">
    <meta name="APIs">
    <api>// toggle button API to change color and name

    var state = {style:{on:'bg#selectbg', off:'bg#buttonbg'}, name:{on:'Click for off',off:'Click for on'}}// this look s complicated but it is keeping style and name data for later use. fell free to change anything in the quotes and it will change how the button do.
    var toggleState = 0 // 0= off 1 = on

    function ButtonToggle(buttonName){// the button name is set but the function call which in this case is just the ID for later use. Check the button if you want to see how it is being called &lt;&lt;--
    if(toggleState == 0){// Yo is the state off by that I mean 0? if so do this
    toggleState = 1; // first set the state to on so I know for next time
    ogscript.setStyle(buttonName, state['style']['on']);//lets go ahead and change the style to what we are calling on up in the above object
    ogscript.rename(buttonName, state['name']['on']);// changing that name here too
    }else{// oh dang so it wasn't off?
    if(toggleState == 1){//Hmmmm lets see if it is on. Oh it is? sweet do this!
    toggleState = 0;// set the state to off for next time
    ogscript.setStyle(buttonName, state['style']['off']);// lets set the style like above but for off now
    ogscript.rename(buttonName, state['name']['off']);// second verse here comes the name.
    }
    }
    }

    </api>
    </meta>
    <button buttontype="push" height="472" id="Toggle_Button" left="80" name="Click For on" style="size:Biggest;font:bold;" top="62" width="841">
    <task tasktype="ogscript">ButtonToggle(component.getClientProperty('id')); // yo do the function in the API and use my ID as the "buttonName". Boom Town!</task>
    </button>
    </abs>



    #DashBoard


  • 5.  RE: Toggle Button Question

    Posted 02-23-2021 21:24

    I should mention that to the best of my knowledge there is not a good way to trigger a toggle buttons style from script so I just keep the style in the api and tell the button what to do hence the ogscript.setStyle([ID],[style]). Here is another way to do it that simply uses params and a task in the button.  keep in mind just use a button instead of a param that looks like a button.  You have a bit more flexibility that way.   Good luck dude. 

     

    <abs contexttype="opengear" id="_top" keepalive="false" style="">
    <meta>
    <params>
    <param access="1" constrainttype="INT_CHOICE" name="ToggleButton" oid="ToggleButton" precision="1" type="INT16" value="0" widget="toggle">
    <constraint key="0"/>
    <constraint key="1"/>
    </param>
    </params>
    </meta>
    <button buttontype="push" height="337" id="Toggle_Button" left="61" name="This button is off" top="68" width="605">
    <task tasktype="ogscript">var name = {on:'This button is on', off:'This button is off'};// names to be used if on or off
    var style = {on:'bg#selectbg', off:'bg#buttonbg'}
    var value = params.getValue('ToggleButton', 0);//what is the current state of the param
    var button = component.getClientProperty('id');//what is the name of this button

    if(value == 0){// if the param is off do this
    ogscript.rename(button, name['on']);//rename this button
    params.setValue('ToggleButton', 0, 1);//set the param value to on
    ogscript.setStyle(button, style['on'])
    }else{
    if(value == 1){ //if the param is on do this
    ogscript.rename(button, name['off']);// rename the button the off value
    params.setValue('ToggleButton', 0, 0);
    ogscript.setStyle(button, style['off'])
    }
    }
    </task>
    </button>
    </abs>

    #DashBoard


  • 6.  RE: Toggle Button Question

    Posted 03-11-2021 20:40

    Thanks - lots ponder here!!


    #DashBoard