Skip to content

Commit 3db9d08

Browse files
eisbilireisbilir
authored
Merge pull request #324 from topcoder-platform/dice_new_flow
Dice new flow
2 parents b3dd96f + 83d6543 commit 3db9d08

File tree

6 files changed

+243
-35
lines changed

6 files changed

+243
-35
lines changed

‎build.sh‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,9 @@ SIGNUPFILENAME="./web-assets/js/signup.js"
1212
perl -pi -e "s/\{\{DOMAIN\}\}/$DOMAIN/g" $SIGNUPFILENAME
1313
perl -pi -e "s/\{\{AUTH0DOMAIN\}\}/$AUTH0DOMAIN/g" $SIGNUPFILENAME
1414

15-
CHECKEMAIL="./web-assets/static-pages/check_email.html"
15+
CHECKEMAIL="./web-assets/js/check_email.js"
1616
perl -pi -e "s/\{\{DOMAIN\}\}/$DOMAIN/g" $CHECKEMAIL
17+
perl -pi -e "s/\{\{AUTH0DOMAIN\}\}/$AUTH0DOMAIN/g" $CHECKEMAIL
1718

1819
OTPFILENAME="./web-assets/js/otp.js"
1920
perl -pi -e "s/\{\{DOMAIN\}\}/$DOMAIN/g" $OTPFILENAME

‎web-assets/css/styles.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -295,6 +295,7 @@ select::-ms-expand {
295295
list-style: none;
296296
list-style-image: url(./images/arrow.svg);
297297
margin: 0px;
298+
padding-left: 15px;
298299
}
299300

