setting aspect ratio only to videos that are playing works

js/lib/Comms.js

@@ -66,26 +66,26 @@ class CommsClient {
     }
 
     if (message.cmd === "set-ar") {
-      this.pageInfo.setAr(message.arg);
+      this.pageInfo.setAr(message.arg, message.playing);
     } else if (message.cmd === 'set-alignment') {
-      this.pageInfo.setVideoFloat(message.arg);
+      this.pageInfo.setVideoFloat(message.arg, message.playing);
       this.pageInfo.restoreAr();
     } else if (message.cmd === "set-stretch") {
-      this.pageInfo.setStretchMode(StretchMode[message.arg]);
+      this.pageInfo.setStretchMode(StretchMode[message.arg], message.playing);
     } else if (message.cmd === "autoar-start") {
       if (message.enabled !== false) {
-        this.pageInfo.initArDetection();
-        this.pageInfo.startArDetection();
+        this.pageInfo.initArDetection(message.playing);
+        this.pageInfo.startArDetection(message.playing);
       } else {
-        this.pageInfo.stopArDetection();
+        this.pageInfo.stopArDetection(message.playing);
       }
     } else if (message.cmd === "pause-processing") {
-      this.pageInfo.pauseProcessing();
+      this.pageInfo.pauseProcessing(message.playing);
     } else if (message.cmd === "resume-processing") {
       // todo: autoArStatus
-      this.pageInfo.resumeProcessing(message.autoArStatus);
+      this.pageInfo.resumeProcessing(message.autoArStatus, message.playing);
     } else if (message.cmd === 'set-zoom') {
-      this.pageInfo.setZoom(message.zoom, true);
+      this.pageInfo.setZoom(message.zoom, true, message.playing);
     }
   }
 

js/lib/VideoData.js

@@ -186,4 +186,13 @@ class VideoData {
   announceZoom(scale){
     this.pageInfo.announceZoom(scale);
   }
+
+  isPlaying() {
+
+    console.log("is playing? video:", this.video, "ctime:", this.video.currentTime, 
+    "paused/ended:", this.video.paused, this.video.ended,
+    "is playing?", this.video && this.video.currentTime > 0 && !this.video.paused && !this.video.ended);
+
+    return this.video && this.video.currentTime > 0 && !this.video.paused && !this.video.ended;
+  }
 }

js/modules/PageInfo.js

@@ -196,22 +196,49 @@ class PageInfo {
     this.scheduleUrlCheck();
   }
 
-  initArDetection(){
+  initArDetection(playingOnly){
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if(vd.isPlaying()) {
+          vd.initArDetection();
+        }
+      }
+      return;
+    } else {
       for(var vd of this.videos){
         vd.initArDetection();
       }
     }
+  }
 
 
   // to je treba klicat ob menjavi zavihkov
   // these need to be called on tab switch
-  pauseProcessing(){
+  pauseProcessing(playingOnly){
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if (vd.isPlaying()) {
+          vd.pause();
+        }
+      }  
+    } else {
       for(var vd of this.videos){
         vd.pause();
       }
     }
+  }
 
-  resumeProcessing(resumeAutoar = false){
+  resumeProcessing(resumeAutoar = false, playingOnly = false){
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if (vd.isPlaying()) {
+          vd.resume();
+          if(resumeAutoar){
+            vd.resumeAutoAr();
+          }
+        }
+      }
+    } else {
       for(var vd of this.videos){
         vd.resume();
         if(resumeAutoar){
@@ -219,32 +246,48 @@ class PageInfo {
         }
       }
     }
+  }
 
 
 
-  startArDetection(){
+  startArDetection(playingOnly){
     if (Debug.debug) {
       console.log('[PageInfo::startArDetection()] starting automatic ar detection!')
     }
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if (video.isPlaying()) {
+          vd.startArDetection();
+        }
+      }
+    } else {
       for(var vd of this.videos){
         vd.startArDetection();
       }
     }
+  }
 
