Proyectos de Subversion Moodle

/**

 * Amanote filter script.

 *

 * @copyright   2020 Amaplex Software

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

 */

define(['jquery', 'core/modal_factory'], ($, modalFactory) =>

{

  class Main

  {

    /**

     * Init the plugin's scripts. This method is called by AMD.

     *

     * @param rawUserParams

     */

    public init(rawUserParams: string): void

    {

      // Parse the params.

      const pluginParams = window['amanote_params'];

      const moodleUserParams = Main.parseParams(rawUserParams);

      if (!pluginParams || !moodleUserParams)

      {

        return;

      }

      // Init the Moodle service (Singleton).

      MoodleService.init(pluginParams, moodleUserParams, modalFactory);

      // Add Amanote button to each course modules.

      const courseModuleFilter = new CourseModuleFilter();

      courseModuleFilter.addButtonToCourseModules();

    }

    /**

     * Parse the given plugin params.

     *

     * @param rawParams - The serialized params.

     *

     * @returns The parsed params as an object.

     */

    private static parseParams(rawParams: string): IMoodleUserParams

    {

      try

      {

        return JSON.parse(rawParams);

      }

      catch (error)

      {

        console.error(error);

        return null;

      }

    }

  }

  class MoodleService

  {

    private static instance: MoodleService;

    constructor(private readonly pluginParams: IPluginParams,

                private readonly moodleUserParams: IMoodleUserParams,

                private readonly modalFactory: any)

    {

      if (MoodleService.instance)

      {

        throw new Error("Error - Use MoodleService.getInstance()");

      }

      try

      {

        const userOpeningMode = localStorage.getItem(StorageKeysEnum.OpeningMode);

        if (userOpeningMode !== null)

        {

          this.pluginParams.plugin.openingMode = userOpeningMode as OpeningModeEnum;

        }

      }

      catch (error)

      {

        console.log(error);

      }

    }

    /**

     * Get the plugin params.

     *

     * @returns The moodle plugin params.

     */

    public getPluginParams(): IPluginParams

    {

      return this.pluginParams;

    }

    /**

     * Get the user params.

     *

     * @returns The user params.

     */

    public getUserParams(): IMoodleUserParams

    {

      return this.moodleUserParams;

    }

    /**

     * Get the modal factory.

     *

     * @returns The modal factory.

     */

    public getModalFactory(): any

    {

      return this.modalFactory;

    }

    /**

     * Get an annotatable by course module id (cmid).

     *

     * @param cmid - The course module id (cmid).

     *

     * @returns The annotatable.

     */

    public getAnnotatableByCmId(cmid: number): IAnnotatable

    {

      return (this.pluginParams.annotatables || [])

        .filter(cm => cm.cmid == cmid).pop();

    }

    /**

     * Get an annotatable by id.

     *

     * @param id - The annotatable id.

     *

     * @returns The annotatable.

     */

     public getAnnotatableById(id: string): IAnnotatable

     {

       return (this.pluginParams.annotatables || [])

         .filter(a => a.id == id).pop();

     }

    /**

     * Get a annotatable by the path of the content.

     *

     * @param path - The path to find.

     *

     * @returns The annotatable.

     */

    public getAnnotatableByContentPath(path: string): IAnnotatable

    {

      const annotatable = this.pluginParams.annotatables || [];

      for (let i = 0; i < annotatable.length; i++)

      {

        if (annotatable[i].url === path)

        {

          return annotatable[i];

        }

        else if (annotatable[i].internal)

        {

          let path1 = annotatable[i].url;

          let path2 = path.split('pluginfile.php')[1]

            .split('?')[0]

            .replace('intro/0', 'intro')

            .replace('content/0/', 'content/1/');

          path1 = decodeURIComponent(path1 || '');

          path2 = decodeURIComponent(path2 || '');

          if (path1 && path2 && path1 === path2)

          {

            return annotatable[i];

          }

        }

      }

      return null;

    }

    /**

     * Get the filename of the note linked to the annotatable if any.

     *

     * @param annotatable The annotatable.

     *

     * @returns The file name if any or null otherwise.

     */

    public getSavedNoteFilenameForAnnotatable(annotatable: IAnnotatable): string

    {

      const savedNotes = this.pluginParams.savedNotes || {};

      if (savedNotes[annotatable.id + '.ama'])

      {

        return savedNotes[annotatable.id + '.ama'].filename;

      }

      else if (annotatable.legacyid && savedNotes[annotatable.legacyid + '.ama'])

      {

        return savedNotes[annotatable.legacyid + '.ama'].filename;

      }

      return null;

    }

    /**

     * Get the Amanote logo for a given annotatable.

     *

     * @param annotatable The annotatable.

     *

     * @returns The logo depending if the annotatable is annotated or note.

     */

    public getLogoForAnnotatable(annotatable: IAnnotatable): string

    {

      if (this.getSavedNoteFilenameForAnnotatable(annotatable))

      {

        return this.pluginParams.plugin.annotatedLogo;

      }

      return this.pluginParams.plugin.logo;

    }

    /**

     * Generate an URL to open a file in Amanote.

     *

     * @param annotatable - The annotatable to open.

     * @param route - The route.

     *

     * @returns The generated url.

     */

    public generateAmanoteURL(annotatable: IAnnotatable, route = 'note-taking'): string

    {

      if (!annotatable)

      {

        return '';

      }

      if (route === 'note-taking' && this.pluginParams.plugin.target != OpeningTargetEnum.Amanote)

      {

        return `${this.pluginParams.siteURL}/filter/amanote/annotate.php?annotatableId=${annotatable.id}`;

      }

      // Parse the PDF path.

      let filePath = annotatable.url;

      if (annotatable.internal && filePath.indexOf('pluginfile.php') >= 0)

      {

        filePath = filePath.split('pluginfile.php')[1].replace('content/0/', 'content/1/');

      }

      else

      {

        filePath = encodeURIComponent(filePath);

      }

      // Generate the AMA path.

      const noteFilename = this.getSavedNoteFilenameForAnnotatable(annotatable) || `${annotatable.id}.ama`;

      const amaPath = this.pluginParams.privateFilePath + noteFilename;

      let protocol = 'https';

      if (this.pluginParams.siteURL.indexOf('https') < 0)

      {

        protocol = 'http';

      }

      if (route === 'note-taking' && annotatable.kind === ContentKindEnum.Video)

      {

        route = `/note-taking/moodle/video/${annotatable.id}`;

      }

      else

      {

        route = `/moodle/${route}`;

      }

      return protocol + '://app.amanote.com/' + this.pluginParams.language + route + '?' +

        'siteURL=' + this.pluginParams.siteURL + '&' +

        'accessToken=' + this.moodleUserParams.token.value + '&' +

        'tokenExpDate=' + this.moodleUserParams.token.expiration + '&' +

        'userId=' + this.moodleUserParams.id + '&' +

        'filePath=' + filePath + '&' +

        'mimeType='  +  annotatable.mimetype + '&' +

        'amaPath=' + amaPath + '&' +

        'resourceId=' + annotatable.id + '&' +

        'legacyResourceId=' + (annotatable.legacyid || annotatable.id) + '&' +

        'saveInProvider=' + (this.pluginParams.plugin.saveInProvider ? '1' : '0') + '&' +

        'providerVersion=' + this.pluginParams.moodle.version + '&' +

        'pluginVersion=' + this.pluginParams.plugin.version + '&' +

        'key=' + this.pluginParams.plugin.key + '&' +

        'worksheet=' + (this.pluginParams.plugin.worksheet ? '1' : '0') + '&' +

        'anonymous=' + (this.pluginParams.plugin.anonymous ? '1' : '0');

    }

    /**

     * Init the Singleton.

     *

     * @param pluginParams - The plugin params.

     * @param moodleUserParams - The moodle user params.

     * @param modalFactory - THe modal factory.

     */

    public static init(pluginParams: IPluginParams, moodleUserParams: IMoodleUserParams, modalFactory: any): void

    {

      MoodleService.instance = new MoodleService(pluginParams, moodleUserParams, modalFactory);

    }

    /**

     * Get the Singleton instance.

     *

     * @returns The Singleton instance.

     */

    public static getInstance(): MoodleService

    {

      return MoodleService.instance;

    }

  }

  class CourseModuleFilter

  {

    private static readonly annotatableIDAttribute = 'annotatable-id';

    private static readonly amanoteButtonClass = 'amanote-button';

    private observer: MutationObserver;

    private menuModal = new MenuModal();

    private moodleService = MoodleService.getInstance();

    private params = this.moodleService.getPluginParams();

    private userParams = this.moodleService.getUserParams();

    constructor() { }

    /**

     * Add the Amanote buttons on each supported module and listen changes.

     */

    public addButtonToCourseModules(): void

    {

      this.addAmanoteButtons();

      if (this.observer)

      {

        this.observer.disconnect();

      }

      this.observer = new MutationObserver((mutationsList) =>

      {

        if (this.doesMutationsContainAnActivity(mutationsList))

        {

          this.addAmanoteButtons();

        }

      });

      const targetNode = document.getElementById('page-content');

      this.observer.observe(targetNode, { childList: true, subtree: true });

    }

    /**

     * Check if a given DOM mutations list contains a new activity instance node.

     *

     * @param mutationsList - The list of mutations.

     *

     * @returns True if a mutation contains a new activity instance, False otherwise.

     */

    private doesMutationsContainAnActivity(mutationsList: any[]): boolean

    {

      for (let i = 0; i < mutationsList.length; i++)

      {

        const mutation = mutationsList[i];

        if (mutation.type !== 'childList')

        {

          continue;

        }

        for (let j = 0; j < mutation.addedNodes.length; j++)

        {

          const addedNode = mutation.addedNodes[j];

          if ($(addedNode).find('.activityinstance, .activity-instance').length > 0)

          {

            return true;

          }

        }

      }

      return false;

    }

    /**

     * Add the Amanote buttons on each supported module.

     */

    private addAmanoteButtons(): void

    {

      this.forEachNewInstances(['modtype_resource', 'modtype_url'], (element) =>

      {

        const annotatable = this.getAnnotatableFromElement(element);

        if (!annotatable)

        {

          return;

        }

        let activityLink = $(element).find('.activitytitle').find('a').first();

        if (activityLink.length === 0)

        {

          activityLink = $(element).find('a').first();

        }

        if (this.openWithButton())

        {

          const button = this.generateAmanoteButton(annotatable);

          activityLink.css('display', 'inline-block');

          activityLink.removeClass('stretched-link');

          if ($(element).find('.activity-instance').length > 0)

          {

            $(element).find('.activity-instance').find('.activityname').children().first().after(button);

          }

          else if ($(element).find('.activity-basis').length > 0)

          {

            $(element).find('.activity-basis').first().children().children().first().after(button);

          }

          else

          {

            $(element).find('.activityinstance').first().children().first().after(button);

          }

        }

        else

        {

          this.replaceLink(activityLink, annotatable);

          // Replace link on activity icon if any.

          const iconLink = $(element).find('a.activity-icon').first();

          if (iconLink.length > 0)

          {

            this.replaceLink(iconLink, annotatable);

          }

        }

        this.addOnDeleteWarning($(element));

      });

      this.forEachNewInstances(['fp-filename-icon'], (element) =>

      {

        // Get file id from file url.

        const fileLink = $(element).find('a').first();

        if (fileLink.length !== 1)

        {

          return;

        }

        const filePath = fileLink.attr('href');

        const annotatable = this.moodleService.getAnnotatableByContentPath(filePath);

        if (!annotatable)

        {

          return;

        }

        if (this.openWithButton())

        {

          const button = this.generateAmanoteButton(annotatable);

          fileLink.css('display', 'inline-block');

          fileLink.after(button);

        }

        else

        {

          this.replaceLink(fileLink, annotatable);

        }

      });

      this.forEachNewInstances(['modtype_folder'], (element) =>

      {

        this.addOnDeleteWarning($(element));

      });

      this.forEachNewInstances(['modtype_label'], (element) =>

      {

        const annotatable = this.getAnnotatableFromElement(element);

        if (!annotatable)

        {

          return;

        }

        if (this.openWithButton())

        {

          const button = this.generateAmanoteButton(annotatable);

          $(element).find('.mediaplugin').first().children().children().first().after(button);

        }

        else

        {

          this.replaceLink($(element).find('a').first(), annotatable);

        }

        this.addOnDeleteWarning($(element));

      });

      // Listen click on amanote button.

      setTimeout(() =>

      {

        $(`.${CourseModuleFilter.amanoteButtonClass}`).on('click', (event) =>

        {

          event.preventDefault();

          const annotatableId = $(event.currentTarget).attr(CourseModuleFilter.annotatableIDAttribute);

          const annotatable = this.moodleService.getAnnotatableById(annotatableId);

          if (this.params.plugin.openingMode === OpeningModeEnum.FileClick)

          {

            annotatable.openInMoodleURL = event.currentTarget.href;

          }

          if ((this.params.plugin.openingMode !== OpeningModeEnum.FileClick || this.params.plugin.preventDownload) && !this.userParams.isTeacher)

          {

            window.open(this.moodleService.generateAmanoteURL(annotatable, 'note-taking'), 'blank');

            return;

          }

          this.menuModal.open(annotatable);

        });

      }, 500);

    }

    /**

     * Get the annotatable from an element. The element must contains and id property with

     * a value of kind "module-xx" where xx is the cmid.

     *

     * @param element - The element.

     *

     * @returns The annotatable corresponding to the cmid of the element.

     */

    private getAnnotatableFromElement(element: HTMLElement): IAnnotatable

    {

      const elementId = $(element).attr('id');

      if (!elementId || elementId.indexOf('module-') < 0)

      {

        return;

      }

      const courseModuleId = parseInt(elementId.replace('module-', ''), 10);

      return this.moodleService.getAnnotatableByCmId(courseModuleId);

    }

    /**

     * Determine if it should open the menu with a button or by replacing the current link.

     *

     * @returns True the menu should open with a button.

     */

    private openWithButton(): boolean

    {

      return this.params.plugin.openingMode !== OpeningModeEnum.FileClick;

    }

    /**

     * Apply action to all new course module instance.

     *

     * @param classNames - The module class names.

     * @param action - The action.

     */

    private forEachNewInstances(classNames: string[], action: (e: HTMLElement) => void): void

    {

      $('.' + classNames.join(', .')).each((index, element) =>

      {

        if ($(element).find('.' + CourseModuleFilter.amanoteButtonClass).length > 0)

        {

          return;

        }

        action(element);

      });

    }

    /**

     * Generate a new button for a given annotatable.

     *

     * @param annotatable - The annotatable for which the button should be created.

     *

     * @returns The JQuery generate button.

     */

    private generateAmanoteButton(annotatable: IAnnotatable): JQuery

    {

      const moodleService = MoodleService.getInstance();

      const logo = moodleService.getLogoForAnnotatable(annotatable);

      const widthByMode = {

        [OpeningModeEnum.FileClick]: 90,

        [OpeningModeEnum.LogoNextToFile]: 90,

        [OpeningModeEnum.IconNextToFile]: 40,

        [OpeningModeEnum.IconNextToFileWithText]: 130,

      };

      const width = widthByMode[this.params.plugin.openingMode] || 90;

      const a = $(`<a class="mx-4 my-2 amanote-button"><img src="${logo}" width="${width}px" alt="Open in Amanote"></a>`);

      a.css('display', 'inline-block');

      a.css('cursor', 'pointer');

      a.css('margin', 'auto');

      if (this.params.plugin.openingMode === OpeningModeEnum.LogoNextToFile)

      {

        a.css('min-width', '110px');

      }

      a.attr(CourseModuleFilter.annotatableIDAttribute, annotatable.id);

      return a;

    }

    /**

     * Replace a link element with an Amanote button.

     *

     * @param link - The link to replace.

     * @param annotatable - The annotatable for which the button should be created.

     */

    private replaceLink(link: JQuery, annotatable: IAnnotatable): void

    {

      link.attr(CourseModuleFilter.annotatableIDAttribute, annotatable.id);

      link.addClass('amanote-button');

      link.css('cursor', 'pointer');

    }

    /**

     * Add a warning when the user want to delete a resource.

     *

     * @param activity - The activity to which the warning should be added.

     */

    private addOnDeleteWarning(activity: JQuery): void

    {

      activity.find('.editing_delete').first().on('click', () =>

      {

        setTimeout(() => { this.menuModal.showDeleteWarning(); }, 500);

      });

    }

  }

  class MenuModal

  {

    private moodleService = MoodleService.getInstance();

    private modalFactory = this.moodleService.getModalFactory();

    private pluginParams = this.moodleService.getPluginParams();

    private moodleUserParams = this.moodleService.getUserParams();

    constructor() { }

    /**

     * Open the menu modal for a given annotatable.

     */

    public open(annotatable: IAnnotatable): Promise<void>

    {

      if (!annotatable)

      {

        return;

      }

      const modalParams = {

        title: 'Amanote',

        body: this.generateModalBodyHTML(annotatable),

        footer: '',

      };

      return this.modalFactory.create(modalParams)

        .then((modal) =>

        {

          modal.show();

        });

    }

    /**

     * Show a warning popup before deleting a resource.

     */

    public showDeleteWarning(): void

    {

      const hideDeleteWarningExp = localStorage.getItem(StorageKeysEnum.HideDeleteWarningExp);

      if (hideDeleteWarningExp && !isNaN(Date.parse(hideDeleteWarningExp)))

      {

        const hideDate = new Date(hideDeleteWarningExp);

        const now = new Date();

        if ((now.getTime() - hideDate.getTime()) < (30 * 24 * 60 * 60 * 1000))

        {

          return;

        }

      }

      const guideLink = 'https://help.amanote.com/en/support/solutions/articles/36000448676';

      var message = `<div class="alert alert-warning">

        <strong>Warning</strong>

        <p>${this.pluginParams.strings.deletefilewarning}</p>

        <p><a href="${guideLink}" target="_blank">${this.pluginParams.strings.seeguide}</a></p>

      </div>

      <div style="text-align: center; margin-top: 1rem;">

        <a class="text-muted" style="cursor: pointer;" data-action="hide"

        onclick="localStorage.setItem('${StorageKeysEnum.HideDeleteWarningExp}', new Date().toISOString());">

          ${this.pluginParams.strings.stopmodal}

        </a>

      </div>`;

      const modalParams = {

        title: 'Amanote Warning',

        body: message,

        footer: '',

      };

      this.modalFactory.create(modalParams)

        .then((modal) =>

        {

          modal.show();

        });

    }

    /**

     * Generate the modal body for a given annotatable.

     *

     * @param annotatable - The annotatable.

     *

     * @returns The modal body in HTML.

     */

    private generateModalBodyHTML(annotatable: IAnnotatable): string

    {

      const openInAmanoteURL = this.moodleService.generateAmanoteURL(annotatable, 'note-taking');

      let body = `<p class="mb-0 text-muted">${this.pluginParams.strings.modalDescription}</p>`;

      body += MenuModal.generateButtonHTML(openInAmanoteURL, this.pluginParams.strings.annotateResource, 'fa fa-edit', 'font-weight: 600; background: #2cdf90; color: #03341f; border: none');

      if (this.pluginParams.plugin.openingMode === OpeningModeEnum.FileClick && !this.pluginParams.plugin.preventDownload)

      {

        body += MenuModal.generateButtonHTML(annotatable.openInMoodleURL, this.pluginParams.strings.viewResource, 'fa fa-eye', 'font-weight: 600;');

      }

      if (this.moodleUserParams.isTeacher && annotatable.kind === ContentKindEnum.Document)

      {

        body += '<hr style="margin-bottom: 0px">';

        // Add Learning Analytics.

        const openAnalyticsURL = this.moodleService.generateAmanoteURL(annotatable, `document-analytics/${annotatable.id}/view`);

        body += MenuModal.generateButtonHTML(openAnalyticsURL, this.pluginParams.strings.openAnalytics);

        // Add Podcast Creator.

        if (this.pluginParams.plugin.key && !this.pluginParams.plugin.anonymous)

        {

          const openPodcastCreatorURL = this.moodleService.generateAmanoteURL(annotatable, 'podcast/creator');

          body += MenuModal.generateButtonHTML(openPodcastCreatorURL, this.pluginParams.strings.openPodcastCreator);

        }

        // Add Open student's works.

        if (this.pluginParams.plugin.worksheet && !this.pluginParams.plugin.anonymous)

        {

          const openStudentWorkURL = this.moodleService.generateAmanoteURL(annotatable, `document-analytics/${annotatable.id}/notes`);

          body += MenuModal.generateButtonHTML(openStudentWorkURL, this.pluginParams.strings.openStudentsWorks);

        }

      }

      if (this.pluginParams.plugin.openingMode === OpeningModeEnum.FileClick &&

         !this.moodleUserParams.isTeacher &&

         !this.pluginParams.plugin.preventDownload)

      {

        body += `

          <div style="text-align: center; margin-top: 1rem;">

            <a class="text-muted" style="cursor: pointer;" data-action="hide"

            onclick="localStorage.setItem('${StorageKeysEnum.OpeningMode}', '${OpeningModeEnum.LogoNextToFile}'); location.reload()">

              ${this.pluginParams.strings.stopmodal}

            </a>

          </div>`;

      }

      return body;

    }

    /**

    * Generate a button.

    *

    * @param href - The button's href.

    * @param title - The button's title.

    *

    * @returns The button as HTML string.

    */

    private static generateButtonHTML(href: string, title: string, faIconClass?: string, style: string = ''): string

    {

      let faIconHTML = '';

      if (faIconClass)

      {

        faIconHTML = `<i class="${faIconClass} mr-2"></i> `;

      }

      return `<a class="btn btn-secondary" style="width: 100%; margin-top: 1rem; ${style}" href="${href}" target="_blank">${faIconHTML}${title}</a>`;

    }

  }

  return new Main();

});

