Proyectos de Subversion Moodle

// This file is part of Moodle - http://moodle.org/

//

// Moodle is free software: you can redistribute it and/or modify

// it under the terms of the GNU General Public License as published by

// the Free Software Foundation, either version 3 of the License, or

// (at your option) any later version.

//

// Moodle is distributed in the hope that it will be useful,

// but WITHOUT ANY WARRANTY; without even the implied warranty of

// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the

// GNU General Public License for more details.

//

// You should have received a copy of the GNU General Public License

// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.

import {getString} from 'core/str';

import {Reactive} from 'core/reactive';

import notification from 'core/notification';

import Exporter from 'core_courseformat/local/courseeditor/exporter';

import log from 'core/log';

import ajax from 'core/ajax';

import * as Storage from 'core/sessionstorage';

import {uploadFilesToCourse} from 'core_courseformat/local/courseeditor/fileuploader';

/**

 * Main course editor module.

 *

 * All formats can register new components on this object to create new reactive

 * UI components that watch the current course state.

 *

 * @module     core_courseformat/local/courseeditor/courseeditor

 * @class     core_courseformat/local/courseeditor/courseeditor

 * @copyright  2021 Ferran Recio <ferran@moodle.com>

 * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later

 */

export default class extends Reactive {

    /**

     * The current state cache key

     *

     * The state cache is considered dirty if the state changes from the last page or

     * if the page has editing mode on.

     *

     * @attribute stateKey

     * @type number|null

     * @default 1

     * @package

     */

    stateKey = 1;

    /**

     * The current page section return

     * @attribute sectionReturn

     * @type number

     * @default null

     */

    sectionReturn = null;

    /**

     * Set up the course editor when the page is ready.

     *

     * The course can only be loaded once per instance. Otherwise an error is thrown.

     *

     * The backend can inform the module of the current state key. This key changes every time some

     * update in the course affect the current user state. Some examples are:

     *  - The course content has been edited

     *  - The user marks some activity as completed

     *  - The user collapses or uncollapses a section (it is stored as a user preference)

     *

     * @param {number} courseId course id

     * @param {string} serverStateKey the current backend course cache reference

     */

    async loadCourse(courseId, serverStateKey) {

        if (this.courseId) {

            throw new Error(`Cannot load ${courseId}, course already loaded with id ${this.courseId}`);

        }

        if (!serverStateKey) {

            // The server state key is not provided, we use a invalid statekey to force reloading.

            serverStateKey = `invalidStateKey_${Date.now()}`;

        }

        // Default view format setup.

        this._editing = false;

        this._supportscomponents = false;

        this._fileHandlers = null;

        this.courseId = courseId;

        let stateData;

        const storeStateKey = Storage.get(`course/${courseId}/stateKey`);

        try {

            // Check if the backend state key is the same we have in our session storage.

            if (!this.isEditing && serverStateKey == storeStateKey) {

                stateData = JSON.parse(Storage.get(`course/${courseId}/staticState`));

            }

            if (!stateData) {

                stateData = await this.getServerCourseState();

            }

        } catch (error) {

            log.error("EXCEPTION RAISED WHILE INIT COURSE EDITOR");

            log.error(error);

            return;

        }

        // The bulk editing only applies to the frontend and the state data is not created in the backend.

        stateData.bulk = {

            enabled: false,

            selectedType: '',

            selection: [],

        };

        this.setInitialState(stateData);

        // In editing mode, the session cache is considered dirty always.

        if (this.isEditing) {

            this.stateKey = null;

        } else {

            // Check if the last state is the same as the cached one.

            const newState = JSON.stringify(stateData);

            const previousState = Storage.get(`course/${courseId}/staticState`);

            if (previousState !== newState || storeStateKey !== serverStateKey) {

                Storage.set(`course/${courseId}/staticState`, newState);

                Storage.set(`course/${courseId}/stateKey`, stateData?.course?.statekey ?? serverStateKey);

            }

            this.stateKey = Storage.get(`course/${courseId}/stateKey`);

        }

        this._loadFileHandlers();

    }

    /**

     * Load the file hanlders promise.

     */

    _loadFileHandlers() {

        // Load the course file extensions.

        this._fileHandlersPromise = new Promise((resolve) => {

            if (!this.isEditing) {

                resolve([]);

                return;

            }

            // Check the cache.

            const handlersCacheKey = `course/${this.courseId}/fileHandlers`;

            const cacheValue = Storage.get(handlersCacheKey);

            if (cacheValue) {

                try {

                    const cachedHandlers = JSON.parse(cacheValue);

                    resolve(cachedHandlers);

                    return;

                } catch (error) {

                    log.error("ERROR PARSING CACHED FILE HANDLERS");

                }

            }

            // Call file handlers webservice.

            ajax.call([{

                methodname: 'core_courseformat_file_handlers',

                args: {

                    courseid: this.courseId,

                }

            }])[0].then((handlers) => {

                Storage.set(handlersCacheKey, JSON.stringify(handlers));

                resolve(handlers);

                return;

            }).catch(error => {

                log.error(error);

                resolve([]);

                return;

            });

        });

    }

