add extra video check if valid, causes the motion detection screen to crash.

Author: Cédric Verstraeten

app/Http/Controllers/ImageController.php

@@ -107,18 +107,25 @@ public function getLatestSequence()
 
         if($videosFound)
         {
-            if(count($images) > 1)
+            for($i = count($images) - 1; $i >= 0; $i--)
             {
-                $lastMedia = $images[count($images)-1];
-                if($lastMedia['type'] === 'video')
+                $media = $images[$i];
+
+                // We will use getID4 to check if media this.
+                $getID3 = new \getID3;
+	              $mediaInfo = $getID3->analyze($media['local_src']);
+
+                if($media['type'] === 'image' ||
+                  ($media['type'] === 'video' && $mediaInfo['playtime_seconds'])
+                )
+                {
+                    break;
+                }
+                else // If a video but not valid, remove it!
                 {
                     array_pop($images);
                 }
             }
-            else
-            {
-                $images = $this->imageHandler->getSecondLatestSequence();
-            }
         }
 
         return Response::json($images);

app/Http/Repositories/ImageHandler/ImageFileSystemHandler.php

@@ -442,6 +442,7 @@ public function getImagesSequenceFromDay($day, $page, $maximumTimeBetween)
                     $object = [
                         'time' => $image->getTime(),
                         'src' => $path,
+                        'local_src' => $systemPath,
                         'metadata' => $this->filesystem->getMetadata($image)
                     ];
 
@@ -538,6 +539,7 @@ public function getImagesSequenceFromDayAndStartTime($day, $page, $starttime, $m
                 $object = [
                     'time' => $image->getTime(),
                     'src' => $path,
+                    'local_src' => $systemPath,
                     'metadata' => $this->filesystem->getMetadata($image)
                 ];
 

composer.json

@@ -6,13 +6,14 @@
     "type": "project",
     "require": {
         "php": ">=5.6.4",
+        "cedricve/lockfile": "1.0.1",
+        "cedricve/simpleauth": "1.2.2",
+        "intervention/image": "dev-master",
+        "james-heinrich/getid3": "^1.9",
         "laravel/framework": "5.4.*",
         "laravel/tinker": "~1.0",
-        "intervention/image": "dev-master",
-        "cedricve/simpleauth": "1.2.2",
-        "cedricve/lockfile": "1.0.1",
-        "linfo/linfo": "^3.0",
-        "laravelcollective/html": "~5.0"
+        "laravelcollective/html": "~5.0",
+        "linfo/linfo": "^3.0"
     },
     "require-dev": {
         "fzaninotto/faker": "~1.4",

public/js/app/controllers/dashboard_heatmap.js

@@ -1,7 +1,7 @@
 /**
-*   Dashboard Heatmap:  
+*   Dashboard Heatmap:
 *               Shows an heatmap which is draw
-*               on a canvas 
+*               on a canvas
 **/
 
 define(["heatmap"], function(heatmap)
@@ -18,21 +18,21 @@ define(["heatmap"], function(heatmap)
             self.config = config;
             self.fps = config.fps;
             self.radius = (config.radius) ? config.radius * 100 : 250;
-            
+
             // create heatmap
             self.heatmapInstance = heatmap.create({
                 container: document.querySelector('.heatmap'),
                 maxOpacity: 0.5,
                 minOpacity: 0
             });
-            
+
             $(window).resize(function()
             {
                 self.resize();
                 self.draw();
             });
-            
-            // Wait 300 ms before executing 
+
+            // Wait 300 ms before executing
             setTimeout(self.config.callback, 300);
         },
         changeRadius: function(radius)
@@ -43,7 +43,7 @@ define(["heatmap"], function(heatmap)
         redraw: function()
         {
             self = this;
-            
+
             $.get(self.config.url,function(data)
             {
                 $.get(self.config.urlSequence,function(images)
@@ -75,7 +75,7 @@ define(["heatmap"], function(heatmap)
             {
                 var canvas = $(".heatmap canvas").get(0);
                 var ctx = canvas.getContext("2d");
-                
+
                 var x = canvas.width / 2;
                 var y = canvas.height / 2;
                 ctx.font = '20px Arial';
@@ -110,16 +110,16 @@ define(["heatmap"], function(heatmap)
                     context.drawImage(video, 0, 0, canvas.width(), canvas.height());
                     var data =  canvas.get(0).toDataURL();
                     canvas.css({
-                        "background-image": "url("+data+")", 
-                        "background-size": "100% 100%", 
+                        "background-image": "url("+data+")",
+                        "background-size": "100% 100%",
                         "background-repeat": "no-repeat",
                     });
 
                     video.pause();
                     callback();
                 });
             }
-            else
+            else if(this.images.length)
             {
                 var image = this.images[this.images.length-1];
                 var img = new Image();
@@ -130,22 +130,22 @@ define(["heatmap"], function(heatmap)
                     self.latestImage.width = this.width;
                     self.latestImage.height = this.height;
                     canvas.css({
-                        "background": "url('"+image.src+"')", 
-                        "background-size": "100% 100%", 
+                        "background": "url('"+image.src+"')",
+                        "background-size": "100% 100%",
                         "background-repeat": "no-repeat",
                     });
                     canvas.attr("height", canvas.width()/2);
-                    $(".heatmap").css({"height": canvas.height()}); 
+                    $(".heatmap").css({"height": canvas.height()});
                     callback();
                 };
             }
-            
+
             this.heatmapInstance._renderer.setDimensions(canvas.width(),canvas.height());
         },
         setRegions: function(data)
         {
             this.regions = [];
-            
+
             for(var i  =0; i < data.length; i++)
             {
                 var regionCoordinates = data[i].regionCoordinates.split("-");
@@ -170,11 +170,11 @@ define(["heatmap"], function(heatmap)
                     region.end.y = parseInt(regionCoordinates[3]);
                     region.changes = parseInt(data[i].numberOfChanges);
                     region.average = parseInt(data[i].numberOfChanges) / ((region.end.x - region.start.x) * (region.end.y - region.start.y));
-                    
+
                     this.regions.push(region);
                 }
             }
-            
+
             return data;
         },
         calculate: function(regions)
@@ -183,18 +183,18 @@ define(["heatmap"], function(heatmap)
             var width = 640;
             var height = 360;
             var dataPoints = [];
-            
+
             var originalWidth = this.latestImage.width;
             var originalHeight = this.latestImage.height;
-            
+
             var canvas = $(".heatmap canvas");
             var currentWidth = canvas.width();
             var currentHeight = canvas.height();
-            
+
             // scale x- and y-coordinates
             var dx = currentWidth / originalWidth;
             var dy = currentHeight / originalHeight;
-                
+
             for(var i = 0; i < regions.length; i++)
             {
                 max = Math.max(max, regions[i].average);
@@ -204,24 +204,24 @@ define(["heatmap"], function(heatmap)
                     value: regions[i].average,
                     radius: regions[i].average * this.radius,
                 };
-                
+
                 dataPoints.push(point);
             }
-            
-            var data = { 
-              max: max, 
+
+            var data = {
+              max: max,
               data: dataPoints
             };
-            
+
             return data;
         },
         resize: function()
         {
             var canvas = $(".heatmap canvas");
             canvas.attr("width", $(".heatmap").width());
             canvas.attr("height", canvas.width()/2);
-            $(".heatmap").css({"height": canvas.width()}); 
+            $(".heatmap").css({"height": canvas.width()});
             $(".heatmap").css({"height": canvas.height()});
         }
     };
-});
+});