\n \n \n \x3c!-- New Tab Button (Using tabs-end slot) --\x3e\n \n \n \n {{page.shortname}}\n \n \n \n {{text.studyline_name}} \n \n \n \n \n {{text.studyline_shortname}} \n \n \n \n \n \n {{text.studyline_color}} \n \n \n \x3c!-- hsluv-picker v-model="create.studyline.color" horizontal displaysize="175" >\n \n \n \n \n \n \n {{ text.studyline_name}} \n \n \n \n \n \n {{ text.studyline_shortname}} \n \n \n \n \n \n {{ text.studyline_color}} \n \n \n \n \n \n \n \n \n \n
\n '}),Vue.component("t-studyline-heading",{props:{value:{type:Object,default:function(){return{}}},layers:{type:Number,default:1}},data:()=>({layerHeights:{}}),created(){ItemEventBus.$on("lineHeightChange",this.onLineHeightChange)},computed:{},methods:{onLineHeightChange(lineid,layerid,newheight){if(this.$refs.main&&lineid==this.value.id){const items=document.querySelectorAll(`.t-studyline-slot-0[data-studyline='${this.value.id}']`);let heightSum=0;items.forEach((el=>{const height=el.getBoundingClientRect().height;heightSum+=height}));const heightStyle=`${heightSum}px`;this.$refs.main.style.height=heightStyle}}},template:'\n \n
\n \n {{ text.studyline_editmode }} \n {{ text.toolbox_toggle}} \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n
\n {{ text.editmode_modules_hidden}}
\n \n \n \n \x3c!-- Now paint the headings column --\x3e\n
\n \n \n
\n \x3c!-- Next, paint all the cells in the scrollable --\x3e\n \n
\n \n \x3c!-- add period information --\x3e \n \n
\n \n
\n '}),Vue.component("t-studyline-edit",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),computed:{deletable(){const slots=this.value.slots;if(Array.isArray(slots)){let count=0;for(let i=0;i\n {{ value.shortname }}\n
\n --{{ hover.type }}--\n
\n '}),Vue.component("t-item-timing-checker",{props:{value:{type:Object},page:{type:Object},period:{type:Object},maxspan:{type:Number},hidden:{type:Boolean,default:!1}},computed:{endperiod(){const endperiodnr=Math.min(this.page.periods,this.period.period+(this.value.span-1));return this.page.perioddesc[endperiodnr-1]},course_period_matches(){const self=this;return self.value&&"course"==self.value.type?(self.datechanger.coursespan=(0,_dateHelper.datespaninfo)(self.value.course.startdate,self.value.course.enddate),self.datechanger.periodspan=(0,_dateHelper.datespaninfo)(self.period.startdate,self.endperiod.enddate),self.datechanger.coursespan.first.getTime()==self.datechanger.periodspan.first.getTime()&&self.datechanger.coursespan.last.getTime()==self.datechanger.periodspan.last.getTime()):(debug.warn("Timing thing not proper configured",self.value,self.period,self.maxspan),!1)}},data:()=>({id:Math.floor(Math.random()*Date.now()).toString(16),text:strings.course_timing,datechanger:{coursespan:null,periodspan:null,globals:datechanger_globals}}),methods:{validate_course_period(force){const self=this;debug.info("Validating course and period"),self.course_period_matches?debug.info("Course timing matches period",self.datechanger):(debug.info("Course timing does not match period timing"),self.value.course.canupdatecourse?self.hidden&&self.datechanger.globals.default?self.datechanger.globals.defaultvalue&&self.change_course_period():this.$bvModal.show("t-course-timing-matching-"+this.id):self.hidden&&self.datechanger.globals.hidewarn||this.$bvModal.show("t-course-timing-warning-"+this.id))},change_course_period(){const self=this;return self.datechanger.globals.default&&(self.datechanger.globals.defaultvalue=!0),(0,_ajax.call)([{methodname:"local_treestudyplan_course_period_timing",args:{period_id:self.period.id,course_id:this.value.course.id,span:this.value.span}}])[0].fail(_notification.default.exception).done((response=>{self.value.course.startdate=response.startdate,self.value.course.enddate=response.enddate,self.value.course.timing=response.timing,self.$emit("input",self.value)}))},change_span(span){const self=this;return(0,_ajax.call)([{methodname:"local_treestudyplan_set_studyitem_span",args:{id:self.value.id,span:span}}])[0].fail(_notification.default.exception).done((response=>{self.value.span=response.span,self.$emit("input",self.value),self.$nextTick((()=>{self.validate_course_period()}))}))},format_duration(dsi){let s="";return 1==dsi.years?s+=`1 ${this.text.year}, `:dsi.years>1&&(s+=`${dsi.years} ${this.text.years}, `),1==dsi.weeks?s+=`1 ${this.text.week}, `:dsi.weeks>1&&(s+=`${dsi.weeks} ${this.text.weeks}, `),1==dsi.days?s+=`1 ${this.text.day}, `:dsi.days>1&&(s+=`${dsi.days} ${this.text.days}, `),s.toLocaleLowerCase()}},template:'\n \n \n \n \n \n \n \n \n {{ text.periodspan\n }} \n {{ n }} \n {{\n (value.span == 1)?text.period.toLowerCase():text.periods.toLowerCase()\n }}\n \n \n \n \n {{ text.desc }} \n \n \n \n \n \n \n {{ text.rememberchoice }} \n \n \n \n \n {{ text.desc }} \n \n \n "6">\n \n \n \n {{ text.hidewarning }} \n \n \n
\n '}),Vue.component("t-item",{props:{value:{type:Object,default:()=>null},dummy:{type:Boolean,default:()=>!1},plan:{type:Object,default:()=>null},line:{type:Object,default:()=>null},page:{type:Object,default:()=>null},period:{type:Object,default:()=>null},maxspan:{type:Number,default:()=>0}},data:()=>({dragLine:null,dragEventListener:null,deleteMode:!1,condition_options:string_keys.conditions,text:strings.item_text,showContext:!1,lines:[]}),methods:{dragStart(event){this.deleteMode=!1;let start=document.getElementById("studyitem-"+this.value.id),dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.position="fixed",dragelement.style.left=event.position.x+"px",dragelement.style.top=event.position.y+"px",this.dragLine=new _simpleline.SimpleLine(start,dragelement,{color:"#777",gravity:{start:1.3,end:1.3}}),document.addEventListener("mousemove",this.onMouseMove)},dragEnd(){null!==this.dragLine&&this.dragLine.remove();let dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.removeProperty("left"),dragelement.style.removeProperty("top"),dragelement.style.removeProperty("position"),document.removeEventListener("mousemove",this.onMouseMove)},onMouseMove:function(event){let dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.position="fixed",dragelement.style.left=event.clientX+"px",dragelement.style.top=event.clientY+"px"},onDrop(event){let from_id=event.data.id,to_id=this.value.id;this.redrawLines(),(0,_ajax.call)([{methodname:"local_treestudyplan_connect_studyitems",args:{from_id:from_id,to_id:to_id}}])[0].done((response=>{let conn={id:response.id,from_id:response.from_id,to_id:response.to_id};ItemEventBus.$emit("createdConnection",conn),this.value.connections.in.push(conn)})).fail(_notification.default.exception)},redrawLine(conn){const start=document.getElementById(`studyitem-${conn.from_id}`),end=document.getElementById(`studyitem-${conn.to_id}`);this.lines[conn.to_id]&&(this.lines[conn.to_id].remove(),delete this.lines[conn.to_id]),null!==start&&null!==end&&isVisible(start)&&isVisible(end)&&(this.lines[conn.to_id]=new _simpleline.SimpleLine(start,end,{color:"var(--success)",gravity:{start:1.3,end:1.3}}))},deleteLine(conn){const self=this;(0,_ajax.call)([{methodname:"local_treestudyplan_disconnect_studyitems",args:{from_id:conn.from_id,to_id:conn.to_id}}])[0].done((response=>{if(response.success){this.removeLine(conn),ItemEventBus.$emit("connectionDisconnected",conn);let index=self.value.connections.out.indexOf(conn);self.value.connections.out.splice(index,1)}})).fail(_notification.default.exception)},highlight(conn){this.lines[conn.to_id]&&this.lines[conn.to_id].setConfig({color:"var(--danger)"})},normalize(conn){this.lines[conn.to_id]&&this.lines[conn.to_id].setConfig({color:"var(--success)"})},updateItem(){(0,_ajax.call)([{methodname:"local_treestudyplan_edit_studyitem",args:{id:this.value.id,conditions:this.value.conditions,continuation_id:this.value.continuation_id}}])[0].fail(_notification.default.exception)},doShowContext(event){this.hasContext&&(this.showContext=!0,event.preventDefault())},redrawLines(){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.out){let conn=this.value.connections.out[i];this.redrawLine(conn)}},onCreatedConnection(conn){conn.from_id==this.value.id&&(this.value.connections.out.push(conn),this.redrawLine(conn))},onRemovedConnection(conn){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.in){let c_in=this.value.connections.in[i];conn.id==c_in.id&&self.value.connections.out.splice(i,1)}},onRePositioned(){this.redrawLines()},onDisPositioned(re_id){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.out){let conn=this.value.connections.out[i];conn.to_id==re_id&&this.removeLine(conn)}},onItemDeleted(item_id){const self=this;if(this.value.connections&&this.value.connections.out)for(const i in this.value.connections.out){let conn=this.value.connections.out[i];conn.to_id==item_id&&(self.removeLine(conn),self.value.connections.out.splice(i,1))}if(this.value.connections&&this.value.connections.in)for(const i in this.value.connections.in){this.value.connections.in[i].from_id==item_id&&self.value.connections.out.splice(i,1)}},onRedrawLines(){this.redrawLines()},removeLine(conn){this.lines[conn.to_id]&&(this.lines[conn.to_id].remove(),delete this.lines[conn.to_id])},deleteItem(){const self=this,msgparams={item:this.text["type_"+this.value.type].toLocaleLowerCase(),name:"course"==this.value.type?this.value.course.displayname:"",line:this.line?this.line.name:"",period:this.period?this.period.fullname:this.plan.name};this.$bvModal.msgBoxConfirm((0,_stringHelper.strformat)(this.text.item_delete_message,msgparams),{okVariant:"danger",okTitle:this.text.ok,cancelTitle:this.text.cancel}).then((value=>{value&&(0,_ajax.call)([{methodname:"local_treestudyplan_delete_studyitem",args:{id:self.value.id}}])[0].done((function(response){1==response.success&&self.$emit("deleted",{data:self.value})})).fail(_notification.default.exception)})).catch((err=>{debug.console.error(err)}))}},computed:{hasConnectionsOut(){return!["finish"].includes(this.value.type)},hasConnectionsIn(){return!["start"].includes(this.value.type)},hasContext(){return["start","junction","finish"].includes(this.value.type)}},created(){this.dummy||(ItemEventBus.$on("createdConnection",this.onCreatedConnection),ItemEventBus.$on("removedConnection",this.onRemovedConnection),ItemEventBus.$on("rePositioned",this.onRePositioned),ItemEventBus.$on("disPositioned",this.onDisPositioned),ItemEventBus.$on("itemDeleted",this.onItemDeleted),ItemEventBus.$on("redrawLines",this.onRedrawLines))},mounted(){this.dummy||(this.redrawLines(),setTimeout((()=>{ItemEventBus.$emit("rePositioned",this.value.id)}),10))},beforeDestroy(){if(!this.dummy){for(let i in this.value.connections.out){let conn=this.value.connections.out[i];this.removeLine(conn)}ItemEventBus.$emit("disPositioned",this.value.id),ItemEventBus.$off("createdConnection",this.onCreatedConnection),ItemEventBus.$off("removedConnection",this.onRemovedConnection),ItemEventBus.$off("rePositioned",this.onRePositioned),ItemEventBus.$off("disPositioned",this.onDisPositioned),ItemEventBus.$off("itemDeleted",this.onItemDeleted),ItemEventBus.$off("redrawLines",this.onRedrawLines)}},beforeUpdate(){},updated(){this.dummy||this.redrawLines()},template:'\n {{ text.question }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} - {{ endperiod.fullname }}
\n{{ period.shortname }} - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
{{ text.warning }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} - {{ endperiod.fullname }}
\n{{ period.shortname }} - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {{ text.ok }}\n \n \n\n \n
\n '}),Vue.component("t-item-invalid",{props:{value:{type:Object,default:function(){return null}}},data:()=>({text:strings.invalid}),methods:{},template:'\n \n '}),Vue.component("t-item-course",{props:{value:{type:Object,default:()=>null},plan:{type:Object,default:()=>null},page:{type:Object,default:()=>null},period:{type:Object,default:()=>null},maxspan:{type:Number,default:()=>0}},data:()=>({condition_options:string_keys.conditions,text:strings.item_course_text}),computed:{useItemConditions(){return!(!this.plan||!this.plan.aggregation_info||void 0===this.plan.aggregation_info.useItemConditions)&&this.plan.aggregation_info.useItemConditions},configurationState(){return this.hasGrades()||this.hasCompletions()?"t-configured-ok":"t-configured-alert"},configurationIcon(){return this.hasGrades()||this.hasCompletions()?"check":"exclamation-circle"},startdate(){return(0,_dateHelper.format_date)(this.value.course.startdate)},enddate(){return this.value.course.enddate?(0,_dateHelper.format_date)(this.value.course.enddate):this.text.noenddate}},methods:{hasGrades(){if(this.value.course.grades&&this.value.course.grades.length>0)for(const g of this.value.course.grades)if(g.selected)return!0;return!1},hasCompletions(){if(this.value.course.completion&&this.value.course.completion.conditions)for(const cgroup of this.value.course.completion.conditions)if(cgroup.items&&cgroup.items.length>0)return!0;return!1},includeChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:newValue,required:g.required}}])[0].fail(_notification.default.exception)},requiredChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:g.selected,required:newValue}}])[0].fail(_notification.default.exception)},updateConditions(){(0,_ajax.call)([{methodname:"local_treestudyplan_edit_studyitem",args:{id:this.value.id,conditions:this.value.conditions}}])[0].fail(_notification.default.exception)}},created(){},template:'\n \n \n \n \n
\n \n \n \n \n \n 0\'\n v-model=\'value\' :plan="plan"\n >\n \n\n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n
\n '}),Vue.component("t-item-course-grades",{props:{value:{type:Object,default:()=>null},plan:{type:Object,default:()=>null}},data:()=>({condition_options:string_keys.conditions,text:strings.item_course_text}),computed:{useRequiredGrades(){return!(!this.plan||!this.plan.aggregation_info||void 0===this.plan.aggregation_info.useRequiredGrades)&&this.plan.aggregation_info.useRequiredGrades},selectedgrades(){let list=[];for(let ix in this.value.course.grades){let g=this.value.course.grades[ix];g.selected&&list.push(g)}return list}},methods:{includeChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:newValue,required:g.required}}])[0].fail(_notification.default.exception)},requiredChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:g.selected,required:newValue}}])[0].fail(_notification.default.exception)}},created(){},template:'\n \n
\n \n \n
\n \n \n \n {{ value.course.displayname }}\n \n
\n \n
\n {{ value.course.fullname }}\n \n
\n {{ value.course.context.path.join(" / ")}} / {{value.course.shortname}}\n\n \n
\n \n\n \n {{text[\'coursetiming_\'+value.course.timing]}}
\n {{ startdate }} - {{ enddate }}\n
\n \n {{ startdate }} - {{ enddate }}\n
\n
\n '}),Vue.component("t-item-course-completion",{props:{value:{type:Object,default:function(){return{}}},guestmode:{type:Boolean,default:!1},course:{type:Object,default:function(){return{}}}},data:()=>({text:strings.completion}),created(){const self=this;let stringkeys=[];for(const key in this.text)stringkeys.push({key:key,component:"local_treestudyplan"});(0,_str.get_strings)(stringkeys).then((function(strings){let i=0;for(const key in self.text)self.text[key]=strings[i],i++}))},computed:{hasCompletions(){if(this.value.conditions)for(const cgroup of this.value.conditions)if(cgroup.items&&cgroup.items.length>0)return!0;return!1}},methods:{completion_icon(completion){switch(completion){case"progress":return"exclamation-circle";case"complete":case"complete-pass":return"check-circle";case"complete-fail":return"times-circle";default:return"circle-o"}},completion_tag:cgroup=>cgroup.completion?"completed":"incomplete"},template:"\n - \n
- \n {{text.grade_include}}{{text.grade_require}}\n \n
- \n
\n \n \n \n
| {{ text.aggregation_overall_all}}{{ text.aggregation_overall_any}} | \n|
| {{text.completion_not_configured}}!\n {{text.configure_completion}}\n | \n |
| 1\"\n >{{ text.aggregation_all}}{{ text.aggregation_any}}\n {{cgroup.title}} | \n|
|---|---|
| \n | \n\n {{ci.details.requirement}}\n | \n
\n \n
\n "}),Vue.component("t-item-finish",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),methods:{},template:"\n \n \n
\n "}),Vue.component("t-item-start",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),created(){},methods:{},template:"\n \n \n
\n "}),Vue.component("t-item-badge",{props:{value:{type:Object,default:function(){return{badge:{}}}}},data:()=>({txt:strings,text:strings.item_text}),methods:{},template:'\n \n \n \n \n \n \n \n ![]()
\n \n \n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n\n
\n '}),Vue.component("t-coursecat-list",{props:{value:{type:Array,default:function(){return{}}}},data:()=>({}),methods:{},template:'\n \n
\n \n \n {{ value.badge.name }}
\n{{value.badge.description}}
\n- \n
- \n
- \n
{{ text.advanced_cascade_cohortsync_title}}
\n{{ text.advanced_cascade_cohortsync_desc}}
\n{{ text.advanced_bulk_course_timing}}
\n{{ text.advanced_bulk_course_timing_desc}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{ text.advanced_force_scale_title}}
\n {{ text.advanced_force_scale_desc}}\n\n
- \n
- \n {{c.course.fullname}}\n
- \n
- \n {{text.advanced_converted}}{{text.advanced_skipped}}{{text.advanced_error}} \n
\n
{{ text.advanced_backup }}
\n{{ text.advanced_restore }}
\n{{ text.advanced_export }}
\n{{text.advanced_purge_page_expl}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{text.advanced_purge_plan_expl}}
\n\n \n \n \x3c!-- New Tab Button (Using tabs-end slot) --\x3e\n \n \n \n {{page.shortname}}\n \n \n \n {{text.studyline_name}} \n \n \n \n \n {{text.studyline_shortname}} \n \n \n \n \n \n {{text.studyline_color}} \n \n \n \x3c!-- hsluv-picker v-model="create.studyline.color" horizontal displaysize="175" >\n \n \n \n \n \n \n {{ text.studyline_name}} \n \n \n \n \n \n {{ text.studyline_shortname}} \n \n \n \n \n \n {{ text.studyline_color}} \n \n \n \n \n \n \n \n \n \n
\n '}),Vue.component("t-studyline-heading",{props:{value:{type:Object,default:function(){return{}}},layers:{type:Number,default:1}},data:()=>({layerHeights:{}}),created(){ItemEventBus.$on("lineHeightChange",this.onLineHeightChange)},computed:{},methods:{onLineHeightChange(lineid,layerid,newheight){if(this.$refs.main&&lineid==this.value.id){const items=document.querySelectorAll(`.t-studyline-slot-0[data-studyline='${this.value.id}']`);let heightSum=0;items.forEach((el=>{const height=el.getBoundingClientRect().height;heightSum+=height}));const heightStyle=`${heightSum}px`;this.$refs.main.style.height=heightStyle}}},template:'\n \n
\n \n {{ text.studyline_editmode }} \n {{ text.toolbox_toggle}} \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n
\n {{ text.editmode_modules_hidden}}
\n \n \n \n \x3c!-- Now paint the headings column --\x3e\n
\n \n \n
\n \x3c!-- Next, paint all the cells in the scrollable --\x3e\n \n
\n \n \x3c!-- add period information --\x3e \n \n
\n \n
\n '}),Vue.component("t-studyline-edit",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),computed:{deletable(){const slots=this.value.slots;if(Array.isArray(slots)){let count=0;for(let i=0;i\n {{ value.shortname }}\n
\n --{{ hover.type }}--\n
\n '}),Vue.component("t-item-timing-checker",{props:{value:{type:Object},page:{type:Object},period:{type:Object},maxspan:{type:Number},hidden:{type:Boolean,default:!1}},computed:{endperiod(){const endperiodnr=Math.min(this.page.periods,this.period.period+(this.value.span-1));return this.page.perioddesc[endperiodnr-1]},course_period_matches(){const self=this;return self.value&&"course"==self.value.type?(self.datechanger.coursespan=(0,_dateHelper.datespaninfo)(self.value.course.startdate,self.value.course.enddate),self.datechanger.periodspan=(0,_dateHelper.datespaninfo)(self.period.startdate,self.endperiod.enddate),self.datechanger.coursespan.first.getTime()==self.datechanger.periodspan.first.getTime()&&self.datechanger.coursespan.last.getTime()==self.datechanger.periodspan.last.getTime()):(debug.warn("Timing thing not proper configured",self.value,self.period,self.maxspan),!1)}},data:()=>({id:Math.floor(Math.random()*Date.now()).toString(16),text:strings.course_timing,datechanger:{coursespan:null,periodspan:null,globals:datechanger_globals}}),methods:{validate_course_period(force){const self=this;debug.info("Validating course and period"),self.course_period_matches?debug.info("Course timing matches period",self.datechanger):(debug.info("Course timing does not match period timing"),self.value.course.canupdatecourse?self.hidden&&self.datechanger.globals.default?self.datechanger.globals.defaultvalue&&self.change_course_period():this.$bvModal.show("t-course-timing-matching-"+this.id):self.hidden&&self.datechanger.globals.hidewarn||this.$bvModal.show("t-course-timing-warning-"+this.id))},change_course_period(){const self=this;return self.datechanger.globals.default&&(self.datechanger.globals.defaultvalue=!0),(0,_ajax.call)([{methodname:"local_treestudyplan_course_period_timing",args:{period_id:self.period.id,course_id:this.value.course.id,span:this.value.span}}])[0].fail(_notification.default.exception).done((response=>{self.value.course.startdate=response.startdate,self.value.course.enddate=response.enddate,self.value.course.timing=response.timing,self.$emit("input",self.value)}))},change_span(span){const self=this;return(0,_ajax.call)([{methodname:"local_treestudyplan_set_studyitem_span",args:{id:self.value.id,span:span}}])[0].fail(_notification.default.exception).done((response=>{self.value.span=response.span,self.$emit("input",self.value),self.$nextTick((()=>{self.validate_course_period()}))}))},format_duration(dsi){let s="";return 1==dsi.years?s+=`1 ${this.text.year}, `:dsi.years>1&&(s+=`${dsi.years} ${this.text.years}, `),1==dsi.weeks?s+=`1 ${this.text.week}, `:dsi.weeks>1&&(s+=`${dsi.weeks} ${this.text.weeks}, `),1==dsi.days?s+=`1 ${this.text.day}, `:dsi.days>1&&(s+=`${dsi.days} ${this.text.days}, `),s.toLocaleLowerCase()}},template:'\n \n \n \n \n \n \n \n \n {{ text.periodspan\n }} \n {{ n }} \n {{\n (value.span == 1)?text.period.toLowerCase():text.periods.toLowerCase()\n }}\n \n \n \n \n {{ text.desc }} \n \n \n \n \n \n \n {{ text.rememberchoice }} \n \n \n \n \n {{ text.desc }} \n \n \n "6">\n \n \n \n {{ text.hidewarning }} \n \n \n
\n '}),Vue.component("t-item",{props:{value:{type:Object,default:()=>null},dummy:{type:Boolean,default:()=>!1},plan:{type:Object,default:()=>null},line:{type:Object,default:()=>null},page:{type:Object,default:()=>null},period:{type:Object,default:()=>null},maxspan:{type:Number,default:()=>0}},data:()=>({dragLine:null,dragEventListener:null,deleteMode:!1,condition_options:string_keys.conditions,text:strings.item_text,showContext:!1,lines:[]}),methods:{dragStart(event){this.deleteMode=!1;let start=document.getElementById("studyitem-"+this.value.id),dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.position="fixed",dragelement.style.left=event.position.x+"px",dragelement.style.top=event.position.y+"px",this.dragLine=new _simpleline.SimpleLine(start,dragelement,{color:"#777",gravity:{start:1.3,end:1.3}}),document.addEventListener("mousemove",this.onMouseMove)},dragEnd(){null!==this.dragLine&&this.dragLine.remove();let dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.removeProperty("left"),dragelement.style.removeProperty("top"),dragelement.style.removeProperty("position"),document.removeEventListener("mousemove",this.onMouseMove)},onMouseMove:function(event){let dragelement=document.getElementById("t-item-cdrag-"+this.value.id);dragelement.style.position="fixed",dragelement.style.left=event.clientX+"px",dragelement.style.top=event.clientY+"px"},onDrop(event){let from_id=event.data.id,to_id=this.value.id;this.redrawLines(),(0,_ajax.call)([{methodname:"local_treestudyplan_connect_studyitems",args:{from_id:from_id,to_id:to_id}}])[0].done((response=>{let conn={id:response.id,from_id:response.from_id,to_id:response.to_id};ItemEventBus.$emit("createdConnection",conn),this.value.connections.in.push(conn)})).fail(_notification.default.exception)},redrawLine(conn){const start=document.getElementById(`studyitem-${conn.from_id}`),end=document.getElementById(`studyitem-${conn.to_id}`);this.lines[conn.to_id]&&(this.lines[conn.to_id].remove(),delete this.lines[conn.to_id]),null!==start&&null!==end&&isVisible(start)&&isVisible(end)&&(this.lines[conn.to_id]=new _simpleline.SimpleLine(start,end,{color:"var(--success)",gravity:{start:1.3,end:1.3}}))},deleteLine(conn){const self=this;(0,_ajax.call)([{methodname:"local_treestudyplan_disconnect_studyitems",args:{from_id:conn.from_id,to_id:conn.to_id}}])[0].done((response=>{if(response.success){this.removeLine(conn),ItemEventBus.$emit("connectionDisconnected",conn);let index=self.value.connections.out.indexOf(conn);self.value.connections.out.splice(index,1)}})).fail(_notification.default.exception)},highlight(conn){this.lines[conn.to_id]&&this.lines[conn.to_id].setConfig({color:"var(--danger)"})},normalize(conn){this.lines[conn.to_id]&&this.lines[conn.to_id].setConfig({color:"var(--success)"})},updateItem(){(0,_ajax.call)([{methodname:"local_treestudyplan_edit_studyitem",args:{id:this.value.id,conditions:this.value.conditions,continuation_id:this.value.continuation_id}}])[0].fail(_notification.default.exception)},doShowContext(event){this.hasContext&&(this.showContext=!0,event.preventDefault())},redrawLines(){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.out){let conn=this.value.connections.out[i];this.redrawLine(conn)}},onCreatedConnection(conn){conn.from_id==this.value.id&&(this.value.connections.out.push(conn),this.redrawLine(conn))},onRemovedConnection(conn){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.in){let c_in=this.value.connections.in[i];conn.id==c_in.id&&self.value.connections.out.splice(i,1)}},onRePositioned(){this.redrawLines()},onDisPositioned(re_id){if(this.value.connections&&this.value.connections.out)for(let i in this.value.connections.out){let conn=this.value.connections.out[i];conn.to_id==re_id&&this.removeLine(conn)}},onItemDeleted(item_id){const self=this;if(this.value.connections&&this.value.connections.out)for(const i in this.value.connections.out){let conn=this.value.connections.out[i];conn.to_id==item_id&&(self.removeLine(conn),self.value.connections.out.splice(i,1))}if(this.value.connections&&this.value.connections.in)for(const i in this.value.connections.in){this.value.connections.in[i].from_id==item_id&&self.value.connections.out.splice(i,1)}},onRedrawLines(){this.redrawLines()},removeLine(conn){this.lines[conn.to_id]&&(this.lines[conn.to_id].remove(),delete this.lines[conn.to_id])},deleteItem(){const self=this,msgparams={item:this.text["type_"+this.value.type].toLocaleLowerCase(),name:"course"==this.value.type?this.value.course.displayname:"",line:this.line?this.line.name:"",period:this.period?this.period.fullname:this.plan.name};this.$bvModal.msgBoxConfirm((0,_stringHelper.strformat)(this.text.item_delete_message,msgparams),{okVariant:"danger",okTitle:this.text.ok,cancelTitle:this.text.cancel}).then((value=>{value&&(0,_ajax.call)([{methodname:"local_treestudyplan_delete_studyitem",args:{id:self.value.id}}])[0].done((function(response){1==response.success&&self.$emit("deleted",{data:self.value})})).fail(_notification.default.exception)})).catch((err=>{debug.console.error(err)}))}},computed:{hasConnectionsOut(){return!["finish"].includes(this.value.type)},hasConnectionsIn(){return!["start"].includes(this.value.type)},hasContext(){return["start","junction","finish"].includes(this.value.type)}},created(){this.dummy||(ItemEventBus.$on("createdConnection",this.onCreatedConnection),ItemEventBus.$on("removedConnection",this.onRemovedConnection),ItemEventBus.$on("rePositioned",this.onRePositioned),ItemEventBus.$on("disPositioned",this.onDisPositioned),ItemEventBus.$on("itemDeleted",this.onItemDeleted),ItemEventBus.$on("redrawLines",this.onRedrawLines))},mounted(){this.dummy||(this.redrawLines(),setTimeout((()=>{ItemEventBus.$emit("rePositioned",this.value.id)}),10))},beforeDestroy(){if(!this.dummy){for(let i in this.value.connections.out){let conn=this.value.connections.out[i];this.removeLine(conn)}ItemEventBus.$emit("disPositioned",this.value.id),ItemEventBus.$off("createdConnection",this.onCreatedConnection),ItemEventBus.$off("removedConnection",this.onRemovedConnection),ItemEventBus.$off("rePositioned",this.onRePositioned),ItemEventBus.$off("disPositioned",this.onDisPositioned),ItemEventBus.$off("itemDeleted",this.onItemDeleted),ItemEventBus.$off("redrawLines",this.onRedrawLines)}},beforeUpdate(){},updated(){this.dummy||this.redrawLines()},template:'\n {{ text.question }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} - {{ endperiod.fullname }}
\n{{ period.shortname }} - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
{{ text.warning }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} - {{ endperiod.fullname }}
\n{{ period.shortname }} - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {{ text.ok }}\n \n \n\n \n
\n '}),Vue.component("t-item-invalid",{props:{value:{type:Object,default:function(){return null}}},data:()=>({text:strings.invalid}),methods:{},template:'\n \n '}),Vue.component("t-item-course",{props:{value:{type:Object,default:()=>null},plan:{type:Object,default:()=>null},page:{type:Object,default:()=>null},period:{type:Object,default:()=>null},maxspan:{type:Number,default:()=>0}},data:()=>({condition_options:string_keys.conditions,text:strings.item_course_text}),computed:{useItemConditions(){return!(!this.plan||!this.plan.aggregation_info||void 0===this.plan.aggregation_info.useItemConditions)&&this.plan.aggregation_info.useItemConditions},configurationState(){return this.hasGrades()||this.hasCompletions()||this.hasCompetencies()?"t-configured-ok":"t-configured-alert"},configurationIcon(){return this.hasGrades()||this.hasCompletions()||this.hasCompetencies()?"check":"exclamation-circle"},startdate(){return(0,_dateHelper.format_date)(this.value.course.startdate)},enddate(){return this.value.course.enddate?(0,_dateHelper.format_date)(this.value.course.enddate):this.text.noenddate}},methods:{hasGrades(){if(this.value.course.grades&&this.value.course.grades.length>0)for(const g of this.value.course.grades)if(g.selected)return!0;return!1},hasCompletions(){if(this.value.course.completion&&this.value.course.completion.conditions)for(const cgroup of this.value.course.completion.conditions)if(cgroup.items&&cgroup.items.length>0)return!0;return!1},hasCompetencies(){return!(!this.value.course.competency||!this.value.course.competency.competencies)&&this.value.course.competency.competencies.length>0},includeChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:newValue,required:g.required}}])[0].fail(_notification.default.exception)},requiredChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:g.selected,required:newValue}}])[0].fail(_notification.default.exception)},updateConditions(){(0,_ajax.call)([{methodname:"local_treestudyplan_edit_studyitem",args:{id:this.value.id,conditions:this.value.conditions}}])[0].fail(_notification.default.exception)}},created(){},template:'\n \n \n \n \n
\n \n \n \n \n \n 0\'\n v-model=\'value\' :plan="plan"\n >\n \n \n\n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n
\n '}),Vue.component("t-item-course-grades",{props:{value:{type:Object,default:()=>null},plan:{type:Object,default:()=>null}},data:()=>({condition_options:string_keys.conditions,text:strings.item_course_text}),computed:{useRequiredGrades(){return!(!this.plan||!this.plan.aggregation_info||void 0===this.plan.aggregation_info.useRequiredGrades)&&this.plan.aggregation_info.useRequiredGrades},selectedgrades(){let list=[];for(let ix in this.value.course.grades){let g=this.value.course.grades[ix];g.selected&&list.push(g)}return list}},methods:{includeChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:newValue,required:g.required}}])[0].fail(_notification.default.exception)},requiredChanged(newValue,g){(0,_ajax.call)([{methodname:"local_treestudyplan_include_grade",args:{grade_id:g.id,item_id:this.value.id,include:g.selected,required:newValue}}])[0].fail(_notification.default.exception)}},created(){},template:'\n \n
\n \n \n
\n \n \n \n {{ value.course.displayname }}\n \n
\n \n
\n {{ value.course.fullname }}\n \n
\n {{ value.course.context.path.join(" / ")}} / {{value.course.shortname}}\n\n \n
\n \n\n \n {{text[\'coursetiming_\'+value.course.timing]}}
\n {{ startdate }} - {{ enddate }}\n
\n \n {{ startdate }} - {{ enddate }}\n
\n
\n '}),Vue.component("t-item-course-completion",{props:{value:{type:Object,default:function(){return{}}},guestmode:{type:Boolean,default:!1},course:{type:Object,default:function(){return{}}}},data:()=>({text:strings.completion}),created(){const self=this;let stringkeys=[];for(const key in this.text)stringkeys.push({key:key,component:"local_treestudyplan"});(0,_str.get_strings)(stringkeys).then((function(strings){let i=0;for(const key in self.text)self.text[key]=strings[i],i++}))},computed:{hasCompletions(){if(this.value.conditions)for(const cgroup of this.value.conditions)if(cgroup.items&&cgroup.items.length>0)return!0;return!1}},methods:{completion_icon(completion){switch(completion){case"progress":return"exclamation-circle";case"complete":case"complete-pass":return"check-circle";case"complete-fail":return"times-circle";default:return"circle-o"}},completion_tag:cgroup=>cgroup.completion?"completed":"incomplete"},template:"\n - \n
- \n {{text.grade_include}}{{text.grade_require}}\n \n
- \n
\n \n \n \n
| {{ text.aggregation_overall_all}}{{ text.aggregation_overall_any}} | \n|
| {{text.completion_not_configured}}!\n {{text.configure_completion}}\n | \n |
| 1\"\n >{{ text.aggregation_all}}{{ text.aggregation_any}}\n {{cgroup.title}} | \n|
|---|---|
| \n | \n\n {{ci.details.requirement}}\n | \n
| {{text.competencies_not_configured}}!\n {{text.configure_competencies}}\n | \n |
| \n | \n \n | \n
\n \n
\n "}),Vue.component("t-item-finish",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),methods:{},template:"\n \n \n
\n "}),Vue.component("t-item-start",{props:{value:{type:Object,default:function(){return{}}}},data:()=>({}),created(){},methods:{},template:"\n \n \n
\n "}),Vue.component("t-item-badge",{props:{value:{type:Object,default:function(){return{badge:{}}}}},data:()=>({txt:strings,text:strings.item_text}),methods:{},template:'\n \n \n \n \n \n \n \n ![]()
\n \n \n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n\n
\n '}),Vue.component("t-coursecat-list",{props:{value:{type:Array,default:function(){return{}}}},data:()=>({}),methods:{},template:'\n \n
\n \n \n {{ value.badge.name }}
\n{{value.badge.description}}
\n- \n
- \n
- \n
{{ text.advanced_cascade_cohortsync_title}}
\n{{ text.advanced_cascade_cohortsync_desc}}
\n{{ text.advanced_bulk_course_timing}}
\n{{ text.advanced_bulk_course_timing_desc}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{ text.advanced_force_scale_title}}
\n {{ text.advanced_force_scale_desc}}\n\n
- 0\">\n
- \n {{c.course.fullname}}\n
- 0\">\n
- \n {{text.advanced_converted}}{{text.advanced_skipped}}{{text.advanced_error}} \n
\n
{{ text.advanced_backup }}
\n{{ text.advanced_restore }}
\n{{ text.advanced_export }}
\n{{text.advanced_purge_page_expl}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{text.advanced_purge_plan_expl}}
\n\n \n \n \n \n \n \n {{page.shortname}}\n \n \n \n {{text.studyline_name}} \n \n \n \n \n {{text.studyline_shortname}} \n \n \n \n \n \n {{text.studyline_color}} \n \n \n \n \n \n \n \n \n \n \n {{ text.studyline_name}} \n \n \n \n \n \n {{ text.studyline_shortname}} \n \n \n \n \n \n {{ text.studyline_color}} \n \n \n \n \n \n \n \n \n \n
\n `\n });\n\n\n /*\n * T-STUDYLINE-HEADER\n */\n Vue.component('t-studyline-heading', {\n props: {\n value : {\n type: Object, // Studyline\n default: function(){ return {};},\n },\n layers: {\n type: Number,\n default: 1,\n },\n },\n data() {\n return {\n layerHeights: {}\n };\n },\n created() {\n // Listener for the signal that a new connection was made and needs to be drawn\n // Sent by the incoming item - By convention, outgoing items are responsible for drawing the lines\n ItemEventBus.$on('lineHeightChange', this.onLineHeightChange);\n },\n computed: {\n\n },\n methods: {\n onLineHeightChange(lineid,layerid,newheight){\n // All layers for this line have the first slot send an update message on layer height change.\n // When one of those updates is received, record the height and recalculate the total height of the\n // header\n if(this.$refs.main && lineid == this.value.id){\n const items = document.querySelectorAll(\n `.t-studyline-slot-0[data-studyline='${this.value.id}']`);\n\n // determine the height of all the lines and add them up.\n let heightSum = 0;\n items.forEach((el) => {\n // getBoundingClientRect() Gets the actual fractional height instead of rounded to integer pixels\n const r = el.getBoundingClientRect();\n const height = r.height;\n heightSum += height;\n });\n\n const heightStyle=`${heightSum}px`;\n this.$refs.main.style.height = heightStyle;\n }\n }\n },\n template: `\n \n
\n \n {{ text.studyline_editmode }} \n {{ text.toolbox_toggle}} \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n
\n {{ text.editmode_modules_hidden}}
\n \n \n \n \n
\n \n \n
\n \n \n
\n \n \n \n 0\"\n v-model=\"page.perioddesc[index-1]\"\n > 1) ? add_day(page.perioddesc[index-2].startdate,2) : null\"\n :maxend=\"(index < page.periods) ? sub_day(page.perioddesc[index].enddate,2) : null\"\n > \n \n \n\n \n \n \n 0 && showslot(page,line, index, layeridx, 'gradable')\"\n type='gradable'\n v-model=\"line.slots[index].courses\"\n :key=\"'c-'+lineindex+'-'+index+'-'+layernr\"\n :slotindex=\"index\"\n :line=\"line\"\n :plan=\"value\"\n :page=\"page\"\n :period=\"page.perioddesc[index-1]\"\n :layer=\"layeridx\"\n :class=\"'t-studyline ' + ((lineindex%2==0)?' odd ':' even ')\n + ((lineindex==0 && layernr==1)?' first ':' ')\n + ((lineindex==page.studylines.length-1)?' last ':' ')\n + ((layernr == countLineLayers(line,page))?' lastlyr ':' ')\n + ((layernr == countLineLayers(line,page)+1)?' newlyr ':' ')\"\n >
\n \n
\n `,\n });\n\n /*\n * T-STUDYLINE (Used only for study line edit mode)\n */\n Vue.component('t-studyline-edit', {\n props: {\n value : {\n type: Object, // Studyline\n default: function(){ return {};},\n }\n },\n data() {\n return {\n };\n },\n computed: {\n deletable() {\n // Check if all the slots are empty\n const slots = this.value.slots;\n if(Array.isArray(slots)){\n let count = 0;\n for(let i = 0; i < slots.length; i++) {\n if(Array.isArray(slots[i].courses)){\n count += slots[i].courses.length;\n }\n if(Array.isArray(slots[i].filters)){\n count += slots[i].filters.length;\n }\n }\n return (count == 0);\n } else {\n return false;\n }\n },\n editable() {\n return true;\n }\n },\n methods: {\n onEdit() {\n this.$emit('edit',this.value);\n },\n onDelete() {\n this.$emit('delete',this.value);\n },\n\n },\n template: `\n \n `,\n });\n\n /*\n * During a redisign it was decided to have the studyline still get the entire array as a value,\n * even though it only shows one drop slot for the layer it is in. This is to make repainting easier,\n * since we modify the array for the layer we handle. FIXME: Make this less weird\n */\n Vue.component('t-studyline-slot', {\n props: {\n type : {\n type: String,\n default: 'gradable',\n },\n slotindex : {\n type: Number,\n default: '',\n },\n line : {\n type: Object,\n default(){ return null;},\n },\n layer : {\n type: Number,\n },\n value: {\n type: Array, // dict with layer as index\n default(){ return [];},\n },\n plan: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n page: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n period: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n },\n mounted() {\n const self=this;\n if(self.type == \"gradable\" && self.slotindex == 1){\n self.resizeListener = new ResizeObserver(() => {\n if(self.$refs.main){\n const size = self.$refs.main.getBoundingClientRect();\n\n ItemEventBus.$emit('lineHeightChange', self.line.id, self.layer, size.height);\n }\n }).observe(self.$refs.main);\n }\n },\n unmounted() {\n if(this.resizeListener) {\n this.resizeListener.disconnect();\n }\n },\n computed: {\n slotkey(){\n return `${this.type}'-'${this.line.id}-${this.slotindex}-${this.layer}`;\n },\n itemidx(){\n for(const ix in this.value){\n const itm = this.value[ix];\n if(itm.layer == this.layer){\n return ix;\n }\n }\n return null;\n },\n item(){\n for(const ix in this.value){\n const itm = this.value[ix];\n if(itm.layer == this.layer){\n return itm;\n }\n }\n return null;\n },\n listtype() {\n return this.type;\n },\n dragacceptlist(){\n if(this.type == \"gradable\"){\n return [\"course\", \"gradable-item\"];\n } else {\n return [\"filter\", \"filter-item\"];\n }\n },\n courseHoverDummy(){\n return {course: this.hover.component};\n },\n current(){\n if( this.period && this.period.startdate && this.period.enddate){\n const now = new Date();\n const pstart = new Date(this.period.startdate);\n const pend = new Date(this.period.enddate);\n return (now >= pstart && now < pend);\n }\n else {\n return false;\n }\n },\n spanCss(){\n if(this.item && this.item.span > 1){\n const span = (2 * this.item.span) - 1;\n return `width: 100%; grid-column: span ${span};`;\n } else {\n return \"\";\n }\n }\n },\n data() {\n return {\n text: strings.course_timing,\n resizeListener: null,\n hover: {\n component:null,\n type: null,\n },\n datechanger: {\n coursespan: null,\n periodspan: null,\n default: false,\n defaultchoice: false,\n hidewarn: false,\n }\n };\n },\n methods: {\n onDrop(event) {\n this.hover.component = null;\n this.hover.type = null;\n debug.info(event);\n const self = this;\n if(event.type.item) {\n let item = event.data;\n\n // To avoid weird visuals with the lines,\n // we add the item to the proper place in the front-end first\n item.layer = this.layer;\n item.slot = this.slotindex;\n self.value.push(item);\n self.$emit(\"input\",self.value);\n\n // then on the next tick, we inform the back end\n // Since moving things around has never been unsuccessful, unless you have other problems,\n // it's better to have nice visuals.\n self.relocateStudyItem(item).done(()=>{\n if(this.$refs.timingChecker){\n this.$refs.timingChecker.validate_course_period();\n }\n });\n }\n else if(event.type.component){\n debug.info(\"Adding new component\");\n if(event.type.type == \"gradable\"){\n call([{\n methodname: 'local_treestudyplan_add_studyitem',\n args: {\n \"line_id\": self.line.id,\n \"slot\" : self.slotindex,\n \"layer\" : self.layer,\n \"type\": 'course',\n \"details\": {\n \"competency_id\": null,\n 'conditions':'',\n 'course_id':event.data.id,\n 'badge_id':null,\n 'continuation_id':null,\n }\n }\n }])[0].done((response) => {\n let item = response;\n self.relocateStudyItem(item).done(()=>{\n self.value.push(item);\n self.$emit(\"input\",self.value);\n\n // call the validate period function on next tick,\n // since it paints the item in the slot first\n this.$nextTick(() => {\n if(this.$refs.timingChecker){\n this.$refs.timingChecker.validate_course_period();\n }\n });\n });\n }).fail(notification.exception);\n }\n else if(event.type.type == \"filter\") {\n debug.info(\"Adding new filter compenent\");\n call([{\n methodname: 'local_treestudyplan_add_studyitem',\n args: {\n \"line_id\": self.line.id,\n \"slot\" : self.slotindex,\n \"type\": event.data.type,\n \"details\":{\n \"badge_id\": event.data.badge?event.data.badge.id:undefined,\n }\n }\n }])[0].done((response) => {\n let item = response;\n self.relocateStudyItem(item).done(()=>{\n item.layer = this.layer;\n self.value.push(item);\n self.$emit(\"input\",self.value);\n });\n }).fail(notification.exception);\n }\n }\n },\n onCut(event) {\n const self=this;\n let id = event.data.id;\n for(let i = 0; i < self.value.length; i++){\n if(self.value[i].id == id){\n self.value.splice(i, 1); i--;\n break; // just remove one\n }\n }\n // Do something to signal that this item has been removed\n this.$emit(\"input\",this.value);\n },\n relocateStudyItem(item){\n const iteminfo = {'id': item.id, 'layer': this.layer, 'slot': this.slotindex, 'line_id': this.line.id};\n return call([{\n methodname: 'local_treestudyplan_reorder_studyitems',\n args: { 'items': [iteminfo] } // function was designed to relocate multiple items at once, hence the array\n }])[0].fail(notification.exception);\n },\n onDragEnter(event){\n this.hover.component = event.data;\n this.hover.type = event.type;\n },\n onDragLeave(){\n this.hover.component = null;\n this.hover.type = null;\n },\n maxSpan(){\n // Determine the maximum span for components in this slot\n // Used for setting the max in the timing adjustment screen(s)\n // And for checking the filter types\n\n // Assume this slot is first one available\n let freeIndex = this.slotindex;\n // Determine last free slot following this one in the layer\n for(let i = this.slotindex + 1; i <= this.page.periods; i++){\n if(this.line.slots && this.line.slots[i] && this.line.slots[i].courses){\n const clist = this.line.slots[i].courses;\n const flist = this.line.slots[i-1].filters; // next filter is in the same slot\n let busy = false;\n for(const ix in clist) {\n if( clist[ix].layer == this.layer) {\n busy = true; // slot is busy in this layer.\n break;\n }\n }\n for(const ix in flist) {\n if( flist[ix].layer == this.layer) {\n busy = true; // slot is busy in this layer.\n break;\n }\n }\n\n if(! busy) {\n // slot is free in this layer\n freeIndex = i;\n } else {\n break; // stop checking next slots\n }\n\n } else {\n break; // stop processing\n }\n }\n // calculate span from that\n return freeIndex - this.slotindex + 1;\n\n },\n makeType(item){\n return {\n item: true,\n component: false,\n span: item.span,\n type: this.type,\n };\n },\n checkType(type) {\n if(type.type == this.type){\n if(type == 'filter'){\n return true;\n } else if(type.span <= this.maxSpan()){\n return true;\n } else {\n return false;\n }\n } else {\n return false;\n }\n }\n },\n template: `\n \n {{ value.shortname }}\n
\n --{{ hover.type }}--\n
\n `,\n });\n\n\n Vue.component('t-item-timing-checker', {\n props: {\n value: {\n type: Object, // t-item model\n },\n page: {\n type: Object, // Studyplan data\n },\n period: {\n type: Object, // Studyplan data\n },\n maxspan: {\n type: Number,\n },\n hidden: {\n type: Boolean,\n default: false,\n }\n },\n computed: {\n endperiod() {\n const endperiodnr = Math.min(this.page.periods,this.period.period + (this.value.span - 1));\n return this.page.perioddesc[endperiodnr-1];\n },\n course_period_matches() {\n const self=this;\n if(self.value && self.value.type == 'course'){\n self.datechanger.coursespan = datespaninfo(self.value.course.startdate,self.value.course.enddate);\n self.datechanger.periodspan = datespaninfo(self.period.startdate,self.endperiod.enddate);\n if( self.datechanger.coursespan.first.getTime() == self.datechanger.periodspan.first.getTime()\n && self.datechanger.coursespan.last.getTime() == self.datechanger.periodspan.last.getTime() ){\n return true;\n }\n else {\n return false;\n }\n } else {\n debug.warn(\"Timing thing not proper configured\",self.value,self.period,self.maxspan);\n return false;\n }\n },\n },\n data() {\n return {\n // Create random id to avoid opening the wrong modals\n id: Math.floor(Math.random() * Date.now()).toString(16),\n text: strings.course_timing,\n datechanger: {\n coursespan: null,\n periodspan: null,\n globals: datechanger_globals,\n }\n };\n },\n methods: {\n\n validate_course_period(force) {\n const self = this;\n\n debug.info(\"Validating course and period\");\n if(!(self.course_period_matches)){\n debug.info(\"Course timing does not match period timing\");\n\n if(self.value.course.canupdatecourse){\n if(!self.hidden || !self.datechanger.globals.default){\n // Periods do not match, pop up the date change request\n this.$bvModal.show('t-course-timing-matching-'+this.id);\n } else if (self.datechanger.globals.defaultvalue){\n // go for it without asking\n self.change_course_period();\n }\n }\n else {\n // user is not able to change course timing - show a warning\n if(!self.hidden || !self.datechanger.globals.hidewarn){\n this.$bvModal.show('t-course-timing-warning-'+this.id);\n }\n }\n }\n else {\n debug.info(\"Course timing matches period\",self.datechanger);\n }\n },\n change_course_period() {\n const self=this;\n // Save the state\n if(self.datechanger.globals.default){\n self.datechanger.globals.defaultvalue = true;\n }\n return call([{\n methodname: 'local_treestudyplan_course_period_timing',\n args: { period_id: self.period.id,\n course_id: this.value.course.id,\n span: this.value.span,\n }\n }])[0].fail(notification.exception).done((response) => {\n self.value.course.startdate = response.startdate;\n self.value.course.enddate = response.enddate;\n self.value.course.timing = response.timing;\n self.$emit(\"input\",self.value);\n });\n },\n change_span(span) {\n const self=this;\n return call([{\n methodname: 'local_treestudyplan_set_studyitem_span',\n args: { id: self.value.id,\n span: span\n }\n }])[0].fail(notification.exception).done((response) => {\n self.value.span = response.span;\n self.$emit('input',self.value);\n self.$nextTick(() => {\n self.validate_course_period();\n });\n } );\n },\n format_duration(dsi){\n let s = \"\";\n if(dsi.years == 1){ s += `1 ${this.text.year}, `;}\n else if(dsi.years > 1){ s += `${dsi.years} ${this.text.years}, `;}\n if(dsi.weeks == 1){ s += `1 ${this.text.week}, `;}\n else if(dsi.weeks > 1){ s += `${dsi.weeks} ${this.text.weeks}, `;}\n if(dsi.days == 1){ s += `1 ${this.text.day}, `;}\n else if(dsi.days > 1){ s += `${dsi.days} ${this.text.days}, `;}\n\n return s.toLocaleLowerCase();\n },\n },\n // To avoid the span creeping in the dom where it shouldn't, set display to none if it is hidden\n // This does not affect the modals, which are rendered outside of this element when needed\n template: `\n \n \n \n \n \n \n \n \n {{ text.periodspan\n }} \n {{ n }} \n {{\n (value.span == 1)?text.period.toLowerCase():text.periods.toLowerCase()\n }}\n \n \n \n \n {{ text.desc }} \n \n \n \n \n \n \n {{ text.rememberchoice }} \n \n \n \n \n {{ text.desc }} \n \n \n \"6\">\n \n \n \n {{ text.hidewarning }} \n \n \n
\n `,\n });\n\n\n Vue.component('t-item', {\n props: {\n value :{\n type: Object,\n default(){ return null;},\n },\n dummy :{\n type: Boolean,\n default() { return false;},\n },\n plan: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n line: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n page: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n period: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n maxspan: {\n type: Number,\n default() { return 0;},\n },\n },\n data() {\n return {\n dragLine: null,\n dragEventListener: null,\n deleteMode: false,\n condition_options: string_keys.conditions,\n text: strings.item_text,\n showContext: false,\n lines: [],\n };\n },\n methods: {\n dragStart(event){\n // Add line between start point and drag image\n this.deleteMode = false;\n let start = document.getElementById('studyitem-'+this.value.id);\n let dragelement= document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.position = 'fixed';\n dragelement.style.left = event.position.x+'px';\n dragelement.style.top = event.position.y+'px';\n this.dragLine = new SimpleLine(start,dragelement,{\n color: \"#777\",\n gravity: {\n start: LINE_GRAVITY,\n end: LINE_GRAVITY,\n },\n });\n // Add separate event listener to reposition mouse move\n document.addEventListener(\"mousemove\",this.onMouseMove);\n },\n dragEnd(){\n if(this.dragLine !== null) {\n this.dragLine.remove();\n }\n let dragelement = document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.removeProperty('left');\n dragelement.style.removeProperty('top');\n dragelement.style.removeProperty('position');\n document.removeEventListener(\"mousemove\",this.onMouseMove);\n },\n onMouseMove: function(event){\n let dragelement = document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.position = 'fixed';\n dragelement.style.left = event.clientX+'px';\n dragelement.style.top = event.clientY+'px';\n // line will follow automatically\n },\n onDrop(event){\n let from_id = event.data.id;\n let to_id = this.value.id;\n this.redrawLines();\n call([{\n methodname: 'local_treestudyplan_connect_studyitems',\n args: { 'from_id': from_id, 'to_id': to_id }\n }])[0].done((response)=>{\n let conn = {'id': response.id, 'from_id': response.from_id, 'to_id': response.to_id};\n ItemEventBus.$emit(\"createdConnection\",conn);\n this.value.connections.in.push(conn);\n }).fail(notification.exception);\n },\n redrawLine(conn){\n const lineColor = \"var(--success)\";\n const start = document.getElementById(`studyitem-${conn.from_id}`);\n const end = document.getElementById(`studyitem-${conn.to_id}`);\n\n // delete old line\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].remove();\n delete this.lines[conn.to_id];\n }\n // create a new line if the start and finish items are visible\n if(start !== null && end !== null && isVisible(start) && isVisible(end)){\n this.lines[conn.to_id] = new SimpleLine( start,end,{\n color: lineColor,\n gravity: {\n start: LINE_GRAVITY,\n end: LINE_GRAVITY,\n },\n });\n }\n\n },\n deleteLine(conn){\n const self = this;\n call([{\n methodname: 'local_treestudyplan_disconnect_studyitems',\n args: { 'from_id': conn.from_id, 'to_id': conn.to_id }\n }])[0].done((response)=>{\n if(response.success){\n this.removeLine(conn);\n // send disconnect event on message bus, so the connection on the other end can delete it too\n ItemEventBus.$emit(\"connectionDisconnected\",conn);\n // Remove connection from our outgoing list\n let index = self.value.connections.out.indexOf(conn);\n self.value.connections.out.splice(index, 1);\n }\n }).fail(notification.exception);\n },\n highlight(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].setConfig({color:\"var(--danger)\",});\n }\n },\n normalize(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].setConfig({color:\"var(--success)\",});\n }\n },\n updateItem() {\n call([{\n methodname: 'local_treestudyplan_edit_studyitem',\n args: { 'id': this.value.id,\n 'conditions': this.value.conditions,\n 'continuation_id': this.value.continuation_id,}\n }])[0].fail(notification.exception);\n },\n doShowContext(event) {\n if(this.hasContext){\n this.showContext=true;\n event.preventDefault();\n }\n },\n redrawLines(){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n this.redrawLine(conn);\n }\n }\n },\n\n // EVENT LISTENERS\n onCreatedConnection(conn){\n if(conn.from_id == this.value.id){\n this.value.connections.out.push(conn);\n this.redrawLine(conn);\n }\n },\n // Listener for the signal that a connection was removed by the outgoing item\n onRemovedConnection(conn){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.in){\n let c_in = this.value.connections.in[i];\n if(conn.id == c_in.id){\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n },\n // Listener for reposition events\n // When an item in the list is repositioned, all lines need to be redrawn\n onRePositioned(){\n this.redrawLines();\n },\n // When an item is disPositioned - (temporarily) removed from the list,\n // all connections need to be deleted.\n onDisPositioned(re_id){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n if(conn.to_id == re_id){\n this.removeLine(conn);\n }\n }\n }\n },\n\n // When an item is deleted\n // all connections to/from that item need to be cleaned up\n onItemDeleted(item_id){\n const self = this;\n if(this.value.connections && this.value.connections.out){\n for(const i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n if(conn.to_id == item_id){\n self.removeLine(conn);\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n if(this.value.connections && this.value.connections.in){\n for(const i in this.value.connections.in){\n let conn = this.value.connections.in[i];\n if(conn.from_id == item_id){\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n },\n\n onRedrawLines(){\n this.redrawLines();\n },\n\n removeLine(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].remove();\n delete this.lines[conn.to_id];\n }\n },\n deleteItem(){\n const self = this;\n const msgparams = {\n item: this.text['type_' + this.value.type].toLocaleLowerCase(),\n name: (this.value.type=='course')?this.value.course.displayname:\"\",\n line: (this.line) ? this.line.name : \"\",\n period: (this.period) ? this.period.fullname : this.plan.name,\n };\n\n this.$bvModal.msgBoxConfirm(strformat(this.text.item_delete_message, msgparams), {\n okVariant : 'danger',\n okTitle : this.text.ok,\n cancelTitle: this.text.cancel,\n }).then(value => {\n if ( value ) {\n // Confirmed to delete.\n call([{\n methodname: 'local_treestudyplan_delete_studyitem',\n args: { 'id': self.value.id, }\n }])[0].done(function(response){\n if(response.success == true){\n self.$emit(\"deleted\",{ data: self.value });\n }\n }).fail(notification.exception);\n }\n }).catch(err => {\n debug.console.error(err);\n });\n }\n\n\n },\n computed: {\n hasConnectionsOut() {\n return !([\"finish\",].includes(this.value.type));\n },\n hasConnectionsIn() {\n return !([\"start\",].includes(this.value.type));\n },\n hasContext() {\n return ['start','junction','finish'].includes(this.value.type);\n }\n },\n created(){\n // Add event listeners on the message bus\n // But only if not in \"dummy\" mode - mode which is used for droplist placeholders\n // Since an item is \"fully made\" with all references, not specifying dummy mode really messes things up\n if(!this.dummy){\n\n // Listener for the signal that a new connection was made and needs to be drawn\n // Sent by the incoming item - By convention, outgoing items are responsible for drawing the lines\n ItemEventBus.$on('createdConnection', this.onCreatedConnection);\n // Listener for the signal that a connection was removed by the outgoing item\n ItemEventBus.$on('removedConnection', this.onRemovedConnection);\n // Listener for reposition events\n // When an item in the list is repositioned, all lines need to be redrawn\n ItemEventBus.$on('rePositioned', this.onRePositioned);\n // When an item is disPositioned - (temporarily) removed from the list,\n // all connections need to be deleted.\n ItemEventBus.$on('disPositioned', this.onDisPositioned);\n // When an item is deleted\n // all connections to/from that item need to be cleaned up\n ItemEventBus.$on('itemDeleted', this.onItemDeleted);\n ItemEventBus.$on('redrawLines', this.onRedrawLines);\n\n\n }\n },\n mounted(){\n // Initialize connection lines when mounting\n // But only if not in \"dummy\" mode - mode which is used for droplist placeholders\n // Since an item is \"fully made\" with all references, not specifying dummy mode really messes things up\n\n if(!this.dummy)\n {\n this.redrawLines();\n setTimeout(()=>{\n ItemEventBus.$emit(\"rePositioned\",this.value.id);\n },10);\n }\n },\n beforeDestroy(){\n if(!this.dummy) {\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n this.removeLine(conn);\n }\n ItemEventBus.$emit(\"disPositioned\",this.value.id);\n\n // Remove event listeners\n ItemEventBus.$off('createdConnection', this.onCreatedConnection);\n ItemEventBus.$off('removedConnection', this.onRemovedConnection);\n ItemEventBus.$off('rePositioned', this.onRePositioned);\n ItemEventBus.$off('disPositioned', this.onDisPositioned);\n ItemEventBus.$off('itemDeleted', this.onItemDeleted);\n ItemEventBus.$off('redrawLines', this.onRedrawLines);\n }\n },\n beforeUpdate(){\n },\n updated(){\n if(!this.dummy) {\n this.redrawLines();\n }\n },\n template: `\n {{ text.question }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} 1\"> - {{ endperiod.fullname }}
\n{{ period.shortname }} 1\"> - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
{{ text.warning }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} 1\"> - {{ endperiod.fullname }}
\n{{ period.shortname }} 1\"> - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {{ text.ok }}\n \n \n\n \n
\n `,\n });\n\n Vue.component('t-item-invalid', {\n props: {\n 'value' :{\n type: Object,\n default: function(){ return null;},\n },\n },\n data() {\n return {\n text: strings.invalid,\n };\n },\n methods: {\n },\n template: `\n \n `,\n });\n\n Vue.component('t-item-course', {\n props: {\n value:{\n type: Object,\n default(){ return null;},\n },\n plan:{\n type: Object,\n default(){ return null;},\n },\n page: {\n type: Object, // PAge data\n default() { return null;}\n },\n period: {\n type: Object, // Period data\n default() { return null;}\n },\n maxspan: {\n type: Number,\n default() { return 0;}\n },\n },\n data() {\n return {\n condition_options: string_keys.conditions,\n text: strings.item_course_text,\n };\n },\n computed: {\n useItemConditions() {\n if(this.plan && this.plan.aggregation_info && this.plan.aggregation_info.useItemConditions !== undefined){\n return this.plan.aggregation_info.useItemConditions;\n }\n else {\n return false;\n }\n },\n\n configurationState(){\n if(this.hasGrades() || this.hasCompletions()) {\n return \"t-configured-ok\";\n } else {\n return \"t-configured-alert\";\n }\n },\n\n configurationIcon(){\n if(this.hasGrades() || this.hasCompletions()) {\n return \"check\";\n } else {\n return \"exclamation-circle\";\n }\n },\n startdate(){\n return format_date(this.value.course.startdate);\n },\n enddate(){\n if(this.value.course.enddate){\n return format_date(this.value.course.enddate);\n }\n else {\n return this.text.noenddate;\n }\n }\n\n },\n methods: {\n hasGrades() {\n if(this.value.course.grades && this.value.course.grades.length > 0){\n for(const g of this.value.course.grades){\n if(g.selected){\n return true;\n }\n }\n }\n return false;\n },\n hasCompletions() {\n if(this.value.course.completion && this.value.course.completion.conditions) {\n for(const cgroup of this.value.course.completion.conditions){\n if(cgroup.items && cgroup.items.length > 0){\n return true;\n }\n }\n }\n return false;\n },\n includeChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': newValue,\n 'required': g.required,\n }\n }])[0].fail(notification.exception);\n },\n requiredChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': g.selected,\n 'required': newValue,\n }\n }])[0].fail(notification.exception);\n },\n updateConditions() {\n call([{\n methodname: 'local_treestudyplan_edit_studyitem',\n args: { 'id': this.value.id,\n 'conditions': this.value.conditions,\n }\n }])[0].fail(notification.exception);\n },\n },\n created() {\n\n },\n template: `\n 0\"\n >\n \n \n \n
\n \n \n \n \n \n \n \n\n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n
\n `,\n });\n\n\n Vue.component('t-item-course-grades', {\n props: {\n 'value' :{\n type: Object,\n default(){ return null;},\n },\n 'plan' :{\n type: Object,\n default(){ return null;},\n },\n },\n data() {\n return {\n condition_options: string_keys.conditions,\n text: strings.item_course_text,\n };\n },\n computed: {\n useRequiredGrades() {\n if(this.plan && this.plan.aggregation_info && this.plan.aggregation_info.useRequiredGrades !== undefined){\n return this.plan.aggregation_info.useRequiredGrades;\n }\n else {\n return false;\n }\n },\n selectedgrades(){\n let list = [];\n for(let ix in this.value.course.grades){\n let g = this.value.course.grades[ix];\n if(g.selected){\n list.push(g);\n }\n }\n return list;\n },\n },\n methods: {\n includeChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': newValue,\n 'required': g.required,\n }\n }])[0].fail(notification.exception);\n },\n requiredChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': g.selected,\n 'required': newValue,\n }\n }])[0].fail(notification.exception);\n },\n },\n created() {\n\n },\n template: `\n \n
\n \n \n
\n \n \n \n {{ value.course.displayname }}\n \n
\n \n
\n {{ value.course.fullname }}\n \n
\n {{ value.course.context.path.join(\" / \")}} / {{value.course.shortname}}\n\n \n
\n \n\n \n {{text['coursetiming_'+value.course.timing]}}
\n {{ startdate }} - {{ enddate }}\n
\n \n {{ startdate }} - {{ enddate }}\n
\n
\n `,\n });\n\n Vue.component('t-item-course-completion',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n guestmode: {\n type: Boolean,\n default: false,\n },\n course: {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n text: strings.completion,\n };\n },\n created(){\n const self = this;\n // Get text strings for condition settings\n let stringkeys = [];\n for(const key in this.text){\n stringkeys.push({ key: key, component: 'local_treestudyplan'});\n }\n get_strings(stringkeys).then(function(strings){\n let i = 0;\n for(const key in self.text){\n self.text[key] = strings[i];\n i++;\n }\n });\n },\n computed: {\n hasCompletions() {\n if(this.value.conditions) {\n for(const cgroup of this.value.conditions){\n if(cgroup.items && cgroup.items.length > 0){\n return true;\n }\n }\n }\n return false;\n },\n },\n methods: {\n completion_icon(completion) {\n switch(completion){\n case \"progress\":\n return \"exclamation-circle\";\n case \"complete\":\n return \"check-circle\";\n case \"complete-pass\":\n return \"check-circle\";\n case \"complete-fail\":\n return \"times-circle\";\n default: // case \"incomplete\"\n return \"circle-o\";\n }\n },\n\n completion_tag(cgroup){\n return cgroup.completion?'completed':'incomplete';\n }\n },\n template: `\n - \n
- \n {{text.grade_include}}{{text.grade_require}}\n \n
- \n
\n \n \n \n
| {{ text.aggregation_overall_all}}{{ text.aggregation_overall_any}} | \n|
| {{text.completion_not_configured}}!\n {{text.configure_completion}}\n | \n |
| 1\"\n >{{ text.aggregation_all}}{{ text.aggregation_any}}\n {{cgroup.title}} | \n|
|---|---|
| \n | \n\n {{ci.details.requirement}}\n | \n
\n \n
\n `,\n });\n\n Vue.component('t-item-finish',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n methods: {\n },\n template: `\n \n \n
\n `,\n });\n\n Vue.component('t-item-start',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n created(){\n\n },\n methods: {\n },\n template: `\n \n \n
\n `,\n });\n\n Vue.component('t-item-badge',{\n props: {\n value : {\n type: Object,\n default: function(){ return { badge: {}};},\n },\n },\n data() {\n return {\n txt: strings,\n text: strings.item_text,\n };\n },\n methods: {\n },\n template: `\n \n \n \n \n \n \n \n ![]()
\n \n \n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n\n
\n `,\n });\n\n Vue.component('t-coursecat-list',{\n props: {\n value : {\n type: Array,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n methods: {\n },\n template: `\n \n
\n \n \n {{ value.badge.name }}
\n{{value.badge.description}}
\n- \n
- \n
- \n
{{ text.advanced_cascade_cohortsync_title}}
\n{{ text.advanced_cascade_cohortsync_desc}}
\n{{ text.advanced_bulk_course_timing}}
\n{{ text.advanced_bulk_course_timing_desc}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{ text.advanced_force_scale_title}}
\n {{ text.advanced_force_scale_desc}}\n\n
- 0\">\n
- \n {{c.course.fullname}}\n
- 0\">\n
- \n {{text.advanced_converted}}{{text.advanced_skipped}}{{text.advanced_error}} \n
\n
{{ text.advanced_backup }}
\n{{ text.advanced_restore }}
\n{{ text.advanced_export }}
\n{{text.advanced_purge_page_expl}}
\n{{text.currentpage}} {{selectedpage.fullname}}
\n{{text.advanced_purge_plan_expl}}
\n\n \n \n \n \n \n \n {{page.shortname}}\n \n \n \n {{text.studyline_name}} \n \n \n \n \n {{text.studyline_shortname}} \n \n \n \n \n \n {{text.studyline_color}} \n \n \n \n \n \n \n \n \n \n \n {{ text.studyline_name}} \n \n \n \n \n \n {{ text.studyline_shortname}} \n \n \n \n \n \n {{ text.studyline_color}} \n \n \n \n \n \n \n \n \n \n
\n `\n });\n\n\n /*\n * T-STUDYLINE-HEADER\n */\n Vue.component('t-studyline-heading', {\n props: {\n value : {\n type: Object, // Studyline\n default: function(){ return {};},\n },\n layers: {\n type: Number,\n default: 1,\n },\n },\n data() {\n return {\n layerHeights: {}\n };\n },\n created() {\n // Listener for the signal that a new connection was made and needs to be drawn\n // Sent by the incoming item - By convention, outgoing items are responsible for drawing the lines\n ItemEventBus.$on('lineHeightChange', this.onLineHeightChange);\n },\n computed: {\n\n },\n methods: {\n onLineHeightChange(lineid,layerid,newheight){\n // All layers for this line have the first slot send an update message on layer height change.\n // When one of those updates is received, record the height and recalculate the total height of the\n // header\n if(this.$refs.main && lineid == this.value.id){\n const items = document.querySelectorAll(\n `.t-studyline-slot-0[data-studyline='${this.value.id}']`);\n\n // determine the height of all the lines and add them up.\n let heightSum = 0;\n items.forEach((el) => {\n // getBoundingClientRect() Gets the actual fractional height instead of rounded to integer pixels\n const r = el.getBoundingClientRect();\n const height = r.height;\n heightSum += height;\n });\n\n const heightStyle=`${heightSum}px`;\n this.$refs.main.style.height = heightStyle;\n }\n }\n },\n template: `\n \n
\n \n {{ text.studyline_editmode }} \n {{ text.toolbox_toggle}} \n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n
\n {{ text.editmode_modules_hidden}}
\n \n \n \n \n
\n \n \n
\n \n \n
\n \n \n \n 0\"\n v-model=\"page.perioddesc[index-1]\"\n > 1) ? add_day(page.perioddesc[index-2].startdate,2) : null\"\n :maxend=\"(index < page.periods) ? sub_day(page.perioddesc[index].enddate,2) : null\"\n > \n \n \n\n \n \n \n 0 && showslot(page,line, index, layeridx, 'gradable')\"\n type='gradable'\n v-model=\"line.slots[index].courses\"\n :key=\"'c-'+lineindex+'-'+index+'-'+layernr\"\n :slotindex=\"index\"\n :line=\"line\"\n :plan=\"value\"\n :page=\"page\"\n :period=\"page.perioddesc[index-1]\"\n :layer=\"layeridx\"\n :class=\"'t-studyline ' + ((lineindex%2==0)?' odd ':' even ')\n + ((lineindex==0 && layernr==1)?' first ':' ')\n + ((lineindex==page.studylines.length-1)?' last ':' ')\n + ((layernr == countLineLayers(line,page))?' lastlyr ':' ')\n + ((layernr == countLineLayers(line,page)+1)?' newlyr ':' ')\"\n >
\n \n
\n `,\n });\n\n /*\n * T-STUDYLINE (Used only for study line edit mode)\n */\n Vue.component('t-studyline-edit', {\n props: {\n value : {\n type: Object, // Studyline\n default: function(){ return {};},\n }\n },\n data() {\n return {\n };\n },\n computed: {\n deletable() {\n // Check if all the slots are empty\n const slots = this.value.slots;\n if(Array.isArray(slots)){\n let count = 0;\n for(let i = 0; i < slots.length; i++) {\n if(Array.isArray(slots[i].courses)){\n count += slots[i].courses.length;\n }\n if(Array.isArray(slots[i].filters)){\n count += slots[i].filters.length;\n }\n }\n return (count == 0);\n } else {\n return false;\n }\n },\n editable() {\n return true;\n }\n },\n methods: {\n onEdit() {\n this.$emit('edit',this.value);\n },\n onDelete() {\n this.$emit('delete',this.value);\n },\n\n },\n template: `\n \n `,\n });\n\n /*\n * During a redisign it was decided to have the studyline still get the entire array as a value,\n * even though it only shows one drop slot for the layer it is in. This is to make repainting easier,\n * since we modify the array for the layer we handle. FIXME: Make this less weird\n */\n Vue.component('t-studyline-slot', {\n props: {\n type : {\n type: String,\n default: 'gradable',\n },\n slotindex : {\n type: Number,\n default: '',\n },\n line : {\n type: Object,\n default(){ return null;},\n },\n layer : {\n type: Number,\n },\n value: {\n type: Array, // dict with layer as index\n default(){ return [];},\n },\n plan: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n page: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n period: {\n type: Object, // Studyplan data\n default(){ return null;},\n },\n },\n mounted() {\n const self=this;\n if(self.type == \"gradable\" && self.slotindex == 1){\n self.resizeListener = new ResizeObserver(() => {\n if(self.$refs.main){\n const size = self.$refs.main.getBoundingClientRect();\n\n ItemEventBus.$emit('lineHeightChange', self.line.id, self.layer, size.height);\n }\n }).observe(self.$refs.main);\n }\n },\n unmounted() {\n if(this.resizeListener) {\n this.resizeListener.disconnect();\n }\n },\n computed: {\n slotkey(){\n return `${this.type}'-'${this.line.id}-${this.slotindex}-${this.layer}`;\n },\n itemidx(){\n for(const ix in this.value){\n const itm = this.value[ix];\n if(itm.layer == this.layer){\n return ix;\n }\n }\n return null;\n },\n item(){\n for(const ix in this.value){\n const itm = this.value[ix];\n if(itm.layer == this.layer){\n return itm;\n }\n }\n return null;\n },\n listtype() {\n return this.type;\n },\n dragacceptlist(){\n if(this.type == \"gradable\"){\n return [\"course\", \"gradable-item\"];\n } else {\n return [\"filter\", \"filter-item\"];\n }\n },\n courseHoverDummy(){\n return {course: this.hover.component};\n },\n current(){\n if( this.period && this.period.startdate && this.period.enddate){\n const now = new Date();\n const pstart = new Date(this.period.startdate);\n const pend = new Date(this.period.enddate);\n return (now >= pstart && now < pend);\n }\n else {\n return false;\n }\n },\n spanCss(){\n if(this.item && this.item.span > 1){\n const span = (2 * this.item.span) - 1;\n return `width: 100%; grid-column: span ${span};`;\n } else {\n return \"\";\n }\n }\n },\n data() {\n return {\n text: strings.course_timing,\n resizeListener: null,\n hover: {\n component:null,\n type: null,\n },\n datechanger: {\n coursespan: null,\n periodspan: null,\n default: false,\n defaultchoice: false,\n hidewarn: false,\n }\n };\n },\n methods: {\n onDrop(event) {\n this.hover.component = null;\n this.hover.type = null;\n debug.info(event);\n const self = this;\n if(event.type.item) {\n let item = event.data;\n\n // To avoid weird visuals with the lines,\n // we add the item to the proper place in the front-end first\n item.layer = this.layer;\n item.slot = this.slotindex;\n self.value.push(item);\n self.$emit(\"input\",self.value);\n\n // then on the next tick, we inform the back end\n // Since moving things around has never been unsuccessful, unless you have other problems,\n // it's better to have nice visuals.\n self.relocateStudyItem(item).done(()=>{\n if(this.$refs.timingChecker){\n this.$refs.timingChecker.validate_course_period();\n }\n });\n }\n else if(event.type.component){\n debug.info(\"Adding new component\");\n if(event.type.type == \"gradable\"){\n call([{\n methodname: 'local_treestudyplan_add_studyitem',\n args: {\n \"line_id\": self.line.id,\n \"slot\" : self.slotindex,\n \"layer\" : self.layer,\n \"type\": 'course',\n \"details\": {\n \"competency_id\": null,\n 'conditions':'',\n 'course_id':event.data.id,\n 'badge_id':null,\n 'continuation_id':null,\n }\n }\n }])[0].done((response) => {\n let item = response;\n self.relocateStudyItem(item).done(()=>{\n self.value.push(item);\n self.$emit(\"input\",self.value);\n\n // call the validate period function on next tick,\n // since it paints the item in the slot first\n this.$nextTick(() => {\n if(this.$refs.timingChecker){\n this.$refs.timingChecker.validate_course_period();\n }\n });\n });\n }).fail(notification.exception);\n }\n else if(event.type.type == \"filter\") {\n debug.info(\"Adding new filter compenent\");\n call([{\n methodname: 'local_treestudyplan_add_studyitem',\n args: {\n \"line_id\": self.line.id,\n \"slot\" : self.slotindex,\n \"type\": event.data.type,\n \"details\":{\n \"badge_id\": event.data.badge?event.data.badge.id:undefined,\n }\n }\n }])[0].done((response) => {\n let item = response;\n self.relocateStudyItem(item).done(()=>{\n item.layer = this.layer;\n self.value.push(item);\n self.$emit(\"input\",self.value);\n });\n }).fail(notification.exception);\n }\n }\n },\n onCut(event) {\n const self=this;\n let id = event.data.id;\n for(let i = 0; i < self.value.length; i++){\n if(self.value[i].id == id){\n self.value.splice(i, 1); i--;\n break; // just remove one\n }\n }\n // Do something to signal that this item has been removed\n this.$emit(\"input\",this.value);\n },\n relocateStudyItem(item){\n const iteminfo = {'id': item.id, 'layer': this.layer, 'slot': this.slotindex, 'line_id': this.line.id};\n return call([{\n methodname: 'local_treestudyplan_reorder_studyitems',\n args: { 'items': [iteminfo] } // function was designed to relocate multiple items at once, hence the array\n }])[0].fail(notification.exception);\n },\n onDragEnter(event){\n this.hover.component = event.data;\n this.hover.type = event.type;\n },\n onDragLeave(){\n this.hover.component = null;\n this.hover.type = null;\n },\n maxSpan(){\n // Determine the maximum span for components in this slot\n // Used for setting the max in the timing adjustment screen(s)\n // And for checking the filter types\n\n // Assume this slot is first one available\n let freeIndex = this.slotindex;\n // Determine last free slot following this one in the layer\n for(let i = this.slotindex + 1; i <= this.page.periods; i++){\n if(this.line.slots && this.line.slots[i] && this.line.slots[i].courses){\n const clist = this.line.slots[i].courses;\n const flist = this.line.slots[i-1].filters; // next filter is in the same slot\n let busy = false;\n for(const ix in clist) {\n if( clist[ix].layer == this.layer) {\n busy = true; // slot is busy in this layer.\n break;\n }\n }\n for(const ix in flist) {\n if( flist[ix].layer == this.layer) {\n busy = true; // slot is busy in this layer.\n break;\n }\n }\n\n if(! busy) {\n // slot is free in this layer\n freeIndex = i;\n } else {\n break; // stop checking next slots\n }\n\n } else {\n break; // stop processing\n }\n }\n // calculate span from that\n return freeIndex - this.slotindex + 1;\n\n },\n makeType(item){\n return {\n item: true,\n component: false,\n span: item.span,\n type: this.type,\n };\n },\n checkType(type) {\n if(type.type == this.type){\n if(type == 'filter'){\n return true;\n } else if(type.span <= this.maxSpan()){\n return true;\n } else {\n return false;\n }\n } else {\n return false;\n }\n }\n },\n template: `\n \n {{ value.shortname }}\n
\n --{{ hover.type }}--\n
\n `,\n });\n\n\n Vue.component('t-item-timing-checker', {\n props: {\n value: {\n type: Object, // t-item model\n },\n page: {\n type: Object, // Studyplan data\n },\n period: {\n type: Object, // Studyplan data\n },\n maxspan: {\n type: Number,\n },\n hidden: {\n type: Boolean,\n default: false,\n }\n },\n computed: {\n endperiod() {\n const endperiodnr = Math.min(this.page.periods,this.period.period + (this.value.span - 1));\n return this.page.perioddesc[endperiodnr-1];\n },\n course_period_matches() {\n const self=this;\n if(self.value && self.value.type == 'course'){\n self.datechanger.coursespan = datespaninfo(self.value.course.startdate,self.value.course.enddate);\n self.datechanger.periodspan = datespaninfo(self.period.startdate,self.endperiod.enddate);\n if( self.datechanger.coursespan.first.getTime() == self.datechanger.periodspan.first.getTime()\n && self.datechanger.coursespan.last.getTime() == self.datechanger.periodspan.last.getTime() ){\n return true;\n }\n else {\n return false;\n }\n } else {\n debug.warn(\"Timing thing not proper configured\",self.value,self.period,self.maxspan);\n return false;\n }\n },\n },\n data() {\n return {\n // Create random id to avoid opening the wrong modals\n id: Math.floor(Math.random() * Date.now()).toString(16),\n text: strings.course_timing,\n datechanger: {\n coursespan: null,\n periodspan: null,\n globals: datechanger_globals,\n }\n };\n },\n methods: {\n\n validate_course_period(force) {\n const self = this;\n\n debug.info(\"Validating course and period\");\n if(!(self.course_period_matches)){\n debug.info(\"Course timing does not match period timing\");\n\n if(self.value.course.canupdatecourse){\n if(!self.hidden || !self.datechanger.globals.default){\n // Periods do not match, pop up the date change request\n this.$bvModal.show('t-course-timing-matching-'+this.id);\n } else if (self.datechanger.globals.defaultvalue){\n // go for it without asking\n self.change_course_period();\n }\n }\n else {\n // user is not able to change course timing - show a warning\n if(!self.hidden || !self.datechanger.globals.hidewarn){\n this.$bvModal.show('t-course-timing-warning-'+this.id);\n }\n }\n }\n else {\n debug.info(\"Course timing matches period\",self.datechanger);\n }\n },\n change_course_period() {\n const self=this;\n // Save the state\n if(self.datechanger.globals.default){\n self.datechanger.globals.defaultvalue = true;\n }\n return call([{\n methodname: 'local_treestudyplan_course_period_timing',\n args: { period_id: self.period.id,\n course_id: this.value.course.id,\n span: this.value.span,\n }\n }])[0].fail(notification.exception).done((response) => {\n self.value.course.startdate = response.startdate;\n self.value.course.enddate = response.enddate;\n self.value.course.timing = response.timing;\n self.$emit(\"input\",self.value);\n });\n },\n change_span(span) {\n const self=this;\n return call([{\n methodname: 'local_treestudyplan_set_studyitem_span',\n args: { id: self.value.id,\n span: span\n }\n }])[0].fail(notification.exception).done((response) => {\n self.value.span = response.span;\n self.$emit('input',self.value);\n self.$nextTick(() => {\n self.validate_course_period();\n });\n } );\n },\n format_duration(dsi){\n let s = \"\";\n if(dsi.years == 1){ s += `1 ${this.text.year}, `;}\n else if(dsi.years > 1){ s += `${dsi.years} ${this.text.years}, `;}\n if(dsi.weeks == 1){ s += `1 ${this.text.week}, `;}\n else if(dsi.weeks > 1){ s += `${dsi.weeks} ${this.text.weeks}, `;}\n if(dsi.days == 1){ s += `1 ${this.text.day}, `;}\n else if(dsi.days > 1){ s += `${dsi.days} ${this.text.days}, `;}\n\n return s.toLocaleLowerCase();\n },\n },\n // To avoid the span creeping in the dom where it shouldn't, set display to none if it is hidden\n // This does not affect the modals, which are rendered outside of this element when needed\n template: `\n \n \n \n \n \n \n \n \n {{ text.periodspan\n }} \n {{ n }} \n {{\n (value.span == 1)?text.period.toLowerCase():text.periods.toLowerCase()\n }}\n \n \n \n \n {{ text.desc }} \n \n \n \n \n \n \n {{ text.rememberchoice }} \n \n \n \n \n {{ text.desc }} \n \n \n \"6\">\n \n \n \n {{ text.hidewarning }} \n \n \n
\n `,\n });\n\n\n Vue.component('t-item', {\n props: {\n value :{\n type: Object,\n default(){ return null;},\n },\n dummy :{\n type: Boolean,\n default() { return false;},\n },\n plan: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n line: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n page: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n period: {\n type: Object, // Studyplan page\n default() { return null;},\n },\n maxspan: {\n type: Number,\n default() { return 0;},\n },\n },\n data() {\n return {\n dragLine: null,\n dragEventListener: null,\n deleteMode: false,\n condition_options: string_keys.conditions,\n text: strings.item_text,\n showContext: false,\n lines: [],\n };\n },\n methods: {\n dragStart(event){\n // Add line between start point and drag image\n this.deleteMode = false;\n let start = document.getElementById('studyitem-'+this.value.id);\n let dragelement= document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.position = 'fixed';\n dragelement.style.left = event.position.x+'px';\n dragelement.style.top = event.position.y+'px';\n this.dragLine = new SimpleLine(start,dragelement,{\n color: \"#777\",\n gravity: {\n start: LINE_GRAVITY,\n end: LINE_GRAVITY,\n },\n });\n // Add separate event listener to reposition mouse move\n document.addEventListener(\"mousemove\",this.onMouseMove);\n },\n dragEnd(){\n if(this.dragLine !== null) {\n this.dragLine.remove();\n }\n let dragelement = document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.removeProperty('left');\n dragelement.style.removeProperty('top');\n dragelement.style.removeProperty('position');\n document.removeEventListener(\"mousemove\",this.onMouseMove);\n },\n onMouseMove: function(event){\n let dragelement = document.getElementById('t-item-cdrag-'+this.value.id);\n dragelement.style.position = 'fixed';\n dragelement.style.left = event.clientX+'px';\n dragelement.style.top = event.clientY+'px';\n // line will follow automatically\n },\n onDrop(event){\n let from_id = event.data.id;\n let to_id = this.value.id;\n this.redrawLines();\n call([{\n methodname: 'local_treestudyplan_connect_studyitems',\n args: { 'from_id': from_id, 'to_id': to_id }\n }])[0].done((response)=>{\n let conn = {'id': response.id, 'from_id': response.from_id, 'to_id': response.to_id};\n ItemEventBus.$emit(\"createdConnection\",conn);\n this.value.connections.in.push(conn);\n }).fail(notification.exception);\n },\n redrawLine(conn){\n const lineColor = \"var(--success)\";\n const start = document.getElementById(`studyitem-${conn.from_id}`);\n const end = document.getElementById(`studyitem-${conn.to_id}`);\n\n // delete old line\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].remove();\n delete this.lines[conn.to_id];\n }\n // create a new line if the start and finish items are visible\n if(start !== null && end !== null && isVisible(start) && isVisible(end)){\n this.lines[conn.to_id] = new SimpleLine( start,end,{\n color: lineColor,\n gravity: {\n start: LINE_GRAVITY,\n end: LINE_GRAVITY,\n },\n });\n }\n\n },\n deleteLine(conn){\n const self = this;\n call([{\n methodname: 'local_treestudyplan_disconnect_studyitems',\n args: { 'from_id': conn.from_id, 'to_id': conn.to_id }\n }])[0].done((response)=>{\n if(response.success){\n this.removeLine(conn);\n // send disconnect event on message bus, so the connection on the other end can delete it too\n ItemEventBus.$emit(\"connectionDisconnected\",conn);\n // Remove connection from our outgoing list\n let index = self.value.connections.out.indexOf(conn);\n self.value.connections.out.splice(index, 1);\n }\n }).fail(notification.exception);\n },\n highlight(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].setConfig({color:\"var(--danger)\",});\n }\n },\n normalize(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].setConfig({color:\"var(--success)\",});\n }\n },\n updateItem() {\n call([{\n methodname: 'local_treestudyplan_edit_studyitem',\n args: { 'id': this.value.id,\n 'conditions': this.value.conditions,\n 'continuation_id': this.value.continuation_id,}\n }])[0].fail(notification.exception);\n },\n doShowContext(event) {\n if(this.hasContext){\n this.showContext=true;\n event.preventDefault();\n }\n },\n redrawLines(){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n this.redrawLine(conn);\n }\n }\n },\n\n // EVENT LISTENERS\n onCreatedConnection(conn){\n if(conn.from_id == this.value.id){\n this.value.connections.out.push(conn);\n this.redrawLine(conn);\n }\n },\n // Listener for the signal that a connection was removed by the outgoing item\n onRemovedConnection(conn){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.in){\n let c_in = this.value.connections.in[i];\n if(conn.id == c_in.id){\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n },\n // Listener for reposition events\n // When an item in the list is repositioned, all lines need to be redrawn\n onRePositioned(){\n this.redrawLines();\n },\n // When an item is disPositioned - (temporarily) removed from the list,\n // all connections need to be deleted.\n onDisPositioned(re_id){\n if(this.value.connections && this.value.connections.out){\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n if(conn.to_id == re_id){\n this.removeLine(conn);\n }\n }\n }\n },\n\n // When an item is deleted\n // all connections to/from that item need to be cleaned up\n onItemDeleted(item_id){\n const self = this;\n if(this.value.connections && this.value.connections.out){\n for(const i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n if(conn.to_id == item_id){\n self.removeLine(conn);\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n if(this.value.connections && this.value.connections.in){\n for(const i in this.value.connections.in){\n let conn = this.value.connections.in[i];\n if(conn.from_id == item_id){\n self.value.connections.out.splice(i, 1);\n }\n }\n }\n },\n\n onRedrawLines(){\n this.redrawLines();\n },\n\n removeLine(conn){\n if(this.lines[conn.to_id]){\n this.lines[conn.to_id].remove();\n delete this.lines[conn.to_id];\n }\n },\n deleteItem(){\n const self = this;\n const msgparams = {\n item: this.text['type_' + this.value.type].toLocaleLowerCase(),\n name: (this.value.type=='course')?this.value.course.displayname:\"\",\n line: (this.line) ? this.line.name : \"\",\n period: (this.period) ? this.period.fullname : this.plan.name,\n };\n\n this.$bvModal.msgBoxConfirm(strformat(this.text.item_delete_message, msgparams), {\n okVariant : 'danger',\n okTitle : this.text.ok,\n cancelTitle: this.text.cancel,\n }).then(value => {\n if ( value ) {\n // Confirmed to delete.\n call([{\n methodname: 'local_treestudyplan_delete_studyitem',\n args: { 'id': self.value.id, }\n }])[0].done(function(response){\n if(response.success == true){\n self.$emit(\"deleted\",{ data: self.value });\n }\n }).fail(notification.exception);\n }\n }).catch(err => {\n debug.console.error(err);\n });\n }\n\n\n },\n computed: {\n hasConnectionsOut() {\n return !([\"finish\",].includes(this.value.type));\n },\n hasConnectionsIn() {\n return !([\"start\",].includes(this.value.type));\n },\n hasContext() {\n return ['start','junction','finish'].includes(this.value.type);\n }\n },\n created(){\n // Add event listeners on the message bus\n // But only if not in \"dummy\" mode - mode which is used for droplist placeholders\n // Since an item is \"fully made\" with all references, not specifying dummy mode really messes things up\n if(!this.dummy){\n\n // Listener for the signal that a new connection was made and needs to be drawn\n // Sent by the incoming item - By convention, outgoing items are responsible for drawing the lines\n ItemEventBus.$on('createdConnection', this.onCreatedConnection);\n // Listener for the signal that a connection was removed by the outgoing item\n ItemEventBus.$on('removedConnection', this.onRemovedConnection);\n // Listener for reposition events\n // When an item in the list is repositioned, all lines need to be redrawn\n ItemEventBus.$on('rePositioned', this.onRePositioned);\n // When an item is disPositioned - (temporarily) removed from the list,\n // all connections need to be deleted.\n ItemEventBus.$on('disPositioned', this.onDisPositioned);\n // When an item is deleted\n // all connections to/from that item need to be cleaned up\n ItemEventBus.$on('itemDeleted', this.onItemDeleted);\n ItemEventBus.$on('redrawLines', this.onRedrawLines);\n\n\n }\n },\n mounted(){\n // Initialize connection lines when mounting\n // But only if not in \"dummy\" mode - mode which is used for droplist placeholders\n // Since an item is \"fully made\" with all references, not specifying dummy mode really messes things up\n\n if(!this.dummy)\n {\n this.redrawLines();\n setTimeout(()=>{\n ItemEventBus.$emit(\"rePositioned\",this.value.id);\n },10);\n }\n },\n beforeDestroy(){\n if(!this.dummy) {\n for(let i in this.value.connections.out){\n let conn = this.value.connections.out[i];\n this.removeLine(conn);\n }\n ItemEventBus.$emit(\"disPositioned\",this.value.id);\n\n // Remove event listeners\n ItemEventBus.$off('createdConnection', this.onCreatedConnection);\n ItemEventBus.$off('removedConnection', this.onRemovedConnection);\n ItemEventBus.$off('rePositioned', this.onRePositioned);\n ItemEventBus.$off('disPositioned', this.onDisPositioned);\n ItemEventBus.$off('itemDeleted', this.onItemDeleted);\n ItemEventBus.$off('redrawLines', this.onRedrawLines);\n }\n },\n beforeUpdate(){\n },\n updated(){\n if(!this.dummy) {\n this.redrawLines();\n }\n },\n template: `\n {{ text.question }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} 1\"> - {{ endperiod.fullname }}
\n{{ period.shortname }} 1\"> - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
{{ text.warning }}
{{ text.course }}
\n{{ value.course.fullname }}
\n{{ value.course.shortname }}
\n{{ datechanger.coursespan.formatted.first}} - {{ datechanger.coursespan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.coursespan)}}
{{ text.period }}
\n{{ period.fullname }} 1\"> - {{ endperiod.fullname }}
\n{{ period.shortname }} 1\"> - {{ endperiod.shortname }}
\n{{ datechanger.periodspan.formatted.first}} - {{ datechanger.periodspan.formatted.last}}
\n{{ text.duration }}
\n {{ format_duration(datechanger.periodspan)}}
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {{ text.ok }}\n \n \n\n \n
\n `,\n });\n\n Vue.component('t-item-invalid', {\n props: {\n 'value' :{\n type: Object,\n default: function(){ return null;},\n },\n },\n data() {\n return {\n text: strings.invalid,\n };\n },\n methods: {\n },\n template: `\n \n `,\n });\n\n //TAG: Course item\n Vue.component('t-item-course', {\n props: {\n value:{\n type: Object,\n default(){ return null;},\n },\n plan:{\n type: Object,\n default(){ return null;},\n },\n page: {\n type: Object, // PAge data\n default() { return null;}\n },\n period: {\n type: Object, // Period data\n default() { return null;}\n },\n maxspan: {\n type: Number,\n default() { return 0;}\n },\n },\n data() {\n return {\n condition_options: string_keys.conditions,\n text: strings.item_course_text,\n };\n },\n computed: {\n useItemConditions() {\n if(this.plan && this.plan.aggregation_info && this.plan.aggregation_info.useItemConditions !== undefined){\n return this.plan.aggregation_info.useItemConditions;\n }\n else {\n return false;\n }\n },\n\n configurationState(){\n if(this.hasGrades() || this.hasCompletions() || this.hasCompetencies()) {\n return \"t-configured-ok\";\n } else {\n return \"t-configured-alert\";\n }\n },\n\n configurationIcon(){\n if(this.hasGrades() || this.hasCompletions() || this.hasCompetencies()) {\n return \"check\";\n } else {\n return \"exclamation-circle\";\n }\n },\n startdate(){\n return format_date(this.value.course.startdate);\n },\n enddate(){\n if(this.value.course.enddate){\n return format_date(this.value.course.enddate);\n }\n else {\n return this.text.noenddate;\n }\n }\n\n },\n methods: {\n hasGrades() {\n if(this.value.course.grades && this.value.course.grades.length > 0){\n for(const g of this.value.course.grades){\n if(g.selected){\n return true;\n }\n }\n }\n return false;\n },\n hasCompletions() {\n if(this.value.course.completion && this.value.course.completion.conditions) {\n for(const cgroup of this.value.course.completion.conditions){\n if(cgroup.items && cgroup.items.length > 0){\n return true;\n }\n }\n }\n return false;\n },\n hasCompetencies() {\n if(this.value.course.competency && this.value.course.competency.competencies) {\n return (this.value.course.competency.competencies.length > 0);\n }\n return false;\n },\n includeChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': newValue,\n 'required': g.required,\n }\n }])[0].fail(notification.exception);\n },\n requiredChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': g.selected,\n 'required': newValue,\n }\n }])[0].fail(notification.exception);\n },\n updateConditions() {\n call([{\n methodname: 'local_treestudyplan_edit_studyitem',\n args: { 'id': this.value.id,\n 'conditions': this.value.conditions,\n }\n }])[0].fail(notification.exception);\n },\n },\n created() {\n\n },\n template: `\n 0\"\n >\n \n \n \n
\n \n \n \n \n \n \n \n \n\n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n
\n `,\n });\n\n\n Vue.component('t-item-course-grades', {\n props: {\n 'value' :{\n type: Object,\n default(){ return null;},\n },\n 'plan' :{\n type: Object,\n default(){ return null;},\n },\n },\n data() {\n return {\n condition_options: string_keys.conditions,\n text: strings.item_course_text,\n };\n },\n computed: {\n useRequiredGrades() {\n if(this.plan && this.plan.aggregation_info && this.plan.aggregation_info.useRequiredGrades !== undefined){\n return this.plan.aggregation_info.useRequiredGrades;\n }\n else {\n return false;\n }\n },\n selectedgrades(){\n let list = [];\n for(let ix in this.value.course.grades){\n let g = this.value.course.grades[ix];\n if(g.selected){\n list.push(g);\n }\n }\n return list;\n },\n },\n methods: {\n includeChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': newValue,\n 'required': g.required,\n }\n }])[0].fail(notification.exception);\n },\n requiredChanged(newValue,g){\n call([{\n methodname: 'local_treestudyplan_include_grade',\n args: { 'grade_id': g.id,\n 'item_id': this.value.id,\n 'include': g.selected,\n 'required': newValue,\n }\n }])[0].fail(notification.exception);\n },\n },\n created() {\n\n },\n template: `\n \n
\n \n \n
\n \n \n \n {{ value.course.displayname }}\n \n
\n \n
\n {{ value.course.fullname }}\n \n
\n {{ value.course.context.path.join(\" / \")}} / {{value.course.shortname}}\n\n \n
\n \n\n \n {{text['coursetiming_'+value.course.timing]}}
\n {{ startdate }} - {{ enddate }}\n
\n \n {{ startdate }} - {{ enddate }}\n
\n
\n `,\n });\n\n Vue.component('t-item-course-completion',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n guestmode: {\n type: Boolean,\n default: false,\n },\n course: {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n text: strings.completion,\n };\n },\n created(){\n const self = this;\n // Get text strings for condition settings\n let stringkeys = [];\n for(const key in this.text){\n stringkeys.push({ key: key, component: 'local_treestudyplan'});\n }\n get_strings(stringkeys).then(function(strings){\n let i = 0;\n for(const key in self.text){\n self.text[key] = strings[i];\n i++;\n }\n });\n },\n computed: {\n hasCompletions() {\n if(this.value.conditions) {\n for(const cgroup of this.value.conditions){\n if(cgroup.items && cgroup.items.length > 0){\n return true;\n }\n }\n }\n return false;\n },\n },\n methods: {\n completion_icon(completion) {\n switch(completion){\n case \"progress\":\n return \"exclamation-circle\";\n case \"complete\":\n return \"check-circle\";\n case \"complete-pass\":\n return \"check-circle\";\n case \"complete-fail\":\n return \"times-circle\";\n default: // case \"incomplete\"\n return \"circle-o\";\n }\n },\n\n completion_tag(cgroup){\n return cgroup.completion?'completed':'incomplete';\n }\n },\n template: `\n - \n
- \n {{text.grade_include}}{{text.grade_require}}\n \n
- \n
\n \n \n \n
| {{ text.aggregation_overall_all}}{{ text.aggregation_overall_any}} | \n|
| {{text.completion_not_configured}}!\n {{text.configure_completion}}\n | \n |
| 1\"\n >{{ text.aggregation_all}}{{ text.aggregation_any}}\n {{cgroup.title}} | \n|
|---|---|
| \n | \n\n {{ci.details.requirement}}\n | \n
| {{text.competencies_not_configured}}!\n {{text.configure_competencies}}\n | \n |
| \n | \n \n | \n
\n \n
\n `,\n });\n\n Vue.component('t-item-finish',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n methods: {\n },\n template: `\n \n \n
\n `,\n });\n\n Vue.component('t-item-start',{\n props: {\n value : {\n type: Object,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n created(){\n\n },\n methods: {\n },\n template: `\n \n \n
\n `,\n });\n\n Vue.component('t-item-badge',{\n props: {\n value : {\n type: Object,\n default: function(){ return { badge: {}};},\n },\n },\n data() {\n return {\n txt: strings,\n text: strings.item_text,\n };\n },\n methods: {\n },\n template: `\n \n \n \n \n \n \n \n ![]()
\n \n \n \n \n {{ text.delete }}\n \n \n {{ text.ok }}\n \n \n \n\n
\n `,\n });\n\n Vue.component('t-coursecat-list',{\n props: {\n value : {\n type: Array,\n default: function(){ return {};},\n },\n },\n data() {\n return {\n };\n },\n methods: {\n },\n template: `\n \n
\n \n \n {{ value.badge.name }}
\n{{value.badge.description}}
\n- \n
- \n
- \n
| {{text.competencies_not_configured}}!
+ {{text.configure_competencies}} + |
+ |
| + | + + | +
Only relevant if "Failed" results are supported'; $string["setting_bistate_accept_pending_submitted"] = 'Accept submitted but ungraded result as "progress"'; $string["settingdesc_bistate_accept_pending_submitted"] = 'If enabled, submitted but ungraded outcomes will still count toward progress. If disabled, only graded outcomes will count'; +$string["setting_competency_heading"] = 'Defults for course competencies '; +$string["settingdesc_competency_heading"] = 'Set the defaults for this aggregation method'; +$string["setting_competency_thresh_completed"] = 'Threshold for good (%)'; +$string["settingdesc_competency_thresh_completed"] = 'Minimum percentage of proficient competencies for result "Completed'; +$string["setting_competency_support_failed"] = 'Support "Failed" result'; +$string["settingdesc_competency_support_failed"] = 'When the course end date has passed, mark course as "Failed" instead of "Progress"'; + $string["grade_include"] = "Include"; $string["grade_require"] = "Require"; $string["required_goal"] = "Required outcome"; diff --git a/lang/nl/local_treestudyplan.php b/lang/nl/local_treestudyplan.php index 112cdc5..fe2bdbc 100644 --- a/lang/nl/local_treestudyplan.php +++ b/lang/nl/local_treestudyplan.php @@ -263,6 +263,10 @@ $string["bistate_aggregator_desc"] = 'Doelen zijn behaald of niet (o.a. niet ges $string["core_aggregator_title"] = 'Moodle cursusvoltooiing'; $string["core_aggregator_desc"] = 'Gebruik de ingesteld cursusvoltooiing'; +$string["competency_aggregator_title"] = 'Curuscompetenties'; +$string["competency_aggregator_desc"] = 'Gebruik de bij de cursus ingestelde competenties'; + + $string["setting_bistate_heading"] = 'Standaardwaarden voor Behaald + Vereidte leerdoelen '; $string["settingdesc_bistate_heading"] = 'Stel de standaardwaarden in voor deze verzamelmethode'; @@ -271,11 +275,11 @@ $string["choose_aggregation_style"] = 'Kies berekening van eindresultaten'; $string["select_scaleitem"] = 'Kies...'; $string["setting_bistate_thresh_excellent"] = 'Drempelwaarde voor uitstekend (%)'; -$string["settingdesc_bistate_thresh_excellent"] = 'Minimumpercentage of goals completed for result "Excellent"'; +$string["settingdesc_bistate_thresh_excellent"] = 'Minimumpercentage behaalde doelen voor "Uitstekend"'; $string["setting_bistate_thresh_good"] = 'Drempelwaarde voor goed (%)'; -$string["settingdesc_bistate_thresh_good"] = 'Minimum percentage of goals completed for result "Good"'; +$string["settingdesc_bistate_thresh_good"] = 'Minimum ercentage behaalde doelen voor "Goed"'; $string["setting_bistate_thresh_completed"] = 'Drempelwaarde voor voltooid (%)'; -$string["settingdesc_bistate_thresh_completed"] = 'Minimumpercentage of goals completed for result "Completed"'; +$string["settingdesc_bistate_thresh_completed"] = 'Minimumpercentage behaalde doelen voor "Voltooid"'; $string["setting_bistate_support_failed"] = 'Onvoldoende ingeschakeld'; $string["settingdesc_bistate_support_failed"] = 'Vink aan om "Onvoldoende" weer te kunnen geven als resultaat voor een module'; $string["setting_bistate_thresh_progress"] = 'Drempelwaarde voor "in ontwikkeling" (%)'; @@ -283,6 +287,13 @@ $string["settingdesc_bistate_thresh_progress"] = 'Minimumpercentage van doelen d $string["setting_bistate_accept_pending_submitted"] = 'Accepteer nog niet beoordeelde doelen als "in ontwikkeling"'; $string["settingdesc_bistate_accept_pending_submitted"] = 'Neem leerdoelen waarbij bewijs is ingeleverd, maar wat nog niet is beoordeeld mee als "in ontwikkeling", zolang er nog geen beoordeling is'; +$string["setting_competency_heading"] = 'Standaardwaarden voor cursuscompetenties '; +$string["settingdesc_competency_heading"] = 'Stel de standaardwaarden in voor deze verzamelmethode'; +$string["setting_competency_thresh_completed"] = 'Drempelwaarde voor voltooid (%)'; +$string["settingdesc_competency_thresh_completed"] = 'Minimumpercentage behaalde competenties voor "Behaald"'; +$string["setting_competency_support_failed"] = 'Onvoldoende ingeschakeld'; +$string["settingdesc_competency_support_failed"] = 'Vink aan om "Onvoldoende" weer te kunnen geven als eind resultaat voor een cursus'; + $string["grade_include"] = "Doel"; $string["grade_require"] = "Verplicht"; $string["required_goal"] = "Verplicht leerdoel"; diff --git a/settings.php b/settings.php index 4b33139..201cfec 100644 --- a/settings.php +++ b/settings.php @@ -107,6 +107,24 @@ if ($hassiteconfig) { $displayfields )); + // BISTATE AGGREGATON DEFAULTS. + $page->add(new admin_setting_heading('local_treestudyplan/competency_aggregation_heading', + get_string('setting_competency_heading', 'local_treestudyplan'), + get_string('settingdesc_competency_heading', 'local_treestudyplan') + )); + $page->add(new admin_setting_configtext('local_treestudyplan/competency_thresh_completed', + get_string('setting_competency_thresh_completed', 'local_treestudyplan'), + get_string('settingdesc_competency_thresh_completed', 'local_treestudyplan'), + "66", + PARAM_INT + )); + + $page->add(new admin_setting_configcheckbox('local_treestudyplan/competency_support_failed', + get_string('setting_competency_support_failed', 'local_treestudyplan'), + get_string('settingdesc_competency_support_failed', 'local_treestudyplan'), + true, + )); + // BISTATE AGGREGATON DEFAULTS. $page->add(new admin_setting_heading('local_treestudyplan/bistate_aggregation_heading', get_string('setting_bistate_heading', 'local_treestudyplan'), diff --git a/version.php b/version.php index bdf784e..965f4ba 100644 --- a/version.php +++ b/version.php @@ -22,7 +22,7 @@ defined('MOODLE_INTERNAL') || die(); $plugin->component = 'local_treestudyplan'; // Recommended since 2.0.2 (MDL-26035). Required since 3.0 (MDL-48494). -$plugin->version = 2023111202; // YYYYMMDDHH (year, month, day, iteration). +$plugin->version = 2023111700; // YYYYMMDDHH (year, month, day, iteration). $plugin->requires = 2021051700; // YYYYMMDDHH (This is the release version for Moodle 3.11). $plugin->release = "1.1.0-b";