Moved Modal Control to its own file

6 files changed, 269 insertions, 252 deletions

diff --git a/www/index.html b/www/index.html
index 6d42a21b..a4a2d47b 100644
--- a/www/index.html
+++ b/www/index.html
@@ -40,7 +40,7 @@
 
     <script src="js/DataModel.js"></script>
     <script src="js/LoginCtrl.js"></script>
-
+  <script src="js/ModalCtrl.js"></script>
     <script src="js/MontageCtrl.js"></script>
     <script src="js/EventCtrl.js"></script>
     <script src="js/EventsGraphsCtrl.js"></script>
diff --git a/www/js/ModalCtrl.js b/www/js/ModalCtrl.js
new file mode 100644
index 00000000..b0fd3ab9
--- /dev/null
+++ b/www/js/ModalCtrl.js
@@ -0,0 +1,259 @@
+// Common Controller for the montage view
+/* jshint -W041 */
+/* jslint browser: true*/
+/* global cordova,StatusBar,angular,console,ionic */
+
+
+angular.module('zmApp.controllers').controller('ModalCtrl', ['$scope', '$rootScope', 'ZMDataModel',  '$ionicSideMenuDelegate', '$timeout', '$interval', '$ionicModal', '$ionicLoading', '$http', '$state', '$stateParams','$ionicHistory','$ionicScrollDelegate', function ($scope, $rootScope, ZMDataModel, $ionicSideMenuDelegate, $timeout, $interval, $ionicModal, $ionicLoading, $http,$state, $stateParams, $ionicHistory,$ionicScrollDelegate) {
+
+
+    console.log ("**** INSIDE MODAL CTRL *****");
+
+     // This holds the PTZ menu control
+     // Note that I hacked radialMenu
+     // so please don't use the one you get from bower
+      $scope.radialMenuOptions = {
+        content: '',
+
+        background: '#2F4F4F',
+        isOpen: false,
+        toggleOnClick: false,
+        button: {
+            cssClass: "fa  fa-arrows-alt",
+        },
+        items: [
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'Down');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'DownLeft');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'Left');
+                }
+    },
+            {
+                content: 'D',
+                empty: true,
+
+                onclick: function () {
+                    console.log('About');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'UpLeft');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'Up');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'UpRight');
+                }
+    },
+
+            {
+                content: 'H',
+                empty: true,
+                onclick: function () {
+                    console.log('About');
+                }
+    },
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'Right');
+                }
+    },
+
+
+            {
+                content: '',
+                cssClass: 'fa fa-chevron-circle-up',
+                empty: false,
+                onclick: function () {
+                    controlPTZ($scope.monitorId, 'DownRight');
+                }
+    },
+
+            {
+                content: 'K',
+                empty: true,
+                onclick: function () {
+                    console.log('About');
+                }
+    },
+
+
+  ]
+    };
+
+    // Send PTZ command to ZM
+    // FIXME: moveCon is hardcoded - won't work with
+    // cams that don't use moveCon.
+    // Need to grab control ID and then control API
+    function controlPTZ(monitorId, cmd) {
+
+        //curl -X POST "http://server.com/zm/index.php?view=request" -d "request=control&user=admin&passwd=xx&id=4&control=moveConLeft"
+
+        console.log("Command value " + cmd + " with MID=" + monitorId);
+
+        if (ZMDataModel.isSimulated()) {
+            var str = "simulation mode. no action taken";
+            $ionicLoading.show({
+                template: str,
+                noBackdrop: true,
+                duration: 3000
+            });
+            return;
+        }
+
+        $ionicLoading.hide();
+        $ionicLoading.show({
+            template: "please wait...",
+            noBackdrop: true,
+            duration: 15000,
+        });
+
+        var loginData = ZMDataModel.getLogin();
+
+        /*  $http({
+              method:'POST',
+              url:loginData.url + '/index.php',
+              headers:{
+                  'Content-Type': 'application/x-www-form-urlencoded',
+                 'Accept': 'application/json',
+              },
+              transformRequest: function (obj) {
+                  var str = [];
+                  for (var p in obj)
+                      str.push(encodeURIComponent(p) + "=" +
+                          encodeURIComponent(obj[p]));
+                  var foo = str.join("&");
+                  console.log("****RETURNING " + foo);
+                  return foo;
+              },
+
+              data: {
+                  username:loginData.username,
+                  password:loginData.password,
+                  action:"login",
+                  view:"console"
+              }
+          })
+          .success (function(data,status,header,config)
+          {*/
+        $ionicLoading.hide();
+        $ionicLoading.show({
+            template: "Sending PTZ..",
+            noBackdrop: true,
+            duration: 15000,
+        });
+
+
+        var req = $http({
+            method: 'POST',
+            /*timeout: 15000,*/
+            url: loginData.url + '/index.php',
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded',
+                'Accept': 'application/json',
+            },
+            transformRequest: function (obj) {
+                var str = [];
+                for (var p in obj)
+                    str.push(encodeURIComponent(p) + "=" +
+                        encodeURIComponent(obj[p]));
+                var foo = str.join("&");
+                console.log("****RETURNING " + foo);
+                return foo;
+            },
+
+            data: {
+                view: "request",
+                request: "control",
+                id: monitorId,
+                //connkey: $scope.connKey,
+                control: "moveCon" + cmd,
+                xge: "30",
+                yge: "30",
+                //user: loginData.username,
+                //pass: loginData.password
+            }
+
+        });
+
+        req.success(function (resp) {
+            $ionicLoading.hide();
+            console.log("SUCCESS: " + JSON.stringify(resp));
+
+            // $ionicLoading.hide();
+
+        });
+
+        req.error(function (resp) {
+            $ionicLoading.hide();
+            console.log("ERROR: " + JSON.stringify(resp));
+        });
+
+        //});
+    }
+
+
+
+       $scope.finishedLoadingImage = function () {
+        console.log("***Monitor image FINISHED Loading***");
+        $ionicLoading.hide();
+        /* $ionicLoading.show({
+             template: "loading, please wait...",
+             noBackdrop: true,
+         });*/
+    };
+
+
+
+
+
+    // In Android, the app runs full steam while in background mode
+    // while in iOS it gets suspended unless you ask for specific resources
+    // So while this view, we DON'T want Android to keep sending 1 second
+    // refreshes to the server for images we are not seeing!
+
+
+}]);
diff --git a/www/js/MontageCtrl.js b/www/js/MontageCtrl.js
index 42102a3a..1e0c1a64 100644
--- a/www/js/MontageCtrl.js
+++ b/www/js/MontageCtrl.js
@@ -29,246 +29,8 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', '
         $scope.showPTZ = !$scope.showPTZ;
     };
 
