PHPackages                             atk14/extended-password-field - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. atk14/extended-password-field

ActiveLibrary[Utility & Helpers](/categories/utility)

atk14/extended-password-field
=============================

ExtendedPasswordField is a password field with a password reveal function and a password strength progress bar

0139↓92.9%PHP

Since Apr 9Pushed 2mo ago3 watchersCompare

[ Source](https://github.com/atk14/ExtendedPasswordField)[ Packagist](https://packagist.org/packages/atk14/extended-password-field)[ RSS](/packages/atk14-extended-password-field/feed)WikiDiscussions master Synced yesterday

READMEChangelogDependenciesVersions (1)Used By (0)

ExtendedPasswordField
=====================

[](#extendedpasswordfield)

ExtendedPasswordField is a password field with a password reveal function and a password strength progress bar.

The ExtendedPasswordField is intended to be used in ATK14 applications.

Installation
------------

[](#installation)

Just use the Composer:

```
cd path/to/your/atk14/project/
composer require atk14/extended-password-field

ln -s ../../vendor/atk14/extended-password-field/src/app/fields/extended_password_field.php app/fields/
ln -s ../../vendor/atk14/extended-password-field/src/app/widgets/extended_password_widget.php app/widgets/
ln -s ../../../vendor/atk14/extended-password-field/src/public/scripts/utils/extended_password_field.js public/scripts/utils/

ln -s ../../../vendor/atk14/extended-password-field/src/app/controllers/api/password_strength_analyzer_controller.php app/controllers/api/
ln -s ../../../vendor/atk14/extended-password-field/src/app/forms/api/password_strength_analyzer app/forms/api/

```

Link a proper style form either for or Bootstrap 4 (scss) or Bootstrap 3 (less).

```
# Bootstrap 4
ln -s ../../../vendor/atk14/extended-password-field/src/public/styles/shared/_extended_password_field.scss public/styles/shared/

# or Bootstrap 3
ln -s ../../../vendor/atk14/extended-password-field/src/public/styles/shared/extended_password_field.less public/styles/shared/

```

Include public/scripts/utils/extended\_password\_field.js in gulpfile.js into applicationScripts.

```
var applicationScripts = [
  // ...
  "public/scripts/utils/extended_password_field.js",
  "public/scripts/application.js"
];

```

Initialize the ExtendedPasswordField in the desired place in the public/scripts/application.js file.

```
// file: public/scripts/application.js

// ...

var
  UTILS = window.UTILS,

  APPLICATION = {
  // ...
  users {
    create_new: function() {
      UTILS.extended_password_field.init();
    }
  },
  // ...
};

// ...

```

Usage in an ATK14 application
-----------------------------

[](#usage-in-an-atk14-application)

In a form:

```