Add strength meter support to `PasswordFormField`
authorCyperghost <olaf_schmitz_1@t-online.de>
Thu, 24 Oct 2024 11:43:40 +0000 (13:43 +0200)
committerCyperghost <olaf_schmitz_1@t-online.de>
Thu, 24 Oct 2024 11:43:40 +0000 (13:43 +0200)
com.woltlab.wcf/templates/shared_passwordFormField.tpl
wcfsetup/install/files/lib/form/EmailNewActivationCodeForm.class.php
wcfsetup/install/files/lib/form/RegisterNewActivationCodeForm.class.php
wcfsetup/install/files/lib/system/form/builder/field/PasswordFormField.class.php

index 069dfd0b9d9a4b04b409eca6608264ccd395c037..d4d606da76288aa1e40236796d612c1ed2cce216 100644 (file)
        *}{if $field->getDocument()->isAjax()} data-dialog-submit-on-enter="true"{/if}{*
        *}{foreach from=$field->getFieldAttributes() key='attributeName' item='attributeValue'} {$attributeName}="{$attributeValue}"{/foreach}{*
 *}>
+
+{if $field->getStrengthMeter()}
+       <script data-relocate="true">
+               require(["WoltLabSuite/Core/Ui/User/PasswordStrength", "Language"], (PasswordStrength, Language) => {
+                       {include file='shared_passwordStrengthLanguage'}
+
+                       new PasswordStrength(document.getElementById('{unsafe:$field->getPrefixedId()|encodeJS}'), {
+                               relatedInputs: [
+                               {foreach from=$field->getRelatedFieldsIDs() item=fieldId}
+                                       document.getElementById('{unsafe:$fieldId|encodeJS}'),
+                               {/foreach}
+                               ],
+                       });
+               });
+       </script>
+{/if}
index 897c71734ad052d7f697a3c039bbd00c65108bf1..434089ea00282a60077b8045ac88c3ba10d0d945 100644 (file)
@@ -58,6 +58,7 @@ final class EmailNewActivationCodeForm extends AbstractFormBuilderForm
                         ->removeFieldClass('medium')
                         ->addFieldClass('long')
                         ->autocomplete('current-password')
+                        ->addMeterRelatedFieldId('username')
                         ->addValidator(new FormFieldValidator(
                             'passwordValidator',
                             $this->validatePassword(...)
index 5ab631fed78027a963265acc1dd65bff03d3df9d..6571e308874a7f935077a7802dc2d83dbe15b05f 100644 (file)
@@ -55,6 +55,8 @@ final class RegisterNewActivationCodeForm extends AbstractFormBuilderForm
                         ->required()
                         ->removeFieldClass('medium')
                         ->addFieldClass('long')
+                        ->addMeterRelatedFieldId('username')
+                        ->addMeterRelatedFieldId('email')
                         ->autocomplete('current-password')
                         ->addValidator(new FormFieldValidator(
                             'passwordValidator',
index 5837b52d06e042fec46d7797ea1b10f36a0831c0..aa74796d49271fb9be8f8ae569e6e37f182b9d85 100644 (file)
@@ -46,6 +46,16 @@ class PasswordFormField extends AbstractFormField implements
      */
     protected $templateName = 'shared_passwordFormField';
 
+    protected bool $strengthMeter = true;
+    /**
+     * @var IFormField[]
+     */
+    protected array $relatedFields = [];
+    /**
+     * @var string[]
+     */
+    protected array $relatedFieldsId = [];
+
     /**
      * Creates a new instance of `PasswordFormField`.
      */
@@ -95,6 +105,17 @@ class PasswordFormField extends AbstractFormField implements
         parent::validate();
     }
 
+    /**
+     * Sets if the password strength meter should be used to provide feedback
+     * to the user about the strength of their password.
+     */
+    public function passwordStrengthMeter(bool $passwordStrengthMeter = true): self
+    {
+        $this->strengthMeter = $passwordStrengthMeter;
+
+        return $this;
+    }
+
     /**
      * @inheritDoc
      */
@@ -110,4 +131,36 @@ class PasswordFormField extends AbstractFormField implements
     {
         return ['new-password', 'current-password'];
     }
+
+    public function addMeterRelatedField(IFormField $input): self
+    {
+        $this->relatedFields[] = $input;
+
+        return $this;
+    }
+
+    public function addMeterRelatedFieldId(string $fieldId): self
+    {
+        $this->relatedFieldsId[] = $fieldId;
+
+        return $this;
+    }
+
+    public function getStrengthMeter(): bool
+    {
+        return $this->strengthMeter;
+    }
+
+    /**
+     * @return string[]
+     */
+    public function getRelatedFieldsIDs(): array
+    {
+        $result = $this->relatedFieldsId;
+        foreach ($this->relatedFields as $field) {
+            $result[] = $field->getPrefixedId();
+        }
+
+        return $result;
+    }
 }