summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--www/js/MontageCtrl.js1
-rw-r--r--www/js/app.js121
-rw-r--r--www/templates/events-modal.html4
-rw-r--r--www/templates/events.html4
-rw-r--r--www/templates/montage.html6
5 files changed, 100 insertions, 36 deletions
diff --git a/www/js/MontageCtrl.js b/www/js/MontageCtrl.js
index 93d771a7..cd39a1c7 100644
--- a/www/js/MontageCtrl.js
+++ b/www/js/MontageCtrl.js
@@ -222,6 +222,7 @@ angular.module('zmApp.controllers').controller('zmApp.MontageCtrl', ['$scope', '
function loadNotifications() {
$rootScope.rand = Math.floor((Math.random() * 100000) + 1);
+
//console.log ("Inside Montage timer...");
}
diff --git a/www/js/app.js b/www/js/app.js
index d0e96838..619ae051 100644
--- a/www/js/app.js
+++ b/www/js/app.js
@@ -69,9 +69,64 @@ angular.module('zmApp', [
})
-//credit http://stackoverflow.com/questions/20997406/force-http-interceptor-in-dynamic-ngsrc-request
+
+//credit: http://stackoverflow.com/questions/34958575/intercepting-img-src-via-http-interceptor-as-well-as-not-lose-the-ability-to-kee
.directive('httpSrc', [
- '$http', 'imageLoadingDataShare', function ($http, imageLoadingDataShare) {
+ '$http', 'imageLoadingDataShare', 'ZMDataModel',
+ function ($http, imageLoadingDataShare, ZMDataModel) {
+ var directive = {
+ link: postLink,
+ restrict: 'A'
+ };
+ return directive;
+
+ function postLink(scope, element, attrs) {
+ console.log ("HELLO NEW");
+ var requestConfig = {
+ method: 'GET',
+ //url: attrs.httpSrc,
+ responseType: 'arraybuffer',
+ cache: 'true'
+ };
+
+ function base64Img(data) {
+ var arr = new Uint8Array(data);
+ var raw = '';
+ var i, j, subArray, chunk = 5000;
+ for (i = 0, j = arr.length; i < j; i += chunk) {
+ subArray = arr.subarray(i, i + chunk);
+ raw += String.fromCharCode.apply(null, subArray);
+ }
+ return btoa(raw);
+ }
+ attrs.$observe('httpSrc', function (newValue) {
+ requestConfig.url = newValue;
+ console.log ("requestConfig is " + JSON.stringify(requestConfig));
+ imageLoadingDataShare.set(1);
+ $http(requestConfig)
+ .success(function (data) {
+ console.log ("Inside HTTP after Calling " + requestConfig.url);
+ //console.log ("data got " + JSON.stringify(data));
+
+
+ var b64 = base64Img(data);
+ attrs.$set('src', "data:image/jpeg;base64," + b64);
+ imageLoadingDataShare.set(0);
+ });
+ });
+
+ }
+ }
+])
+
+
+
+
+
+
+//credit http://stackoverflow.com/questions/20997406/force-http-interceptor-in-dynamic-ngsrc-request
+.directive('httpSrcOld', [
+ '$http', 'imageLoadingDataShare', 'ZMDataModel', function ($http, imageLoadingDataShare, ZMDataModel) {
var directive = {
link: link,
restrict: 'A'
@@ -79,34 +134,42 @@ angular.module('zmApp', [
return directive;
function link(scope, element, attrs) {
- var requestConfig = {
- method: 'Get',
- url: attrs.httpSrc,
- responseType: 'arraybuffer',
- cache: 'true'
- };
-
- imageLoadingDataShare.set(1);
- $http(requestConfig)
- .success(function(data) {
- var arr = new Uint8Array(data);
-
- var raw = '';
- var i, j, subArray, chunk = 5000;
- for (i = 0, j = arr.length; i < j; i += chunk) {
- subArray = arr.subarray(i, i + chunk);
- raw += String.fromCharCode.apply(null, subArray);
- }
+
+ console.log ("HELLO OLD");
+
+ var requestConfig = {
+ method: 'Get',
+ url: attrs.httpSrcOld,
+ responseType: 'arraybuffer',
+ cache: 'true'
+ };
+
+ console.log ("Calling " + requestConfig.url);
+ imageLoadingDataShare.set(1);
+ $http(requestConfig)
+ .success(function(data) {
+
+ console.log ("data got " + JSON.stringify(data));
+ var arr = new Uint8Array(data);
+
+ var raw = '';
+ var i, j, subArray, chunk = 5000;
+ for (i = 0, j = arr.length; i < j; i += chunk) {
+ subArray = arr.subarray(i, i + chunk);
+ raw += String.fromCharCode.apply(null, subArray);
+ }
- var b64 = btoa(raw);
+ var b64 = btoa(raw);
- attrs.$set('src', "data:image/jpeg;base64," + b64);
- imageLoadingDataShare.set(0);
- })
- .error (function(data) {
- attrs.$set('src', 'img/novideo.png');
- imageLoadingDataShare.set(0);
- });
+ attrs.$set('src', "data:image/jpeg;base64," + b64);
+ imageLoadingDataShare.set(0);
+ })
+ .error (function(data) {
+ attrs.$set('src', 'img/novideo.png');
+ imageLoadingDataShare.set(0);
+ ZMDataModel.zmDebug ("Inside http-src err");
+ });
+
}
}
@@ -308,7 +371,7 @@ angular.module('zmApp', [
// console.log ("Parsed data is " + JSON.stringify(components));
var credentials = btoa(components.userinfo);
//var authorization = {'Authorization': 'Basic ' + credentials};
- config.headers.Authorization = 'Basic ' + credentials;
+ //config.headers.Authorization = 'Basic ' + credentials;
// console.log ("Full headers: " + JSON.stringify(config.headers));
diff --git a/www/templates/events-modal.html b/www/templates/events-modal.html
index da27116e..675a812d 100644
--- a/www/templates/events-modal.html
+++ b/www/templates/events-modal.html
@@ -20,7 +20,7 @@
<li ng-repeat="slide in slides">
<div ng-if="!animationInProgress">
<img style="width:100vw; height:100vh" imageonload="finishedLoadingImage($index)"
- http-src="{{playbackURL}}/index.php?view=image&rand={{$root.rand}}&path={{relativePath}}{{slide.img}}&scale={{loginData.singleImageQuality}}"
+ image-spinner-src="{{playbackURL}}/index.php?view=image&rand={{$root.rand}}&path={{relativePath}}{{slide.img}}&scale={{loginData.singleImageQuality}}"
image-spinner-loader="lines"
ng-class="{'object-fit_cover':imageFit==false, 'object-fit_contain':imageFit==true}"
@@ -28,7 +28,7 @@
</div>
<div ng-if="animationInProgress">
<img style="width:100vw; height:100vh" imageonload="finishedLoadingImage($index)"
- http-src="img/pausevideo.png"
+ image-spinner-src="img/pausevideo.png"
image-spinner-loader="lines"
class="object-fit_contain" />
</div>
diff --git a/www/templates/events.html b/www/templates/events.html
index e3332960..02254bce 100644
--- a/www/templates/events.html
+++ b/www/templates/events.html
@@ -144,7 +144,7 @@
<figure style="display:inline-block">
<figcaption><p>frame:{{alarm.id}} score:{{alarm.score}}</p></figcaption>
- <img http-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{alarm.fname}}&height=380" height="170px" />
+ <img image-spinner-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{alarm.fname}}&height=380" height="170px" />
</figure>
@@ -182,7 +182,7 @@
<!-- <img imageonload="finishedLoadingImage($index)" image-spinner-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{slide.img}}&height=380" image-spinner-loader="lines" height="190px" ;/> -->
- <img imageonload="finishedLoadingImage($index)" http-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{slide.img}}&height=380" image-spinner-loader="lines" height="190px" ;/>
+ <img imageonload="finishedLoadingImage($index)" image-spinner-src="{{playbackURL}}/index.php?view=image&path={{event.Event.relativePath}}{{slide.img}}&height=380" image-spinner-loader="lines" height="190px" ;/>
<br/>
diff --git a/www/templates/montage.html b/www/templates/montage.html
index 06b9ba65..e182d001 100644
--- a/www/templates/montage.html
+++ b/www/templates/montage.html
@@ -63,7 +63,7 @@
</div>
<div ng-if = "minimal">
- <img id="img-$index" image-spinner-src="{{LoginData.streamingurl}}/nph-zms?mode=single&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{$root.rand}}" ng-click="openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId)" image-spinner-loader="lines" style="margin-top:0px;
+ <img id="img-$index" image-spinner-src="{{LoginData.streamingurl}}/nph-zms?mode=single&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{$root.rand}}" ng-click="openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId)" image-spinner-loader="lines" style="margin-top:0px;
width: 100% !important;
height: auto !important;" />
</div>
@@ -72,7 +72,7 @@
</div>
<div ng-if="!$root.authSession=='undefined' || isBackground()">
- <img id="img-$index" ng-src="img/pausevideo.png" style="width: 100% !important;
+ <img id="img-$index" image-spinner-src="img/pausevideo.png" style="width: 100% !important;
height: auto !important;" />
</div>
@@ -93,7 +93,7 @@
<div ng-if="isModalActive">
- <img id="img-$index" ng-src="img/pausevideo.png" style="margin-top:0px;
+ <img id="img-$index" image-spinner-src="img/pausevideo.png" style="margin-top:0px;
width: 100% !important;
height: auto !important;" />
</div>