-     // This holds the PTZ menu control
-     // Note that I hacked radialMenu
-     // so please don't use the one you get from bower
-      $scope.radialMenuOptions = {
-        content: '',
-
-        background: '#2F4F4F',
-        isOpen: false,
-        toggleOnClick: false,
-        button: {
-            cssClass: "fa  fa-arrows-alt",
-        },
-        items: [
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'Down');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'DownLeft');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'Left');
-                }
-    },
-            {
-                content: 'D',
-                empty: true,
-
-                onclick: function () {
-                    console.log('About');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'UpLeft');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'Up');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'UpRight');
-                }
-    },
-
-            {
-                content: 'H',
-                empty: true,
-                onclick: function () {
-                    console.log('About');
-                }
-    },
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'Right');
-                }
-    },
-
-
-            {
-                content: '',
-                cssClass: 'fa fa-chevron-circle-up',
-                empty: false,
-                onclick: function () {
-                    controlPTZ($scope.monitorId, 'DownRight');
-                }
-    },
-
-            {
-                content: 'K',
-                empty: true,
-                onclick: function () {
-                    console.log('About');
-                }
-    },
-
-
-  ]
-    };
-
-    // Send PTZ command to ZM
-    // FIXME: moveCon is hardcoded - won't work with
-    // cams that don't use moveCon.
-    // Need to grab control ID and then control API
-    function controlPTZ(monitorId, cmd) {
-
-        //curl -X POST "http://server.com/zm/index.php?view=request" -d "request=control&user=admin&passwd=xx&id=4&control=moveConLeft"
-
-        console.log("Command value " + cmd + " with MID=" + monitorId);
-
-        if (ZMDataModel.isSimulated()) {
-            var str = "simulation mode. no action taken";
-            $ionicLoading.show({
-                template: str,
-                noBackdrop: true,
-                duration: 3000
-            });
-            return;
-        }
-
-        $ionicLoading.hide();
-        $ionicLoading.show({
-            template: "please wait...",
-            noBackdrop: true,
-            duration: 15000,
-        });
-
-        var loginData = ZMDataModel.getLogin();
-
-        /*  $http({
-              method:'POST',
-              url:loginData.url + '/index.php',
-              headers:{
-                  'Content-Type': 'application/x-www-form-urlencoded',
-                 'Accept': 'application/json',
-              },
-              transformRequest: function (obj) {
-                  var str = [];
-                  for (var p in obj)
-                      str.push(encodeURIComponent(p) + "=" +
-                          encodeURIComponent(obj[p]));
-                  var foo = str.join("&");
-                  console.log("****RETURNING " + foo);
-                  return foo;
-              },
-
-              data: {
-                  username:loginData.username,
-                  password:loginData.password,
-                  action:"login",
-                  view:"console"
-              }
-          })
-          .success (function(data,status,header,config)
-          {*/
-        $ionicLoading.hide();
-        $ionicLoading.show({
-            template: "Sending PTZ..",
-            noBackdrop: true,
-            duration: 15000,
-        });
-
-
-        var req = $http({
-            method: 'POST',
-            /*timeout: 15000,*/
-            url: loginData.url + '/index.php',
-            headers: {
-                'Content-Type': 'application/x-www-form-urlencoded',
-                'Accept': 'application/json',
-            },
-            transformRequest: function (obj) {
-                var str = [];
-                for (var p in obj)
-                    str.push(encodeURIComponent(p) + "=" +
-                        encodeURIComponent(obj[p]));
-                var foo = str.join("&");
-                console.log("****RETURNING " + foo);
-                return foo;
-            },
-
-            data: {
-                view: "request",
-                request: "control",
-                id: monitorId,
-                //connkey: $scope.connKey,
-                control: "moveCon" + cmd,
-                xge: "30",
-                yge: "30",
-                //user: loginData.username,
-                //pass: loginData.password
-            }
-
-        });
-
-        req.success(function (resp) {
-            $ionicLoading.hide();
-            console.log("SUCCESS: " + JSON.stringify(resp));
-
-            // $ionicLoading.hide();
-
-        });
-
-        req.error(function (resp) {
-            $ionicLoading.hide();
-            console.log("ERROR: " + JSON.stringify(resp));
-        });
-
-        //});
-    }
-
-
-
-    // same logic as EventCtrl.js
-    $scope.finishedLoadingImage = function () {
-        console.log("***Monitor image FINISHED Loading***");
-        $ionicLoading.hide();
-        /* $ionicLoading.show({
-             template: "loading, please wait...",
-             noBackdrop: true,
-         });*/
-    };
-
 
