MDL-57682 media_videojs: convert videojs loader to es6
authorShamim Rezaie <shamim@moodle.com>
Thu, 6 Aug 2020 11:37:15 +0000 (21:37 +1000)
committerShamim Rezaie <shamim@moodle.com>
Fri, 4 Sep 2020 08:51:37 +0000 (18:51 +1000)
media/player/videojs/amd/build/loader.min.js
media/player/videojs/amd/build/loader.min.js.map
media/player/videojs/amd/src/loader.js
media/player/videojs/classes/plugin.php

index 2bf824f..f49e436 100644 (file)
Binary files a/media/player/videojs/amd/build/loader.min.js and b/media/player/videojs/amd/build/loader.min.js differ
index f0d4d84..9383b59 100644 (file)
Binary files a/media/player/videojs/amd/build/loader.min.js.map and b/media/player/videojs/amd/build/loader.min.js.map differ
index 70455f2..933b062 100644 (file)
  *
  * This takes care of applying the filter on content which was dynamically loaded.
  *
+ * @module     media_videojs/loader
  * @package    media_videojs
  * @copyright  2016 Frédéric Massart - FMCorz.net
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
-define(['jquery', 'core/event'], function($, Event) {
 
-    /**
-     * Stores the method we need to execute on the first load of videojs module.
-     */
-    var onload;
+import Event from 'core/event';
+import jQuery from 'jquery';
 
-    /**
-     * Set-up.
-     *
-     * Adds the listener for the event to then notify video.js.
-     * @param {Function} executeonload function to execute when media_videojs/video is loaded
-     */
-    var setUp = function(executeonload) {
-        onload = executeonload;
-        // Notify Video.js about the nodes already present on the page.
-        notifyVideoJS(null, $('body'));
-        // We need to call popover automatically if nodes are added to the page later.
-        Event.getLegacyEvents().done(function(events) {
-            $(document).on(events.FILTER_CONTENT_UPDATED, notifyVideoJS);
-        });
-    };
-
-    /**
-     * Notify video.js of new nodes.
-     *
-     * @param {Event} e The event.
-     * @param {NodeList} nodes List of new nodes.
-     */
-    var notifyVideoJS = function(e, nodes) {
-        var selector = '.mediaplugin_videojs';
+/**
+ * Stores the method we need to execute on the first load of videojs module.
+ */
+let onload;
 
-        // Find the descendants matching the expected parent of the audio and video
-        // tags. Then also addBack the nodes matching the same selector. Finally,
-        // we find the audio and video tags contained in those parents. Kind thanks
-        // to jQuery for the simplicity.
-        nodes.find(selector)
-            .addBack(selector)
-            .find('audio, video').each(function() {
-                var id = $(this).attr('id'),
-                    config = $(this).data('setup-lazy'),
-                    modules = ['media_videojs/video-lazy'];
+/**
+ * Set-up.
+ *
+ * Adds the listener for the event to then notify video.js.
+ * @param {Function} executeonload function to execute when media_videojs/video is loaded
+ */
+export const setUp = (executeonload) => {
+    onload = executeonload;
+    // Notify Video.js about the nodes already present on the page.
+    notifyVideoJS(null, jQuery('body'));
+    // We need to call popover automatically if nodes are added to the page later.
+    Event.getLegacyEvents().done((events) => {
+        jQuery(document).on(events.FILTER_CONTENT_UPDATED, notifyVideoJS);
+    });
+};
 
-                if (config.techOrder && config.techOrder.indexOf('youtube') !== -1) {
-                    // Add YouTube to the list of modules we require.
-                    modules.push('media_videojs/Youtube-lazy');
-                }
-                if (config.techOrder && config.techOrder.indexOf('flash') !== -1) {
-                    // Add Flash to the list of modules we require.
-                    modules.push('media_videojs/videojs-flash-lazy');
-                }
-                require(modules, function(videojs) {
-                    if (onload) {
-                        onload(videojs);
-                        onload = null;
-                    }
-                    videojs(id, config);
-                });
-            });
-    };
+/**
+ * Notify video.js of new nodes.
+ *
+ * @param {Event} e The event.
+ * @param {NodeList} nodes List of new nodes.
+ */
+const notifyVideoJS = (e, nodes) => {
+    const selector = '.mediaplugin_videojs';
 
-    return {
-        setUp: setUp
-    };
+    // Find the descendants matching the expected parent of the audio and video
+    // tags. Then also addBack the nodes matching the same selector. Finally,
+    // we find the audio and video tags contained in those parents. Kind thanks
+    // to jQuery for the simplicity.
+    nodes.find(selector)
+        .addBack(selector)
+        .find('audio, video').each((index, element) => {
+            const id = jQuery(element).attr('id');
+            const config = jQuery(element).data('setup-lazy');
+            const modulePromises = [import('media_videojs/video-lazy')];
 
-});
+            if (config.techOrder && config.techOrder.indexOf('youtube') !== -1) {
+                // Add YouTube to the list of modules we require.
+                modulePromises.push(import('media_videojs/Youtube-lazy'));
+            }
+            if (config.techOrder && config.techOrder.indexOf('flash') !== -1) {
+                // Add Flash to the list of modules we require.
+                modulePromises.push(import('media_videojs/videojs-flash-lazy'));
+            }
+            Promise.all(modulePromises).then(([videojs]) => {
+                if (onload) {
+                    onload(videojs);
+                    onload = null;
+                }
+                videojs(id, config);
+                return;
+            }).catch(Notification.exception);
+        });
+};
index 2e5b170..3b4233d 100644 (file)
@@ -423,7 +423,7 @@ class media_videojs_plugin extends core_media_player_native {
         // when video is present on the page or added later to it in AJAX.
         $path = new moodle_url('/media/player/videojs/videojs/video-js.swf');
         $contents = 'videojs.options.flash.swf = "' . $path . '";' . "\n";
-        $contents .= $this->find_language(current_language());
+        $contents .= $this->find_language();
         $page->requires->js_amd_inline(<<<EOT
 require(["media_videojs/loader"], function(loader) {
     loader.setUp(function(videojs) {