git.roojs.org Git - roojs1/blob - Roo/bootstrap/form/Password.js

   1 /**
   2  * @class Roo.bootstrap.form.Password
   3  * @extends Roo.bootstrap.form.Input
   4  * Bootstrap Password class
   5  *
   6  *
   7  *
   8  *
   9  * @constructor
  10  * Create a new Password
  11  * @param {Object} config The config object
  12  */
  13
  14 Roo.bootstrap.form.Password = function(config){
  15     Roo.bootstrap.form.Password.superclass.constructor.call(this, config);
  16
  17     this.inputType = 'password';
  18 };
  19
  20 Roo.extend(Roo.bootstrap.form.Password, Roo.bootstrap.form.Input, {
  21
  22     getAutoCreate : function()
  23     {
  24         this.after = {
  25             xns : Roo.bootstrap,
  26             xtype : 'Button',
  27             cls : 'password-toggle'
  28         };
  29
  30         return Roo.bootstrap.form.Password.superclass.getAutoCreate.call(this);
  31     },
  32
  33     initEvents : function()
  34     {
  35         Roo.bootstrap.form.Password.superclass.initEvents.call(this);
  36
  37         this.el.addClass('form-password');
  38
  39         this.toggleEl().addClass('password-hidden');
  40
  41         this.toggleEl().on('click', this.onToggleClick, this);;
  42     },
  43
  44     toggleEl: function()
  45     {
  46         return this.el.select('button.password-toggle',true).first();
  47     },
  48
  49     onToggleClick : function(e)
  50     {
  51         var input = this.inputEl();
  52         var toggle = this.toggleEl();
  53
  54         toggle.removeClass(['password-visible', 'password-hidden']);
  55
  56         if(input.attr('type') == 'password') {
  57             input.attr('type', 'text');
  58             toggle.addClass('password-visible');
  59         }
  60         else {
  61             input.attr('type', 'password');
  62             toggle.addClass('password-hidden');
  63         }
  64     }
  65 });