Allow the Autosubmit decorator being used on forms as well

refs #7935

library/Icinga/Web/Form.php

@@ -133,6 +133,15 @@ class Form extends Zend_Form
      */
     protected $descriptions;
 
+    /**
+     * Whether the Autosubmit decorator should be applied to this form
+     *
+     * If this is true, the Autosubmit decorator is being applied to this form instead of to each of its elements.
+     *
+     * @var bool
+     */
+    protected $useFormAutosubmit = false;
+
     /**
      * Authentication manager
      *
@@ -486,6 +495,31 @@ class Form extends Zend_Form
         return $this->descriptions;
     }
 
+    /**
+     * Set whether the Autosubmit decorator should be applied to this form
+     *
+     * If true, the Autosubmit decorator is being applied to this form instead of to each of its elements.
+     *
+     * @param   bool    $state
+     *
+     * @return  Form
+     */
+    public function setUseFormAutosubmit($state = true)
+    {
+        $this->useFormAutosubmit = (bool) $state;
+        return $this;
+    }
+
+    /**
+     * Return whether the Autosubmit decorator is being applied to this form
+     *
+     * @return  bool
+     */
+    public function getUseFormAutosubmit()
+    {
+        return $this->useFormAutosubmit;
+    }
+
     /**
      * Create this form
      *
@@ -647,20 +681,35 @@ class Form extends Zend_Form
         }
 
         if ($el->getAttrib('autosubmit')) {
+            if ($this->getUseFormAutosubmit()) {
+                $warningId = 'autosubmit_warning_' . $el->getId();
+                $warningText = $this->getView()->escape($this->translate(
+                    'Upon its value has changed, this control issues an automatic update of this page.'
+                ));
+                $autosubmitDecorator = $this->_getDecorator('Callback', array(
+                    'placement' => 'PREPEND',
+                    'callback'  => function ($content) use ($warningId, $warningText) {
+                        return '<span class="sr-only" id="' . $warningId . '">' . $warningText . '</span>';
+                    }
+                ));
+            } else {
                 $autosubmitDecorator = new Autosubmit();
                 $autosubmitDecorator->setAccessible();
+                $warningId = $autosubmitDecorator->getWarningId($el);
+            }
+
             $decorators = $el->getDecorators();
             $pos = array_search('Zend_Form_Decorator_ViewHelper', array_keys($decorators)) + 1;
             $el->setDecorators(
                 array_slice($decorators, 0, $pos, true)
-                + array(get_class($autosubmitDecorator) => $autosubmitDecorator)
+                + array('autosubmit' => $autosubmitDecorator)
                 + array_slice($decorators, $pos, count($decorators) - $pos, true)
             );
 
             if (($describedBy = $el->getAttrib('aria-describedby')) !== null) {
-                $el->setAttrib('aria-describedby', $describedBy . ' ' . $autosubmitDecorator->getWarningId($el));
+                $el->setAttrib('aria-describedby', $describedBy . ' ' . $warningId);
             } else {
-                $el->setAttrib('aria-describedby', $autosubmitDecorator->getWarningId($el));
+                $el->setAttrib('aria-describedby', $warningId);
             }
 
             $class = $el->getAttrib('class');
@@ -702,7 +751,7 @@ class Form extends Zend_Form
             if (($describedBy = $element->getAttrib('aria-describedby')) !== null) {
                 // Assume that it's because of the element being of type autosubmit or
                 // that one who did set the property manually removes the help decorator
-                // in case it has already an aria-requiredby property set
+                // in case it has already an aria-describedby property set
                 $element->setAttrib(
                     'aria-describedby',
                     $help->setAccessible()->getDescriptionId($element) . ' ' . $describedBy
@@ -909,8 +958,13 @@ class Form extends Zend_Form
                     'form'          => $this
                 ));
             } else {
-                $this->addDecorator('Description', array('tag' => 'h1'))
+                $this->addDecorator('Description', array('tag' => 'h1'));
-                    ->addDecorator('FormErrors', array('onlyCustomFormErrors' => true))
+                if ($this->getUseFormAutosubmit()) {
+                    $this->addDecorator('Autosubmit', array('accessible' => true))
+                        ->addDecorator('HtmlTag', array('tag' => 'div', 'class' => 'header'));
+                }
+
+                $this->addDecorator('FormErrors', array('onlyCustomFormErrors' => true))
                     ->addDecorator('FormDescriptions')
                     ->addDecorator('FormElements')
                     //->addDecorator('HtmlTag', array('tag' => 'dl', 'class' => 'zend_form'))

library/Icinga/Web/Form/Decorator/Autosubmit.php

@@ -3,15 +3,15 @@
 
 namespace Icinga\Web\Form\Decorator;
 
-use Zend_Form_Element;
 use Zend_Form_Decorator_Abstract;
 use Icinga\Application\Icinga;
 use Icinga\Web\View;
+use Icinga\Web\Form;
 
 /**
  * Decorator to add an icon and a submit button encapsulated in noscript-tags
  *
- * The icon is shown in JS environments to indicate that a specific form control does automatically request an update
+ * The icon is shown in JS environments to indicate that a specific form field does automatically request an update
  * of its form upon it has changed. The button allows users in non-JS environments to trigger the update manually.
  */
 class Autosubmit extends Zend_Form_Decorator_Abstract
