Merge pull request #521 from AudiovisualMetadataPlatform/AMP-3223_media

AMP-3223:
AudiovisualMetadataPlatform · Jun 17, 2024 · 6e29436 · 6e29436
2 parents 61acecb + 474c8b2
commit 6e29436
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/src/components/entity/EntityList.vue b/src/components/entity/EntityList.vue
@@ -4,7 +4,7 @@
     :class="baseUrl == 'unit' ? 'units' : 'collection'"
   >
     <loader :show="showLoader" />
-    <div class="row">
+    <div class="row" v-if="!showLoader">
       <!-- <Sidebar /> -->
       <div class="col-12 bg-light-gray-1">
         <main :class="!unitEntity.currentUnit ? 'mb-3' : 'mb-5'">
@@ -38,12 +38,12 @@
             </h1>
             <div class="primary-file">
               <div
+                v-if="baseUrl === 'file'"
                 class="media-player"
-                v-if="
-                  baseUrl === 'file'
-                "
               >
+                <!-- showLoader is {{ showLoader }}, mediaSource is {{ entity.mediaSource }} -->
                 <div v-if="entity.mediaSource">
+                  <!-- MediaElement -->
                   <mediaelement
                     ref="vPlay"
                     :type="entity.mediaType"
@@ -1362,21 +1362,23 @@ export default {
         }
       } else if (self.baseUrl === "file") {
         self.showLoader = true;
+        // console.log("EntityList.getEntityData: before get media, showLoader = " + self.showLoader);
         self.entity = self.selectedFile;
         if (self.accessControl._primaryfile_media._read) {
           let mediaSourceUrl = await self.workflowResultService.getMediaSymlink(
             self.selectedFile.id
           );
           self.entity["mediaSource"] = mediaSourceUrl;
-          console.log("mediaSource = " + self.entity.mediaSource);
+          console.log("EntityList.getEntityData: mediaSource = " + self.entity.mediaSource);
         }
         let mediaSourceType = await self.primaryFileService.getPrimaryFile(
           self.selectedFile.id
         );
         self.entity["mediaInfo"] = mediaSourceType.mediaInfo;
         self.entity["mediaType"] = mediaSourceType.mimeType.substring(0, 5);
-        // console.log("mediaType = " + self.entity.mediaType);
+        console.log("EntityList.getEntityData: mediaType = " + self.entity.mediaType);
         self.showLoader = false;
+        // console.log("EntityList.getEntityData: after get media, showLoader = " + self.showLoader);
       }
     },
     async getUnitCollections() {

diff --git a/src/components/entity/Mediaelement.vue b/src/components/entity/Mediaelement.vue
@@ -70,6 +70,7 @@ export default {
   mounted() {
     const { MediaElementPlayer } = global;
     const componentObject = this;
+    // console.log("MediaElement: loading MediaElementPlayer");
     this.player = new MediaElementPlayer(this.$el, {
       pluginPath: "https://cdn.jsdelivr.net/npm/[email protected]/build/",
       shimScriptAccess: "always",
@@ -82,9 +83,11 @@ export default {
           });
         }
         this.success(mediaElement, originalNode, instance);
+        // console.log("MediaElement: MediaElementPlayer loaded.");
       },
       error: (e) => {
         this.error(e);
+        // console.log("MediaElement: error: " + e);
       },
     });
   },