moodle_local_treestudyplan/amd/src/page-coach.js

/*eslint no-var: "error" */
/*eslint no-unused-vars: "off" */
/*eslint linebreak-style: "off" */
/*eslint no-trailing-spaces: "off" */
/*eslint-env es6*/
// Put this file in path/to/plugin/amd/src
// You can call it anything you like

import {call} from 'core/ajax';
import notification from 'core/notification';

import Vue from './vue/vue';

import Debugger from './util/debugger';
import {load_strings} from './util/string-helper';
import {ProcessStudyplan} from './studyplan-processor';
import {studyplanTiming} from './util/date-helper';
import {addBrowserButtonEvent} from './util/browserbuttonevents';

import EditorComponents from './studyplan-editor-components';
Vue.use(EditorComponents);

import TSComponents from './treestudyplan-components';
Vue.use(TSComponents);

import RVComponents from './report-viewer-components';
Vue.use(RVComponents);

import ModalComponents from './modedit-modal';
Vue.use(ModalComponents);

import PortalVue from './portal-vue/portal-vue.esm';
Vue.use(PortalVue);
import BootstrapVue from './bootstrap-vue/bootstrap-vue';
Vue.use(BootstrapVue);


let debug = new Debugger("treestudyplancoach");

let strings = load_strings({
    coach: {
        studyplan_select_placeholder: 'studyplan_select_placeholder',
        switch_coach_editmode: 'switch_coach_editmode',
    },
});

/**
 * Initialize the Page
 */
export function init() {
    let app = new Vue({
        el: '#root',
        data: {
            selected: {
                planid: 0,
                studentid: 0,
            },
            displayedstudyplan: null,
            activestudyplan: null,
            associatedstudents: [],
            selectedstudent: null,
            studentstudyplan: null,
            loadingstudyplan: false,
            studyplans: [],
            text: strings.coach,
            toolbox: {
                right: true,
            },
            usedcontexts: [],
            editmode: false,
        },
        async mounted() {
            call([{
                methodname: 'local_treestudyplan_list_coaching_studyplans',
                args: {}
            }])[0].then(function(response){
                const timingval = { present: 0, past: 1, future: 2};
                response.sort((a,b) => {
                    const timinga = studyplanTiming(a);
                    const timingb = studyplanTiming(b);

                    const t = timingval[timinga] - timingval[timingb];
                    if(t == 0){
                        // sort by name if timing is equal
                        return a.name.localeCompare(b.name);
                    }
                    else {
                        return t;
                    }
                });
                app.studyplans = response;
                // load studyplan from hash if applicable
                const hash = window.location.hash.replace('#','');
                const parts = hash.split("-");

                if(!!parts && parts.length > 0 && parts[0] != ''){
                    for(let idx in app.studyplans){
                        if(app.studyplans[idx].id == parts[0]){
                            app.selectStudyplan(app.studyplans[idx],parts[1],false);
                            break;
                        }
                    }
                }
            }).catch(notification.exception);
            addBrowserButtonEvent(this.navChanged, this.navChanged);
        },
        computed: {
        },
        methods: {
            navChanged() {
                const hash = window.location.hash.replace('#','');
                const parts = hash.split("-");
                debug.log("Navigation changed",hash,parts);

                if(!!parts && parts.length > 0){
                    const planid = Number(parts[0]);
                    const studentid = (parts.length > 1)?Number(parts[1]):0;

                    debug.log("Selected ids",planid,studentid,this.selected.planid,this.selected.studentid);
                    if ( planid == 0) {
                        if (planid != this.selected.planid) {
                            this.closeStudyplan(false);
                        }
                    } else if ( this.selected.planid != planid || (studentid == 0 && this.selected.studentid != 0) ) {
                        debug.info ("Requested plan changed - loading studyplan");
                        for(let idx in app.studyplans){
                            const plan = this.studyplans[idx];
                            if(Number(plan.id) == planid){
                                this.selectStudyplan(plan,studentid,false);
                                break;
                            }
                        }
                    } else if (this.selected.studentid != studentid) {
                        for(const group of app.associatedstudents) {
                            for(const student of group.users){
                                if(Number(student.id) == studentid){
                                    app.showStudentView(student,false);
                                    break;
                                }
                            }
                        }
                    }
                }
            },
            closeStudyplan(updatehash=true) {
                app.selected.planid = 0;
                app.selected.studentid = 0;
                app.activestudyplan = null;
                app.associatedstudents = [];
                app.studentstudyplan = [];
                app.displayedstudyplan = null;
                if (updatehash) {
                    window.location.hash = '';
                }
            },

            selectStudyplan(studyplan,studentid,updatehash=true){
                app.selected.planid = Number(studyplan.id);
                app.selected.studentid = studentid?Number(studentid):0;
                // fetch studyplan
                const self = this;
                self.loadingstudyplan = true;
                self.associatedstudents = [];
                self.selectedstudent = null;
                self.studentstudyplan = null;
                call([{
                    methodname: 'local_treestudyplan_get_studyplan_map',
                    args: { id: studyplan.id}
                }])[0].then(function(response){
                    self.activestudyplan = ProcessStudyplan(response,true);

                    call([{
                        methodname: 'local_treestudyplan_all_associated_grouped',
                        args: { studyplan_id: studyplan.id}
                    }])[0].then(function(response){
                        self.associatedstudents = response;
                        let foundstudent = false;
                        if(studentid){
                            for(const group of self.associatedstudents) {
                                for(const student of group.users){
                                    if(student.id == studentid){
                                        foundstudent = true;
                                        self.showStudentView(student);
                                        break;
                                    }
                                }
                            }
                        }
                        if (!foundstudent) {
                            // Select first student available.
                            for(const group of self.associatedstudents) {
                                for(const student of group.users){
                                    foundstudent = true;
                                    self.showStudentView(student);
                                    break;
                                }
                            }
                        }
                        if (!foundstudent) { // update hash with just the studyplan if no student was available for display
                            app.selected.studentid = 0;
                            if (updatehash) {
                                window.location.hash = app.activestudyplan.id;
                            }
                            self.displayedstudyplan = self.activestudyplan;
                            self.loadingstudyplan = false;
                        }
                    }).catch(notification.exception);

                }).catch(function(error){
                    notification.exception(error);
                    app.loadingstudyplan = false;
                });
            },
            showStudentView(student,updatehash=true){
                app.selected.studentid = student?Number(student.id):0;
                if (student) {
                    app.selectedstudent = student;
                    app.studentstudyplan = null;
                    app.loadingstudyplan = true;
                    call([{
                        methodname: 'local_treestudyplan_get_user_studyplan',
                        args: { userid: student.id, studyplanid: app.activestudyplan.id}
                    }])[0].then(function(response){
                        app.studentstudyplan = ProcessStudyplan(response,false);
                        app.displayedstudyplan = app.studentstudyplan;
                        app.loadingstudyplan = false;
                        if (updatehash) {
                            window.location.hash = app.activestudyplan.id + "-" + student.id;
                        }
                    }).catch(function(error){
                        notification.exception(error);
                        app.loadingstudyplan = false;
                    });
                } else {
                    this.showOverview(updatehash);
                }
            },
            showOverview(updatehash=true){
                debug.info("Switch to overview",updatehash);
                app.selected.studentid = 0;
                app.selectedstudent = null;
                app.studentstudyplan = null;
                app.displayedstudyplan = app.activestudyplan;
                if (updatehash) {
                    window.location.hash = app.activestudyplan.id;
                }
            }

        },
    });
}