Change webservice config to not have nested Pieforms (Bug #1397128)

The webservices config had a parent Pieform without <form> tags,
which was used solely for layout. Inside this it nested other Pieforms.
This caused problems due to the nested forms (fieldsets and legends
didn't work properly).

This patch replaces the parent Pieform with a Dwoo template to avoid
those problems.

Change-Id: Ic5b8fa935f403e1002669efa315627f110bcdcc3
Signed-off-by: Robert Lyon <robertl@catalyst.net.nz>

htdocs/auth/webservice/lang/en.utf8/auth.webservice.php

@@ -57,7 +57,7 @@ $string['disabled'] = 'disabled';
 $string['masterswitch'] = 'WebServices master switch';
 $string['formatdate'] = '';
 $string['protocolswitches'] = 'Switch On/Off Protocols';
-$string['manage_protocols'] = '<b>Enable or Disable protocols that are to be supported by this installation:</b>';
+$string['manage_protocols'] = 'Enable or Disable protocols that are to be supported by this installation:';
 $string['protocol'] = 'Protocol';
 $string['rest'] = 'REST';
 $string['soap'] = 'SOAP';
@@ -145,6 +145,8 @@ $string['webservices_title'] = 'Web Services Configuration';
 $string['headingusersearchtoken'] = 'WebServices: Token user search';
 $string['headingusersearchuser'] = 'WebServices: Service User search';
 $string['usersearchinstructions'] = 'Select a user to associate with a webservice by clicking on the avatar.  You can search for users by clicking on the initials of their first and last names, or by entering a name in the search box. You can also enter an email address in the search box if you would like to search email addresses.';
+$string['sha1fingerprint'] = 'SHA1 fingerprint';
+$string['md5fingerprint'] = 'MD5 fingerprint';
 
 // wsdoc
 $string['function'] = 'Function';

htdocs/lib/pieforms/pieform.php

@@ -803,7 +803,6 @@ class Pieform {/*{{{*/
             ));
             $result .= "<script type=\"text/javascript\">new Pieform($data);</script>\n";
         }
-
         return $result;
     }/*}}}*/
 

htdocs/lib/pieforms/pieform/renderers/multicolumntable.php

@@ -94,16 +94,14 @@ class FormRendererMultiColumnTable {/*{{{*/
                 $result .= ' class="' . Pieform::hsc($data['settings']['class']) . '"';
             }
             $result .= ">\n\t\t";
