passwordComponent.js

'use strict';

var m = require('mithril');
var icons = require('client/utils/icons');

function controller() {
  var scope = {
    isPasswordVisible: false,
    showPassword: function() {
      scope.isPasswordVisible = true;
    },
    hidePassword: function() {
      scope.isPasswordVisible = false;
    }
  };
  return scope;
}

function view(scope, obj, field) {
  return m('.password', {
    key: 'password'
  }, [
    m('input.form-input.field-' + field.attribute, {
      type: scope.isPasswordVisible ? 'text' : 'password',
      name: field.attribute,
      oninput: field.oninput,
      value: obj[field.attribute] || '',
      placeholder: field.placeholder || ''
    }),
    m('.reveal', {
      onmouseover: scope.showPassword,
      onmouseout: scope.hidePassword
    }, icons('eye'))
  ]);
}

module.exports = {
  controller: controller,
  view: view
};