frontend: rework refresh loop

This commit is contained in:
nemunaire 2018-12-01 16:14:34 +01:00
parent 0414c392bf
commit 8702db568c
2 changed files with 160 additions and 104 deletions

View File

@ -16,7 +16,7 @@
</head>
<body class="bg-light">
<div class="navbar navbar-expand-lg navbar-dark bg-dark text-light">
<div class="navbar navbar-expand-lg navbar-dark bg-dark text-light" ng-controller="CountdownController">
<div class="container">
<div class="col-md-auto">
<a href="https://www.forum-fic.com/" ng-if="!(time.remaining === undefined || my.team_id)">

View File

@ -42,65 +42,70 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
});
$locationProvider.html5Mode(true);
})
.run(function($rootScope, $interval) {
.run(function($rootScope) {
$rootScope.current_theme = 0;
$rootScope.current_exercice = 0;
$rootScope.current_tag = undefined;
$rootScope.time = {};
})
.controller("CountdownController", function($scope, $rootScope, $interval) {
var time;
if (sessionStorage.userService)
time = angular.fromJson(sessionStorage.userService);
$scope.time = {};
$rootScope.recvTime = function(response) {
sessionStorage.userService = angular.toJson({
time = {
"cu": Math.floor(response.headers("x-fic-time") * 1000),
"he": (new Date()).getTime(),
});
};
sessionStorage.userService = angular.toJson(time);
}
function updTime() {
if (sessionStorage.userService && $rootScope.settings) {
var time = angular.fromJson(sessionStorage.userService);
var settings = $rootScope.settings;
if (time && $rootScope.settings) {
var srv_cur = new Date(Date.now() + (time.cu - time.he));
if (Math.floor(settings.start / 1000) == Math.floor(srv_cur / 1000)) {
// Refresh on start time reached
if (Math.floor($rootScope.settings.start / 1000) == Math.floor(srv_cur / 1000))
$rootScope.refresh(true);
}
var remain = 0;
if (settings.start == 0) {
$rootScope.time = {};
if ($rootScope.settings.start == 0) {
$scope.time = {};
return
} else if (settings.start > srv_cur) {
$rootScope.startIn = Math.floor((settings.start - srv_cur) / 1000);
remain = settings.end - settings.start;
} else if (settings.end > srv_cur) {
} else if ($rootScope.settings.start > srv_cur) {
$rootScope.startIn = Math.floor(($rootScope.settings.start - srv_cur) / 1000);
remain = $rootScope.settings.end - $rootScope.settings.start;
} else if ($rootScope.settings.end > srv_cur) {
$rootScope.startIn = 0;
remain = settings.end - srv_cur;
remain = $rootScope.settings.end - srv_cur;
}
remain = remain / 1000;
if (remain < 0) {
remain = 0;
$rootScope.time.end = true;
$rootScope.time.expired = true;
$scope.time.end = true;
$scope.time.expired = true;
} else if (remain < 60) {
$rootScope.time.end = false;
$rootScope.time.expired = true;
$scope.time.end = false;
$scope.time.expired = true;
} else {
$rootScope.time.end = false;
$rootScope.time.expired = false;
$scope.time.end = false;
$scope.time.expired = false;
}
$rootScope.time.remaining = remain;
$rootScope.time.hours = Math.floor(remain / 3600);
$rootScope.time.minutes = Math.floor((remain % 3600) / 60);
$rootScope.time.seconds = Math.floor(remain % 60);
$scope.time.remaining = remain;
$scope.time.hours = Math.floor(remain / 3600);
$scope.time.minutes = Math.floor((remain % 3600) / 60);
$scope.time.seconds = Math.floor(remain % 60);
}
}
updTime();
$interval(updTime, 1000);
})
.controller("DataController", function($sce, $scope, $http, $rootScope, $timeout, $location) {
.controller("DataController", function($sce, $scope, $http, $rootScope, $interval, $location) {
var actMenu = function() {
if ($scope.my && $scope.themes) {
var tags = {};
@ -128,54 +133,98 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
$scope.tags = tags;
}
}
$rootScope.refresh = function(justMy) {
if (!justMy) {
$timeout.cancel($scope.cbr);
$scope.cbr = $timeout($rootScope.refresh, 42000);
$http.get("/settings.json").then(function(response) {
$rootScope.recvTime(response);
response.data.start = new Date(response.data.start);
response.data.end = new Date(response.data.end);
response.data.generation = new Date(response.data.generation);
$rootScope.settings = response.data;
});
$http.get("/themes.json").then(function(response) {
$scope.themes = response.data;
$scope.max_gain = 0;
$scope.max_solved = 0;
$scope.themesUrl = {};
$scope.exercicesUrl = {};
angular.forEach(response.data, function(theme, key) {
$scope.themesUrl[theme.urlid] = key;
this[key].exercice_count = Object.keys(theme.exercices).length;
this[key].exercice_coeff_max = 0;
this[key].gain = 0;
this[key].solved = 0;
angular.forEach(theme.exercices, function(ex, k) {
$scope.exercicesUrl[ex.urlid] = k;
this.gain += ex.gain;
this.solved += ex.solved;
this.exercice_coeff_max = Math.max(this.exercice_coeff_max, ex.curcoeff);
}, theme);
$scope.max_gain += theme.gain;
$scope.max_solved = Math.max($scope.max_solved, theme.solved);
}, response.data);
actMenu();
});
$http.get("/teams.json").then(function(response) {
var teams = response.data;
$scope.teams_count = Object.keys(teams).length
$scope.teams = teams;
$scope.rank = [];
angular.forEach($scope.teams, function(team, tid) {
team.id = tid;
this.push(team);
}, $scope.rank);
});
}
var refreshSettingsInterval
var refreshSettings = function() {
if (refreshSettingsInterval)
$interval.cancel(refreshSettingsInterval);
refreshSettingsInterval = $interval(refreshSettings, Math.floor(Math.random() * 24000) + 32000);
$http.get("/settings.json").then(function(response) {
$rootScope.recvTime(response);
response.data.start = new Date(response.data.start);
response.data.end = new Date(response.data.end);
response.data.generation = new Date(response.data.generation);
$rootScope.settings = response.data;
});
}
var refreshThemesInterval
var refreshThemes = function() {
if (refreshThemesInterval)
$interval.cancel(refreshThemesInterval);
refreshThemesInterval = $interval(refreshThemes, Math.floor(Math.random() * 24000) + 32000);
$http.get("/themes.json").then(function(response) {
$scope.themes = response.data;
$scope.max_gain = 0;
$scope.max_solved = 0;
$scope.themesUrl = {};
$scope.exercicesUrl = {};
angular.forEach(response.data, function(theme, key) {
$scope.themesUrl[theme.urlid] = key;
this[key].exercice_count = Object.keys(theme.exercices).length;
this[key].exercice_coeff_max = 0;
this[key].gain = 0;
this[key].solved = 0;
angular.forEach(theme.exercices, function(ex, k) {
$scope.exercicesUrl[ex.urlid] = k;
this.gain += ex.gain;
this.solved += ex.solved;
this.exercice_coeff_max = Math.max(this.exercice_coeff_max, ex.curcoeff);
}, theme);
$scope.max_gain += theme.gain;
$scope.max_solved = Math.max($scope.max_solved, theme.solved);
}, response.data);
actMenu();
});
}
var refreshTeamsInterval;
$rootScope.refreshTeams = function() {
if (refreshTeamsInterval)
$interval.cancel(refreshTeamsInterval);
refreshTeamsInterval = $interval($rootScope.refreshTeams, Math.floor(Math.random() * 24000) + 32000);
$http.get("/teams.json").then(function(response) {
var teams = response.data;
$scope.teams_count = Object.keys(teams).length
$scope.teams = teams;
$scope.rank = [];
angular.forEach($scope.teams, function(team, tid) {
team.id = tid;
this.push(team);
}, $scope.rank);
});
}
var refreshMyInterval;
var refreshMy = function() {
if (refreshMyInterval)
$interval.cancel(refreshMyInterval);
refreshMyInterval = $interval(refreshMy, Math.floor(Math.random() * 24000) + 24000);
$http.get("/my.json").then(function(response) {
$scope.my = response.data;
if (response.data.team_id == 0) {
angular.forEach(response.data.exercices, function(exercice, eid) {
angular.forEach(exercice.hints, function(hint, hid) {
if ($scope.my && $scope.my.exercices[eid] && $scope.my.exercices[eid].hints[hid] && $scope.my.exercices[eid].hints[hid].hidden !== undefined)
response.data.exercices[eid].hints[hid].hidden = $scope.my.exercices[eid].hints[hid].hidden;
else
response.data.exercices[eid].hints[hid].hidden = true;
});
});
}
$rootScope.recvMy(response.data);
}, function(response) {
if (!$scope.my && response.status == 404) {
$location.url("/register");
}
});
}
$rootScope.recvMy = function(data) {
$scope.my = data;
angular.forEach($scope.my.exercices, function(exercice, eid) {
exercice.solved = exercice.solved_rank > 0;
if (exercice.video_uri) {
@ -183,19 +232,15 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
}
});
actMenu();
if ($scope.my.team_id == 0) {
angular.forEach($scope.my.exercices, function(exercice, eid) {
angular.forEach(exercice.hints, function(hint, hid) {
$scope.my.exercices[eid].hints[hid].hidden = true;
});
});
}
}, function(response) {
if (!$scope.my && response.status == 404) {
$location.url("/register");
}
});
console.log("refresh!");
}
$rootScope.refresh = function(justMy) {
if (!justMy) {
refreshSettings();
refreshThemes();
$rootScope.refreshTeams();
}
refreshMy();
}
$rootScope.refresh();
})
@ -219,27 +264,29 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
$rootScope.current_exercice = 0;
}
var cbh;
$scope.hsubmit = function(hint) {
hint.submitted = true;
$scope.hinterror = null;
$http({ url: "/openhint/" + $rootScope.current_exercice, method: "POST", data: { id: hint.id } }).then(function(response, status, header, config) {
$http({ url: "/openhint/" + $rootScope.current_exercice, method: "POST", data: { id: hint.id } }).then(function(response) {
var checkDiffHint = function() {
$http.get("/my.json").then(function(response) {
var my = response.data;
angular.forEach(my.exercices[$rootScope.current_exercice].hints, function(h,hid){
if (hint.id == h.id) {
if (hint.content != h.content) {
$rootScope.refresh();
$rootScope.recvMy(my);
} else {
$timeout.cancel($scope.cbh);
$scope.cbh = $timeout(checkDiffHint, 750);
if (cbh)
$timeout.cancel(cbh);
cbh = $timeout(checkDiffHint, 750);
}
}
});
});
};
checkDiffHint();
}, function(response, status, header, config) {
}, function(response) {
$scope.hinterror = response.data.errmsg;
hint.submitted = false;
});
@ -248,10 +295,14 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
.controller("SubmissionController", function($scope, $http, $rootScope, $timeout) {
$rootScope.sberr = "";
var cbs;
var cbd;
$scope.$watch("my", function(my) {
if (!my || !my.exercices || !my.exercices[$rootScope.current_exercice]) {
$timeout.cancel($scope.cbs);
$scope.cbs = $timeout(waitMy, 420);
if (cbs)
$timeout.cancel(cbs);
cbs = $timeout(waitMy, 420);
} else {
angular.forEach(my.exercices[$rootScope.current_exercice].mcqs, function(mcq,qid) {
angular.forEach(mcq["choices"], function(choice,cid) {
@ -346,11 +397,12 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
$http.get("/my.json").then(function(response) {
var my = response.data;
if ($scope.my.exercices[$rootScope.current_exercice].tries != my.exercices[$rootScope.current_exercice].tries || $scope.my.exercices[$rootScope.current_exercice].solved_time != my.exercices[$rootScope.current_exercice].solved_time) {
$rootScope.refresh();
$scope.my = my;
$rootScope.recvMy(my);
$rootScope.refreshTeams();
} else {
$timeout.cancel($scope.cbd);
$scope.cbd = $timeout(checkDiff, 750);
if (cbd)
$timeout.cancel(cbd);
cbd = $timeout(checkDiff, 750);
}
});
};
@ -382,6 +434,8 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
$rootScope.message = "";
$rootScope.sberr = "";
var cbt;
$scope.tsubmit = function() {
$rootScope.sberr = "";
if ($scope.newName.length < 1) {
@ -404,7 +458,7 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
url: "/submit/name",
method: "POST",
data: {newName: $scope.newName}
}).then(function(response, status, header, config) {
}).then(function(response) {
$rootScope.messageClass = {"text-success": true};
$rootScope.message = response.data.errmsg;
@ -413,18 +467,20 @@ angular.module("FICApp", ["ngRoute", "ngSanitize"])
if ($scope.my.name != response.data.name) {
$scope.newName = "";
$rootScope.message = "";
$rootScope.refresh();
$rootScope.recvMy(response.data);
$rootScope.refreshTeams();
} else {
$timeout.cancel($scope.cbt);
$scope.cbt = $timeout(checkDiff, 750);
if (cbt)
$timeout.cancel(cbt);
cbt = $timeout(checkDiff, 750);
}
});
};
checkDiff();
}, function(response, status, header, config) {
}, function(response) {
$rootScope.messageClass = {"text-danger": true};
$rootScope.message = response.data.errmsg;
if (status != 402) {
if (response.status != 402) {
$rootScope.sberr = "Une erreur est survenue lors de l'envoi. Veuillez réessayer dans quelques instants.";
}
});