-
-            $result .= '<th>';
-            if (isset($data['settings']['title'])) {
+            if (!empty(trim($data['settings']['title']))) {
+                $result .= '<th>';
                 $result .= Pieform::hsc($data['settings']['title']);
+                if ($this->form->get_property('requiredmarker') && !empty($rawelement['rules']['required'])) {
+                    $result .= ' <span class="requiredmarker">*</span>';
+                }
+                $result .= "</th>\n\t";
             }
-            if ($this->form->get_property('requiredmarker') && !empty($rawelement['rules']['required'])) {
-                $result .= ' <span class="requiredmarker">*</span>';
-            }
-            $result .= "</th>\n\t";
-
             foreach ($data['builtelements'] as $k => $builtelement) {
                 $rawelement = $data['rawelements'][$k];
                 $result .= "\t<td";

htdocs/lib/pieforms/static/core/pieforms.js

@@ -144,7 +144,6 @@ function Pieform(data) {//{{{
         if (self.data.checkDirtyChange) {
             formchangemanager.add(self.data.name);
         }
-
         connect(self.data.name, 'onsubmit', self.processForm);
 
         self.connectSubmitButtons();

htdocs/theme/raw/auth/webservice/static/style/webservice.css

@@ -76,4 +76,30 @@ div.restdescription {
 
 span.response {
     color: #EA33A6;
+}
+
+.webserviceconfigcontrols {
+    width: 70px;
+    padding: 3px 0 0 5px;
+    white-space: nowrap;
+}
+
+.webserviceconfigcontrols form {
+    display: inline-block;
+    margin-left: 5px;
+}
+
+#webservices_function_groups_add_service {
+    margin-right: 3px;
+}
+
+.header {
+    border-bottom: 1px solid #ccc;
+    font-size: 1.167em;
+    color: #42637b;
+    line-height: 1.25em;
+    padding: 3px 5px;
+    text-align: left;
+    vertical-align: bottom;
+    font-weight: bold;
 }
\ No newline at end of file

htdocs/theme/raw/auth/webservice/templates/configform.tpl

+{foreach from=$form.elements item=element}
+    <div class="pseudofieldset collapsible collapsed">
+    <span class="pseudolegend"><h4><a href="">{$element.legend}</a></h4></span>
+    {foreach from=$element.elements item=item}
+        {$item.value|safe}
+    {/foreach}
+    </div>
+{/foreach}
+<div class="cl"></div>
+<script type="application/javascript">
+jQuery(function() {
+    jQuery('.pseudofieldset').each(function() {
+        var fieldset = jQuery(this);
+        var legend = fieldset.find('.pseudolegend').first();
+        var legendh4 = legend.find('h4').first();
+        legendh4.find('a').click(function(e) {
+            fieldset.toggleClass('collapsed');
+            var isCollapsed = fieldset.hasClass('collapsed');
+            if (!isCollapsed) {
+                fieldset.find(':input').not(':hidden').first().focus();
+            }
+            e.preventDefault();
+        });
+    });               
+});
+
+</script>
\ No newline at end of file

htdocs/theme/raw/static/style/style.css

@@ -594,7 +594,8 @@ label {
     font-weight: normal;
 }
 /* fieldset */
-fieldset {
+fieldset,
+.pseudofieldset {
     padding: 10px 15px;
     margin: 10px 0;
     border-radius: 10px;
@@ -606,7 +607,12 @@ fieldset.collapsible {
     padding: 10px 15px;
     margin: 5px 0;
 }
-fieldset.collapsed {
+.pseudofieldset.collapsible {
+    padding: 10px 15px;
+    margin: 30px 0;
+}
+fieldset.collapsed,
+.pseudofieldset.collapsed {
     padding: 0 15px;
     margin: 5px 0;
     border-left: 0;
@@ -616,6 +622,11 @@ fieldset.collapsed {
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
 }
+.pseudofieldset.collapsed {
+    clear: both;
+    margin-top: 30px;
+}
+
 .no-js fieldset.collapsed {
     padding: 10px 15px;
     border-radius: 10px;
@@ -624,9 +635,12 @@ fieldset.collapsed {
     border: 1px solid #d1d1d1;
 }
 fieldset.collapsed div,
-fieldset.collapsed table {
+fieldset.collapsed table,
+.pseudofieldset.collapsed div,
+.pseudofieldset.collapsed table,
+.pseudofieldset.collapsed pre {
     position: absolute;
-    display: none;
+    display: none !important;
     padding: 0;
     border: 0;
     margin: 0;
@@ -641,26 +655,43 @@ fieldset.collapsed table {
     padding: 0;
 }
 /* legend */
-legend {
+legend,
+.pseudolegend {
     font-weight: bold;
     font-size: 1.333em;
 }
-legend h4 {
+legend h4,
+.pseudolegend h4 {
     font-size: 1em;
     margin: 0;
 }
+.pseudofieldset .pseudolegend {
+    margin-top: -20px;
+    float: left;
+    padding: 0 2px;
+    background-color: #ffffff;
+}
+.pseudofieldset.collapsed .pseudolegend {
+    margin-top: -8px;
+}
 fieldset.collapsible legend {
     font-size: 1.167em;
 }
-fieldset.collapsible legend a {
+.pseudofieldset.collapsible .pseudolegend {
+    font-size: 1.0em;
+}
+fieldset.collapsible legend a,
+.pseudofieldset.collapsible .pseudolegend a {
     padding-left: 15px;
     background: url(../images/expanded.png) 0 center no-repeat;
     text-decoration: none;
 }
-fieldset legend a:hover {
+fieldset legend a:hover,
+.pseudofieldset .pseudolegend a:hover {
     text-decoration: none;
 }
-fieldset.collapsed legend a {
+fieldset.collapsed legend a,
+.pseudofieldset.collapsed .pseudolegend a {
     background: url(../images/expand.png) 0 center no-repeat;
 }
 .no-js fieldset.collapsed legend a {