Roo.apply(Pman.Dialog.BAdminStaffTwoFactorQRCode.prototype, {
_strings : {
- 'dc7b0c7f9d3941532bda06cd58eec7bd' :"<ol class='qr-list' start=\"1\">\n <li>Open Google Authenticator in your phone, and scan this QR code.</li>\n</ol>",
- '5d412a3d8de0189df31c8f331e2e6630' :"<ol class='qr-list' start=\"2\">\n <li>After adding this to Google Authenticator, type in the generated number below to confirm.</li>\n</ol>",
+ '1459eb538ddc78e1908bbd761a444395' :"1. Download an Authentication App on your phone, like \"<a href='#' class='download-google-authenticator' style='color:#337ab7;'>Google Authenticator</a>\" or \"<a href='#' class='download-authy' style='color:#337ab7;'>Authy</a>\" ",
+ 'e8e9a5b1083b253b726d1fa7f31176f5' :"2. After adding this to Authenticator app, type in the generated number below to confirm.",
+ '2194867d6c27ce97cd1f0a5db8d5c95e' :"Setup 2-Factor Authentication",
+ '22e960368d2513a40b7467ec143440cc' :"5. After adding this to Authenticator app, type in the generated number below to confirm.",
+ '131e3875e777f6c9a8e510f96a4d20d2' :"Skip for now",
+ 'f93dadd0b45b370c51bf80fb0a3eadfa' :"3. For the Account Name user \"{0}\"",
+ '8e5b55264e2acf73fb73b6a327bccd51' :"4. Enter the code below as \"Your Key\"",
+ '4141195b21d661e36e56d91f19d53273' :"2. In the App, select \"<b>Create or Setup an Account</b>\"",
'ea4788705e6873b424c65e91c2846b19' :"Cancel",
'ee468f72ab7fe4937fb014d6fcea540b' :"Enter Two factor Authentication code",
- 'c9cc8cce247e49bae79f15173ce97354' :"Save",
- '4674ee874911c910f2356ef9ec6ab7f9' :"Scan this into Google Authenticator"
+ '6d9785b18748c30bb3adbf7506f40202' :"1. Open Authenticator App in your phone, and scan this QR code.",
+ '780573538d031cf7387477f9ea3204f6' :"Copy Key",
+ '70d9be9b139893aa6c69b5e77e614311' :"Confirm"
+ },
+ _named_strings : {
+ 'two_factor_auth_code_fieldLabel' : 'ee468f72ab7fe4937fb014d6fcea540b' /* Enter Two factor Authentication code */
},
dialog : false,
var _this = this;
this.dialog = Roo.factory({
xtype : 'Modal',
- allow_close : false,
+ allow_close : true,
+ animate : false,
cls : 'enable-overflow coba-qr-dialog',
- title : _this._strings['4674ee874911c910f2356ef9ec6ab7f9'] /* Scan this into Google Authenticator */,
+ title : _this._strings['2194867d6c27ce97cd1f0a5db8d5c95e'] /* Setup 2-Factor Authentication */,
listeners : {
+ hide : function (_self)
+ {
+ if(_this.callback){
+ _this.callback.call(_this, false);
+ }
+
+ },
show : function (_self)
{
+ if(!Pman.Login.authUser) {
+ Roo.bootstrap.MessageBox.alert('Error', 'Please login again');
+ return;
+ }
+
+ if(
+ !_this.data.id ||
+ _this.data.id.length == 0
+ ) {
+ Roo.bootstrap.MessageBox.alert('Error', 'Please select a person again');
+ return;
+ }
+
+ _this.dialog.closeEl.hide();
+ _this.skipBtn.hide();
+ _this.cancelBtn.hide();
+
+ if(_this.data.allow_close) {
+ _this.dialog.closeEl.show();
+ _this.skipBtn.show();
+ }
+
+ if(_this.data.allow_cancel) {
+ _this.cancelBtn.show();
+ }
+
+ _this.desktopView.hide();
+ _this.mobileView.hide();
+
new Pman.Request({
url: baseURL + '/Roo/Core_person.php',
method : 'GET',
mask : 'Loading...',
params : {
- _to_qr_code : 1
+ _to_qr_code : 1,
+ id: _this.data.id
},
success : function(res) {
+ _this.qrcode_image.setSrc(res.data.image);
+ _this.secret.setValue(res.data.secret);
+ _this.issuer_notify.el.dom.innerHTML = String.format(_this.issuer_notify._html, res.data.issuer);
- _this.qrcode_image.setSrc(res.data);
+ _this.desktopView.show();
+ _this.mobileView.hide();
- return;
+ if(Roo.isTouch) {
+ _this.desktopView.hide();
+ _this.mobileView.show();
+ }
+ },
+
+ failure : function(res) {
+ Roo.log(res);
}
});
}
buttons : [
{
xtype : 'Button',
- html : _this._strings['ea4788705e6873b424c65e91c2846b19'] /* Cancel */,
+ html : _this._strings['131e3875e777f6c9a8e510f96a4d20d2'] /* Skip for now */,
weight : 'default',
listeners : {
click : function (_self, e)
{
-
_this.dialog.hide();
- //need to pass a flag
-
- if(_this.callback){
- _this.callback.call(_this);
- }
-
return;
+ },
+ render : function (_self)
+ {
+ _this.skipBtn = this;
}
},
xns : Roo.bootstrap,
},
{
xtype : 'Button',
- html : _this._strings['c9cc8cce247e49bae79f15173ce97354'] /* Save */,
- weight : 'primary',
+ html : _this._strings['ea4788705e6873b424c65e91c2846b19'] /* Cancel */,
+ weight : 'default',
listeners : {
click : function (_self, e)
{
-
_this.dialog.hide();
- if(_this.callback){
- _this.callback.call(_this);
- }
-
return;
+ },
+ render : function (_self)
+ {
+ _this.cancelBtn = this;
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ },
+ {
+ xtype : 'Button',
+ html : _this._strings['70d9be9b139893aa6c69b5e77e614311'] /* Confirm */,
+ weight : 'primary',
+ listeners : {
+ click : function (_self, e)
+ {
+ _this.form.doAction('submit');
}
},
xns : Roo.bootstrap,
items : [
{
xtype : 'Row',
+ listeners : {
+ render : function (_self)
+ {
+ _this.desktopView = this;
+ }
+ },
xns : Roo.bootstrap,
'|xns' : 'Roo.bootstrap',
items : [
'|xns' : 'Roo.bootstrap',
items : [
{
- xtype : 'Container',
- html : _this._strings['dc7b0c7f9d3941532bda06cd58eec7bd'] /*
- <ol class='qr-list' start="1">
- <li>Open Google Authenticator in your phone, and scan this QR code.</li>
-</ol>
- */ ,
- well : 'sm',
+ xtype : 'Row',
xns : Roo.bootstrap,
- '|xns' : 'Roo.bootstrap'
- }
- ]
- }
- ]
- },
- {
- xtype : 'Row',
- xns : Roo.bootstrap,
- '|xns' : 'Roo.bootstrap',
- items : [
- {
- xtype : 'Column',
- cls : 'text-center',
- xs : 12,
- xns : Roo.bootstrap,
- '|xns' : 'Roo.bootstrap',
- items : [
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['6d9785b18748c30bb3adbf7506f40202'] /* 1. Open Authenticator App in your phone, and scan this QR code. */,
+ well : 'sm',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
{
- xtype : 'Img',
- cls : 'qr-code',
- imgResponsive : false,
- src : 'about:blank',
- listeners : {
- render : function (_self)
- {
- _this.qrcode_image = this;
-
- this.el.setVisibilityMode(Roo.Element.DISPLAY);
-
- }
- },
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ cls : 'text-center',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Img',
+ cls : 'qr-code',
+ imgResponsive : false,
+ src : 'about:blank',
+ listeners : {
+ render : function (_self)
+ {
+ _this.qrcode_image = this;
+
+ this.el.setVisibilityMode(Roo.Element.DISPLAY);
+
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
xns : Roo.bootstrap,
- '|xns' : 'Roo.bootstrap'
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['e8e9a5b1083b253b726d1fa7f31176f5'] /* 2. After adding this to Authenticator app, type in the generated number below to confirm. */,
+ well : 'sm',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
}
]
}
},
{
xtype : 'Row',
+ listeners : {
+ render : function (_self)
+ {
+ _this.mobileView = this;
+ }
+ },
xns : Roo.bootstrap,
'|xns' : 'Roo.bootstrap',
items : [
'|xns' : 'Roo.bootstrap',
items : [
{
- xtype : 'Container',
- html : _this._strings['5d412a3d8de0189df31c8f331e2e6630'] /*
- <ol class='qr-list' start="2">
- <li>After adding this to Google Authenticator, type in the generated number below to confirm.</li>
-</ol>
- */ ,
- well : 'sm',
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['1459eb538ddc78e1908bbd761a444395'] /* 1. Download an Authentication App on your phone, like "<a href='#' class='download-google-authenticator' style='color:#337ab7;'>Google Authenticator</a>" or "<a href='#' class='download-authy' style='color:#337ab7;'>Authy</a>" */,
+ well : 'sm',
+ listeners : {
+ render : function (_self)
+ {
+ this.el.select('.download-google-authenticator', true).first().on('click', function(e){
+ e.preventDefault();
+
+ if(Roo.isIOS) {
+ window.open("https://itunes.apple.com/us/app/google-authenticator/id388497605?mt=8", "_blank");
+ return;
+ }
+
+ window.open("https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2", "_blank");
+ });
+
+ this.el.select('.download-authy', true).first().on('click', function(e){
+ e.preventDefault();
+
+ if(Roo.isIOS) {
+ window.open("https://itunes.apple.com/us/app/authy/id494168017?mt=8", "_blank");
+ return;
+ }
+
+ window.open("https://play.google.com/store/apps/details?id=com.ionicpremium.authy", "_blank");
+ });
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['4141195b21d661e36e56d91f19d53273'] /* 2. In the App, select "<b>Create or Setup an Account</b>" */,
+ well : 'sm',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
xns : Roo.bootstrap,
- '|xns' : 'Roo.bootstrap'
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ _html : _this._strings['f93dadd0b45b370c51bf80fb0a3eadfa'] /* 3. For the Account Name user "{0}" */,
+ html : _this._strings['f93dadd0b45b370c51bf80fb0a3eadfa'] /* 3. For the Account Name user "{0}" */,
+ well : 'sm',
+ listeners : {
+ render : function (_self)
+ {
+ _this.issuer_notify = this;
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['8e5b55264e2acf73fb73b6a327bccd51'] /* 4. Enter the code below as "Your Key" */,
+ well : 'sm',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Input',
+ name : 'secret',
+ readOnly : true,
+ listeners : {
+ render : function (_self)
+ {
+ _this.secret = this;
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ },
+ {
+ xtype : 'Column',
+ cls : 'text-center',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Button',
+ html : _this._strings['780573538d031cf7387477f9ea3204f6'] /* Copy Key */,
+ preventDefault : true,
+ size : 'sm',
+ style : 'margin-bottom: 15px;',
+ listeners : {
+ click : function (_self, e)
+ {
+ var el = _this.secret.inputEl().dom;
+
+ if (document.body.createTextRange) {
+ // IE
+ var textRange = document.body.createTextRange();
+ textRange.moveToElementText(el);
+ textRange.select();
+ textRange.execCommand("Copy");
+ } else if (window.getSelection && document.createRange) {
+ // Non-IE
+ var editable = el.contentEditable; // Record contentEditable status of element
+ var readOnly = el.readOnly; // Record readOnly status of element
+ el.contentEditable = true; // iOS will only select text on non-form elements if contentEditable = true;
+ el.readOnly = false; // iOS will not select in a read only form element
+ var range = document.createRange();
+ range.selectNodeContents(el);
+ var sel = window.getSelection();
+ sel.removeAllRanges();
+ sel.addRange(range); // Does not work for Firefox if a textarea or input
+
+ if (el.nodeName == "TEXTAREA" || el.nodeName == "INPUT") {
+ el.select(); // Firefox will only select a form element with select()
+ }
+
+ if (el.setSelectionRange && navigator.userAgent.match(/ipad|ipod|iphone/i)) {
+ el.setSelectionRange(0, 999999); // iOS only selects "form" elements with SelectionRange
+ }
+
+ el.contentEditable = editable; // Restore previous contentEditable status
+ el.readOnly = readOnly; // Restore previous readOnly status
+
+ document.execCommand('copy');
+ }
+ }
+ },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ xtype : 'Row',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Column',
+ xs : 12,
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap',
+ items : [
+ {
+ xtype : 'Container',
+ html : _this._strings['22e960368d2513a40b7467ec143440cc'] /* 5. After adding this to Authenticator app, type in the generated number below to confirm. */,
+ well : 'sm',
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ }
+ ]
+ }
+ ]
}
]
}
items : [
{
xtype : 'Form',
+ method : 'GET',
+ url : baseURL + '/Roo/Core_person.php',
listeners : {
actioncomplete : function (_self, action)
{
this.clearInvalid();
}
+
+ if(action.type == 'submit') {
+
+ switch(action.result.data) {
+
+ case 'DONE':
+ var cb = function() {
+ _this.dialog.hide();
+ };
+
+ Roo.bootstrap.MessageBox.alert('Success', 'Two Factor authentication has been enabled', cb);
+ return;
+
+ default:
+ Roo.log('invalid usage');
+ break;
+ }
+ }
+ },
+ actionfailed : function (_self, action)
+ {
+ if(action.type == 'submit') {
+
+ switch(action.result.errorMsg) {
+ case '_invalid_auth_code':
+ Roo.bootstrap.MessageBox.alert(
+ 'Invalid authentication code',
+ 'Please re-enter the latest authentication code.'
+ );
+ break;
+ default:
+ Roo.log('invalid usage');
+ break;
+ }
+ }
},
render : function (_self)
{
fieldLabel : _this._strings['ee468f72ab7fe4937fb014d6fcea540b'] /* Enter Two factor Authentication code */,
indicatorpos : 'right',
labelAlign : 'top',
+ maxLength : 6,
+ name : 'two_factor_auth_code',
xs : 12,
- listeners : {
- valid : function (_self)
- {
- if(this.getValue().length !== 6) {
- this.markInvalid('The authentication code should be in 6 digits');
- }
- }
- },
+ xns : Roo.bootstrap,
+ '|xns' : 'Roo.bootstrap'
+ },
+ {
+ xtype : 'Input',
+ inputType : 'hidden',
+ name : 'id',
xns : Roo.bootstrap,
'|xns' : 'Roo.bootstrap'
}