MDL-9239 New fromslib password element with reveal option

lang/en_utf8/form.php

@@ -16,6 +16,7 @@ $string['nonexistentformelements'] = 'Trying to add help buttons to nonexistent
 $string['requiredelement'] = 'Required field';
 $string['general'] = 'General';
 $string['optional'] = 'Optional';
+$string['revealpassword'] = 'Reveal';
 $string['modstandardels']='Common Module Settings';
 $string['miscellaneoussettings']='Miscellaneous Settings';
 $string['addfields']='Add $a fields to form';

lib/form/passwordreveal.php

@@ -0,0 +1,33 @@
+<?php
+if (!defined('MOODLE_INTERNAL')) {
+    die('Direct access to this script is forbidden.');    ///  It must be included from a Moodle page
+}
+
+global $CFG;
+require_once($CFG->libdir.'/form/password.php');
+
+/**
+ * HTML class for a password type element with reveal option
+ *
+ * @author       Petr Skoda
+ * @access       public
+ */
+class MoodleQuickForm_passwordreveal extends MoodleQuickForm_password {
+
+    function toHtml() {
+        if ($this->_flagFrozen) {
+            return $this->getFrozenHtml();
+        } else {
+            $id = $this->getAttribute('id');
+            $reveal = get_string('revealpassword', 'form');
+            $revealjs = '<script type="text/javascript">
+//<![CDATA[
+document.write(\'<div class="reveal"><input id="'.$id.'reveal" value="1" type="checkbox" onclick="revealPassword(\\\''.$id.'\\\')"/><label for="'.$id.'reveal">'.addslashes_js($reveal).'<\/label><\/div>\');
+//]]>
+</script>';
+            return $this->_getTabs() . '<input' . $this->_getAttrString($this->_attributes) . ' />'.$revealjs;
+        }
+    } //end func toHtml
+
+}
+?>

lib/formslib.php

@@ -1585,6 +1585,7 @@ MoodleQuickForm::registerElementType('checkbox', "$CFG->libdir/form/checkbox.php
 MoodleQuickForm::registerElementType('file', "$CFG->libdir/form/file.php", 'MoodleQuickForm_file');
 MoodleQuickForm::registerElementType('group', "$CFG->libdir/form/group.php", 'MoodleQuickForm_group');
 MoodleQuickForm::registerElementType('password', "$CFG->libdir/form/password.php", 'MoodleQuickForm_password');
+MoodleQuickForm::registerElementType('passwordreveal', "$CFG->libdir/form/passwordreveal.php", 'MoodleQuickForm_passwordreveal');
 MoodleQuickForm::registerElementType('radio', "$CFG->libdir/form/radio.php", 'MoodleQuickForm_radio');
 MoodleQuickForm::registerElementType('select', "$CFG->libdir/form/select.php", 'MoodleQuickForm_select');
 MoodleQuickForm::registerElementType('text', "$CFG->libdir/form/text.php", 'MoodleQuickForm_text');

lib/javascript-static.js

@@ -280,6 +280,34 @@ function showAdvancedOnClick(button, hidetext, showtext){
     return false;
 }
 
+function revealPassword(id) {
+  var pw = document.getElementById(id);
+  var chb = document.getElementById(id+'reveal');
+
+  try {
+    // first try IE way - it can not set name attribute later
+    if (chb.checked) {
+      var newpw = document.createElement('<input type="text" name="'+pw.name+'">');
+    } else {
+      var newpw = document.createElement('<input type="password" name="'+pw.name+'">');
+    }
+  } catch (e) {
+    var newpw = document.createElement('input');
+    newpw.setAttribute('name', pw.name);
+    if (chb.checked) {
+      newpw.setAttribute('type', 'text');
+    } else {
+      newpw.setAttribute('type', 'password');
+    }
+  }
+  newpw.id = pw.id;
+  newpw.size = pw.size;
+  newpw.onblur = pw.onblur;
+  newpw.onchange = pw.onchange;
+  newpw.value = pw.value;
+  pw.parentNode.replaceChild(newpw, pw);
+}
+
 /*
     elementToggleHide (element, elementFinder)
 

theme/standard/styles_layout.css

@@ -553,6 +553,14 @@ form.mform div.error,form.mform fieldset.error {
 form.mform .fcheckbox input {
   margin-left: 0px;
 }
+form.mform .fpassword .reveal {
+  display:inline;
+}
+form.mform .fpassword .reveal input {
+  margin-left:5px;
+  margin-right:3px;
+}
+
 form#adminsettings div.htmlarea {
   clear: left;
   padding-top: 5px;