This commit is contained in:
PMKuipers 2023-07-08 18:33:48 +02:00
parent a4f4503faf
commit a77b7c15ca
3 changed files with 23 additions and 17 deletions

View File

@ -1361,7 +1361,9 @@ export default {
:key="'c-'+lineindex+'-'+index" :key="'c-'+lineindex+'-'+index"
:slotindex="index" :slotindex="index"
:line="line" :line="line"
:plan="value"> :plan="value"
:class= "'t-studyline ' + (line.sequence==1?' first':'') + (line.sequence==numlines?' last':'')"
>
</t-studyline-slot </t-studyline-slot
><t-studyline-slot ><t-studyline-slot
type='filter' type='filter'
@ -1370,6 +1372,10 @@ export default {
:slotindex="index" :slotindex="index"
:line="line" :line="line"
:plan="value" :plan="value"
:class=" 't-studyline '
+ (line.sequence==1?' first':'')
+ (line.sequence==numlines?' last':'')
+ (index==value.slots?' end':'')"
> >
</t-studyline-slot </t-studyline-slot
></template ></template
@ -1480,7 +1486,7 @@ export default {
}, },
template: ` template: `
<div :class="'t-studyline t-studyline-heading' + ((value.sequence%2)?' odd':' even') + <div :class="'t-studyline t-studyline-heading' + ((value.sequence%2)?' odd':' even') +
(value.sequence==0?' first':'') + (value.sequence==numlines?' last':'')" (value.sequence==1?' first':'') + (value.sequence==numlines?' last':'')"
:data-studyline="value.id" :data-sequence="value.sequence" :data-numlines="numlines" :data-studyline="value.id" :data-sequence="value.sequence" :data-numlines="numlines"
><div class="t-studyline-handle" :style="'background-color: ' + value.color"></div> ><div class="t-studyline-handle" :style="'background-color: ' + value.color"></div>
<div class="t-studyline-title"> <div class="t-studyline-title">
@ -1545,7 +1551,7 @@ export default {
}, },
template: ` template: `
<div :class="'t-studyline ' + (value.sequence==0?' first':'') + (value.sequence==numlines-1?' last':'')" > <div :class="'t-studyline ' + (value.sequence==1?' first':'') + (value.sequence==numlines?' last':'')" >
<div class="t-studyline-handle" :style="'background-color: ' + value.color"></div> <div class="t-studyline-handle" :style="'background-color: ' + value.color"></div>
<div class="t-studyline-title"> <div class="t-studyline-title">
<div> <div>

View File

@ -1,3 +1,4 @@
/*eslint no-console: "off"*/
/** /**
* Copy fields from one object to another * Copy fields from one object to another
* @param {Object} target The target to move to * @param {Object} target The target to move to
@ -125,18 +126,21 @@ export function ProcessStudyplan(studyplan){
/** /**
* Update the line wrapper elements to properly display the lines between items * Update the line wrapper elements to properly display the lines between items
*
* TODO: For a short time, during the loading time of the page, the arrows get messed up if the frame is scrolled
* Somehow this is not the case after a short while. This phenomenon must be investigated.
*/ */
export function fixLineWrappers(){ export function fixLineWrappers(){
let elmLineWrappers = document.getElementsByClassName('l-leaderline-linewrapper'); let elmLineWrappers = document.getElementsByClassName('l-leaderline-linewrapper');
//debug.info("Line wrappers",elmLineWrappers); console.info("Request line wrapper fix @",(Date.now() - window.performance.timeOrigin)/1000.0);
for(let i =0; i < elmLineWrappers.length; i++){ for(let i =0; i < elmLineWrappers.length; i++){
const elm = elmLineWrappers[i]; const elm = elmLineWrappers[i];
elm.style.transform = ''; elm.style.transform = '';
let rectWrapper = elm.getBoundingClientRect(); let rectWrapper = elm.getBoundingClientRect();
//debug.info("Line wrapper",elm,rectWrapper,[window.pageXOffset,window.pageYOffset]); console.info("Line wrapper",elm,rectWrapper,(Date.now() - window.performance.timeOrigin)/1000.0);
// Move to the origin of coordinates as the document // Move to the origin of coordinates as the document
elm.style.transform = 'translate(' + elm.style.transform = 'translate(' +
((rectWrapper.left + window.pageXOffset ) * -1) + 'px, ' + ((rectWrapper.left + window.scrollX ) * -1) + 'px, ' +
((rectWrapper.top + window.pageYOffset ) * -1) + 'px)'; ((rectWrapper.top + window.scrollY ) * -1) + 'px)';
} }
} }

View File

@ -1,9 +1,5 @@
/* stylelint-disable length-zero-no-unit, color-hex-case, color-hex-length, no-eol-whitespace, unit-blacklist, block-no-empty */ /* stylelint-disable length-zero-no-unit, color-hex-case, color-hex-length, no-eol-whitespace, unit-blacklist, block-no-empty */
:root {
}
.t-toolbox-preface { .t-toolbox-preface {
margin: 10px; margin: 10px;
} }
@ -62,17 +58,19 @@ ul.dropdown-menu.show {
} }
.t-studyline { .t-studyline {
width: min-content;
display: grid; display: grid;
grid-auto-flow: column; grid-auto-flow: column;
/*border-bottom-style: solid;*/ /*border-bottom-style: solid;*/
border-right-style: solid;
border-color: #cccccc; border-color: #cccccc;
border-width: 1px; border-width: 1px;
} }
.t-studyline:first-child { .t-studyline.t-studyline-heading {
border-top-style: solid; border-right-style: none;
}
.t-studyline.end {
border-right-style: solid;
} }
.t-studyline .controlbox { .t-studyline .controlbox {
@ -124,7 +122,6 @@ ul.dropdown-menu.show {
border-color: rgba(0, 0, 0, 0.125); border-color: rgba(0, 0, 0, 0.125);
border-width: 1px; border-width: 1px;
border-left-style: solid; border-left-style: solid;
border-right-style: solid;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
@ -548,7 +545,6 @@ a.t-item-course-config {
display: grid; display: grid;
grid-auto-flow: column; grid-auto-flow: column;
/*border-bottom-style: solid;*/ /*border-bottom-style: solid;*/
border-right-style: solid;
border-color: #cccccc; border-color: #cccccc;
border-width: 1px; border-width: 1px;
} }