avec les ;

This commit is contained in:
iziram 2023-06-02 16:58:15 +02:00
parent 42d33c9a41
commit 0ea99e1a06
3 changed files with 52 additions and 44 deletions

View File

@ -12,13 +12,13 @@
const t_start = {{ t_start }}; const t_start = {{ t_start }};
const t_end = {{ t_end }}; const t_end = {{ t_end }};
const tick_time = 60 / {{ tick_time }} const tick_time = 60 / {{ tick_time }};
const tick_delay = 1 / tick_time const tick_delay = 1 / tick_time;
const period_default = {{ periode_defaut }}; const period_default = {{ periode_defaut }};
function createTicks() { function createTicks() {
let i = t_start let i = t_start;
while (i <= t_end) { while (i <= t_end) {
const hourTick = document.createElement("div"); const hourTick = document.createElement("div");
@ -33,7 +33,7 @@
timelineContainer.appendChild(tickLabel); timelineContainer.appendChild(tickLabel);
if (i < t_end) { if (i < t_end) {
let j = Math.floor(i + 1) let j = Math.floor(i + 1);
while (i < j) { while (i < j) {
i += tick_delay; i += tick_delay;
@ -44,39 +44,35 @@
quarterTick.style.left = `${computePercentage(i, t_start)}%`; quarterTick.style.left = `${computePercentage(i, t_start)}%`;
timelineContainer.appendChild(quarterTick); timelineContainer.appendChild(quarterTick);
} }
} }
i = j i = j;
} }
} }
} }
function numberToTime(num) { function numberToTime(num) {
const integer = Math.floor(num) const integer = Math.floor(num);
const decimal = (num % 1) * 60 const decimal = (num % 1) * 60;
let dec = `:${decimal}` let dec = `:${decimal}`;
if (decimal < 10) { if (decimal < 10) {
dec = `:0${decimal}` dec = `:0${decimal}`;
} }
let int = `${integer}` let int = `${integer}`;
if (integer < 10) { if (integer < 10) {
int = `0${integer}` int = `0${integer}`;
} }
return int + dec return int + dec;
} }
function snapToQuarter(value) { function snapToQuarter(value) {
return Math.round(value * tick_time) / tick_time; return Math.round(value * tick_time) / tick_time;
} }
function setupTimeLine(callback) { function setupTimeLine(callback) {
const func_call = callback ? callback : () => { } const func_call = callback ? callback : () => { };
timelineContainer.addEventListener("mousedown", (event) => { timelineContainer.addEventListener("mousedown", (event) => {
const startX = event.clientX; const startX = event.clientX;
@ -96,9 +92,9 @@
"mouseup", "mouseup",
() => { () => {
generateAllEtudRow(); generateAllEtudRow();
snapHandlesToQuarters() snapHandlesToQuarters();
document.removeEventListener("mousemove", onMouseMove); document.removeEventListener("mousemove", onMouseMove);
func_call() func_call();
}, },
{ once: true } { once: true }
); );
@ -111,7 +107,8 @@
const deltaX = moveEvent.clientX - startX; const deltaX = moveEvent.clientX - startX;
const containerWidth = timelineContainer.clientWidth; const containerWidth = timelineContainer.clientWidth;
const newWidth = const newWidth =
startWidth + ((isLeftHandle ? -deltaX : deltaX) / containerWidth) * 100; startWidth +
((isLeftHandle ? -deltaX : deltaX) / containerWidth) * 100;
if (isLeftHandle) { if (isLeftHandle) {
const newLeft = startLeft + (deltaX / containerWidth) * 100; const newLeft = startLeft + (deltaX / containerWidth) * 100;
@ -125,13 +122,12 @@
document.addEventListener( document.addEventListener(
"mouseup", "mouseup",
() => { () => {
snapHandlesToQuarters() snapHandlesToQuarters();
generateAllEtudRow(); generateAllEtudRow();
document.removeEventListener("mousemove", onMouseMove); document.removeEventListener("mousemove", onMouseMove);
func_call() func_call();
}, },
{ once: true } { once: true }
); );
@ -140,7 +136,6 @@
} }
function adjustPeriodPosition(newLeft, newWidth) { function adjustPeriodPosition(newLeft, newWidth) {
const snappedLeft = snapToQuarter(newLeft); const snappedLeft = snapToQuarter(newLeft);
const snappedWidth = snapToQuarter(newWidth); const snappedWidth = snapToQuarter(newWidth);
const minLeft = 0; const minLeft = 0;
@ -157,59 +152,72 @@
const widthPercentage = parseFloat(periodTimeLine.style.width); const widthPercentage = parseFloat(periodTimeLine.style.width);
const startHour = (leftPercentage / 100) * (t_end - t_start) + t_start; const startHour = (leftPercentage / 100) * (t_end - t_start) + t_start;
const endHour = ((leftPercentage + widthPercentage) / 100) * (t_end - t_start) + t_start; const endHour =
((leftPercentage + widthPercentage) / 100) * (t_end - t_start) + t_start;
const startValue = snapToQuarter(startHour); const startValue = snapToQuarter(startHour);
const endValue = snapToQuarter(endHour); const endValue = snapToQuarter(endHour);
const computedValues = [Math.max(startValue, t_start), Math.min(t_end, endValue)] const computedValues = [
Math.max(startValue, t_start),
Math.min(t_end, endValue),
];
if (computedValues[0] > t_end || computedValues[1] < t_start) { if (computedValues[0] > t_end || computedValues[1] < t_start) {
return [t_start, min(t_end, t_start + period_default)] return [t_start, min(t_end, t_start + period_default)];
} }
if (computedValues[1] - computedValues[0] <= tick_delay && computedValues[1] < t_end - tick_delay) { if (
computedValues[1] - computedValues[0] <= tick_delay &&
computedValues[1] < t_end - tick_delay
) {
computedValues[1] += tick_delay; computedValues[1] += tick_delay;
} }
return computedValues return computedValues;
} }
function setPeriodValues(deb, fin) { function setPeriodValues(deb, fin) {
deb = snapToQuarter(deb) deb = snapToQuarter(deb);
fin = snapToQuarter(fin) fin = snapToQuarter(fin);
let leftPercentage = (deb - t_start) / (t_end - t_start) * 100 let leftPercentage = ((deb - t_start) / (t_end - t_start)) * 100;
let widthPercentage = (fin - deb) / (t_end - t_start) * 100 let widthPercentage = ((fin - deb) / (t_end - t_start)) * 100;
periodTimeLine.style.left = `${leftPercentage}%` periodTimeLine.style.left = `${leftPercentage}%`;
periodTimeLine.style.width = `${widthPercentage}%` periodTimeLine.style.width = `${widthPercentage}%`;
snapHandlesToQuarters() snapHandlesToQuarters();
generateAllEtudRow(); generateAllEtudRow();
} }
function snapHandlesToQuarters() { function snapHandlesToQuarters() {
const periodValues = getPeriodValues(); const periodValues = getPeriodValues();
let lef = Math.min(computePercentage(periodValues[0], t_start), computePercentage(t_end, tick_delay)) let lef = Math.min(
computePercentage(periodValues[0], t_start),
computePercentage(t_end, tick_delay)
);
if (lef < 0) { if (lef < 0) {
lef = 0; lef = 0;
} }
const left = `${lef}%` const left = `${lef}%`;
let wid = Math.max(computePercentage(periodValues[1], periodValues[0]), computePercentage(tick_delay, 0)) let wid = Math.max(
computePercentage(periodValues[1], periodValues[0]),
computePercentage(tick_delay, 0)
);
if (wid > 100) { if (wid > 100) {
wid = 100; wid = 100;
} }
const width = `${wid}%` const width = `${wid}%`;
periodTimeLine.style.left = left; periodTimeLine.style.left = left;
periodTimeLine.style.width = width; periodTimeLine.style.width = width;
} }
function computePercentage(a, b) { function computePercentage(a, b) {
return ((a - b) / (t_end - t_start)) * 100 return ((a - b) / (t_end - t_start)) * 100;
} }
createTicks(); createTicks();
setPeriodValues(t_start, t_start + period_default) setPeriodValues(t_start, t_start + period_default);
</script> </script>
<style> <style>

View File

@ -602,7 +602,7 @@ def _timeline(formsemestre_id=None) -> HTMLElement:
"assiduites/timeline.j2", "assiduites/timeline.j2",
t_start=get_time("assi_morning_time", "08:00:00"), t_start=get_time("assi_morning_time", "08:00:00"),
t_end=get_time("assi_afternoon_time", "18:00:00"), t_end=get_time("assi_afternoon_time", "18:00:00"),
tick_time=ScoDocSiteConfig.get("assi_tick_time", 0.25), tick_time=ScoDocSiteConfig.get("assi_tick_time", 15),
periode_defaut=sco_preferences.get_preference( periode_defaut=sco_preferences.get_preference(
"periode_defaut", formsemestre_id "periode_defaut", formsemestre_id
), ),

View File

@ -217,7 +217,7 @@ def config_assiduites():
form.afternoon_time.data = ScoDocSiteConfig.get( form.afternoon_time.data = ScoDocSiteConfig.get(
"assi_afternoon_time", datetime.time(18, 0, 0) "assi_afternoon_time", datetime.time(18, 0, 0)
) )
form.tick_time.data = float(ScoDocSiteConfig.get("assi_tick_time", 0.25)) form.tick_time.data = float(ScoDocSiteConfig.get("assi_tick_time", 15))
return render_template( return render_template(
"assiduites/config_assiduites.j2", "assiduites/config_assiduites.j2",
form=form, form=form,