Add mobile QR code screen
diff --git a/browser/bower.json b/browser/bower.json
index 2d4f014..80e55f4 100644
--- a/browser/bower.json
+++ b/browser/bower.json
@@ -7,7 +7,7 @@
],
"dependencies": {
"milagro-crypto": "https://github.com/miracl/milagro-crypto.git#1.0.0",
- "milagro-mfa-js-lib": "https://github.com/miracl/milagro-mfa-js-lib.git#1.0.0",
+ "milagro-mfa-js-lib": "https://github.com/miracl/milagro-mfa-js-lib.git#1.1.0",
"qrcodejs": "0.1.0",
"handlebars": "~3.0.3"
},
diff --git a/browser/js/mpin.js b/browser/js/mpin.js
index 5b89da0..acf8429 100644
--- a/browser/js/mpin.js
+++ b/browser/js/mpin.js
@@ -21,10 +21,9 @@
(function () {
"use strict";
- var lang = {}, hlp = {}, loader, MPIN_URL_BASE, IMAGES_PATH, CSS_FILENAME, TEMPLATE_NAME;
+ var lang = {}, hlp = {}, loader, MPIN_URL_BASE, IMAGES_PATH, CSS_FILENAME;
MPIN_URL_BASE = "%URL_BASE%";
- TEMPLATE_NAME = "%TEMPLATE_NAME%";
- IMAGES_PATH = MPIN_URL_BASE + "/images/" + TEMPLATE_NAME + "/";
+ IMAGES_PATH = MPIN_URL_BASE + "/images/";
CSS_FILENAME = "main.css";
@@ -439,7 +438,6 @@
this.mpinLib.cancelMobileAuth();
};
- // Access NUMBER
mpin.prototype.renderMobile = function () {
var callbacks = {}, self = this;
@@ -454,6 +452,43 @@
self.clrInterval.call(self);
self.renderHome.call(self, evt);
};
+
+ callbacks.mpin_action_setup = function () {
+ self.clrInterval.call(self);
+ if (self.opts.mobileConfigURL) {
+ self.renderMobileConfig.call(self);
+ } else {
+ self.renderMobileSetup.call(self);
+ }
+ };
+
+ callbacks.mpin_desktop = function () {
+ self.clrInterval.call(self);
+ self.renderDesktop.call(self);
+ };
+
+ this.render("mobile-qr", callbacks, {mobileOnly: !this.opts.mobileOnly});
+
+ setTimeout(function () {
+ self.getQrParams.call(self);
+ }, 0);
+ };
+
+ // Access NUMBER
+ mpin.prototype.renderMobileAN = function () {
+ var callbacks = {}, self = this;
+
+ this.clrInterval();
+
+ if (this.opts.requestOTP === "1") {
+ this.renderMobileSetup();
+ return;
+ }
+
+ callbacks.mpin_home = function (evt) {
+ self.clrInterval.call(self);
+ self.renderHome.call(self, evt);
+ };
callbacks.mpin_action_setup = function () {
self.clrInterval.call(self);
if (self.opts.mobileConfigURL) {
@@ -488,6 +523,8 @@
}, 0);
};
+
+
mpin.prototype.renderHelp = function (tmplName, callbacks, tmplData) {
var k, self = this;
tmplData = tmplData || {};
@@ -984,6 +1021,27 @@
this.clrInterval.call(this);
};
+ mpin.prototype.getQrParams = function () {
+ var self = this;
+ this.mpinLib.getQrUrl("", function (err, data) {
+ var qrElem, expireAfter;
+ if (err) {
+ self.error(4010);
+ }
+
+ var qrElem = document.getElementById("mp_qrcode");
+ new QRCode(qrElem, {
+ text: data.qrUrl,
+ width: 158,
+ height: 158
+ });
+
+ expireAfter = data.ttlSeconds;
+
+ self._getAccess.call(self, expireAfter);
+ });
+ };
+
mpin.prototype.getAccessNumber = function () {
var self = this, drawTimer, timerEl, timer2d, totalSec, timerExpire, expire;
@@ -1335,7 +1393,7 @@
};
mpin.prototype.renderSetupDone = function () {
var callbacks = {}, self = this, userId;
- userId = this.readIdentity() || this.identity;
+ userId = this.readIdentity() || this.identity;
callbacks.mpin_home = function () {
self.renderHome.call(self);
};
@@ -2302,6 +2360,7 @@
"signin_btn_mobile1": "Sign in with Smartphone",
"signin_mobile_btn_text": "Sign in with your Smartphone",
"signin_mobile_header": "Sign in with your phone",
+ "scan_mobile_header": "Scan with the M-Pin app",
"signin_mobile_btn_text2": "Sign in with phone",
"signin_button_mobile": "Sign in with Phone",
"signin_btn_mobile2": "(This is a PUBLIC device I DO NOT trust)",
diff --git a/browser/themes/milagro/sass/_template.scss b/browser/themes/milagro/sass/_template.scss
index e956bb0..d9dfd9d 100644
--- a/browser/themes/milagro/sass/_template.scss
+++ b/browser/themes/milagro/sass/_template.scss
@@ -367,6 +367,13 @@
@mixin buttons-box() {
padding: 5% 5%;
z-index: 99;
+
+ .qrCodeArea {
+ width: 160px;
+ height: 160px;
+ display: block;
+ margin: 0 auto 20px;
+ }
}
@mixin mpin-input-field () {
diff --git a/browser/themes/milagro/views/mobile-qr.handlebars b/browser/themes/milagro/views/mobile-qr.handlebars
new file mode 100644
index 0000000..8109e1d
--- /dev/null
+++ b/browser/themes/milagro/views/mobile-qr.handlebars
@@ -0,0 +1,33 @@
+<div class="mpinHeader mpMobileColor">
+ <div class="mpinLogo"></div>
+ <div class="mpinHome mpPointer" id="mpin_home"></div>
+</div>
+
+<div class="mpinHeaderBig mpPaddTop10 mpPaddBot10 mpMobColor">
+ {{txt "scan_mobile_header"}}
+</div>
+
+<div class="mpinMain mpNoHeight">
+ <div class="mpinBtnBox mpNoPadding">
+
+ <span id="mp_qrcode" class="qrCodeArea">
+ </span>
+
+ <div class="mpinButton mpinMobileBtn mpinBtnClick" id="mpin_action_setup">
+ {{txt "mobile_button_setup"}}
+ </div>
+
+ {{#if data.mobileOnly }}
+ <div class="mpinButton mpinButtonDark mpinBtnClick" id="mpin_desktop">
+ {{txt "mobile_button_signin2"}}
+ </div>
+ {{/if}}
+
+ </div>
+</div>
+
+
+<div class="mpinFooter mpMobileFooter">
+ <div class="mpinPowered"></div>
+ <div class="mpinHelpHub"></div>
+</div>
\ No newline at end of file
