diff options
Diffstat (limited to 'www')
| -rw-r--r-- | www/js/EventCtrl.js | 110 | ||||
| -rw-r--r-- | www/templates/events.html | 4 |
2 files changed, 52 insertions, 62 deletions
diff --git a/www/js/EventCtrl.js b/www/js/EventCtrl.js index c2d0125e..5f8a58a5 100644 --- a/www/js/EventCtrl.js +++ b/www/js/EventCtrl.js @@ -434,46 +434,15 @@ angular.module('zmApp.controllers') var tempMon = NVRDataModel.getMonitorObject(myevents[i].Event.MonitorId); if (tempMon != undefined) { - var ratio; var mw = parseInt(tempMon.Monitor.Width); var mh = parseInt(tempMon.Monitor.Height); var mo = parseInt(tempMon.Monitor.Orientation); - myevents[i].Event.Rotation = ''; + + var th = computeThumbnailSize(mw,mh,mo); + myevents[i].Event.thumbWidth = th.w; + myevents[i].Event.thumbHeight = th.h; - // scale by X if width > height - if (mw > mh) { - ratio = mw / zm.thumbWidth; - myevents[i].Event.thumbWidth = 200; - myevents[i].Event.thumbHeight = Math.round(mh / ratio); - } else { - - ratio = mh / zm.thumbWidth; - myevents[i].Event.thumbHeight = 200; - myevents[i].Event.thumbWidth = Math.round(mw / ratio); - - } - - if (mo != 0) { - /* - myevents[i].Event.Rotation = { - 'transform' : 'rotate('+mo+'deg'+')' - }; */ - - var tmp = myevents[i].Event.thumbHeight; - myevents[i].Event.thumbHeight = myevents[i].Event.thumbWidth; - myevents[i].Event.thumbWidth = tmp; - - - } // swap - - // console.log ("--------->" +"MW:"+myevents[i].Event.thumbWidth+ " MH:"+ myevents[i].Event.thumbHeight + " for Monitor:" + myevents[i].Event.MonitorName); - - - - - - } // in multiserver BasePath is login url for frames // http://login.url/index.php?view=frame&eid=19696772&fid=21 @@ -2771,34 +2740,18 @@ angular.module('zmApp.controllers') var tempMon = NVRDataModel.getMonitorObject(myevents[i].Event.MonitorId); if (tempMon != undefined) { - var ratio; + var mw = parseInt(tempMon.Monitor.Width); var mh = parseInt(tempMon.Monitor.Height); var mo = parseInt(tempMon.Monitor.Orientation); - // scale by X if width > height - if (mw > mh) { - ratio = mw / zm.thumbWidth; - myevents[i].Event.thumbWidth = 200; - myevents[i].Event.thumbHeight = Math.round(mh / ratio); - } else { - - ratio = mh / zm.thumbWidth; - myevents[i].Event.thumbHeight = 200; - myevents[i].Event.thumbWidth = Math.round(mw / ratio); - - } - if (mo != 0) { - - /*myevents[i].Event.Rotation = { - 'transform' : 'rotate('+mo+'deg'+')' - }; */ + myevents[i].Event.Rotation = ''; - var tmp = myevents[i].Event.thumbHeight; - myevents[i].Event.thumbHeight = myevents[i].Event.thumbWidth; - myevents[i].Event.thumbWidth = tmp; - - } // swap + + var th = computeThumbnailSize(mw,mh,mo); + myevents[i].Event.thumbWidth = th.w; + myevents[i].Event.thumbHeight = th.h; + } @@ -2829,13 +2782,50 @@ angular.module('zmApp.controllers') }; + + function computeThumbnailSize(mw,mh, mo) { + + var ratio = mw/mh; + var result = {w:0, h:0}; + + if (mo!=0) { + + var tmp = mw; + mw = mh; + mh = tmp; + } + + if (mw > mh) { + ratio = mh/mw; + mw = zm.thumbWidth; + mh = zm.thumbWidth * ratio; + } + else if (mh > mw) { + ratio = mw/mh; + mh = zm.thumbWidth; + mw = zm.thumbWidth * ratio; + } + + else { + mw = zm.thumbWidth; + mw = zm.thumbWidth; + } + mw = Math.round(mw); + mh = Math.round(mh); + + result.w = mw; + result.h = mh; + return result; + + } + $scope.constructThumbnail = function (event) { var stream = ""; stream = event.Event.baseURL + "/index.php?view=image&show=capture&fid=" + (event.Event.MaxScoreFrameId ? event.Event.MaxScoreFrameId : "1&eid=" + event.Event.Id) + - "&width=" + event.Event.thumbWidth * 2 + - "&height=" + event.Event.thumbHeight * 2; + "&width=" + event.Event.thumbWidth*2 + + "&height=" + event.Event.thumbHeight*2; if ($rootScope.authSession != 'undefined') stream += $rootScope.authSession; stream += NVRDataModel.insertBasicAuthToken(); diff --git a/www/templates/events.html b/www/templates/events.html index 5993156c..23b5c728 100644 --- a/www/templates/events.html +++ b/www/templates/events.html @@ -97,9 +97,9 @@ <!-- thumbnail --> <!-- ng-image-appear transition-duration="0.5s" animation="fillIn" bg-color="#50a4e2" {{event.Event.thumbWidth}}X{{event.Event.thumbHeight}}--> - <div style="max-height:200px; max-width:200px"> + <div > <img ng-image-appear no-loader transition-duration="0.3s" animation="fillIn" bg-color="#6C7A89" ng-src="{{constructThumbnail(event)}}" - on-tap="closeIfOpen(event);openModalWithSnapshot(event)" width="100%" height="100%" /> + on-tap="closeIfOpen(event);openModalWithSnapshot(event)" width="{{event.Event.thumbWidth}}" height="{{event.Event.thumbHeight}}" /> <!--<p>{{event.Event.thumbWidth}}px*{{event.Event.thumbHeight}}px</p>--> </div> |