LBRYFoundation/lbry.com
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry.com.git synced 2025-08-27 23:41:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Closes #987

Browse source
This commit is contained in:
ポール ウェッブ 2019-03-21 09:55:30 -05:00
parent 7814514938
commit c711fede6e
2 changed files with 129 additions and 96 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
view/template/acquisition/auto-verify.php
View file

@ -1,25 +1,28 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>Verify Your Identity</title> <title>Verify Your Identity</title>
<link rel="icon" href="images/favicon.ico">
<script src='https://www.google.com/recaptcha/api.js?' async defer></script>
<script type="text/javascript">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
<link rel="icon" href="images/favicon.ico"/>
<script src='https://www.google.com/recaptcha/api.js?' async defer></script>
<script>
const ENDPOINT = '<?php echo LBRY::getApiUrl('/user_email/confirm')?>' const ENDPOINT = '<?php echo LBRY::getApiUrl('/user_email/confirm')?>'
var verifyUser = function(temporary_auth_token, email, verification_token, recaptcha) { const verifyUser = function(temporary_auth_token, email, verification_token, recaptcha) {
const url = `${ENDPOINT}?auth_token=${temporary_auth_token}&email=${encodeURIComponent(email)}&verification_token=${verification_token}&recaptcha=${recaptcha}`; const url = `${ENDPOINT}?auth_token=${temporary_auth_token}&email=${encodeURIComponent(email)}&verification_token=${verification_token}&recaptcha=${recaptcha}`;
fetch(url) fetch(url)
.then(response => response.json()) .then(response => response.json())
.then((response) => { .then((response) => {
if (response.error) { if (response.error)
throw Error(response.error) throw Error(response.error);
}
document.getElementById("title").textContent = "Done!" document.getElementById("title").textContent = "Done!"
document.getElementById("verify").style.display = "none"; document.getElementById("verify").style.display = "none";
document.getElementById("verify-success").style.display = "block"; document.getElementById("verify-success").style.display = "block";
@ -29,13 +32,14 @@
document.getElementById("verify").style.display = "none"; document.getElementById("verify").style.display = "none";
document.getElementById("verify-error").style.display = "block"; document.getElementById("verify-error").style.display = "block";
document.getElementById("verify-error-text").textContent = error.message; document.getElementById("verify-error-text").textContent = error.message;
}) });
} }
var verifyCallback = function(response) { const verifyCallback = function(response) {
const urlParams = new URLSearchParams(window.location.search); const urlParams = new URLSearchParams(window.location.search);
const email = urlParams.get('email');
const temporary_auth_token = urlParams.get('auth_token'); const temporary_auth_token = urlParams.get('auth_token');
const email = urlParams.get('email')
const verification_token = urlParams.get('verification_token'); const verification_token = urlParams.get('verification_token');
// In the future we will have an `origin` query, to smartly redirect (or tell users they are verified) // In the future we will have an `origin` query, to smartly redirect (or tell users they are verified)
// eg. if origin == "android" and device == "android" open the app, else say "your android app is verified" // eg. if origin == "android" and device == "android" open the app, else say "your android app is verified"
@ -45,15 +49,22 @@
document.getElementById("verify").style.display = "block"; document.getElementById("verify").style.display = "block";
} }
var expiredCallback = function(error) { const expiredCallback = error => {
console.log("expired", error) console.log("expired", error);
} }
</script> </script>
</head> </head>
<body> <body>
<div style="display: flex; align-items: center; flex-direction: column;" class="text-center"> <main class="ancillary">
<img src="/img/lbry-dark-1600x528.png" style="max-height: 80px; margin-top: 50px; margin-bottom: 38px" alt="LBRY"/> <section class="hero hero--half-height">
<h1 id="title">Almost Done!</h1> <div class="inner-wrap inner-wrap--hero">
<h1>Almost Done!</h1>
</div>
</section>
<section>
<div class="inner-wrap">
<div id="captcha-block"> <div id="captcha-block">
<p>Click the captcha to continue...</p> <p>Click the captcha to continue...</p>
<br/> <br/>
@ -63,13 +74,17 @@
<div style="display: none; margin-top: 10px;" id="verify"> <div style="display: none; margin-top: 10px;" id="verify">
<p>Verifying...</p> <p>Verifying...</p>
</div> </div>
<div style="display: none; margin-top: 10px;" id="verify-error"> <div style="display: none; margin-top: 10px;" id="verify-error">
<code id="verify-error-text"></code> <code id="verify-error-text"></code>
<p style="margin-top: 10px">There was an error. Please make sure you are clicking the latest verification email and try again. Contact help@lbry.com if this keeps happening.</p> <p style="margin-top: 10px">There was an error. Please make sure you are clicking the latest verification email and try again. Contact help@lbry.com if this keeps happening.</p>
</div> </div>
<div style="display: none; margin-top: 10px;" id="verify-success"> <div style="display: none; margin-top: 10px;" id="verify-success">
<p class="spacer1">Success! Your email is now verified.</p> <p class="spacer1">Success! Your email is now verified.</p>
</div> </div>
</div> </div>
</section>
</main>
</body> </body>
</html> </html>

