Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/jorgecasar/input-password

The input password that you allways want to use in your apps with sign in process now is real with Web Components
https://github.com/jorgecasar/input-password

Last synced: 30 days ago
JSON representation

The input password that you allways want to use in your apps with sign in process now is real with Web Components

Host: GitHub
URL: https://github.com/jorgecasar/input-password
Owner: jorgecasar
License: mit
Created: 2014-07-06T22:11:31.000Z (over 10 years ago)
Default Branch: master
Last Pushed: 2020-01-06T04:24:02.000Z (almost 5 years ago)
Last Synced: 2024-09-26T21:22:28.546Z (about 1 month ago)
Language: HTML
Homepage: http://jorgecasar.github.io/input-password/
Size: 1.91 MB
Stars: 22
Watchers: 5
Forks: 1
Open Issues: 6
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        [![NPM version](http://img.shields.io/npm/v/input-password.svg?style=flat)](http://npmjs.org/input-password)

[![NPM downloads](http://img.shields.io/npm/dm/input-password.svg?style=flat)](http://npmjs.org/input-password)

[![Package Quality](http://npm.packagequality.com/shield/input-password.png)](http://packagequality.com/#?package=input-password)

[![Build Status](https://secure.travis-ci.org/jorgecasar/input-password.svg?branch=master)](http://travis-ci.org/jorgecasar/input-password)

[![Dependency Status](https://david-dm.org/jorgecasar/input-password.svg?theme=shields.io)](https://david-dm.org/jorgecasar/input-password)

[![devDependency Status](https://david-dm.org/jorgecasar/input-password/dev-status.svg?theme=shields.io)](https://david-dm.org/jorgecasar/input-password#info=devDependencies)

# <input-password>

The input password with mobile features and possibility to see the password and more.

## Demo

[http://jorgecasar.github.io/input-password/](http://jorgecasar.github.io/input-password/)

## Install

Install the component using [Bower](http://bower.io/):

```sh

$ bower install input-password --save

```

Or [download as ZIP](https://github.com/jorgecasar/input-password/archive/gh-pages.zip).

## Usage

1. Import Web Components' polyfill:

	```html

	

	```

2. Import Custom Element:

	```html

	

	```

3. Start using it!

	```html

	

	```

### Options

Attribute     | Options    | Default   | Description

---           | ---        | ---       | ---

`name`        | *string*   | ``        | Specifies the input's name.

`value`       | *string*   | ``        | Specifies the input's value.

`visible`     | *boolean*  | `false`   | Specifies the visibility of the input's value.

`toggleText`  | *string*   | `Toggle`  | Specifies the text for the button that change the visibility.

`toggleClass` | *string*   | `visible` | Specifies the class that will have to be synthesized and spoken.

### Methods

Method          | Parameters     | Returns            | Description

---             | ---            | ---                | ---

`getShowText()` | None.          | Nothing.           | Get the button's show text.

`getHideText()` | None.          | Nothing.           | Get the button's hide text.

`showValue()`   | None.          | Nothing.           | Triggers the input value to be shown.

`hideValue()`   | None.          | Nothing.           | Triggers the input value to be hidden.

`toggle()`      | None.          | Nothing.           | Triggers the input value to be toggled.

### Events

Event         | Description

---           | ---

`onShowValue` | Triggers when the password is shown.

`onHideValue` | Triggers when the password is hidden.

[![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/jorgecasar/input-password/trend.png)](https://bitdeli.com/free "Bitdeli Badge")