lookup_result.html (6420B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <!-- Required meta tags --> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 7 <!-- <meta name="taler-uri" content="{{.talerAddContactURI}}"> --> 8 <link href="/css/bootstrap.min.css" rel="stylesheet"> 9 <link href="/css/style.css" rel="stylesheet"> 10 <link href="/fontawesome/css/fontawesome.css" rel="stylesheet" /> 11 <link href="/fontawesome/css/solid.css" rel="stylesheet" /> 12 <title>{{ call .tr "title" }}</title> 13 </head> 14 <body> 15 {{ template "nav.html" . }} 16 <div class="container"> 17 <div id="ebanner" class="container" hidden> 18 <div class="alert alert-danger" role="alert"> 19 <h4 class="alert-heading">{{ call .tr "error" }}</h4> 20 <hr> 21 <p class="mb-0" id="ebanner-text">{{.error}}.</p> 22 </div> 23 </div> 24 <div id="sbanner" class="container" hidden> 25 <div class="alert alert-success" role="alert"> 26 <h4 class="alert-heading">{{ call .tr "validationInitiated" }}</h4> 27 <hr> 28 {{ call .tr "pleaseCompleteValidation" }} 29 </div> 30 </div> 31 <div class="container pt-5"> 32 <div class="row"> 33 <div class="col-2"> 34 <ul class="timeline"> 35 <li class="done">{{ call .tr "lookup" }}</li> 36 <li class="inprogress">{{ call .tr "registerOrModify" }}</li> 37 <li>{{ call .tr "confirm" }}</li> 38 </ul> 39 </div> 40 <div class="col-8"> 41 <div class="card"> 42 {{if .available}} 43 <div class="card-body"> 44 <h4 class="card-title">{{ call .tr "available" }}</h4> 45 <hr> 46 <p class="card-text">{{ call .tr "notYetLinked" .alias}}</p> 47 </div> 48 <form id="regform"> 49 <input id="atypeInput" type="hidden" name="alias_type" value="{{.alias_type}}"> 50 <input id="addrInput" type="hidden" name="alias" value="{{.alias}}"> 51 <div class="row"> 52 <div class="col-lg-8 offset-lg-2 text-center"> 53 <div id="address-input-group" class="input-group mb-3"> 54 <input id="uriInput" name="target_uri" type="text" class="form-control" placeholder="{{ call .tr "talerMailboxAddressExample" }}" value="{{.proposedTargetUri}}" aria-label="Default" aria-describedby="inputGroup-sizing-default"> 55 <input class="input-group-text btn btn-outline-primary" type="submit" value="{{ call .tr "linkIt" }}"> 56 </div> 57 <a class="btn btn-outline-primary mb-3" id="login-button" hidden>Start OpenID validation</a> 58 </div> 59 </div> 60 </form> 61 {{else}} 62 <div class="card-body" role="alert"> 63 <h4 class="card-title">{{ call .tr "lookupResultFound" }}</h4> 64 <hr> 65 <p class="card-text"> 66 {{ call .tr "isLinked" .alias }}<br/> 67 {{ call .tr "importContactLink" }} 68 <a class="link-dark" href="{{.talerAddContactURI}}" class="btn btn-success mb-3"> 69 {{ call .tr "importContactLinkText" }} 70 </a> 71 <br/> 72 {{ call .tr "importContactQr" }} 73 <div class="qr"> 74 <img class="qr" src="{{.qrCode}}"/> 75 </div> 76 </p> 77 </div> 78 <form id="regform"> 79 <input id="atypeInput" type="hidden" name="alias_type" value="{{.alias_type}}"> 80 <input id="addrInput" type="hidden" name="alias" value="{{.alias}}"> 81 <input id="uriInput" type="hidden" name="target_uri" value=""> 82 <div class="row"> 83 <div class="col-lg-8 offset-lg-2 text-center"> 84 <div id="address-input-group" class="input-group mb-3"> 85 <input disabled="disabled" type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default" value="{{.result}}"> 86 <input class="input-group-text btn btn-outline-danger" type="submit" value="{{ call .tr "deleteIt" }}"> 87 </div> 88 <a class="btn btn-outline-primary mb-3" id="login-button" hidden>Start OpenID validation</a> 89 </div> 90 </div> 91 </form> 92 {{end}} 93 </div> 94 </div> 95 </div> 96 </div> 97 {{ template "footer.html" . }} 98 </body> 99 <script> 100 var form = document.getElementById('regform'); 101 form.onsubmit = function(event){ 102 var xhr = new XMLHttpRequest(); 103 var data = new FormData(form); 104 var atype = data.get("alias_type"); 105 var alias = data.get("alias"); 106 107 // 1. Convert FormData to a plain JavaScript object 108 var obj = Object.fromEntries(data); 109 // 2. Explicitly cast or set duration as a number 110 obj.duration = Number(obj.duration) || 2592000000000 * 3; 111 112 // 3. Clean up fields not needed 113 delete obj.alias_type; 114 xhr.open('POST','/register/' + atype) 115 xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8"); 116 // 4. Stringify the modified object 117 var json = JSON.stringify(obj); 118 xhr.send(json); 119 120 xhr.onreadystatechange = function() { 121 if (xhr.readyState == XMLHttpRequest.DONE) { 122 form.reset(); //reset form after AJAX success. 123 var ebanner = document.getElementById('ebanner'); 124 var sbanner = document.getElementById('sbanner'); 125 if (xhr.status == 202) { 126 sbanner.hidden = false; 127 ebanner.hidden = true; 128 var redirLoc = xhr.getResponseHeader("Location"); 129 if (null != redirLoc) { 130 document.getElementById('address-input-group').hidden = true; 131 document.getElementById('login-button').hidden = false; 132 document.getElementById('login-button').href = redirLoc; 133 } 134 } else { 135 var jsonResponse = JSON.parse(xhr.responseText); 136 document.getElementById('ebanner-text').innerHTML = jsonResponse.hint; 137 sbanner.hidden = true; 138 ebanner.hidden = false; 139 // window.location.href = "/?error=Registration failed"; 140 } 141 } 142 } 143 144 //Dont submit the form. 145 return false; 146 } 147 </script> 148 </html>