Work on Maatma interface

token-validator/htdocs/views/auth.html

@@ -0,0 +1,16 @@
+<h2>Accès à votre compte</h2>
+
+<form ng-submit="logmein()">
+  <div class="form-group">
+    <label for="login">CRI login</label>
+    <input class="form-control" id="login" ng-model="auth.username" placeholder="Entrer votre login" autofocus>
+  </div>
+  <div class="form-group">
+    <label for="password">Mot de passe</label>
+    <input type="password" class="form-control" id="password" ng-model="auth.password" placeholder="Mot de passe">
+  </div>
+  <button type="submit" class="btn btn-primary">
+    <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" ng-show="pleaseWait"></span>
+    Me connecter
+  </button>
+</form>

token-validator/htdocs/views/home.html

@@ -0,0 +1,43 @@
+<div class="jumbotron">
+  <h1>
+    Bienvenue {{ isLogged.login }} chez Maatma&nbsp;!
+  </h1>
+  <p class="lead text-muted">L'hébergement vraiment pas cher (mais DIY)&nbsp;!</p>
+
+  <hr class="my-4">
+
+  <h2 ng-if="!isLogged">
+    Connectez-vous&nbsp;!
+  </h2>
+
+  <h2 ng-if="isLogged">
+    Qu'allons-nous faire aujourd'hui&nbsp;?
+  </h2>
+</div>
+
+<div class="card-deck">
+  <div class="card">
+    <img src="..." class="card-img-top" alt="...">
+    <div class="card-body">
+      <h5 class="card-title">Card title</h5>
+      <p class="card-text">This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
+      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
+    </div>
+  </div>
+  <div class="card">
+    <img src="..." class="card-img-top" alt="...">
+    <div class="card-body">
+      <h5 class="card-title">Card title</h5>
+      <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
+      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
+    </div>
+  </div>
+  <div class="card">
+    <img src="..." class="card-img-top" alt="...">
+    <div class="card-body">
+      <h5 class="card-title">Card title</h5>
+      <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.</p>
+      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
+    </div>
+  </div>
+</div>

token-validator/htdocs/views/tunnels.html

@@ -0,0 +1,48 @@
+<h2>
+  Tunnels
+</h2>
+
+<table class="table table-striped table-hover">
+  <thead>
+    <tr>
+      <th>Token</th>
+      <th>Dernière utilisation</th>
+      <th>Clef publique</th>
+      <th></th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr ng-repeat="tunnel in tunnels">
+      <td><code>{{ tunnel.TokenText }}</code></td>
+      <td>{{ tunnel.Time | date:"medium" }}</td>
+      <td><code ng-show="tunnel.PubKey">{{ tunnel.PubKey }}</code><span ng-show="!tunnel.PubKey">(none)</span></td>
+      <td>
+	<button class="btn btn-danger" ng-click="dropTunnel(tunnel)" disabled>
+	  <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" ng-show="tunnel.pleaseWaitDrop"></span>
+	  Supprimer
+	</button>
+      </td>
+    </tr>
+  </tbody>
+  <tfoot>
+    <tr>
+      <td colspan="4">
+	<button class="btn btn-primary" ng-click="newTunnel()">
+	  <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" ng-show="pleaseWaitNew"></span>
+	  Nouveau tunnel
+	</button>
+      </td>
+    </tr>
+  </tfoot>
+</table>
+
+<div class="card mb-4" style="margin: auto; width: 50%;">
+  <h4 class="card-header">Paramètres du tunnel</h4>
+  <ul class="list-group list-group-flush">
+    <li class="list-group-item"><strong>Statut&nbsp;:</strong> {{ wginfo.status }}</li>
+    <li class="list-group-item"><strong>Clef publique du serveur&nbsp;:</strong> <code>{{ wginfo.srv_pubkey }}</code></li>
+    <li class="list-group-item"><strong>Port d'écoute du serveur&nbsp;:</strong> {{ wginfo.srv_port }}</li>
+    <li class="list-group-item"><strong>Adresse IPv6 du tunnel&nbsp;:</strong> {{ wginfo.clt_ipv6 }}/{{ wginfo.clt_range }}</li>
+    <li class="list-group-item"><strong>Gateway/passerelle IPv6&nbsp;:</strong> {{ wginfo.srv_gw6 }}</li>
+  </ul>
+</div>