Issue backdrop#1895: [UX] Node edit/add form: Hide description and he…

…lp fields via `#states` backdrop/backdrop-issues#1895
klonos · May 26, 2019 · 608b6fd · 608b6fd
1 parent 8cc1953
commit 608b6fd
Showing 1 changed file with 51 additions and 7 deletions.
diff --git a/core/modules/node/node.types.inc b/core/modules/node/node.types.inc
@@ -100,7 +100,7 @@ function node_type_form($form, &$form_state, $type = NULL) {
     '#title' => t('Name'),
     '#type' => 'textfield',
     '#default_value' => $type->name,
-    '#description' => t('The human-readable name of this content type. This text will be displayed as part of the list on the <em>Add content</em> page. It is recommended that this name begin with a capital letter and contain only letters, numbers, and spaces. This name must be unique.'),
+    '#description' => t('The human-readable name of this content type; as to be displayed on the <a href="@url"><em>Add content</em></a> page. It is recommended that this name begins with a capital letter and contains only letters, numbers, and spaces. This name must be unique.', array('@url' => url('node/add'))),
     '#required' => TRUE,
     '#size' => 30,
   );
@@ -113,16 +113,36 @@ function node_type_form($form, &$form_state, $type = NULL) {
     '#machine_name' => array(
       'exists' => 'node_type_load',
     ),
-    '#description' => t('A unique machine-readable name for this content type. It must only contain lowercase letters, numbers, and underscores. This name will be used for constructing the URL of the %node-add page, in which underscores will be converted into hyphens.', array(
-      '%node-add' => t('Add content'),
-    )),
+    '#description' => t('A unique machine-readable name for this content type. It must only contain lowercase letters, numbers, and underscores. This name will be used for constructing the URL of the <a href="@url"><em>Add content</em></a> page, in which underscores will be converted into hyphens.', array('@url' => url('node/add'))),
   );
 
+  // Add a toggle for the "Description" field.
+  $form['description_enable'] = array(
+    '#type' => 'checkbox',
+    '#title' => t('Provide description'),
+    '#default_value' => isset($type->description) ? 1 : 0,
+  );
   $form['description'] = array(
-    '#title' => t('Description'),
     '#type' => 'textarea',
+    '#title' => t('Description'),
+    '#title_display' => 'invisible',
     '#default_value' => $type->description,
-    '#description' => t('Describe this content type. The text will be displayed on the <em>Add content</em> page.'),
+    '#states' => array(
+      'visible' => array(
+        ':input[name="description_enable"]' => array('checked' => TRUE),
+      ),
+    ),
+  );
+  // We need to implement the description as a separate form element, so that it
+  // is shown for both the checkbox and the text field.
+  $form['description_description'] = array(
+    '#type' => 'item',
+    // Fields of #type 'item' do not support #attributes, so we need to use
+    // #prefix and #suffix instead, in order to style this form item/text as
+    // help text.
+    '#prefix' => '<div class="description form-item-description">',
+    '#markup' => t('This text will be shown on the <a href="@url"><em>Add content</em></a> page.', array('@url' => url('node/add'))),
+    '#suffix' => '</div>',
   );
 
   $form['additional_settings'] = array(
@@ -153,12 +173,36 @@ function node_type_form($form, &$form_state, $type = NULL) {
     $form['submission']['title_label']['#description'] = t('This content type does not have a title field.');
     $form['submission']['title_label']['#required'] = FALSE;
   }
+
+  // Add a toggle for the "Explanation or submission guidelines" field.
+  $form['submission']['help_enable'] = array(
+    '#type' => 'checkbox',
+    '#title' => t('Provide explanation or submission guidelines'),
+    '#default_value' => isset($type->help) ? 1 : 0,
+  );
   $form['submission']['help']  = array(
     '#type' => 'textarea',
     '#title' => t('Explanation or submission guidelines'),
+    '#title_display' => 'invisible',
     '#default_value' => $type->help,
-    '#description' => t('This text will be displayed at the top of the page when creating or editing content of this type.'),
+    '#states' => array(
+      'visible' => array(
+        ':input[name="help_enable"]' => array('checked' => TRUE),
+      ),
+    ),
+  );
+  // We need to implement the description as a separate form element, so that it
+  // is shown for both the checkbox and the text field.
+  $form['submission']['help_description'] = array(
+    '#type' => 'item',
+    // Fields of #type 'item' do not support #attributes, so we need to use
+    // #prefix and #suffix instead, in order to style this form item/text as
+    // help text.
+    '#prefix' => '<div class="description form-item-description">',
+    '#markup' => t('This text will be displayed at the top of the page when creating or editing content of this type.'),
+    '#suffix' => '</div>',
   );
+
   $form['submission']['node_preview'] = array(
     '#type' => 'radios',
     '#title' => t('Preview before submitting'),