Skip to content

Commit

Permalink
#147- undid auth approach -- causes problems with streaming images - …
Browse files Browse the repository at this point in the history
…we never get to success - screw it - lets see who complains

Former-commit-id: c1b7759465cf79b414c40aa241df011ffee85285
  • Loading branch information
pliablepixels committed Jan 23, 2016
1 parent 5a80b23 commit 7e78751
Show file tree
Hide file tree
Showing 5 changed files with 100 additions and 36 deletions.
1 change: 1 addition & 0 deletions www/js/MontageCtrl.js
Original file line number Diff line number Diff line change
Expand Up @@ -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...");

}
Expand Down
121 changes: 92 additions & 29 deletions www/js/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -69,44 +69,107 @@ 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'
};
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");
});

}

}
Expand Down Expand Up @@ -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));

Expand Down
4 changes: 2 additions & 2 deletions www/templates/events-modal.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,15 +20,15 @@
<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}"

/>
</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>
Expand Down
4 changes: 2 additions & 2 deletions www/templates/events.html
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand Down Expand Up @@ -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/>

Expand Down
6 changes: 3 additions & 3 deletions www/templates/montage.html
Original file line number Diff line number Diff line change
Expand Up @@ -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>
Expand All @@ -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>

Expand All @@ -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>
Expand Down

0 comments on commit 7e78751

Please sign in to comment.