    /**

     * Setup the current view settings

     *

     * @param {Object} setup format, page and course settings

     * @param {boolean} setup.editing if the page is in edit mode

     * @param {boolean} setup.supportscomponents if the format supports components for content

     * @param {string} setup.cacherev the backend cached state revision

     * @param {Array} setup.overriddenStrings optional overridden strings

     */

    setViewFormat(setup) {

        this._editing = setup.editing ?? false;

        this._supportscomponents = setup.supportscomponents ?? false;

        const overriddenStrings = setup.overriddenStrings ?? [];

        this._overriddenStrings = overriddenStrings.reduce(

            (indexed, currentValue) => indexed.set(currentValue.key, currentValue),

            new Map()

        );

    }

    /**

     * Execute a get string for a possible format overriden editor string.

     *

     * Return the proper getString promise for an editor string using the core_courseformat

     * of the format_PLUGINNAME compoment depending on the current view format setup.

     * @param {String} key the string key

     * @param {string|undefined} param The param for variable expansion in the string.

     * @returns {Promise<String>} a getString promise

     */

    getFormatString(key, param) {

        if (this._overriddenStrings.has(key)) {

            const override = this._overriddenStrings.get(key);

            return getString(key, override.component ?? 'core_courseformat', param);

        }

        // All format overridable strings are from core_courseformat lang file.

        return getString(key, 'core_courseformat', param);

    }

    /**

     * Load the current course state from the server.

     *

     * @returns {Object} the current course state

     */

    async getServerCourseState() {

        const courseState = await ajax.call([{

            methodname: 'core_courseformat_get_state',

            args: {

                courseid: this.courseId,

            }

        }])[0];

        const stateData = JSON.parse(courseState);

        return {

            course: {},

            section: [],

            cm: [],

            ...stateData,

        };

    }

    /**

     * Return the current edit mode.

     *

     * Components should use this method to check if edit mode is active.

     *

     * @return {boolean} if edit is enabled

     */

    get isEditing() {

        return this._editing ?? false;

    }

    /**

     * Return a data exporter to transform state part into mustache contexts.

     *

     * @return {Exporter} the exporter class

     */

    getExporter() {

        return new Exporter(this);

    }

    /**

     * Return if the current course support components to refresh the content.

     *

     * @returns {boolean} if the current content support components

     */

    get supportComponents() {

        return this._supportscomponents ?? false;

    }

    /**

     * Return the course file handlers promise.

     * @returns {Promise} the promise for file handlers.

     */

    async getFileHandlersPromise() {

        return this._fileHandlersPromise ?? [];

    }

    /**

     * Upload a file list to the course.

     *

     * This method is a wrapper to the course file uploader.

     *

     * @param {number} sectionId the section id

     * @param {number} sectionNum the section number

     * @param {Array} files and array of files

     * @return {Promise} the file queue promise

     */

    uploadFiles(sectionId, sectionNum, files) {

        return uploadFilesToCourse(this.courseId, sectionId, sectionNum, files);

    }

    /**

     * Get a value from the course editor static storage if any.

     *

     * The course editor static storage uses the sessionStorage to store values from the

     * components. This is used to prevent unnecesary template loadings on every page. However,

     * the storage does not work if no sessionStorage can be used (in debug mode for example),

     * if the page is in editing mode or if the initial state change from the last page.

     *

     * @param {string} key the key to get

     * @return {boolean|string} the storage value or false if cannot be loaded

     */

    getStorageValue(key) {

        if (this.isEditing || !this.stateKey) {

            return false;

        }

        const dataJson = Storage.get(`course/${this.courseId}/${key}`);

        if (!dataJson) {

            return false;

        }

        // Check the stateKey.

        try {

            const data = JSON.parse(dataJson);

            if (data?.stateKey !== this.stateKey) {

                return false;

            }

            return data.value;

        } catch (error) {

            return false;

        }

    }

    /**

     * Stores a value into the course editor static storage if available

     *

     * @param {String} key the key to store

     * @param {*} value the value to store (must be compatible with JSON,stringify)

     * @returns {boolean} true if the value is stored

     */

    setStorageValue(key, value) {

        // Values cannot be stored on edit mode.

        if (this.isEditing) {

            return false;

        }

        const data = {

            stateKey: this.stateKey,

            value,

        };

        return Storage.set(`course/${this.courseId}/${key}`, JSON.stringify(data));

    }

    /**

     * Convert a file dragging event into a proper dragging file list.

     * @param {DataTransfer} dataTransfer the event to convert

     * @return {Array} of file list info.

     */

    getFilesDraggableData(dataTransfer) {

        const exporter = this.getExporter();

        return exporter.fileDraggableData(this.state, dataTransfer);

    }

    /**

     * Dispatch a change in the state.

     *

     * Usually reactive modules throw an error directly to the components when something

     * goes wrong. However, course editor can directly display a notification.

     *

     * @method dispatch

     * @param {mixed} args any number of params the mutation needs.

     */

    async dispatch(...args) {

        try {

            await super.dispatch(...args);

        } catch (error) {

            // Display error modal.

            notification.exception(error);

            // Force unlock all elements.

            super.dispatch('unlockAll');

        }

    }

}