extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2024-12-25 16:19:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

* Etemplate: Password widget improvements - suggest password button, added as custom field type (stored encrypted)

Browse Source
This commit is contained in:
nathangray 2020-06-12 10:56:44 -06:00
parent aab5415873
commit fb27dc66da
4 changed files with 474 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

253
api/js/etemplate/et2_widget_password.js Normal file
View File

@ -0,0 +1,253 @@
"use strict";
/**
* EGroupware eTemplate2 - JS Textbox object
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package etemplate
* @subpackage api
* @link http://www.egroupware.org
* @author Andreas Stöckel
*/
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
/*egw:uses
/vendor/bower-asset/jquery/dist/jquery.js;
et2_core_inputWidget;
et2_core_valueWidget;
*/
require("./et2_core_common");
var et2_core_inheritance_1 = require("./et2_core_inheritance");
var et2_core_widget_1 = require("./et2_core_widget");
var et2_widget_textbox_1 = require("./et2_widget_textbox");
var et2_widget_dialog_1 = require("./et2_widget_dialog");
/**
* Class which implements the "textbox" XET-Tag
*
* @augments et2_inputWidget
*/
var et2_password = /** @class */ (function (_super) {
__extends(et2_password, _super);
/**
* Constructor
*/
function et2_password(_parent, _attrs, _child) {
var _this =
// Call the inherited constructor
_super.call(this, _parent, _attrs, et2_core_inheritance_1.ClassWithAttributes.extendAttributes(et2_password._attributes, _child || {})) || this;
// The password is stored encrypted server side, and passed encrypted.
// This flag is for if we've decrypted the password to show it already
_this.encrypted = true;
return _this;
}
et2_password.prototype.createInputWidget = function () {
this.wrapper = jQuery(document.createElement("div"))
.addClass("et2_password");
this.input = jQuery(document.createElement("input"));
this.input.attr("type", "password");
// Make autocomplete default value off for password field
// seems browsers not respecting 'off' anymore and started to
// implement a new key called "new-password" considered as switching
// autocomplete off.
// https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
if (this.options.autocomplete === "" || this.options.autocomplete == "off")
this.options.autocomplete = "new-password";
if (this.options.size) {
this.set_size(this.options.size);
}
if (this.options.blur) {
this.set_blur(this.options.blur);
}
if (this.options.readonly) {
this.set_readonly(true);
}
this.input.addClass("et2_textbox")
.appendTo(this.wrapper);
this.setDOMNode(this.wrapper[0]);
if (this.options.value) {
this.set_value(this.options.value);
}
if (this.options.onkeypress && typeof this.options.onkeypress == 'function') {
var self = this;
this.input.on('keypress', function (_ev) {
return self.options.onkeypress.call(this, _ev, self);
});
}
this.input.on('change', function () {
this.encrypted = false;
}.bind(this));
// Show button is needed from start as you can't turn viewable on via JS
var attrs = {
class: "show_hide",
image: "visibility",
onclick: this.toggle_visibility.bind(this),
statustext: this.egw().lang("Show password")
};
if (this.options.viewable) {
this.show_button = et2_core_widget_1.et2_createWidget("button", attrs, this);
}
};
et2_password.prototype.getInputNode = function () {
return this.input[0];
};
/**
* Override the parent set_id method to manuipulate the input DOM node
*
* @param {type} _value
* @returns {undefined}
*/
et2_password.prototype.set_id = function (_value) {
_super.prototype.set_id.call(this, _value);
// Remove the name attribute inorder to affect autocomplete="off"
// for no password save. ATM seems all browsers ignore autocomplete for
// input field inside the form
if (this.options.autocomplete === "off")
this.input.removeAttr('name');
};
/**
* Set whether or not the password is allowed to be shown in clear text.
*
* @param viewable
*/
et2_password.prototype.set_viewable = function (viewable) {
this.options.viewable = viewable;
if (viewable) {
jQuery('.show_hide', this.wrapper).show();
}
else {
jQuery('.show_hide', this.wrapper).hide();
}
};
/**
* Turn on or off the suggest password button.
*
* When clicked, a password of the set length will be generated.
*
* @param length Length of password to generate. 0 to disable.
*/
et2_password.prototype.set_suggest = function (length) {
if (typeof length !== "number") {
length = typeof length === "string" ? parseInt(length) : (length ? et2_password.DEFAULT_LENGTH : 0);
}
this.options.suggest = length;
if (length && !this.suggest_button) {
var attrs = {
class: "generate_password",
image: "generate_password",
onclick: this.suggest_password.bind(this),
statustext: this.egw().lang("Suggest password")
};
this.suggest_button = et2_core_widget_1.et2_createWidget("button", attrs, this);
}
if (length) {
jQuery('.suggest', this.wrapper).show();
}
else {
jQuery('.suggest', this.wrapper).hide();
}
};
/**
* If the password is viewable, toggle the visibility.
* If the password is still encrypted, we'll ask for the user's password then have the server decrypt it.
*
* @param on
*/
et2_password.prototype.toggle_visibility = function (on) {
if (typeof on !== "boolean") {
on = this.input.attr("type") == "password";
}
if (!this.options.viewable) {
this.input.attr("type", "password");
return;
}
if (this.show_button) {
this.show_button.set_image(this.egw().image(on ? 'visibility_off' : 'visibility'));
}
// If we are not encrypted or not showing it, we're done
if (!this.encrypted || !on) {
this.input.attr("type", on ? "textbox" : "password");
return;
}
// Need username & password to decrypt
var callback = function (button, user_password) {
if (button == et2_widget_dialog_1.et2_dialog.CANCEL_BUTTON) {
return this.toggle_visibility(false);
}
var request = egw.json("EGroupware\\Api\\Etemplate\\Widget\\Password::ajax_decrypt", [user_password, this.options.value], function (decrypted) {
if (decrypted) {
this.encrypted = false;
this.input.val(decrypted);
this.input.attr("type", "textbox");
}
else {
this.set_validation_error(this.egw().lang("invalid password"));
window.setTimeout(function () {
this.set_validation_error(false);
}.bind(this), 2000);
}
}, this, true, this).sendRequest();
}.bind(this);
var prompt = et2_widget_dialog_1.et2_dialog.show_prompt(callback, this.egw().lang("Enter your password"), this.egw().lang("Authenticate"));
// Make the password prompt a password field
prompt.div.on("load", function () {
jQuery(prompt.template.widgetContainer.getWidgetById('value').getInputNode())
.attr("type", "password");
});
};
/**
* Ask the server for a password suggestion
*/
et2_password.prototype.suggest_password = function () {
// They need to see the suggestion
this.encrypted = false;
this.options.viewable = true;
this.toggle_visibility(true);
var suggestion = "Suggestion";
var request = egw.json("EGroupware\\Api\\Etemplate\\Widget\\Password::ajax_suggest", [this.options.suggest], function (suggestion) {
this.encrypted = false;
this.input.val(suggestion);
}, this, true, this).sendRequest();
};
et2_password.prototype.destroy = function () {
_super.prototype.destroy.call(this);
};
et2_password.prototype.getValue = function () {
return this.input.val();
};
et2_password._attributes = {
"autocomplete": {
"name": "Autocomplete",
"type": "string",
"default": "Off",
"description": "Whether or not browser should autocomplete that field: 'on', 'off', 'default' (use attribute from form). Default value is set to off."
},
"viewable": {
"name": "Viewable",
"type": "boolean",
"default": false,
"description": "Allow password to be shown"
},
"suggest": {
name: "Suggest password",
type: "integer",
default: 16,
description: "Suggest password length (0 for off)"
}
};
et2_password.DEFAULT_LENGTH = 16;
return et2_password;
}(et2_widget_textbox_1.et2_textbox));
exports.et2_password = et2_password;
et2_core_widget_1.et2_register_widget(et2_password, ["passwd"]);
//# sourceMappingURL=et2_widget_password.js.map

