# HG changeset patch
# User Sebastien Jodogne <s.jodogne@gmail.com>
# Date 1606750891 -3600
# Node ID 673c163e1b3e3b4958ee00b14af201400a7dfd41
# Parent  2931f5e15320b5ac16c3a8bd74a34cf72eb21ddd
playing videos if Orthanc is not available

diff -r 2931f5e15320 -r 673c163e1b3e Applications/StoneWebViewer/WebApplication/app.js
--- a/Applications/StoneWebViewer/WebApplication/app.js	Mon Nov 30 15:36:40 2020 +0100
+++ b/Applications/StoneWebViewer/WebApplication/app.js	Mon Nov 30 16:41:31 2020 +0100
@@ -123,7 +123,7 @@
 
 Vue.component('viewport', {
   props: [ 'left', 'top', 'width', 'height', 'canvasId', 'active', 'content', 'viewportIndex',
-           'showInfo' ],
+           'showInfo', 'globalConfiguration' ],
   template: '#viewport-template',
   data: function () {
     return {
@@ -136,7 +136,8 @@
       cineIncrement: 0,
       cineFramesPerSecond: 30,
       cineTimeoutId: null,
-      cineLoadingFrame: false
+      cineLoadingFrame: false,
+      videoUri: ''
     }
   },
   watch: {
@@ -202,7 +203,31 @@
       }
       else if (newVal.series.type == stone.ThumbnailType.VIDEO) {
         this.status = 'video';
-        console.warn('Videos are not supported by the Stone Web viewer yet');
+        this.videoUri = '';
+        if (this.globalConfiguration.OrthancApiRoot) {
+          var that = this;
+          axios.post(that.globalConfiguration.OrthancApiRoot + '/tools/find',
+                     {
+                       Level : 'Instance',
+                       Query : {
+                         StudyInstanceUID: studyInstanceUid
+                       }
+                     })
+            .then(function(response) {
+              if (response.data.length != 1) {
+                throw('');
+              }
+              else {
+                that.videoUri = that.globalConfiguration.OrthancApiRoot + '/instances/' + response.data[0] + '/frames/0/raw';
+              }
+            })
+            .catch(function(error) {
+              alert('Cannot find the video in Orthanc');
+            });
+        }
+        else {
+          console.warn('Videos are not supported by the Stone Web viewer alone yet, the Orthanc REST API is needed');
+        }
       }
     }
   },
diff -r 2931f5e15320 -r 673c163e1b3e Applications/StoneWebViewer/WebApplication/configuration.json
--- a/Applications/StoneWebViewer/WebApplication/configuration.json	Mon Nov 30 15:36:40 2020 +0100
+++ b/Applications/StoneWebViewer/WebApplication/configuration.json	Mon Nov 30 16:41:31 2020 +0100
@@ -61,13 +61,13 @@
      * set, all the requests for dynamic actions will be rejected.
      * https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
      **/
-    "ExpectedMessageOrigin" : "http://localhost:8042",
+    "ExpectedMessageOrigin" : "http://localhost:8042"
 
     /**
      * The following parameter can be set if running the Stone Web
      * viewer from Orthanc, but without using the associated plugin.
      * Using the plugin would overwrite this setting.
      **/
-    "OrthancApiRoot" : "schnol"
+    // "OrthancApiRoot" : ".."
   }
 }
diff -r 2931f5e15320 -r 673c163e1b3e Applications/StoneWebViewer/WebApplication/index.html
--- a/Applications/StoneWebViewer/WebApplication/index.html	Mon Nov 30 15:36:40 2020 +0100
+++ b/Applications/StoneWebViewer/WebApplication/index.html	Mon Nov 30 16:41:31 2020 +0100
@@ -215,7 +215,7 @@
                                  class="wvSerieslist__placeholderIcon fa fa-file-pdf"></i>
 
                               <i v-if="series[seriesIndex].type == stone.ThumbnailType.VIDEO"
-                                 class="wvSerieslist__placeholderIcon fa fa-video-video"></i>
+                                 class="wvSerieslist__placeholderIcon fa fa-video"></i>
                               
                               <div v-if="[stone.ThumbnailType.IMAGE, stone.ThumbnailType.NO_PREVIEW].includes(series[seriesIndex].type)"
                                    class="wvSerieslist__placeholderIcon"
@@ -534,6 +534,7 @@
                         v-bind:width="viewport1Width"
                         v-bind:height="viewport1Height"
                         v-bind:show-info="showInfo"
+                        v-bind:global-configuration="globalConfiguration"
                         v-bind:active="activeViewport==1"></viewport>
               <viewport v-on:updated-series="SetViewportSeries(2, $event)"
                         v-on:selected-viewport="activeViewport=2"
@@ -545,6 +546,7 @@
                         v-bind:width="viewport2Width"
                         v-bind:height="viewport2Height"
                         v-bind:show-info="showInfo"
+                        v-bind:global-configuration="globalConfiguration"
                         v-bind:active="activeViewport==2"></viewport>
               <viewport v-on:updated-series="SetViewportSeries(3, $event)"
                         v-on:selected-viewport="activeViewport=3"
@@ -556,6 +558,7 @@
                         v-bind:width="viewport3Width"
                         v-bind:height="viewport3Height"
                         v-bind:show-info="showInfo"
+                        v-bind:global-configuration="globalConfiguration"
                         v-bind:active="activeViewport==3"></viewport>
               <viewport v-on:updated-series="SetViewportSeries(4, $event)"
                         v-on:selected-viewport="activeViewport=4"
@@ -567,6 +570,7 @@
                         v-bind:width="viewport4Width"
                         v-bind:height="viewport4Height"
                         v-bind:show-info="showInfo"
+                        v-bind:global-configuration="globalConfiguration"
                         v-bind:active="activeViewport==4"></viewport>
             </div>
           </div>
@@ -668,10 +672,14 @@
             </div>
                 
             <div v-if="status == 'video'" class="wvPaneOverlay">
-              [ videos are not supported yet ]
-              <!--video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4"
-                     src="http://viewer-pro.osimis.io/instances/e465dd27-83c96343-96848735-7035a133-1facf1a0/frames/0/raw">
-              </video-->
+              <div v-if="!('OrthancApiRoot' in globalConfiguration) || videoUri.length == 0">
+                [ cannot play videos using only DICOMweb yet ]
+              </div>
+              <div v-if="'OrthancApiRoot' in globalConfiguration && videoUri.length > 0">
+                <video class="wvVideo" autoplay="" loop="" controls="" preload="auto" type="video/mp4"
+                       v-bind:src="videoUri">
+                </video>
+              </div>
             </div>
                 
             <div v-if="status == 'loading'" class="wvPaneOverlay">