@@ -21,7 +21,7 @@ class Autosubmit extends Zend_Form_Decorator_Abstract
      *
      * @var bool
      */
-    protected $accessible = false;
+    protected $accessible;
 
     /**
      * The id used to identify the auto-submit warning associated with the decorated form element
@@ -43,14 +43,28 @@ class Autosubmit extends Zend_Form_Decorator_Abstract
         return $this;
     }
 
+    /**
+     * Return whether a hidden <span> is being created with the same warning as in the icon label
+     *
+     * @return  bool
+     */
+    public function getAccessible()
+    {
+        if ($this->accessible === null) {
+            $this->accessible = $this->getOption('accessible') ?: false;
+        }
+
+        return $this->accessible;
+    }
+
     /**
      * Return the id used to identify the auto-submit warning associated with the decorated element
      *
-     * @param   Zend_Form_Element   $element    The element for which to generate a id
+     * @param   mixed   $element    The element for which to generate a id
      *
      * @return  string
      */
-    public function getWarningId(Zend_Form_Element $element = null)
+    public function getWarningId($element = null)
     {
         if ($this->warningId === null) {
             $element = $element ?: $this->getElement();
@@ -80,13 +94,18 @@ class Autosubmit extends Zend_Form_Decorator_Abstract
     public function render($content = '')
     {
         if ($content) {
-            $warning = t('Upon its value has changed, this control issues an automatic update of this page.');
+            $isForm = $this->getElement() instanceof Form;
+            $warning = $isForm
+                ? t('Upon any of this form\'s fields were changed, this page is being updated automatically.')
+                : t('Upon its value has changed, this field issues an automatic update of this page.');
             $content .= $this->getView()->icon('cw', $warning, array(
                 'aria-hidden'   => 'true',
                 'class'         => 'autosubmit-warning'
             ));
-            if ($this->accessible) {
+            if ($this->getAccessible()) {
-                $content = '<span id="' . $this->getWarningId() . '" class="sr-only">' . $warning . '</span>' . $content;
+                $content = $isForm
+                    ? $content . '<span id="' . $this->getWarningId() . '" class="sr-only">' . $warning . '</span>'
+                    : '<span id="' . $this->getWarningId() . '" class="sr-only">' . $warning . '</span>' . $content;
             }
 
             $content .= sprintf(
@@ -95,10 +114,13 @@ class Autosubmit extends Zend_Form_Decorator_Abstract
                 . ' class="noscript-apply"'
                 . ' type="submit"'
                 . ' value="1"'
-                . ($this->accessible ? ' aria-label="%1$s"' : '')
+                . ($this->getAccessible() ? ' aria-label="%1$s"' : '')
                 . ' title="%1$s"'
                 . '>%2$s</button></noscript>',
-                t('Push this button to update the form to reflect the change that was made in the control on the left'),
+                $isForm
+                    ? t('Push this button to update the form to reflect the changes that were made below')
+                    : t('Push this button to update the form to reflect the change'
+                        . ' that was made in the field on the left'),
                 $this->getView()->icon('cw') . t('Apply')
             );
         }

public/css/icinga/forms.less

@@ -228,3 +228,9 @@ form ul.descriptions {
     }
   }
 }
+
+form > div.header {
+  h1 {
+    display: inline-block;
+  }
+}