diff options
| author | Pliable Pixels <pliablepixels@gmail.com> | 2018-05-12 08:12:23 -0400 |
|---|---|---|
| committer | Pliable Pixels <pliablepixels@gmail.com> | 2018-05-12 08:12:23 -0400 |
| commit | 0d81a588d42c73c92d313f853461b433f8543ae4 (patch) | |
| tree | 08590e3caad35938ec92c7a04bc3206409011284 /www/templates/montage.html | |
| parent | 971741dc3e0eaa26c3a56ceeab6ce6eece61b6ce (diff) | |
file formatting
Diffstat (limited to 'www/templates/montage.html')
| -rw-r--r-- | www/templates/montage.html | 285 |
1 files changed, 156 insertions, 129 deletions
diff --git a/www/templates/montage.html b/www/templates/montage.html index 139799e7..876e1125 100644 --- a/www/templates/montage.html +++ b/www/templates/montage.html @@ -1,155 +1,182 @@ -<ion-view cache-view="false" hide-nav-bar="{{minimal}}"> - <ion-nav-title>{{currentProfileName}}</ion-nav-title> - <ion-nav-buttons side="left"> - <button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button> - <button class="button button-icon button-clear ion-eye" ng-click="hideUnhide();"> - </button> - <button class="button button-icon button-clear ion-chevron-down" ng-click="toggleSubMenuFunction();"> - </button> - <button data-badge="{{$root.alarmCount}}" class="animated infinite tada button button-icon button-clear ion-ios-bell notification-badge" ng-click="handleAlarms();" ng-if="$root.isAlarm"></button> - </ion-nav-buttons> - <ion-nav-buttons side="right"> - <span ng-click="toggleTimeType()" class="icon montage-time"> - <i ng-class="(iconTimeNow=='server')?'icon-server':'ion-ios-location'"></i> - {{timeNow}} </span> - <button class="button button-icon button-clear ion-arrow-move" ng-click="dragToggle();"> - </button> - <!-- +<ion-view cache-view="false" hide-nav-bar="{{minimal}}"> + <ion-nav-title>{{currentProfileName}}</ion-nav-title> + <ion-nav-buttons side="left"> + <button class="button button-icon button-clear ion-navicon" ng-click="openMenu()"></button> + + <button class="button button-icon button-clear ion-eye" ng-click="hideUnhide();"> + </button> + <button class="button button-icon button-clear ion-chevron-down" ng-click="toggleSubMenuFunction();"> + </button> + <button data-badge="{{$root.alarmCount}}" class="animated infinite tada button button-icon button-clear ion-ios-bell notification-badge" + ng-click="handleAlarms();" ng-if="$root.isAlarm"></button> + </ion-nav-buttons> + <ion-nav-buttons side="right"> + <span ng-click="toggleTimeType()" class="icon montage-time"> + <i ng-class="(iconTimeNow=='server')?'icon-server':'ion-ios-location'"></i> + {{timeNow}} </span> + <button class="button button-icon button-clear ion-arrow-move" ng-click="dragToggle();"> + </button> + <!-- <button class="button button-icon button-clear ion-monitor" ng-click="cast();"> </button> --> - <button class="button button-icon button-clear ion-loop" ng-click="resetSizes();"> - </button> - <button class="button button-icon button-clear ion-android-contract" ng-click="switchMinimal()"> - </button> - </ion-nav-buttons> - <ion-content ng-cloak has-bouncing="false" style="background-color:#444444" delegate-handle="montage-delegate" overflow-scroll="false"> - - <div ng-if="areImagesLoading" class="screen-note"> {{ 'kArrangingImages' | translate }}... </div> - - - <div ng-if="!minimal && toggleSubMenu" > - <!-- this is header --> - <br/> - <div id="flyoutmenu" style="float:left"> - <ul> - <!-- <li> + <button class="button button-icon button-clear ion-loop" ng-click="resetSizes();"> + </button> + <button class="button button-icon button-clear ion-android-contract" ng-click="switchMinimal()"> + </button> + </ion-nav-buttons> + <ion-content ng-cloak has-bouncing="false" style="background-color:#444444" delegate-handle="montage-delegate" overflow-scroll="false"> + + <div ng-if="areImagesLoading" class="screen-note"> {{ 'kArrangingImages' | translate }}... </div> + + + <div ng-if="!minimal && toggleSubMenu"> + <!-- this is header --> + <br/> + <div id="flyoutmenu" style="float:left"> + <ul> + <!-- <li> <a href="" ng-click="killAllImages()"> <i class="ion-ionic"></i></a> </li>--> - <li> - <a href="" ng-click="sliderChanged(1)"> <i class="ion-plus-circled"></i></a> - </li> - <li> - <a href="" ng-click="sliderChanged(-1)"> <i class="ion-minus-circled"></i></a> - </li> - <li> - <a href="" ng-click="squeezeMonitors()"> <i class="ion-android-apps"></i></a> - </li> - - <li ng-style="{'background-color': isCycleOn()?'rgba(69, 170, 242,0.7)':'rgba(108, 122, 137, 0.7)'}" ng-if="!isDragabillyOn"> - <a href="" ng-click="toggleCycle()"> <i class="ion-android-bicycle"></i>:{{getCycleStatus()}}</a> - </li> - - <li ng-if="isDragabillyOn"> - <a href="" ng-click="hideMonitor(monitor.Monitor.Id)"> <i class="ion-close-circled"></i></a> - </li> - <li ng-if="isDragabillyOn"> - <a href="" ng-click="toggleStamp()"> <i class="ion-pin"></i></a> - </li> - - </ul> - </div> + <li> + <a href="" ng-click="sliderChanged(1)"> + <i class="ion-plus-circled"></i> + </a> + </li> + <li> + <a href="" ng-click="sliderChanged(-1)"> + <i class="ion-minus-circled"></i> + </a> + </li> + <li> + <a href="" ng-click="squeezeMonitors()"> + <i class="ion-android-apps"></i> + </a> + </li> + + <li ng-style="{'background-color': isCycleOn()?'rgba(69, 170, 242,0.7)':'rgba(108, 122, 137, 0.7)'}" ng-if="!isDragabillyOn"> + <a href="" ng-click="toggleCycle()"> + <i class="ion-android-bicycle"></i>:{{getCycleStatus()}}</a> + </li> + + <li ng-if="isDragabillyOn"> + <a href="" ng-click="hideMonitor(monitor.Monitor.Id)"> + <i class="ion-close-circled"></i> + </a> + </li> + <li ng-if="isDragabillyOn"> + <a href="" ng-click="toggleStamp()"> + <i class="ion-pin"></i> + </a> + </li> + + </ul> + </div> + + <div id="flyoutmenu" style="float:right"> + <ul> + <li> + <a href="" ng-click="switchMontageProfile()"> + <i class="ion-navicon-round"></i> + </a> + </li> + + <li> + <a href="" ng-click="saveMontageProfile()"> + <i class="ion-heart"></i> + </a> + </li> + + <li> + <a href="" ng-click="deleteMontageProfile()"> + <i class="ion-trash-a"></i> + </a> + </li> + + + </ul> + </div> + <div style="clear: both;"></div> + + <br/> + </div> + <!-- now lets draw the montage windows --> + <div class="grid" id="mygrid"> + <div class="grid-sizer grid-item-5"></div> + <!-- <span ng-repeat="monitor in MontageMonitors|limitTo: monLimit" + ng-if="monitor.Monitor.Function!='None' && monitor.Monitor.Enabled !='0' ">--> - <div id="flyoutmenu" style="float:right"> - <ul> - <li> - <a href="" ng-click="switchMontageProfile()"> <i class="ion-navicon-round"></i></a> - </li> - <li> - <a href="" ng-click="saveMontageProfile()"> <i class="ion-heart"></i></a> - </li> - <li> - <a href="" ng-click="deleteMontageProfile()"> <i class="ion-trash-a"></i></a> - </li> - + <span ng-repeat="monitor in MontageMonitors | onlyEnabled |limitTo: monLimit"> + <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}} "> - </ul> - </div> - <div style="clear: both;"></div> + <!-- <figure> + <iframe width="200" height="100" src="https://news.google.com" frameborder="2" ></iframe> + </figure>--> - <br/> - </div> - <!-- now lets draw the montage windows --> - <div class="grid" id="mygrid"> - <div class="grid-sizer grid-item-5"></div> - <!-- <span ng-repeat="monitor in MontageMonitors|limitTo: monLimit" - ng-if="monitor.Monitor.Function!='None' && monitor.Monitor.Enabled !='0' ">--> - + <figure class="{{dragBorder}}" ng-show="monitor.Monitor.listDisplay!='noshow'"> + <!--<div ng-if="!isModalActive" >--> + <!--<div ng-if="$root.authSession!='undefined' && !isBackground() && !areImagesLoading">--> - <span ng-repeat="monitor in MontageMonitors | onlyEnabled |limitTo: monLimit"> - <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}} "> + <div ng-if="!minimal"> + <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}" 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}}" + /> - <!-- <figure> - <iframe width="200" height="100" src="https://news.google.com" frameborder="2" ></iframe> - </figure>--> + </div> + + <div ng-if="minimal"> + <img id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}" 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> - <figure class="{{dragBorder}}" ng-show="monitor.Monitor.listDisplay!='noshow'"> - <!--<div ng-if="!isModalActive" >--> - <!--<div ng-if="$root.authSession!='undefined' && !isBackground() && !areImagesLoading">--> - - <div ng-if = "!minimal" > - <img class="{{monitor.Monitor.selectStyle}}" id="img-{{$index}}" image-spinner-src="{{constructStream(monitor)}}" 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="{{constructStream(monitor)}}" 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> - - + <figcaption id="slowpulse" ng-class="monitor.Monitor.isAlarmed==true?'alarmed-figcaption animated infinite flash':'normal-figcaption'"> - <figcaption id="slowpulse" ng-class="monitor.Monitor.isAlarmed==true?'alarmed-figcaption animated infinite flash':'normal-figcaption'" > - - <span ng-if="monitor.Monitor.isStamp && isDragabillyOn"><i class="animated infinite flash ion-pin"></i> </span><i class="ion-ios-videocam"></i> - {{monitor.Monitor.Name}} <i ng-if="$root.runMode!='lowbw'" ng-style="{'color':monitor.Monitor.alarmState}" class="ion-record"></i> + <span ng-if="monitor.Monitor.isStamp && isDragabillyOn"> + <i class="animated infinite flash ion-pin"></i> </span> + <i class="ion-ios-videocam"></i> {{monitor.Monitor.Name}} + <i ng-if="$root.runMode!='lowbw'" ng-style="{'color':monitor.Monitor.alarmState}" class="ion-record"></i> - </figcaption> + </figcaption> + + </figure> - </figure> - - </div> - </span> - <!-- ngrepeat --> </div> - <ion-item style="background-color:#444444; color:#fff;border:none;" ng-show="!MontageMonitors.length"> - {{'kNoMonitors' | translate}} - </ion-item> - </ion-content> - <div class="bwmode" ng-if="$root.runMode=='lowbw'"> - {{ 'kLowBWDisplay' | translate }} + </span> + <!-- ngrepeat --> </div> - <div ng-show="minimal"> - <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up" toggling-method="click"> - <button mfb-button icon="ion-arrow-expand" label="{{'kIncreaseSize' | translate}}" ng-click="sliderChanged(1)"> - </button> - <button mfb-button icon="ion-arrow-shrink" label="{{'kDecreaseSize' | translate}}" ng-click="sliderChanged(-1)"> - </button> - <!-- <button mfb-button icon="ion-refresh" label="{{'kRefresh' | translate}}" ng-click="resetSizes();"> + <ion-item style="background-color:#444444; color:#fff;border:none;" ng-show="!MontageMonitors.length"> + {{'kNoMonitors' | translate}} + </ion-item> + </ion-content> + <div class="bwmode" ng-if="$root.runMode=='lowbw'"> + {{ 'kLowBWDisplay' | translate }} + </div> + <div ng-show="minimal"> + <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse' | translate}}" active-icon="ion-chevron-down" resting-icon="ion-chevron-up" + toggling-method="click"> + <button mfb-button icon="ion-arrow-expand" label="{{'kIncreaseSize' | translate}}" ng-click="sliderChanged(1)"> + </button> + <button mfb-button icon="ion-arrow-shrink" label="{{'kDecreaseSize' | translate}}" ng-click="sliderChanged(-1)"> + </button> + <!-- <button mfb-button icon="ion-refresh" label="{{'kRefresh' | translate}}" ng-click="resetSizes();"> </button>--> - <button mfb-button icon="ion-close" label="{{'kExitFullScreen'| translate}}" ng-click="switchMinimal()"> - </button> - </nav> - <span class="modal-alarm-badge"> - <a data-badge="{{$root.alarmCount}}" class="animated infinite tada button icon ion-ios-bell notification-badge button-assertive" - ng-click="handleAlarmsWhileMinimized();" ng-if="$root.isAlarm"></a> - </span> - </div> - <br/> + <button mfb-button icon="ion-close" label="{{'kExitFullScreen'| translate}}" ng-click="switchMinimal()"> + </button> + </nav> + <span class="modal-alarm-badge"> + <a data-badge="{{$root.alarmCount}}" class="animated infinite tada button icon ion-ios-bell notification-badge button-assertive" + ng-click="handleAlarmsWhileMinimized();" ng-if="$root.isAlarm"></a> + </span> + </div> + <br/> </ion-view> |
