File -> edit: change Allow comment checkbox to switchbox

Bug 1431569

This was a bit trickier as the form field is hardcoded so needed to
fetch the css that pieforms adds to html header and add it via smarty()

Deals with the filebrowser in content/groups/institution/site

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

htdocs/lib/form/elements/filebrowser.php

@@ -1490,6 +1490,11 @@ function pieform_element_filebrowser_get_headdata($element) {
         $headdata[] = '<link href="' . get_config('wwwroot') . 'js/dropzone/css/dropzone.css" type="text/css" rel="stylesheet">';
         $headdata[] = '<script type="application/javascript" src="' . get_config('wwwroot') . 'artefact/file/js/filedropzone.js"></script>';
     }
+    if ($element['config']['edit']) {
+        // Add switchbox css if filebrowser is allowed to edit
+        require_once(get_config('docroot') . 'lib/form/elements/switchbox.php');
+        $headdata[] = join(' ', pieform_element_switchbox_get_headdata($element));
+    }
     $strings = PluginArtefactFile::jsstrings('filebrowser');
     $jsstrings = '';
     foreach ($strings as $section => $sectionstrings) {

htdocs/theme/raw/artefact/file/templates/form/editfile.tpl

@@ -62,8 +62,15 @@
 {/if}
           {license_form_files($prefix, 'edit')}
           <tr>
-            <th><label for="{$prefix}_edit_allowcomments">{str tag=allowcomments section=artefact.comment}</label></th>
-            <td><input type="checkbox" name="{$prefix}_edit_allowcomments" id="{$prefix}_edit_allowcomments" {if $fileinfo->allowcomments}checked {/if}/></td>
+            <th><label for="{$prefix}_edit_allowcomments">{str tag=Comments section=artefact.comment}</label></th>
+            <td><div class="form-switch ">
+                    <div class="switch onoff"><input class="switchbox" type="checkbox" name="{$prefix}_edit_allowcomments" id="{$prefix}_edit_allowcomments" {if $fileinfo->allowcomments}checked {/if}/>
+                    <label for="{$prefix}_edit_allowcomments" class="switch-label">
+                        <span class="switch-inner"></span>
+                        <span class="switch-switch"></span>
+                    </label>
+                    </div>
+                </div></td>
           </tr>
           <tr>
           	<td></td>

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

@@ -57,7 +57,7 @@
     color: #FFFFFF;
 }
 .form-switch .switch-inner:after {
-    content: "NYET";
+    content: "OFF";
     padding-right: 10px;
     background-color: #BFBFBF;
     color: #000000;