-    $scope.openModal = function (mid, controllable) {
+     $scope.openModal = function (mid, controllable) {
         console.log("Open Monitor Modal");
 
         $scope.monitorId = mid;
diff --git a/www/templates/events-modal.html b/www/templates/events-modal.html
index ca73ae9c..fcd0f8c9 100644
--- a/www/templates/events-modal.html
+++ b/www/templates/events-modal.html
@@ -11,25 +11,16 @@
         </h1>
     </ion-header-bar> -->
     <ion-content>
+         <div ng-controller="ModalCtrl">
 
         <!-- replay can also be gapless -->
-        <div ng-if="!isSimulated()">
 
-            <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" style="width: 100%; ">
-                <img imageonload="finishedLoadingImage()" ng-src="{{loginData.streamingurl}}/cgi-bin/zms?source=event&mode=jpeg&event={{eventId}}&frame=1&maxfps={{loginData.maxFPS}}&replay=single&user={{loginData.username}}&pass={{loginData.password}}&connkey={{connKey}}&rand={{rand}}" width="100%" />
-            </ion-scroll>
-
-
-        </div>
 
-        <div ng-if="isSimulated()">
             <ion-scroll has-bouncing=false min-zoom=1 zooming="true" direction="xy" style="width: 100%; ">
-                <img imageonload="finishedLoadingImage()" ng-src="img/demo.gif" width="100%" />
+                <img imageonload="finishedLoadingImage()" ng-src="{{loginData.streamingurl}}/cgi-bin/zms?source=event&mode=jpeg&event={{eventId}}&frame=1&maxfps={{loginData.maxFPS}}&replay=single&user={{loginData.username}}&pass={{loginData.password}}&connkey={{connKey}}&rand={{rand}}" width="100%" />
             </ion-scroll>
 
-        </div>
 
-    </ion-content>
     <nav mfb-menu position="br" effect="zoomin" label="collapse" active-icon="ion-chevron-down" resting-icon="ion-chevron-up" toggling-method="click">
         <button mfb-button icon="ion-close" label="exit event view" ng-click="closeModal()"></button>
 
@@ -50,5 +41,6 @@
 
         <a mfb-button icon="ion-play" label="play" ng-click="controlEventStream(eventCommands.play)"></a>
     </nav>
-
+        </div>
+    </ion-content>
 </ion-modal-view>
diff --git a/www/templates/monitors-modal.html b/www/templates/monitors-modal.html
index 4bb36c1a..0cd0f0c8 100644
--- a/www/templates/monitors-modal.html
+++ b/www/templates/monitors-modal.html
@@ -11,6 +11,7 @@
         </h1>
     </ion-header-bar> -->
     <ion-content>
+        <div ng-controller="ModalCtrl">
 
         <!-- replay can also be gapless imageonload="finishedLoadingImage()"-->
 
@@ -54,6 +55,7 @@
             <circular options="radialMenuOptions">
             </circular>
         </div>
+        </div>
     </div>
 
 </ion-modal-view>
diff --git a/www/templates/montage.html b/www/templates/montage.html
index ead94684..3e3f940a 100644
--- a/www/templates/montage.html
+++ b/www/templates/montage.html
@@ -11,6 +11,7 @@
 
 
     <ion-content  padding="true" >
+        <div ng-controller="ModalCtrl">
 
         <ion-refresher pulling-text="Pull to reload Monitors..." spinner="bubbles" on-refresh="doRefresh()"></ion-refresher>
 
@@ -65,6 +66,7 @@
 
             </div>
         </div>
+        </div>
     </ion-content>
 
 </ion-view>