103
pixelegg/images/generate_password.svg Normal file
View File

@ -0,0 +1,103 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<?xml-stylesheet type="text/css" href="../less/svg.css" ?><svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
version="1.1"
id="Ebene_1"
x="0px"
y="0px"
width="32px"
height="32px"
viewBox="0 0 32 32"
enable-background="new 0 0 32 32"
xml:space="preserve"
sodipodi:docname="generate_password.svg"
inkscape:version="0.92.3 (2405546, 2018-03-11)"><metadata
id="metadata9"><rdf:RDF><cc:Work
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title /></cc:Work></rdf:RDF></metadata><defs
id="defs7" /><sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1025"
id="namedview5"
showgrid="false"
inkscape:zoom="15.405381"
inkscape:cx="13.822905"
inkscape:cy="5.1020933"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="Ebene_1" />
<path
fill="#696969"
d="M1.935,31h3.739c0.438,0,0.818-0.305,0.914-0.734l0.62-2.796l4.262-0.132c0.479-0.015,0.87-0.393,0.902-0.87 l0.248-3.572l3.549,0.079c0.409,0.01,0.775-0.246,0.907-0.634l1.081-3.182c0.852,0.33,1.881,0.622,3.411,0.622 c5.154,0,9.349-4.194,9.349-9.349s-4.194-9.349-9.349-9.349c-5.155,0-9.35,4.194-9.35,9.349c0,0.671,0.186,1.704,0.328,2.372 L1.232,25.707C1.082,25.88,1,26.1,1,26.325v3.74C1,30.581,1.42,31,1.935,31z M19.932,9.38c0-1.42,1.151-2.571,2.571-2.571 s2.571,1.151,2.571,2.571c0,1.42-1.151,2.571-2.571,2.571S19.932,10.8,19.932,9.38z"
id="path2" />
<rect
style="opacity:1;fill:#fffaff;fill-opacity:1;stroke:#696969;stroke-width:0.906;stroke-linejoin:miter;stroke-miterlimit:1;stroke-dasharray:none;stroke-opacity:1"
id="rect819"
width="29.689947"
height="9.8912907"
x="1.1500962"
y="11.822518" />
<g
id="g857"
transform="translate(-0.48269782,-0.04287953)"><text
id="text823"
y="21.991043"
x="7.0525784"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;line-height:125%;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke:none;stroke-width:0.6161896px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke-width:0.6161896px"
y="21.991043"
x="7.0525784"
id="tspan821"
sodipodi:role="line">*</tspan></text>
<text
id="text823-8"
y="21.991043"
x="13.334093"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;line-height:125%;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke:none;stroke-width:0.6161896px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke-width:0.6161896px"
y="21.991043"
x="13.334093"
id="tspan821-8"
sodipodi:role="line">*</tspan></text>
<text
id="text823-3"
y="21.991043"
x="19.615608"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;line-height:125%;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke:none;stroke-width:0.6161896px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke-width:0.6161896px"
y="21.991043"
x="19.615608"
id="tspan821-3"
sodipodi:role="line">*</tspan></text>
<text
id="text823-2"
y="21.991043"
x="25.897123"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;line-height:125%;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke:none;stroke-width:0.6161896px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:13.33333302px;font-family:'Courier 10 Pitch';-inkscape-font-specification:'Courier 10 Pitch, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:center;writing-mode:lr-tb;text-anchor:middle;fill:#696969;fill-opacity:1;stroke-width:0.6161896px"
y="21.991043"
x="25.897123"
id="tspan821-4"
sodipodi:role="line">*</tspan></text>
</g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.0 KiB

