www/templates/timeline-modal.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

<!-- style="width: 90%; height: 90%; top: 5%; left: 5%; right: 5%; bottom: 5%;"-->
<ion-modal-view cache-view="false">
  <ion-content ng-cloak on-double-tap="closeModal()" delegate-handle="timeline-modal-delegate" class="notch-ready">
    <div ng-controller="TimelineModalCtrl">
      <br />
      <div class="item item-divider">{{mName}}&nbsp;
        <i class="ion-arrow-right-b"></i>&nbsp;{{'kEvent' | translate}}:{{eid}} ({{humanizeTime}})
        <button class="button icon-left button-small  button-positive" style="float:right; opacity:0.7" ng-click="switchType()">
          <i class="ion-shuffle"></i>
        </button>
      </div>
      <center>
        <h5>{{'kEvent' | translate}} {{graphType}} {{'kFrames' | translate}} </h5>
        <p>{{'kTimelineMessage' | translate}}</p>
        {{errorDetails}}
        <!--<p>scroll left/right if needed</p>-->
      </center>
      <div data-tap-disabled="true">
        <canvas id="tcchart" width="auto" height="70%"></canvas>
      </div>
      <ion-spinner icon="spiral" style="position:absolute; top:50%;left:50%" ng-if="!dataReady"></ion-spinner>
      <div style="height:190px;">
        <!-- <ion-scroll direction="x"  class="wide-as-needed">-->
        <span ng-repeat="alarm in alarm_images">


          <figure style="display:inline-block">
            <figcaption class="smallnote">f:{{alarm.fid}} scr:{{alarm.score}} @ {{alarm.time}}</figcaption>
            <img image-spinner-src="{{constructFrames(event,alarm)}}" style="width: auto; height: auto;max-width: 100%;max-height: 170px"
              on-tap="showImage(event.Event.recordingURL,event.Event.relativePath,alarm.fname, alarm.fid, event.Event.Id, event.Event.imageMode, alarm.id)"
              image-spinner-loader="lines" />


          </figure>

        </span>
        <!--</ion-scroll>-->
      </div>
    </div>


  </ion-content>

  <nav mfb-menu position="br" effect="zoomin" label="{{'kCollapse'|translate}}" active-icon="ion-chevron-down"
    resting-icon="ion-chevron-up" toggling-method="click">
    <a mfb-button icon="ion-close" label="{{'kExit' | translate}}" ng-click="closeModal()"> </a>

  </nav>

</ion-modal-view>