tips: Add help tips for custom forms

include/i18n/en_US/help/tips/forms.yaml

+#
+# This is popup help messages for the Admin Panel -> Settings -> System page
+#
+# Fields:
+# title - Shown in bold at the top of the popover window
+# content - The body of the help popover
+# links - List of links shows below the content
+#   title - Link title
+#   href - href of link (links starting with / are translated to the
+#       helpdesk installation path)
+#
+# The key names such as 'helpdesk_name' should not be translated as they
+# must match the HTML #ids put into the page template.
+#
+---
+form_title:
+    title: Form Headline
+    content: >
+        This title text is shown in a gray box above the form fields
+
+form_instructions:
+    title: Form Instructions
+    content: >
+        You can add extra instructions which will help guide the user into
+        the context of the form fields and possibly highlight required data.
+
+field_sort:
+    title: Field Display Position
+    content: >
+        Click on the up-and-down arrow icon and drag the field row to sort
+        within this form. Sorting preference does not take effect until the
+        form is saved.
+
+field_label:
+    title: Field Label
+    content: >
+        This label is shown as the prompt for this field. Typically, a
+        short-answer field would be rendered like this one:<br>
+        <strong>Label:</strong>&nbsp; <input type="text">
+
+field_type:
+    title: Field Content Type
+    content: >
+        This is used to define the type of input expected from the user. You
+        can select from short and long answer, phone number, date and time,
+        checkbox, drop-down list, or a custom list selection.
+    links:
+      - title: Custom Lists
+        href: /scp/lists.php
+
+field_internal:
+    title: Field Visibility
+    content: >
+        Fields marked internal are hidden from your clients. Use internal
+        fields to track things which only your staff need to access.
+
+field_required:
+    title: Data Requirement
+    content: >
+        Forms that have required fields must have valid data before the form
+        can be saved. If checked, forms cannot be submitted or saved until all
+        required fields are satisfied.<br>
+        <br>
+        Internal fields can only be required of staff members, since they
+        are hidden from clients.
+
+field_variable:
+    title: Field Automation
+    content: >
+        The field data will be available to email and page templates via the
+        name used in this column. For instance, fields on the common ticket
+        form are available via <code>%{ticket.variable}</code>, where
+        <strong>variable</strong> is the name used in this column.<br>
+        <br>
+        <em>Company information is available via
+        <code>%{company.variable}</code> and user information is available
+        via <code>%{ticket.user.variable}</code></em>
+
+field_delete:
+    title: Remote this Field
+    content: >
+        Check and save the form to remove a field from this form.<br>
+        <br>
+        <em>Deleting a field does not remove previously entered data for the
+        field on completed forms. For instance, if a previously submitted
+        ticket has data for a field, deleting the field from this form will
+        not remove the data on the ticket.</em>

include/staff/dynamic-form.inc.php

@@ -31,16 +31,19 @@ $info=Format::htmlchars(($errors && $_POST)?$_POST:$info);
             </th>
         </tr>
     </thead>
-    <tbody>
+    <tbody style="vertical-align:top">
         <tr>
             <td width="180" class="required">Title:</td>
             <td><input type="text" name="title" size="40" value="<?php
-                echo $info['title']; ?>"/></td>
+                echo $info['title']; ?>"/>
+                <i class="help-tip icon-question-sign" href="#form_title"></i>
+            </td>
         </tr>
         <tr>
             <td width="180">Instructions:</td>
             <td><textarea name="instructions" rows="3" cols="40"><?php
                 echo $info['instructions']; ?></textarea>
+                <i class="help-tip icon-question-sign" href="#form_instructions"></i>
             </td>
         </tr>
     </tbody>
@@ -90,13 +93,20 @@ $info=Format::htmlchars(($errors && $_POST)?$_POST:$info);
             </th>
         </tr>
         <tr>
-            <th>Sort</th>
-            <th>Label</th>
-            <th>Type</th>
-            <th>Internal</th>
-            <th>Required</th>
-            <th>Variable</th>
-            <th>Delete</th>
+            <th nowrap>Sort
+                <i class="help-tip icon-question-sign" href="#field_sort"></i></th>
+            <th nowrap>Label
+                <i class="help-tip icon-question-sign" href="#field_label"></i></th>
+            <th nowrap>Type
+                <i class="help-tip icon-question-sign" href="#field_type"></i></th>
+            <th nowrap>Internal
+                <i class="help-tip icon-question-sign" href="#field_internal"></i></th>
+            <th nowrap>Required
+                <i class="help-tip icon-question-sign" href="#field_required"></i></th>
+            <th nowrap>Variable
+                <i class="help-tip icon-question-sign" href="#field_variable"></i></th>
+            <th nowrap>Delete
+                <i class="help-tip icon-question-sign" href="#field_delete"></i></th>
         </tr>
     </thead>
     <tbody class="sortable-rows" data-sort="sort-">
@@ -115,7 +125,7 @@ $info=Format::htmlchars(($errors && $_POST)?$_POST:$info);
                 <font class="error"><?php
                     if ($ferrors['label']) echo '<br/>'; echo $ferrors['label']; ?>
             </td>
-            <td><select name="type-<?php echo $id; ?>" <?php
+            <td nowrap><select name="type-<?php echo $id; ?>" <?php
                 if (!$fi->isChangeable()) echo 'disabled="disabled"'; ?>>
                 <?php foreach (FormField::allTypes() as $group=>$types) {
                         ?><optgroup label="<?php echo Format::htmlchars($group); ?>"><?php