enum OpeningModeEnum

{

  FileClick = '0',

  LogoNextToFile = '1',

  IconNextToFile = '2',

  IconNextToFileWithText = '3',

}

enum OpeningTargetEnum

{

  Amanote = '0',

  MoodleFullscreen = '1',

  MoodleEmbedded = '2',

}

enum ContentKindEnum

{

  Document = 'document',

  Video = 'video',

}

enum StorageKeysEnum

{

  OpeningMode = 'amanote.preferences.openingMode',

  HideDeleteWarningExp = 'amanote.preferences.hideDeleteWarningExp',

}

interface IAnnotatable

{

  id: string;

  legacyid: string;

  cmid: number;

  mimetype: string;

  url: string;

  internal: boolean;

  kind: ContentKindEnum;

  openInMoodleURL: string;

}

interface IMoodleUserParams

{

  id: string;

  token: {

    value: string;

    expiration: number;

  },

  isTeacher: boolean;

}

interface IPluginSettings

{

  version: string;

  saveInProvider: boolean;

  openingMode: OpeningModeEnum;

  target: OpeningTargetEnum;

  preventDownload: boolean;

  anonymous: boolean;

  key: string;

  logo: string;

  annotatedLogo: string;

  worksheet: boolean;

}

interface IPluginParams

{

  siteURL: string;

  language: string;

  privateFilePath: string;

  annotatables: IAnnotatable[];

  savedNotes: { [filename: string]: { filename: string}};

  moodle: {

    version: string;

  }

  plugin: IPluginSettings,

  strings: {

    modalDescription: string;

    annotateResource: string;

    viewResource: string;

    downloadNotes: string;

    openAnalytics: string;

    openPodcastCreator: string;

    openStudentsWorks: string;

    teacher: string;

    deletefilewarning: string;

    seeguide: string;

    stopmodal: string;

  }

}