132 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			132 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
| 
 | |
| <head>
 | |
|   <title>Ants Nation Contract</title>
 | |
|   <meta charset="utf-8">
 | |
|   <meta name="viewport" content="width=device-width, initial-scale=1">
 | |
|   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
 | |
|   <script>
 | |
|     const apxinfo={headers:{xalias:"",xhash:"",xtribe:"smatchit", xapp:"smatchapp", xlang:"en" }};
 | |
|   </script> 
 | |
|   <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
 | |
|   <script src="static/js/openpgp.min.js"></script>
 | |
|   <script src="static/js/apxtribcli.js"></script>
 | |
|   <style>
 | |
|   .fakeimg {
 | |
|     height: 200px;
 | |
|     background: #aaa;
 | |
|   }
 | |
|   .primary-color:black;
 | |
|   .secondary-color:red;
 | |
|   </style>
 | |
| </head>
 | |
| <body>
 | |
| 
 | |
| <div class="p-5 bg-primary text-white text-center">
 | |
|   <h1>apXtrib setup test</h1>
 | |
|   <p>To test quickly api interaction</p> 
 | |
| </div>
 | |
| 
 | |
| <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
 | |
|   <div class="container-fluid">
 | |
|     <ul class="navbar-nav">
 | |
|       <li class="nav-item">
 | |
|         <a class="nav-link active" href="#">Active</a>
 | |
|       </li>
 | |
|       <li class="nav-item">
 | |
|         <a class="nav-link" href="#">Link</a>
 | |
|       </li>
 | |
|       <li class="nav-item">
 | |
|         <a class="nav-link" href="#">Link</a>
 | |
|       </li>
 | |
|       <li class="nav-item">
 | |
|         <a class="nav-link disabled" href="#">Disabled</a>
 | |
|       </li>
 | |
|     </ul>
 | |
|   </div>
 | |
| </nav>
 | |
| 
 | |
| <div class="container mt-5">
 | |
|   <div class="row">
 | |
|     <div class="col-sm-4">
 | |
|       <h2>About Me</h2>
 | |
|       <h5>Photo of me:</h5>
 | |
|       <div class="fakeimg">Fake Image</div>
 | |
|       <p>Some text about me in culpa qui officia deserunt mollit anim..</p>
 | |
|       <h3 class="mt-4">Some Links</h3>
 | |
|       <p>Lorem ipsum dolor sit ame.</p>
 | |
|       <ul class="nav nav-pills flex-column">
 | |
|         <li class="nav-item">
 | |
|           <a class="nav-link active" href="#">Active</a>
 | |
|         </li>
 | |
|         <li class="nav-item">
 | |
|           <a class="nav-link" href="#">Link</a>
 | |
|         </li>
 | |
|         <li class="nav-item">
 | |
|           <a class="nav-link" href="#">Link</a>
 | |
|         </li>
 | |
|         <li class="nav-item">
 | |
|           <a class="nav-link disabled" href="#">Disabled</a>
 | |
|         </li>
 | |
|       </ul>
 | |
|       <hr class="d-sm-none">
 | |
|     </div>
 | |
|     <div class="col-sm-8">
 | |
|       <h2>Create an account</h2>
 | |
|       <div class="row g-3">
 | |
|         <div class="col-md-6">
 | |
|           <label for="inputalias" class="form-label">Your alias</label>
 | |
|           <input type="text" class="form-control" id="inputalias" placeholder="A public alias that any one see">
 | |
|         </div>
 | |
|         <div class="col-md-6">
 | |
|           <label for="inputemailrecovery" class="form-label">Email Recovery</label>
 | |
|           <input type="email" class="form-control" id="inputemailrecovery" placeholder="optional">
 | |
|         </div>
 | |
|         <div class="col-12">
 | |
|           <label for="inputpassphrase" class="form-label">A passphrase</label>
 | |
|           <input type="text" class="form-control" id="inputpassphrase" placeholder="optional, a passphrase to remember, each time something try to use your privateKey this passphrase will be requested">
 | |
|         </div>
 | |
|         <div class="col-12">
 | |
|           <button type="button" onclick="apx.generateKey(document.getElementById('inputpseudo').value,document.getElementById('inputpassphrase').value)" class="btn btn-primary">Generate keys</button>
 | |
|         </div>
 | |
|         <div class="col-12">
 | |
|           <div class="form-check">
 | |
|             <input class="form-check-input" type="checkbox" id="gridCheck">
 | |
|             <label class="form-check-label small" for="gridCheck">
 | |
|               <b>I trust smatchit to keep my private key and email </b><br>
 | |
|               <b>If i don't trust</b> please download your keys (be aware, none than you can have access to your cipher data).<br>
 | |
|               If you set a correct email then you will receive your keys on your mailbox (Carefull by sending email, smatchit and anyone that access to your email can see your keys).<br>
 | |
|               The safer to be sure no one else than your local browser can see it, just download localy and save it on a personnal cold support (usb key).<br>
 | |
|               If you use a browser that <b>can be accessible by someone else, don't forget to "logout"</b> to clean up any trace.<br>
 | |
|               If you have any suspicious please 
 | |
|             </label>
 | |
|           </div>
 | |
|         </div>
 | |
|         <div class="btn-group">
 | |
|           <button class="btn btn-outline-primary" onclick="apx.downloadlink('pagans.privateKey');" >Download PrivateKey</button>
 | |
|           <button class="btn btn-outline-primary" onclick="apx.downloadlink('pagans.publicKey');">Download PublicKey</button>
 | |
|         </div>
 | |
|         <div class="col-12">
 | |
|           <label for="inputAddress2" class="form-label">My private Key:</label>
 | |
|           <p id="privatekey" class="small"></p>
 | |
|         </div>       
 | |
|         <div class="col-12">
 | |
|           <label for="inputAddress2" class="form-label">My public Key:</label>
 | |
|           <p id="publickey" class="small"></p>
 | |
|         </div>
 | |
|         <div class="col-12">
 | |
|           <button type="submit" class="btn btn-primary">Create this identity</button>
 | |
|         </div>
 | |
|       </div>
 | |
|     </div>
 | |
|   </div>
 | |
| </div>
 | |
| 
 | |
| <div class="mt-5 p-4 bg-dark text-white text-center">
 | |
|   <p>Footer</p>
 | |
| </div>
 | |
| 
 | |
| </body>
 | |
| </html>
 |