teach/adlin
Archived
0
0
Fork 0
Code Issues 1 Pull Requests 4 Releases Activity

dashboard: extract progress and visual changes

Browse Source
This commit is contained in:
nemunaire 2021-03-05 15:10:16 +01:00
parent 764a790b11
commit f47eb68505
3 changed files with 45 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
token-validator/htdocs/dashboard.html
View File

@ -24,7 +24,7 @@
height: calc(100vh / 5 - 0.3vh);
margin-left: 0.2%;
margin-bottom: 0.2vh;
width: calc(100vw / 13 - 0.22vw);
width: calc(100vw / 13 - 0.26vw);
}
.student-title {
width: calc(2 * (100vw / 13 - 0.22vw) + 0.2vw);
@ -47,7 +47,7 @@
.login {
max-width: 122px;
}
.badge {
.badge.badge-sm {
font-size: 59%;
padding: .15em .35em;
}
@ -108,7 +108,7 @@
</div>
</div>
<div class="card student d-flex flex-column justify-content-between" ng-repeat="(login, mychallenges) in students" style="background-image: url('https://photos.cri.epita.fr/square/{{ mychallenges.img | lowercase }}')">
<div class="card student d-flex flex-column justify-content-between" ng-repeat="(login, mychallenges) in students" ng-if="login != 'nemunaire'" style="background-image: url('https://photos.cri.epita.fr/square/{{ mychallenges.img | lowercase }}')">
<h5 class="login text-truncate" title="{{ login }}">
<span class="badge" ng-class="{'badge-success': mychallenges['ping'] && mychallenges['ping'].recent < 120, 'badge-info': mychallenges['ping'] && mychallenges['ping'].recent >= 120 && mychallenges['ping'].recent < 300, 'badge-warning': mychallenges['ping'] && mychallenges['ping'].recent >= 300 && mychallenges['ping'].recent < 900, 'badge-danger': mychallenges['ping'] && mychallenges['ping'].recent >= 900, 'badge-dark': !mychallenges['ping']}" title="{{ mychallenges['ping'].time }}">
&#x1f4bb;
@ -116,7 +116,7 @@
<a class="text-dark" href="/dashboard/{{login}}">{{ login }}</a>
</h5>
<div class="d-flex flex-wrap justify-content-around" style="padding: 0">
<span class="badge" style="margin-left: .07rem" ng-repeat="(ch,t) in tuto_progress[tutoid]" ng-class="{'badge-warning': mychallenges[ch] && mychallenges[ch].recent && (tutoid != 0 && mychallenges[ch].recent > 300), 'badge-info': mychallenges[ch] && mychallenges[ch].recent && mychallenges[ch].recent <= 300 && mychallenges[ch].recent >= 120, 'badge-success': mychallenges[ch] && mychallenges[ch].recent && (tutoid == 0 || mychallenges[ch].recent < 120), 'badge-danger': !mychallenges[ch]}" title="{{ t.title }} @ {{ mychallenges[ch].time | date: 'medium' }} {{ mychallenges[ch].recent }}" ng-bind="t.label"></span>
<span class="badge badge-sm" style="margin-left: .07rem" ng-repeat="(ch,t) in tuto_progress[tutoid]" ng-class="{'badge-warning': mychallenges[ch] && mychallenges[ch].recent && (tutoid != 0 && mychallenges[ch].recent > 300), 'badge-info': mychallenges[ch] && mychallenges[ch].recent && mychallenges[ch].recent <= 300 && mychallenges[ch].recent >= 120, 'badge-success': mychallenges[ch] && mychallenges[ch].recent && (tutoid == 0 || mychallenges[ch].recent < 120), 'badge-danger': !mychallenges[ch]}" title="{{ t.title }} @ {{ mychallenges[ch].time | date: 'medium' }} {{ mychallenges[ch].recent }}" ng-bind="t.icon"></span>
</div>
</div>
</div>
@ -126,6 +126,7 @@
<script src="js/angular-resource.min.js"></script>
<script src="js/angular-route.min.js"></script>
<script src="js/angular-sanitize.min.js"></script>
<script src="js/adlin-common.js"></script>
<script src="js/adlin-dashboard.js"></script>
</body>
</html>

28
token-validator/htdocs/js/adlin-common.js Normal file
View File

@ -0,0 +1,28 @@
var tuto_progress = [
{
1: { title: "Is alive?", icon: "👋", label: "Token 1"},
2: { title: "DMZ reached", icon: "📚", label: "Token 2"},
3: { title: "HTTPS on + time", icon: "⏲", label: "Token 3"},
4: { title: "DNS ok", icon: "🍰", label: "Token 4"},
5: { title: "On Internet", icon: "🌎", label: "Token 5"},
6: { title: "Bonus caché", icon: "b", label: "Bonus 0"},
7: { title: "Bonus ICMP", icon: "🏓", label: "Bonus 1"},
8: { title: "Bonus disk", icon: "💽", label: "Bonus 2"},
9: { title: "Bonus email", icon: "📧", label: "Bonus 3"},
10: { title: "Wg tunnel", icon: "🚇", label: "Tunnel up"},
11: { title: "Uploaded SSH key", icon: "💊", label: "SSH"},
},
{
100: { title: "HTTP on IP", icon: "0", label: "HTTP IP"},
101: { title: "HTTP on associated domain", icon: "1", label: "HTTP domain"},
102: { title: "HTTPS on associated domain", icon: "2", label: "HTTPS domain"},
103: { title: "DNS Delegation", icon: "3", label: "DNS"},
104: { title: "HTTP on delegated domain", icon: "4", label: "HTTP on NS"},
105: { title: "HTTPS on delegated domain", icon: "5", label: "HTTPS on NS"},
106: { title: "Matrix", icon: "6", label: "Matrix"},
107: { title: "DNSSEC (bonus)", icon: "7", label: "DNSSEC"},
},
{
200: { title: "HTTP", label: "HTTP"},
},
];

47
token-validator/htdocs/js/adlin-dashboard.js
View File

@ -1,32 +1,3 @@
var tuto_progress = [
{
1: { title: "Is alive?", label: "👋"},
2: { title: "DMZ reached", label: "📚"},
3: { title: "HTTPS on + time", label: "⏲"},
4: { title: "DNS ok", label: "🍰"},
5: { title: "On Internet", label: "🌎"},
6: { title: "Bonus caché", label: "b"},
7: { title: "Bonus ICMP", label: "🏓"},
8: { title: "Bonus disk", label: "💽"},
9: { title: "Bonus email", label: "📧"},
10: { title: "Wg tunnel", label: "🚇"},
11: { title: "Uploaded SSH key", label: "💊"},
},
{
100: { title: "HTTP", label: "HTTP"},
101: { title: "HTTPS", label: "HTTPS"},
102: { title: "DNS", label: "DNS"},
103: { title: "Matrix", label: "Matrix"},
},
{
200: { title: "HTTP", label: "HTTP"},
201: { title: "HTTPS", label: "HTTPS"},
202: { title: "DNS", label: "DNS"},
203: { title: "Matrix", label: "Matrix"},
},
];
angular.module("AdLinApp", ["ngResource", "ngSanitize"])
.factory("Student", function($resource) {
return $resource("/api/students/:studentId", { studentId: '@id' }, {
@ -65,7 +36,8 @@ angular.module("AdLinApp")
var refreshStd = function() {
$scope.students = Student.query();
}
$interval(refreshStd, 1600000);
var myinterval = $interval(refreshStd, 1600000);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})
.controller("StudentsProgressionController", function($scope, $interval, Progression) {
$scope.tuto_progress = tuto_progress;
@ -109,7 +81,8 @@ angular.module("AdLinApp")
})
}
refreshStd();
$interval(refreshStd, 9750);
var myinterval = $interval(refreshStd, 9750);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})
.controller("StudentProgressionController", function($scope, $interval, $http, Student, StudentProgression) {
$scope.tuto_progress = tuto_progress;
@ -133,7 +106,8 @@ angular.module("AdLinApp")
}
$scope.$watch("onestudent", function(onestudent) {
refreshStd();
$interval(refreshStd, 15000);
var myinterval = $interval(refreshStd, 15000);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})
})
.controller("PingController", function($scope, $interval, $http) {
@ -150,7 +124,8 @@ angular.module("AdLinApp")
$scope.$watch("student", function(student) {
student.$promise.then(function(std) {
refreshPing();
$interval(refreshPing, 15000);
var myinterval = $interval(refreshPing, 15000);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})
})
})
@ -162,7 +137,8 @@ angular.module("AdLinApp")
});
}
refreshSSH();
$interval(refreshSSH, 15500);
var myinterval = $interval(refreshSSH, 15500);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})
.controller("ProgressionController", function($scope, $interval, $http) {
$scope.tuto_progress = tuto_progress;
@ -179,5 +155,6 @@ angular.module("AdLinApp")
});
}
refreshChal();
$interval(refreshChal, 15750);
var myinterval = $interval(refreshChal, 15750);
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
})