fic/server
Archived
1
0
Fork 0
Code Issues Pull requests 10 Releases Wiki Activity

frontend: use ng-cloak and ng-if

Browse source
This commit is contained in:
nemunaire 2017-02-22 04:39:14 +01:00 • committed by Pierre-Olivier Mercier
commit 2eb94c8ddb
5 changed files with 73 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

91
frontend/static/index.html
View file

@ -22,52 +22,45 @@
</head>
<body>
<noscript>
<div class="alert alert-danger">
<strong>Veuillez activer le JavaScript.</strong> Ce site requiert un navigateur interprêtant le JavaScript pour fonctionner. Veuillez l'activer ou en télécharger un supportant cette technologie.
</div>
</noscript>
<div class="navbar navbar-default">
<div class="container">
<div class="row">
<div class="navbar-left col-sm-3" ng-show="!(time.start || my.team_id)">
<a href="https://www.forum-fic.com/">
<img src="/img/fic.png" alt="Forum International de la Cybersécurité" class="center-block">
</a>
</div>
<div class="navbar-left col-sm-3" ng-show="(time.start || my.team_id)">
<a href="/">
<img src="/img/fic.png" alt="Forum International de la Cybersécurité" class="center-block">
</a>
</div>
<div class="navbar-right col-sm-2">
<a href="http://www.epita.fr/">
<img src="/img/epita.png" alt="Epita" class="center-block">
</a>
</div>
<div id="clock" class="col-sm-7 text-center" ng-class="{expired: time.expired, end: time.end}" ng-show="time.start || my.team_id">
<span id="hours">{{ time.hours | time }}</span>
<span class="point">:</span>
<span id="min">{{ time.minutes | time }}</span>
<span class="point">:</span>
<span id="sec">{{ time.seconds | time }}</span>
</div>
<div id="clock" class="col-sm-7" ng-show="!(time.start || my.team_id)" style="padding: 25px">
<div class="btn-group btn-group-justified btn-group-lg">
<a class="btn btn-default" href="/">
<span class="glyphicon glyphicon-home"></span> Accueil
<div class="navbar-left col-md-3">
<a href="https://www.forum-fic.com/" ng-if="!(time.start || my.team_id)">
<img src="/img/fic.png" alt="Forum International de la Cybersécurité" class="center-block">
</a>
<a class="btn btn-default" href="/rank">
<span class="glyphicon glyphicon-list"></span> Classement
<a href="/" ng-if="(time.start || my.team_id)" ng-cloak>
<img src="/img/fic.png" alt="Forum International de la Cybersécurité" class="center-block">
</a>
<a class="btn btn-default" href="https://www.youtube.com/playlist?list=PLSJ8QLhKMtQv7jRhdAn9wXSMYTsvqfieX">
<span class="glyphicon glyphicon-blackboard"></span> Vidéos
</div>
<div id="clock" class="col-md-6 text-center" ng-hide="1">Chargement...</div>
<div id="clock" class="col-md-6 text-center" ng-class="{expired: time.expired, end: time.end}" ng-if="time.start || my.team_id" ng-cloak>
<span id="hours">{{ time.hours | time }}</span>
<span class="point">:</span>
<span id="min">{{ time.minutes | time }}</span>
<span class="point">:</span>
<span id="sec">{{ time.seconds | time }}</span>
</div>
<div id="clock" class="col-md-6" ng-if="!(time.start || my.team_id)" style="padding: 25px" ng-cloak>
<div class="btn-group btn-group-justified btn-group-lg">
<a class="btn btn-default" href="/">
<span class="glyphicon glyphicon-home"></span> Accueil
</a>
<a class="btn btn-default" href="/rank">
<span class="glyphicon glyphicon-list"></span> Classement
</a>
<a class="btn btn-default disabled" href="https://www.youtube.com/playlist?list=PLSJ8QLhKMtQv7jRhdAn9wXSMYTsvqfieX">
<span class="glyphicon glyphicon-blackboard"></span> Vidéos
</a>
</div>
</div>
<div class="col-md-3 text-right">
<a href="http://www.epita.fr/">
<img src="/img/epita.png" alt="Epita" class="center-block">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="container" ng-controller="DataController">
@ -75,7 +68,7 @@
<div class="row">
<div class="col-sm-3">
<div class="panel panel-default" ng-show="(my.team_id)" style="margin-top: 10px; margin-bottom: 0px;">
<div class="panel panel-default" ng-if="(my.team_id)" style="margin-top: 10px; margin-bottom: 0px;" ng-cloak>
<div class="panel-heading" style="background-color: {{ teams[my.team_id].color }}; color: {{ teams[my.team_id].color }};">
<a style="margin: -8px -13px; color: {{ teams[my.team_id].color }};" class="pull-right btn btn-default" href="/edit"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></a>
<div class="panel-title">
@ -83,7 +76,7 @@
</div>
</div>
<div class="panel-body">
<span ng-show="teams[my.team_id].rank">{{ teams[my.team_id].rank }}<sup><sup><ng-pluralize count="teams[my.team_id].rank" when="{'one': 're', 'other': 'e'}"></ng-pluralize></sup></sup> sur {{ teams_count }} &ndash;</span>
<span ng-if="teams[my.team_id].rank">{{ teams[my.team_id].rank }}<sup><sup><ng-pluralize count="teams[my.team_id].rank" when="{'one': 're', 'other': 'e'}"></ng-pluralize></sup></sup> sur {{ teams_count }} &ndash;</span>
<ng-pluralize count="my.score" when="{'one': '{} point', 'other': '{} points'}"></ng-pluralize>
<div style="margin: -8px -10px;" class="pull-right btn-group">
<a class="btn btn-default" href="/rules"><span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span></a>
@ -95,9 +88,9 @@
<div class="col-sm-9">
<div class="page-header">
<h1 ng-show="(current_theme)">{{ themes[current_theme].name }} <small class="authors" ng-show="themes[current_theme].authors">{{ themes[current_theme].authors }}</small></h1>
<h1 ng-show="(!current_theme && title)">{{ title }} <small class="authors" ng-show="authors">{{ authors }}</small></h1>
<h1 ng-show="(!current_theme && !title)">Challenge forensic 2017 <small class="authors">Laboratoire SRS, Epita</small></h1>
<h1 ng-if="(current_theme)" ng-cloak>{{ themes[current_theme].name }} <small class="authors" ng-if="themes[current_theme].authors">{{ themes[current_theme].authors }}</small></h1>
<h1 ng-if="(!current_theme && title)" ng-cloak>{{ title }} <small class="authors" ng-if="authors">{{ authors }}</small></h1>
<h1 ng-if="(!current_theme && !title)">Challenge forensic 2017 <small class="authors">Laboratoire SRS, Epita</small></h1>
</div>
</div>
@ -106,16 +99,20 @@
<div class="row">
<div class="col-sm-3">
<div class="list-group">
<a ng-repeat="(k,theme) in themes" ng-class="{active: k == current_theme}" class="list-group-item" ng-href="/{{ k }}"><span class="badge"><span class="glyphicon glyphicon-fire" aria-hidden="true" ng-show="max_solved > 1 && theme.solved == max_solved" alt="Déjà {{ theme.solved }} challenges résolus dans ce thème"></span> <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-show="theme.exercice_coeff_max > 1" alt="Des bonus existent pour au moins un challenge de ce thème"></span> <span ng-show="(my.team_id)">{{ theme.exercice_solved }}/</span>{{ theme.exercice_count }}</span>{{ theme.name }}</a>
<div class="list-group" ng-cloak>
<a ng-repeat="(k,theme) in themes" ng-class="{active: k == current_theme}" class="list-group-item" ng-href="/{{ k }}"><span class="badge"><span class="glyphicon glyphicon-fire" aria-hidden="true" ng-if="max_solved > 1 && theme.solved == max_solved" alt="Déjà {{ theme.solved }} challenges résolus dans ce thème"></span> <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="theme.exercice_coeff_max > 1" alt="Des bonus existent pour au moins un challenge de ce thème"></span> <span ng-if="(my.team_id)">{{ theme.exercice_solved }}/</span>{{ theme.exercice_count }}</span>{{ theme.name }}</a>
</div>
<a href="https://srs.epita.fr/">
<img src="/img/srs.png" class="center-block" alt="Epita">
</a>
<a href="https://srs.epita.fr/"><img src="/img/srs.png" alt="Laboratoire SRS Épita" style="width: 48%; max-width: 200px;"></a>
<img src="/img/rcc.png" alt="Réserve Citoyenne Cyberdéfense" style="width: 48%; max-width: 200px;">
</div>
<div class="col-sm-9" ng-view>
<noscript>
<div class="alert alert-danger">
<strong>Veuillez activer le JavaScript.</strong> Ce site requiert un navigateur interprêtant le JavaScript pour fonctionner. Veuillez l'activer ou en télécharger un supportant cette technologie.
</div>
</noscript>
</div>
</div>