| 
									
										
										
										
											2017-05-22 23:25:43 +00:00
										 |  |  | <!DOCTYPE html> | 
					
						
							|  |  |  | <html> | 
					
						
							|  |  |  |     <head> | 
					
						
							|  |  |  |         <meta charset="utf-8"> | 
					
						
							|  |  |  |         <meta name="viewport" content="width=device-width, initial-scale=1"> | 
					
						
							|  |  |  |         <title>Login Facilitator: OAuth3.org</title> | 
					
						
							|  |  |  | 	      <link rel="stylesheet" type="text/css" href="/css/style.css"> | 
					
						
							|  |  |  |         <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Lato:300"> | 
					
						
							|  |  |  |         <script src="https://use.fontawesome.com/3af0faae66.js"></script> | 
					
						
							|  |  |  |     </head> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <body class="fade mock-main"> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         <!-- STEP 1: ask the user where they want to log in --> | 
					
						
							|  |  |  |         <!-- STEP 2: ask the user for their email --> | 
					
						
							|  |  |  |         <!-- STEP 3+4: ask for login code and to remember device --> | 
					
						
							|  |  |  |         <!-- TODO: remember-me-not implementation? --> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         <!--  <button class="btn btn-secondary js-authz-show js-authz-remember-me-not">Just this once</button>--> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         <!-- Step 5: ask for permissions --> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | <div class="dap-bordered js-userid-container" style="display: none;"> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-normal-text">Please, sign in to Daplie Labs...</p> | 
					
						
							|  |  |  |       <form method="post" action=""> | 
					
						
							|  |  |  |         <input type="email" class="dap-input js-oauth3-email emailInput" placeholder="Input your e-mail"></input> | 
					
						
							|  |  |  |         <button class="dap-full-button-green js-authn-show" disabled>CONTINUE</button> | 
					
						
							|  |  |  |       </form> | 
					
						
							|  |  |  |       <p class="dap-line-around">or</p> | 
					
						
							|  |  |  |       <div class="dap-social-media dap-normal-text"> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-facebook-square js-facebook-login"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-twitter-square js-twitter-login"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-google-plus-square js-google-login"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-github-square js-github-login"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-plus-square js-gitlab-login"></span> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <a href="./loginwhatis.html" target="_blank"><p class="dap-centered-text dap-help-text">What is this?</p></a> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <div class="dap-bordered js-authn"> | 
					
						
							|  |  |  |       <div class="dap-normal-text"> | 
					
						
							|  |  |  |         <span class="fa fa-3x icon-centered-3x fa-purple fa-envelope"></span> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-scrunch-top dap-normal-text">A special sign-in code was sent to:</p> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-scrunch-both dap-purple-text"><span class="js-user-email"> </span></p> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-scrunch-bottom dap-med-text">Please enter the code below:</p> | 
					
						
							|  |  |  |       <form method="post" onsubmit=""> | 
					
						
							|  |  |  |         <input type="hidden" class="js-authn-otp-uuid"> | 
					
						
							|  |  |  |         <input class="dap-input js-authn-otp-code" placeholder="XXXX-XXXX-XXXX"></input> | 
					
						
							|  |  |  |         <div class="dap-centered-div dap-space-on-top"> | 
					
						
							|  |  |  |           <label class="js-remember-label dap-normal-text"> | 
					
						
							|  |  |  |             <span class="fa fa-2x fa-purple fa-square-o dap-remember-margin js-remember-status"></span> | 
					
						
							|  |  |  |             <span class="dap-remember-me noselect">Remember this device.</span> | 
					
						
							|  |  |  |             <input class="js-remember-checkbox" type="checkbox" checked="false"></input> | 
					
						
							|  |  |  |           </label> | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  |         <button class="dap-full-button-green js-remember-btn js-authz-remember-me">SIGN IN ONCE</button> | 
					
						
							|  |  |  |       </form> | 
					
						
							|  |  |  |       <a href="./authnocode.html" target="_blank"> | 
					
						
							|  |  |  |         <p class="dap-centered-text dap-help-text">I didn't receive my code...</p> | 
					
						
							|  |  |  |       </a> | 
					
						
							|  |  |  |       <a href="./authnopass.html" target="_blank"> | 
					
						
							|  |  |  |         <p class="dap-centered-text dap-help-text">Why am I not using a password?</p> | 
					
						
							|  |  |  |       </a> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <div class="dap-bordered dap-normal-text js-authz"> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <div class="dap-user-plus-app"> | 
					
						
							|  |  |  |         <span class="fa fa-3x fa-purple fa-user-circle"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-plus"></span> | 
					
						
							|  |  |  |         <img class="dap-lab-logo" src="./img/Daplie-Badge-Purple.png" alt="Daplie Labs Logo"> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-normal-text"> OK! Almost done. Allow app to...?</p> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |       <form class="js-authorization-decision" action="#"> | 
					
						
							|  |  |  |         <ul class="js-scopes-container dap-app-auth-list"> | 
					
						
							|  |  |  |           <li class="checkbox fa fa-check-square-o dap-purple-text js-auth-li-enabled"> | 
					
						
							|  |  |  |              <span class="dap-small-text js-scope-desc noselect"> </span> | 
					
						
							|  |  |  |              <input class="checkbox js-scope-toggle js-auth-checkbox" type="checkbox"> | 
					
						
							|  |  |  |            </li> | 
					
						
							|  |  |  |          </ul> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         <div> | 
					
						
							|  |  |  |           <button class="dap-full-button-green js-login-allow" type="button">AUTHORIZE THIS APP</button> | 
					
						
							|  |  |  |           <button class="dap-full-button-pink js-login-deny" type="button">DENY THIS APP</button> | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  |       </form> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <!-- TODO: Remove Inline Style - Hidden until added into process --> | 
					
						
							|  |  |  |     <div style="display: none" class="dap-bordered dap-normal-text"> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <div class="dap-user-plus-app"> | 
					
						
							|  |  |  |         <span class="fa fa-3x fa-purple fa-user-circle"></span> | 
					
						
							|  |  |  |         <span class="fa fa-2x fa-gray fa-plus"></span> | 
					
						
							|  |  |  |         <span class="fa fa-3x fa-purple fa-laptop"></span> | 
					
						
							|  |  |  |       </div> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-scrunch-top dap-normal-text">It looks like your user agent is</p> | 
					
						
							|  |  |  |       <p><span class="js-sniffed-device"></span></p> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-scrunch-bottom dap-med-text">How long would you like to trust this device?</p> | 
					
						
							|  |  |  |       <button class="dap-3-4-button-green js-authz-remember-me">FOREVER</button> | 
					
						
							|  |  |  |       <button class="dap-1-4-button-purple js-authz-remember-me-not">ONE DAY</button> | 
					
						
							|  |  |  |       <span class="dap-help-text dap-3-4-span">Great if you aren't paranoid.</span> | 
					
						
							|  |  |  |       <span class="dap-help-text dap-1-4-span">Great if you're paranoid.</span> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <br> | 
					
						
							|  |  |  |       <p class="dap-centered-text dap-help-text">What is this?</p> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <div class="dap-bordered dap-normal-text js-logout-container"> | 
					
						
							|  |  |  |       <p class="dap-centered-text">Sign out of Daplie and all Applications?</p> | 
					
						
							|  |  |  |       <button type="button" class="dap-full-button-green js-logout">Sign Out</button> | 
					
						
							|  |  |  |     </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     <!--[if IE]><script src="bower_components/rsvp.js/rsvp.js"></script><![endif]--> | 
					
						
							|  |  |  |     <script src="/assets/com.jquery/jquery-3.1.1.js"></script> | 
					
						
							| 
									
										
										
										
											2017-05-24 08:34:41 +00:00
										 |  |  |     <script src="./js/issuer.js"></script> | 
					
						
							| 
									
										
										
										
											2017-05-22 23:25:43 +00:00
										 |  |  |     <script src="./js/script.js"></script> | 
					
						
							|  |  |  |     <script src="/assets/org.oauth3/oauth3.core.js"></script> | 
					
						
							|  |  |  |     <script src="/assets/org.oauth3/oauth3.issuer.js"></script> | 
					
						
							|  |  |  |     <!--script src="/assets/org.oauth3/oauth3.mock.js"></script--> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     </body> | 
					
						
							|  |  |  | </html> |