-  stopArDetection(){
+  stopArDetection(playingOnly){
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if (vd.isPlaying()) { 
+          vd.stopArDetection();
+        }
+      }
+    } else {
       for(var vd of this.videos){
         vd.stopArDetection();
       }
     }
-
-  setAr(ar){
-    if (Debug.debug) {
-      console.log('[PageInfo::setAr] aspect ratio:', ar)
   }
 
+  setAr(ar, playingOnly){
+    if (Debug.debug) {
+      console.log('[PageInfo::setAr] aspect ratio:', ar, "playing only?", playingOnly)
+    }
 
     if (ar !== 'auto') {
-      this.stopArDetection();
+      this.stopArDetection(playingOnly);
     } else {
       if (Debug.debug) {
         console.log('[PageInfo::setAr] aspect ratio is auto');
@@ -252,65 +295,113 @@ class PageInfo {
 
       try {
         for (var vd of this.videos) {
+          if (!playingOnly || vd.isPlaying()) {
             vd.resetLastAr();
           }
+        }
       } catch (e) {
         console.log("???", e);
       }
-      this.initArDetection();
-      this.startArDetection();
+      this.initArDetection(playingOnly);
+      this.startArDetection(playingOnly);
       return;
     }
 
     // TODO: find a way to only change aspect ratio for one video
     if (ar === 'reset') {
       for (var vd of this.videos) {
+        if (!playingOnly || vd.isPlaying()) {
           vd.resetAr();
         }
+      }
     } else {
       for (var vd of this.videos) {
+        if (!playingOnly || vd.isPlaying()) {
           vd.setAr(ar)
         }
       }
     }
+  }
   
-  setVideoFloat(videoFloat) {
+  setVideoFloat(videoFloat, playingOnly) {
+    if (playingOnly) {
+      for(var vd of this.videos) {
+        if (vd.isPlaying()) { 
+          vd.setVideoFloat(videoFloat)
+        }
+      }
+    } else {
       for(var vd of this.videos) {
         vd.setVideoFloat(videoFloat)
       }
     }
+  }
 
-  setPanMode(mode) {
+  setPanMode(mode, playingOnly) {
+    if (playingOnly) {
+      for(var vd of this.videos) {
+        if (vd.isPlaying()) {
+          vd.setPanMode(mode);
+        }
+      }
+    } else {
       for(var vd of this.videos) {
         vd.setPanMode(mode);
       }
     }
+  }
 
-  restoreAr() {
+  restoreAr(playingOnly) {
+    if (playingOnly) {
       for(var vd of this.videos){
-      vd.restoreAr()
+        if (vd.isPlaying()) {
+          vd.restoreAr();
+        }
+      }
+    } else {
+      for(var vd of this.videos){
+        vd.restoreAr();
+      }
     }
   }
 
-  setStretchMode(sm){
+  setStretchMode(sm, playingOnly){
     // TODO: find a way to only change aspect ratio for one video
 
+    if (playingOnly) {
+      for(var vd of this.videos){
+        if (vd.isPlaying()) {
+          vd.setStretchMode(sm)
+        }
+      }
+    } else {
       for(var vd of this.videos){
         vd.setStretchMode(sm)
       }
     }
+  }
 
-  setZoom(zoomLevel, no_announce) {
+  setZoom(zoomLevel, no_announce, playingOnly) {
+    if (playingOnly) {
+      for(var vd of this.videos) {
+        if (vd.isPlaying()) {
+          vd.setZoom(zoomLevel, no_announce);
+        }
+      }
+    } else {
       for(var vd of this.videos) {
         vd.setZoom(zoomLevel, no_announce);
       }
     }
+  }
 
-  zoomStep(step){
+  zoomStep(step, playingOnly) {
     for(var vd of this.videos){
+      if (!playingOnly || vd.isPlaying()) {
         vd.zoomStep(step);
       }
     }
+  }
 
   announceZoom(scale) {
     if (this.announceZoomTimeout) {