42
view/template/acquisition/verify.php
View file

@ -1,39 +1,55 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>Verify Your Identity</title> <title>Verify Your Identity</title>
<link rel="icon" href="images/favicon.ico">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>
<link rel="icon" href="images/favicon.ico"/>
<script src='https://www.google.com/recaptcha/api.js'></script> <script src='https://www.google.com/recaptcha/api.js'></script>
<script type="text/javascript">
var magicLink = "#"; <script>
var verifyCallback = function(response) { let magicLink = "#";
let payload = btoa(JSON.stringify({
const verifyCallback = response => {
const payload = btoa(JSON.stringify({
recaptcha: response, recaptcha: response,
token: "<?php echo $token ?>" token: "<?php echo $token ?>"
})); }));
magicLink = "lbry://?verify=" + payload; magicLink = "lbry://?verify=" + payload;
document.getElementById("magic-link-text").textContent = payload; document.getElementById("magic-link-text").textContent = payload;
document.getElementById("success").style.display = "block"; document.getElementById("success").style.display = "block";
document.getElementById("captcha-block").style.display = "none"; document.getElementById("captcha-block").style.display = "none";
}; };
var expiredCallback = function() {
const expiredCallback = () => {
document.getElementById("success").style.display = "none"; document.getElementById("success").style.display = "none";
document.getElementById("captcha-block").style.display = "block"; document.getElementById("captcha-block").style.display = "block";
} }
</script> </script>
</head> </head>
<body> <body>
<div style="display: flex; align-items: center; flex-direction: column;" class="text-center"> <main class="ancillary">
<img src="/img/lbry-dark-1600x528.png" style="max-height: 80px; margin-top: 50px;" alt="LBRY"/> <section class="hero hero--half-height">
<div class="inner-wrap inner-wrap--hero">
<h1>Almost Done!</h1> <h1>Almost Done!</h1>
</div>
</section>
<section>
<div class="inner-wrap">
<div id="captcha-block"> <div id="captcha-block">
<p>Click the captcha to continue...</p> <p>Click the captcha to continue...</p>
<br/> <br/>
<div class="g-recaptcha" data-sitekey="6LePsJgUAAAAAFTuWOKRLnyoNKhm0HA4C3elrFMG" data-callback="verifyCallback" data-expired-callback="expiredCallback"></div> <div class="g-recaptcha" data-sitekey="6LePsJgUAAAAAFTuWOKRLnyoNKhm0HA4C3elrFMG" data-callback="verifyCallback" data-expired-callback="expiredCallback"></div>
</div> </div>
<div style="display: none; margin-top: 10px;" id="success"> <div style="display: none; margin-top: 10px;" id="success">
<p>Now click the magic link below to verify your identity in app...</p> <p>Now click the magic link below to verify your identity in app...</p>
<br/> <br/>
@ -42,5 +58,7 @@
<code class="multiline-code" id="magic-link-text"></code> <code class="multiline-code" id="magic-link-text"></code>
</div> </div>
</div> </div>
</section>
</main>
</body> </body>
</html> </html>