Update MYNG GUI with PSOA features

[greenTara]

The checkboxes for PSOA tuple features will (most likely) appear in a new "facet". The dependent slot feature is more complicated because it is related to the existing (independent) slot feature.

[greenTara]

We start with implementation of tuples because there are less design decisions that need to be made.
Specifications:

1. A new facet is created with title something like "Multiple Tuple Options".
2. The location is in the second row. I suggest it appear after Expression Options, sliding Serialization Options ( and the obsolete Language Options) to the right.
3. The first checkbox would enable Tuples (of whatever variety). This corresponds to the inclusion of the Tuple module in the driver schema.
4. Indented below the Tuple checkbox would be the controls for dependent and independent tuples, corresponding to the inclusion of tupdep and tup modules, resp.
5. Interaction of controls: Checking Tuple enables tupdep and tup. Unchecking Tuple disables both.
6. For a meaningful configuration, selection of at least one of tupdep and tup is required if Tuple is enabled. Also both can be selected. One way to do this would be a set of three radio buttons:
   [ ] multiple tuples
   • dependent tuples only
   • independent tuples only
   • both dependent and independent tuples

[greenTara]

7. An alternative would be just a set of four radio buttons
   • no multiple tuples
   • dependent tuples only
   • independent tuples only
   • both dependent and independent tuples

[greenTara]

The javascript is in the myng directory of the repository, in index.html

https://github.com/RuleML/deliberation-ruleml/blob/1.03-psoa/myng/index.html

[greenTara]

The existing facet for Term Sequences is a good template for a set of radio buttons.

            <td class="facet"> <span class="facet-head">Term Sequences: <br /> Number of Terms <br /></span> (Select One) <ol>
              <li><input type="radio" name="termseq" onclick="checkAll(this.form)" /> None </li>
              <li>
                <input type="radio" name="termseq" onclick="checkAll(this.form)" /> Unary (Zero
                or One) </li>
              <li>
                <input type="radio" name="termseq" onclick="checkAll(this.form)" /> Binary (Zero
                or Two) </li>
              <li>
                <input type="radio" name="termseq" onclick="checkAll(this.form)" /> Unary/Binary (Zero
                to Two) </li>
              <li>
                <input type="radio" name="termseq" onclick="checkAll(this.form)" /> Variably Polyadic (Zero
                or More) </li>
            </ol>
            </td>

[greenTara]

In the function "intialize-form", the initial selection of the radio button is set:

            function initializeForm(LanguageForm) {
                // One option must be checked for radio buttons
                ...
                if (!(
                LanguageForm.termseq[0].checked *
                LanguageForm.termseq[1].checked *
                LanguageForm.termseq[2].checked *
                LanguageForm.termseq[3].checked *
                LanguageForm.termseq[4].checked)) {
                    // initialize to Variably Polyadic
                    LanguageForm.termseq[4].checked = true;
                }

[greenTara]

In the function "clearOthers", the minimal or empty option is selected:

            function clearOthers(LanguageForm) {
                //Set other radio buttons
                LanguageForm.termseq[0].checked = true;

[greenTara]

In the function "fillOthers", the maximal element is selected:

            function fillOthers(LanguageForm) {
                //Set other radio buttons
                LanguageForm.termseq[4].checked = true;

[greenTara]

The radio button selection is transformed into a portion of myng code in the function

            function get_ts(LanguageForm) {
                var ts = 0;
                for (var i = 0; i <= 4; i = i + 1) {
                    if (LanguageForm.termseq[i].checked) {
                			switch (i) {
                			    case 0:
                			        ts = 0;
                			        break;
                			    case 1:
                			        ts = 1;
                			        break;
                			    case 2:
                			        ts = 2;
                			        break;
                			    case 3:
                			        ts = 3;
                			        break;
                			    default:
                			        ts = 7;
                			        break;
                
                			}
                	 }
                }

              return ts;
            }

[greenTara]

In this function, the query string containing the myng code is built:

            function constructParams2(bb, df, ts, lng, propo, implies, terms, quant,
              expr, serial) {
                var params = "?";
                ...
                params = params + "&termseq=x" + ts.toString(16);

[greenTara]

In this function, the myng code is extracted from a complete query string:

            function myngCode(params) {
              // kind of inverse to multi-argument constructParams
              var code = "myng";
              //extract each parameter value from query string
             ...
              var ts = getParam(params, "termseq");
              ...
              code = code + "-a" + ts;

[greenTara]

In the function checkAll, interactions between selections can be created:

            function checkAll(LanguageForm) {
            ...
                // If quantification is allowed and
                // term sequences are variably polyadic, then
                // positional rest variables are available
                if (datalogAndUp && LanguageForm.termseq[4].checked) {
                    LanguageForm.quant2.removeAttribute('disabled');
                } else {
                    LanguageForm.quant2.checked = false;
                    LanguageForm.quant2.disabled = "disabled";
                }

[greenTara]

When adding new functionality to the MYNG GUI, it is necessary to coordinate with the MYNG PHP engine:

https://github.com/RuleML/deliberation-ruleml/blob/1.03-psoa/relaxng/schema_rnc.php

For example, the termseq segment of the myng code is utilized as follows:

$termseq_unary = 0;
$termseq_binary = 1;
$termseq_ternary_plus = 2;
...
  $enableTermseq_unary = extractBit($btermseq, $termseq_unary);
  $enableTermseq_binary = extractBit($btermseq, $termseq_binary);
  $enableTermseq_ternary_plus = extractBit($btermseq, $termseq_ternary_plus);

while the tuple features correspond to this:

$terms_tupdep = 14;
$terms_tup = 15;
...
  $needTupDep = extractBit($bterms, $terms_tupdep);
  ...
  $needTup = extractBit($bterms, $terms_tup);

[greenTara]

Tool suggestion:

1. Web developers have browser tools to help them develop both html and javascript. The local copy of the index.html file can be opened in a browser to make use of such tools, if you are comfortable with them.
2. Online checkers may be used:

• W3C Markup Validation https://validator.w3.org/
• https://validatejavascript.com/ (for example)

[greenTara]

Tests:

1. function initializeForm: when the page opens, certain options should be configured.
2. functions clearForm and fillForm: when Fill Form and Clear Form buttons are pressed, the maximal and minimal, resp. options are configured.
3. RNC and XSD fields: these should change whenever the configuration is changed. Check that the correct myng codes and anchor language names for PSOA configurations are displayed.
4. Interdependency in configuration tested: e.g. slotdep should only be enabled if the slot option is checked
5. Relax NG Query String URL, Equivalent Relax NG myng-code URL, XSD Anchor Schema URL should give correct URLs when PSOA configurations are selected.
6. The schema itself that this URL points to is not the responsibility of the MYNG GUI. An integration test (that includes testing of the MYNG PHP engine) is to examine the schema, e.g. shown when the Generate Schema button is pressed to see that the correct PSOA modules are included.
7. To test the Download XYZ Schema button, hover over it (don't press) to see that the URL is as expected.

[greenTara]

Anchor language functionality is implemented in this function:

        function anchorXSD(LanguageForm) {
            //bindatagroundfact_normal
            var bb = 1;
            var df = 7;
            var ts = 2;
            var lng = 1;
            var propo = parseInt("3cf", 16);
            var implies = 6;
            var terms = parseInt("f0f", 16);
            var quant = 1;
            var expr = 0;
            var serial = parseInt("4c", 16);
            var comp = compareTo(LanguageForm, bb, df, ts, lng, 
              propo, implies, terms, quant, expr, serial  );
            if ( comp) {
              return "bindatagroundfact_normal";
            }
            ...