diff options
Diffstat (limited to 'www')
| -rw-r--r-- | www/index.html | 1 | ||||
| -rwxr-xr-x | www/js/app.js | 25 | ||||
| -rw-r--r-- | www/templates/montage-history.html | 4 | ||||
| -rw-r--r-- | www/templates/montage.html | 9 |
4 files changed, 30 insertions, 9 deletions
diff --git a/www/index.html b/www/index.html index bc79ad6d..c820a97e 100644 --- a/www/index.html +++ b/www/index.html @@ -61,6 +61,7 @@ <script src="lib/moment/min/moment-with-locales.min.js"></script> <script src="lib/ng-mfb/src/mfb-directive.js"></script> <script src="lib/angular-touch/angular-touch.min.js"></script> + <script src="lib/holderjs/holder.min.js"></script> diff --git a/www/js/app.js b/www/js/app.js index 018d020a..b126230d 100755 --- a/www/js/app.js +++ b/www/js/app.js @@ -488,9 +488,32 @@ angular.module('zmApp', [ var url = 'img/novideo.png'; + + + var w = $attributes.imgSpinnerW; + var h = $attributes.imgSpinnerH; + + /* $element.css({ + //width: w+'px', + // height: h+'px', + display: ($attributes.imgSpinnerW && $attributes.imgSpinnerH? 'inline-block' : null), + background:'red', + objectFit: 'fill' + });*/ + + + console.log ("**********"+w+"X"+h); // var hurl = "holder.js/2000x$2000?auto=yes&theme=sky&text=..."; - $element.prop('src', url); + $attributes.$set('data-src', 'holder.js/'+w+'x'+h+'?auto=yes&theme=industrial&text=...'); + Holder.run({images:$element[0], nocss:false}); + + // $element.prop ('width', w+'px'); + // $element.prop ('height', h+'px'); + + + // $element.css({backgroundImage: 'url("' + url + '")'}); + //$attributes.$set('src', url); // $element.prop('data-src', hurl); imageLoadingDataShare.set(0); diff --git a/www/templates/montage-history.html b/www/templates/montage-history.html index 785a348d..2bbd799c 100644 --- a/www/templates/montage-history.html +++ b/www/templates/montage-history.html @@ -24,7 +24,7 @@ or we lose the handle for cleanup forever!--> <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}" data-item-size="{{monitor.Monitor.gridScale}}" data-item-listdisplay="{{monitor.Monitor.listDisplay}}" > <figure height="{{Monitor.monitor.height}}" width="{{Monitor.monitor.width}}" class="{{dragBorder}}" ng-show=" monitor.Monitor.listDisplay!='noshow'"> - <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{monitor.Monitor.eventUrl}}" image-spinner-loader="lines" on-tap="!isDragabillyOn?noop():toggleSelectItem($index)" > + <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{monitor.Monitor.eventUrl}}" image-spinner-loader="lines" on-tap="!isDragabillyOn?noop():toggleSelectItem($index)" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}> <figcaption class="normal-figcaption" > @@ -41,7 +41,7 @@ <div ng-if = "monitor.Monitor.eventUrl != 'img/noevent.png' && monitor.Monitor.connKey !=''"> <div class="grid-item grid-item-{{monitor.Monitor.gridScale}} " data-item-id="{{monitor.Monitor.Id}}" data-item-size="{{monitor.Monitor.gridScale}}" data-item-listdisplay="{{monitor.Monitor.listDisplay}}" > <figure height="{{Monitor.monitor.height}}" width="{{Monitor.monitor.width}}" class="{{dragBorder}}" ng-show=" monitor.Monitor.listDisplay!='noshow'"> - <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{monitor.Monitor.eventUrl}}{{$root.authSession}}" image-spinner-loader="lines" on-tap="!isDragabillyOn?togglePause(monitor.Monitor.Id):toggleSelectItem($index)" on-swipe-left="toggleControls()" on-swipe-right="toggleControls()" /> + <img class="{{monitor.Monitor.selectStyle}}" image-spinner-src="{{monitor.Monitor.eventUrl}}{{$root.authSession}}" image-spinner-loader="lines" on-tap="!isDragabillyOn?togglePause(monitor.Monitor.Id):toggleSelectItem($index)" on-swipe-left="toggleControls()" on-swipe-right="toggleControls()" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}/> <figcaption class="normal-figcaption" > diff --git a/www/templates/montage.html b/www/templates/montage.html index 5036c820..3f6dcb5d 100644 --- a/www/templates/montage.html +++ b/www/templates/montage.html @@ -104,18 +104,15 @@ <!--<div ng-if="!isModalActive" >--> <!--<div ng-if="$root.authSession!='undefined' && !isBackground() && !areImagesLoading">--> <div ng-if="$root.authSession!='undefined' && !isBackground() "> - <div ng-if = "!minimal"> - - - - <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{monitor.Monitor.streamingURL}}/nph-zms?mode={{getMode()}}&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{randToAvoidCacheMem}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);" image-spinner-loader="lines" /> + <div ng-if = "!minimal" > + <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{monitor.Monitor.streamingURL}}/nph-zms?mode={{getMode()}}&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{randToAvoidCacheMem}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);" image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}}" /> </div> <div ng-if = "minimal"> - <img id="img-{{$index}}" image-spinner-src="{{monitor.Monitor.streamingURL}}/zms?mode={{getMode()}}&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{randToAvoidCacheMem}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);" image-spinner-loader="lines" /> + <img id="img-{{$index}}" image-spinner-src="{{monitor.Monitor.streamingURL}}/zms?mode={{getMode()}}&monitor={{monitor.Monitor.Id}}&scale={{LoginData.montageQuality}}{{$root.authSession}}&rand={{randToAvoidCacheMem}}" ng-click="!isDragabillyOn?openModal(monitor.Monitor.Id, monitor.Monitor.Controllable, monitor.Monitor.ControlId, monitor.Monitor.connKey,monitor):toggleSelectItem(monitor.Monitor.Id);" image-spinner-loader="lines" img-spinner-w="{{monitor.Monitor.Width}}" img-spinner-h="{{monitor.Monitor.Height}} /> </div> </div> |