frontend: improve main interface

This commit is contained in:
nemunaire 2016-01-23 12:29:19 +01:00
commit 32e8f931b9
8 changed files with 477 additions and 354 deletions

View file

@ -1,13 +1,14 @@
<ul class="nav nav-tabs nav-justified">
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" ng-class="{active: k == current_exercice, disabled: !my.exercices[k]}"><a ng-show="(!my.exercices[k])">{{ exercice.title }}</a><a href="/{{ current_theme }}/{{ k }}" ng-show="(my.exercices[k])">{{ exercice.title }} <span ng-show="(my.exercices[k].solved)" class="badge">{{ exercice.gain }}</span></a></li>
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" ng-class="{active: k == current_exercice, disabled: !my.exercices[k]}"><a ng-show="(!my.exercices[k])">{{ exercice.title }}</a><a href="/{{ current_theme }}/{{ k }}" ng-show="(my.exercices[k])">{{ exercice.title }} <span ng-show="(my.team_id && my.exercices[k].solved)" class="badge">{{ exercice.gain }}</span></a></li>
</ul>
<div class="alert alert-warning" style="margin-top:15px;" ng-show="!(my.exercices[current_exercice])">
Vous n'avez pas encore accès à cet exercice.
</div>
<div style="margin-top: 15px" class="well" ng-show="(my.exercices[current_exercice])">
<p>{{ my.exercices[current_exercice].statement }}</p>
<p ng-show="(my.exercices[current_exercice].hint)">{{ my.exercices[current_exercice].hint }}</p>
<div style="margin-top: 15px" class="well well-lg" ng-show="(my.exercices[current_exercice])">
<p ng-bind-html="my.exercices[current_exercice].statement"></p>
<blockquote ng-show="(my.exercices[current_exercice].hint)" ng-bind-html="my.exercices[current_exercice].hint"></blockquote>
<hr ng-show="!(my.exercices[current_exercice].hint)">
<ul>
<li><strong>Gain :</strong> {{ themes[current_theme].exercices[current_exercice].gain }} points</li>
<li><strong>Résolu par :</strong> {{ themes[current_theme].exercices[current_exercice].solved }} équipes jusqu'à présent</li>
@ -39,25 +40,26 @@
</div>
<div class="alert alert-info" ng-class="messageClass" ng-show="my.exercices[current_exercice] && !(my.exercices[current_exercice].solved) && (my.exercices[current_exercice].submitted)">
<strong>Your solution has been submitted.</strong> {{ message }}
<strong>Votre tentative a bien été transmise.</strong> {{ message }}
</div>
<div class="panel panel-danger" ng-show="my.exercices[current_exercice] && !(my.exercices[current_exercice].solved) && !(my.exercices[current_exercice].submitted)">
<div class="panel panel-danger" ng-show="my.team_id && my.exercices[current_exercice] && !(my.exercices[current_exercice].solved) && !(my.exercices[current_exercice].submitted)">
<div class="panel-heading">
<div class="panel-title">Soumettre une solution</div>
</div>
<div class="panel-body">
<p ng-show="(my.exercices[current_exercice].solved_number)">Dernière solution envoyée à {{ my.exercices[current_exercice].solved_time }}.</p>
<form class="form-inline" ng-submit="ssubmit()">
<div class="form-group">
<input type="text" class="form-control" placeholder="Votre solution" id="solution" name="solution" onchange="sready()">
<form ng-controller="SubmissionController" ng-submit="ssubmit()">
<div class="form-group" ng-repeat="key in flags">
<label for="sol_{{ key.id }}">{{ key.name }}</label>
<input type="text" class="form-control" id="sol_{{ key.id }}" name="sol_{{ index }}" ng-model="key.value">
</div>
<button type="submit" class="btn btn-success disabled" id="sbmt">Soumettre</button>
<button type="submit" class="btn btn-success" id="sbmt">Soumettre</button>
</form>
</div>
</div>
<div class="panel panel-success" ng-show="(my.exercices[current_exercice].solved)">
<div class="panel panel-success" ng-show="(my.team_id && my.exercices[current_exercice].solved)">
<div class="panel-heading">
<div class="panel-title">Challenge réussi !</div>
</div>
@ -65,3 +67,18 @@
Vous êtes la {{ my.exercices[current_exercice].solved_number }}<sup>e</sup> équipe à avoir résolu ce challenge à {{ my.exercices[current_exercice].solved_time }}. Vous avez marqué {{ themes[current_theme].exercices[current_exercice].gain }} points !
</div>
</div>
<div class="panel panel-success" ng-show="(!my.team_id)">
<div class="panel-heading">
<div class="panel-title">Clefs du challenge</div>
</div>
<div class="panel-body">
<p>
Vérifiez les clefs que vous trouvez en comparant leur SHA-512 :
</p>
<dl class="dl-horizontal" ng-repeat="key in my.exercices[current_exercice].keys">
<dt>{{ key.slice(128) }}</dt>
<dd class="samp"><code>{{ key.slice(0, 128) }}</code></dd>
</dl>
</div>
</div>