300301
.checkemail-card.center-align-card .page-content .page-main .page-description ul li {
@@ -675,6 +676,14 @@ select::-ms-expand {
675676
width: 20px;
676677
}
677678

679+
.messages .message.notify {
680+
background-color: #079531b8;
681+
color: #ffffff;
682+
}
683+
.messages .message.notify:before {
684+
content: "\2713";
685+
}
686+
678687
/** Desktop + tab - specific CSS **/
679688
@media (min-width: 768px) {
680689
.center-align-card .page-content {

‎web-assets/js/check_email.js‎

Lines changed: 156 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,156 @@
1+
var qs = (function (a) {
2+
if (a == "") return {};
3+
var b = {};
4+
for (var i = 0; i < a.length; ++i) {
5+
var p = a[i].split("=", 2);
6+
if (p.length == 1) b[p[0]] = "";
7+
else b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
8+
}
9+
return b;
10+
})(window.location.search.substr(1).split("&"));
11+
$(document).ready(function () {
12+
window.history.forward();
13+
const resendToken = qs["resendToken"];
14+
const canResend = qs["canResend"];
15+
const userId = qs["userId"];
16+
let formAction = qs["formAction"] || "#";
17+
const opt1 = 'https://auth.{{DOMAIN}}/continue';
18+
const opt2 = 'https://{{AUTH0DOMAIN}}/continue';
19+
if (!formAction.startsWith(opt1) && !formAction.startsWith(opt2)) {
20+
// looks like XSS attack
21+
formAction = "#";
22+
return false;
23+
}
24+
const apiServerUrl = "https://api.{{DOMAIN}}.com/v3/users";
25+
$("#continueBtn").click(function () {
26+
var otp = $("#otp").val();
27+
if (!otp) {
28+
$("#error").html("Need Password");
29+
$("#error").closest(".message").fadeIn();
30+
return false;
31+
}
32+
$("#error").closest(".message").fadeOut();
33+
$("#error").html("");
34+
$.ajax({
35+
type: "PUT",
36+
url: apiServerUrl + "/activate",
37+
contentType: "application/json",
38+
mimeType: "application/json",
39+
data: JSON.stringify({
40+
"param": {
41+
userId, resendToken, otp
42+
}
43+
}),
44+
dataType: "json",
45+
success: function (result) {
46+
$("#notify").html("Your account is activated");
47+
$("#notify").closest(".message").fadeIn();
48+
$("#resend-text").hide();
49+
$('#verifyOtp').attr('action', formAction);
50+
$("#state").val(qs["state"]);
51+
$("#returnUrl").val(qs["returnUrl"]);
52+
$("#otp").attr('disabled', 'disabled');
53+
$("#verifyOtp").submit();
54+
},
55+
error: function (error) {
56+
if (error.responseJSON && error.responseJSON.result) {
57+
$("#error").html(error.responseJSON.result.content);
58+
$("#error").closest(".message").fadeIn();
59+
} else {
60+
$("#error").html("Unknown Error");
61+
$("#error").closest(".message").fadeIn();
62+
}
63+
}
64+
});
65+
return false;
66+
});
67+
if (canResend) {
68+
$("#resend").click(function () {
69+
$.ajax({
70+
type: "POST",
71+
url: apiServerUrl + "/resendActivationEmail",
72+
contentType: "application/json",
73+
mimeType: "application/json",
74+
data: JSON.stringify({
75+
"param": {
76+
userId, resendToken
77+
}
78+
}),
79+
dataType: "json",
80+
success: function (result) {
81+
$("#notify").html("Email sent");
82+
$("#notify").closest(".message").fadeIn();
83+
$("#resend-text").hide();
84+
},
85+
error: function (error) {
86+
if (error.responseJSON && error.responseJSON.result) {
87+
$("#error").html(error.responseJSON.result.content);
88+
$("#error").closest(".message").fadeIn();
89+
$("#resend-text").hide();
90+
} else {
91+
$("#error").html("Unknown Error");
92+
$("#error").closest(".message").fadeIn();
93+
}
94+
}
95+
});
96+
return false;
97+
});
98+
} else {
99+
$("#resend-text").hide();
100+
}
101+
102+
/**
103+
* Script for field placeholder
104+
**/
105+
$(".messages .close-error").on("click", function () {
106+
$(this).closest(".message").fadeOut();
107+
});
108+
var inputObj = $(".input-field .input-text"),
109+
continueBtnDisable = false;
110+
inputObj
111+
.on("focus", function () {
112+
$(this).parent().addClass("active focussed");
113+
})
114+
.on("blur", function () {
115+
var parentObj = $(this).parent();
116+
if ($(this).val() === "") {
117+
parentObj.removeClass("active");
118+
}
119+
parentObj.removeClass("focussed");
120+
})
121+
.on("change keydown paste input", function () {
122+
var disableStatus = false;
123+
inputObj.each(function (index, element) {
124+
if ($(element).val() === "") {
125+
disableStatus = true;
126+
return;
127+
} else {
128+
disableStatus = false;
129+
return;
130+
}
131+
});
132+
setContinueButtonDisabledStatus(disableStatus);
133+
})
134+
.each(function (index, element) {
135+
var parentObj = $(element).parent();
136+
if ($(element).val() !== "") {
137+
parentObj.addClass("active");
138+
} else {
139+
parentObj.removeClass("active");
140+
}
141+
142+
if ($(element).val() === "" && continueBtnDisable === false) {
143+
continueBtnDisable = true;
144+
}
145+
146+
setContinueButtonDisabledStatus(continueBtnDisable);
147+
});
148+
});
149+
function setContinueButtonDisabledStatus(status) {
150+
var continueBtnObj = $("#continueBtn");
151+
if (status) {
152+
continueBtnObj.attr("disabled", true);
153+
} else {
154+
continueBtnObj.removeAttr("disabled");
155+
}
156+
}

‎web-assets/js/otp.js‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,10 @@ $(document).ready(function () {
2020
$("#error").closest(".message").fadeOut();
2121
$("#error").html("");
2222
let formAction = qs["formAction"];
23-
console.log(formAction)
2423
const opt1 = 'https://auth.{{DOMAIN}}/continue';
2524
const opt2 = 'https://{{AUTH0DOMAIN}}/continue';
2625
if (!formAction.startsWith(opt1) && !formAction.startsWith(opt2)) {
2726
// looks like XSS attack
28-
console.log("err")
2927
formAction = "#";
3028
}
3129
$('#verifyOtp').attr('action', formAction);
@@ -34,6 +32,42 @@ $(document).ready(function () {
3432
$("#verifyOtp").submit();
3533
return false;
3634
});
35+
const resendToken = qs["resendToken"];
36+
const userId = qs["userId"];
37+
if (resendToken && userId) {
38+
const apiServerUrl = "https://api.{{DOMAIN}}.com/v3/users";
39+
$("#resend").click(function () {
40+
$.ajax({
41+
type: "POST",
42+
url: apiServerUrl + "/resendOtpEmail",
43+
contentType: "application/json",
44+
mimeType: "application/json",
45+
data: JSON.stringify({
46+
"param": {
47+
userId, resendToken
48+
}
49+
}),
50+
dataType: "json",
51+
success: function (result) {
52+
$("#notify").html("Email sent");
53+
$("#notify").closest(".message").fadeIn();
54+
$("#resend").hide();
55+
},
56+
error: function (error) {
57+
if (error.responseJSON && error.responseJSON.result) {
58+
$("#error").html(error.responseJSON.result.content);
59+
$("#error").closest(".message").fadeIn();
60+
$("#resend").hide();
61+
} else {
62+
$("#error").html("Unknown Error");
63+
$("#error").closest(".message").fadeIn();
64+
}
65+
}
66+
});
67+
});
68+
} else {
69+
$("#resend").hide();
70+
}
3771

3872
/**
3973
* Script for field placeholder

‎web-assets/static-pages/check_email.html‎

Lines changed: 31 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -11,36 +11,8 @@
1111
<link href="https://fonts.googleapis.com/css2?family=Barlow&family=Barlow+Condensed:wght@500&display=swap"
1212
rel="stylesheet">
1313
<link rel="stylesheet" href="./styles.css" />
14-
<script>
15-
var qs = (function (a) {
16-
if (a == "") return {};
17-
var b = {};
18-
for (var i = 0; i < a.length; ++i) {
19-
var p = a[i].split("=", 2);
20-
if (p.length == 1) b[p[0]] = "";
21-
else b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
22-
}
23-
return b;
24-
})(window.location.search.substr(1).split("&"));
25-
window.addEventListener("load", () => {
26-
var state = qs['state'];
27-
if (state) {
28-
document.querySelector("#resend").addEventListener("click", e => {
29-
e.preventDefault();
30-
window.location = 'https://auth.{{DOMAIN}}/continue?state=' + state + '&resend=1';
31-
});
32-
} else {
33-
document.querySelector("#resend-text").style.display = "none";
34-
}
35-
});
36-
</script>
37-
<!-- Google Tag Manager -->
38-
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
39-
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
40-
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
41-
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
42-
})(window,document,'script','dataLayer','GTM-MXXQHG8');</script>
43-
<!-- End Google Tag Manager -->
14+
<script src="https://tc-public-static-files.topcoder.com/topcoder-auth/js/jquery-3.5.1.min.js"></script>
15+
<script type="text/javascript" src="check_email.js"></script>
4416
</head>
4517

4618
<body class="center-align-card checkemail-card">
@@ -61,6 +33,33 @@ <h1 id="page-title-heading" class="page-title-heading">
6133
<h2 id="page-subtitle-heading" class="page-subtitle-heading">
6234
Welcome to the Topcoder Community!
6335
</h2>
36+
<div class="messages">
37+
<div role="alert" class="message error">
38+
<div id="error" class="message-content"></div>
39+
<span class="close-error" tabindex="0">
40+
<span class="clip-me">Close</span>
41+
</span>
42+
</div>
43+
<div role="alert" class="message notify">
44+
<div id="notify" class="message-content"></div>
45+
<span class="close-error" tabindex="0">
46+
<span class="clip-me">Close</span>
47+
</span>
48+
</div>
49+
</div>
50+
<form method="GET" id="verifyOtp" action="#">
51+
<input id="state" name="state" value="" type="hidden" />
52+
<input id="returnUrl" name="returnUrl" value="" type="hidden" />
53+
<div id="otpdiv" class="input-field active">
54+
<label for="otp">One Time Password</label>
55+
<input id="otp" name="otp" size="6" class="input-text" autocomplete="off" />
56+
</div>
57+
<div id="sb" class="action-wrapper">
58+
<button type="submit" id="continueBtn" class="continue-btn" disabled="disabled">
59+
Continue
60+
</button>
61+
</div>
62+
</form>
6463
<div class="page-description">
6564
<ul>
6665
<li><span>Don't see an email? Try spam just in case.
@@ -89,11 +88,11 @@ <h2 id="page-subtitle-heading" class="page-subtitle-heading">
8988
</footer>
9089
</div>
9190
<script>
92-
document.addEventListener("DOMContentLoaded", function(){
91+
document.addEventListener("DOMContentLoaded", function () {
9392
var copyRightText = document.getElementsByClassName("copyright-text");
9493
copyRightText[0].innerHTML = "<strong>&copy;</strong> " + new Date().getFullYear() + " Topcoder. All Rights Reserved"
9594
});
9695
</script>
9796
</body>
9897

99-
</html>
98+
</html>

‎web-assets/static-pages/otp.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,12 @@ <h1 id="page-title-heading" class="page-title-heading">
3737
<span class="clip-me">Close</span>
3838
</span>
3939
</div>
40+
<div role="alert" class="message notify">
41+
<div id="notify" class="message-content"></div>
42+
<span class="close-error" tabindex="0">
43+
<span class="clip-me">Close</span>
44+
</span>
45+
</div>
4046
</div>
4147
<form method="GET" id="verifyOtp" action="#">
4248
<input id="state" name="state" value="" type="hidden" />
@@ -51,6 +57,9 @@ <h1 id="page-title-heading" class="page-title-heading">
5157
</button>
5258
</div>
5359
</form>
60+
<div id="resend" style="text-align:left;">
61+
<a>resend code</a>
62+
</div>
5463
</main>
5564
</div>
5665
<footer class="footer">

0 commit comments

Comments
 (0)