unserver-unify/src/app/course/chapter/mobileppts.html

<div class="carousel-inner" ng-if='ppt.type=="ppt"' align="center">
  <!--<div style="height:530px; overflow:hidden; border:1px solid red;background:blue;"></div>-->
  <div ng-if="ppt.pic" style="height:100%; text-align: center;" align="center">
    <img ng-if="ppt.pic" ng-src="{{ctrl.getPPtPicUrl(ppt.pic)}}" height="100%" style="max-width:100%;">
  </div>
  <div class="carousel-caption">
    <h2>{{ppt.title}}</h2>
  </div>
  <!-- video exist -->

  <div class="ppt_video left_bottom" ng-if="ppt.mp4">
    <video autoplay="" class="audio_aln"  controls="true">
      <source ng-src="{{ ctrl.getvideoUrl( ppt.mp4) }}" type="video/mp4">
        {{ 'Your browser does not support the video element' | translate }}
    </video>
  </div> 
</div>
<div class="col-md-offset-1 col-md-10" ng-if='ppt.type=="test"'>
  <div ng-repeat="question in ppt.questions">
    <h4>
      {{$index}} : {{ctrl.typename[question.type] |translate}}
      <span><i ng-if="ppt.showresult" class="{{resulticon[question.judgement]}}"> </i>{{ppt.showresult? question.judgement : ''}}</span>
    </h4>
    <div ng-include="'app/course/question.html'"></div>
  </div>
  <div class="heading heading-v1">
    <h2>END</h2>
  </div>
  <div class="text-right">
    <a class="btn btn-u" ng-click="ctrl.submitPPTTest($index)" | translate><i class="glyphicon glyphicon-ok"></i>Submit</a>&nbsp;&nbsp;&nbsp;
    <a class="btn btn-u" ng-click="ctrl.retestPPT($index)" | translate><i class="glyphicon glyphicon-refresh"></i>Retest</a>
  </div>
</div>
<div ng-if='ppt.type=="html"'>
  <h3 align="center">{{ppt.title}}</h3>
  <div class="col-md-offset-1 col-md-10" ng-bind-html="ppt.content"></div>
</div>
<div ng-if='ppt.type == "mp4"' width="400" height="{{(maxFlag||ctrl.chapters.length<2) ? 400:300}}" class="videogular-container">
  <!-- html for no sub video play -->
  <videogular ng-if="!ppt.mp4sub" vg-player-ready="ctrl.onPlayerReady($API)" vg-theme="ctrl.mp4config.theme" vg-auto-play="true">
    <vg-media vg-src="ppt.mp4config.sources"></vg-media>
    <vg-controls vg-autohide="true" vg-autohide-time="1000">
      <vg-play-pause-button></vg-play-pause-button>
      <vg-time-display>{{ currentTime | date:'mm:ss' }}</vg-time-display>
      <vg-scrub-bar>
        <vg-scrub-bar-current-time></vg-scrub-bar-current-time>
      </vg-scrub-bar>
      <vg-time-display>{{ totalTime | date:'mm:ss' }}</vg-time-display>
      <vg-volume>
        <vg-mute-button></vg-mute-button>
        <vg-volume-bar></vg-volume-bar>
      </vg-volume>
      <vg-fullscreen-button></vg-fullscreen-button>
    </vg-controls>
    <vg-buffering></vg-buffering>
    <vg-overlay-play></vg-overlay-play>
  </videogular>
  <!-- html for sub video play -->
  <videogular ng-if="ppt.mp4sub" vg-player-ready="ctrl.onPlayerReady($API)" vg-theme="ctrl.mp4config.theme" vg-auto-play="true" vg-crossorigin="'anonymous'">
    <vg-media vg-src="ppt.mp4config.sources" vg-tracks="ppt.mp4config.tracks"></vg-media>
    <vg-controls vg-autohide="true" vg-autohide-time="1000">
      <vg-play-pause-button></vg-play-pause-button>
      <vg-time-display>{{ currentTime | date:'mm:ss' }}</vg-time-display>
      <vg-scrub-bar>
        <vg-scrub-bar-current-time></vg-scrub-bar-current-time>
      </vg-scrub-bar>
      <vg-time-display>{{ totalTime | date:'mm:ss' }}</vg-time-display>
      <vg-volume>
        <vg-mute-button></vg-mute-button>
        <vg-volume-bar></vg-volume-bar>
      </vg-volume>
      <vg-fullscreen-button></vg-fullscreen-button>
    </vg-controls>
    <vg-buffering></vg-buffering>
    <vg-overlay-play></vg-overlay-play>
  </videogular>
</div>
<object ng-if='ppt.type == "flash"' type="application/x-shockwave-flash" width="100%" height="{{(maxFlag||ctrl.chapters.length<2) ? 600:400}}" ng-attr-data="{{ctrl.getPPtPicUrl(ppt.flash)}}"></object>
<a id="iconleft" class="left carousel-control" ng-click="ctrl.leftclick()">
  <span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a id="iconright" class="right carousel-control" ng-click="ctrl.rightclick();">
  <span id="icongright" class="glyphicon glyphicon-chevron-right"></span>
</a>
<div ng-if="chapter.type=='ppts'" class="badge badge-info">{{pptindex+1}} / {{chapter.ppts.length}}</div>
<div class="clearfix"></div>