59
pixelegg/images/visibility.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="0 0 24 24"
fill="black"
width="18px"
height="18px"
version="1.1"
id="svg6"
sodipodi:docname="visibility.svg"
inkscape:version="0.92.3 (2405546, 2018-03-11)">
<metadata
id="metadata12">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1025"
id="namedview8"
showgrid="false"
inkscape:zoom="45.069444"
inkscape:cx="9"
inkscape:cy="9"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="svg6" />
<path
d="M0 0h24v24H0V0z"
fill="none"
id="path2" />
<path
d="M12 6c3.79 0 7.17 2.13 8.82 5.5C19.17 14.87 15.79 17 12 17s-7.17-2.13-8.82-5.5C4.83 8.13 8.21 6 12 6m0-2C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4zm0 5c1.38 0 2.5 1.12 2.5 2.5S13.38 14 12 14s-2.5-1.12-2.5-2.5S10.62 9 12 9m0-2c-2.48 0-4.5 2.02-4.5 4.5S9.52 16 12 16s4.5-2.02 4.5-4.5S14.48 7 12 7z"
id="path4"
style="fill:#696969;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

59
pixelegg/images/visibility_off.svg Normal file
View File

@ -0,0 +1,59 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="0 0 24 24"
fill="black"
width="18px"
height="18px"
version="1.1"
id="svg18"
sodipodi:docname="visibility_off.svg"
inkscape:version="0.92.3 (2405546, 2018-03-11)">
<metadata
id="metadata24">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs22" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1025"
id="namedview20"
showgrid="false"
inkscape:zoom="45.069444"
inkscape:cx="9"
inkscape:cy="9"
inkscape:window-x="0"
inkscape:window-y="27"
inkscape:window-maximized="1"
inkscape:current-layer="svg18" />
<path
d="M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z"
fill="none"
id="path14" />
<path
d="M12 6c3.79 0 7.17 2.13 8.82 5.5-.59 1.22-1.42 2.27-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5l2.61 2.61c-.04.01-.08.02-.12.02-1.38 0-2.5-1.12-2.5-2.5 0-.05.01-.08.01-.13zm-3.4-3.4l1.75 1.75c-.23.55-.36 1.15-.36 1.78 0 2.48 2.02 4.5 4.5 4.5.63 0 1.23-.13 1.77-.36l.98.98c-.88.24-1.8.38-2.75.38-3.79 0-7.17-2.13-8.82-5.5.7-1.43 1.72-2.61 2.93-3.53z"
id="path16"
style="fill:#696969;fill-opacity:1" />
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB