unserver-unify/src/app/ofcourse/gsx/mobile_info.html

<div class="info_page" ng-controller="OFCourseCtrl as ctrl">
  <!-- Original code -->
  <div class="tag-box theme_red row" style="padding-top:0; padding-bottom:0;">      <!-- show video if video available -->
    <img ng-if="ctrl.imageUrl" ng-src="{{ctrl.imageUrl}}" style="width: 100%"/>
    <img ng-if="!ctrl.imageUrl" src="assets/images/course.png" style="width: 100%"/>
    <ul class="middle_tab cf_tab" ng-init="showTab = 0">
      <li ng-class="{'active': showTab == 0}" ng-click="showTab=0" class="active" style="">
        <a class="btn"  translate="">
          Description
        </a>
      </li>
      <li ng-class="{'active': showTab == 1}"  ng-click="showTab=1"   style="">
        <a class="btn" translate="">
          Available Session
        </a>
      </li>
      <li ng-class="{'active': showTab == 2}" ng-click="showTab=2"   style="">
        <a class="btn" translate="">
          Booked Session
        </a>
      </li>
    </ul>
  </div>
  <div class="clearfix"></div>
  <!-- Tab 0 Starts -->
  <div ng-class="{'profile-edit tab-pane fade':true, 'in active':showTab == '0'}">
    <div class="tag-box row" style="margin-bottom: 20px;">
      <div class="forum">
        <div class="content_heading_sec">
          <div class="margin-bottom-10 blog-info" style="border:none;">
            <strong>
              {{ ctrl.item.name }}
            </strong>
            <div class="clearfix"></div>
          </div>
        </div>
      </div>
      <div class="course_information" style="margin-bottom: 10px;">
        <ul>
          <li class="views">
            <i class="fa fa-eye">
            </i>
            10
          </li>
          <li class="offline">
            <i class="fa fa-users">
            </i>
            offline
          </li>
        </ul>
        <div class="course_price">
          {{ctrl.currency}} {{ ctrl.item.price }}
        </div>
      </div>
      <div class="row">
        <div class="tag-box tag-box-v2">
          <div class="no_record" translate="" ng-if="!ctrl.item.description">
            No Record
          </div>
          <div class="margin-bottom-20" ng-bind-html="ctrl.item.description">
          </div>
          <div ng-if="ctrl.item.detail">
            <div class="margin-bottom-20" ng-bind-html="ctrl.item.detail">
            </div>
          </div>
        </div>
      </div>
    </div>
    <div ng-if="ctrl.editors | notEmpty">
      <div class="margin-bottom-20">
        <div class="headline" ng-if="ctrl.editors&&ctrl.editors.length>0">
          <h4 translate="course.teachers">
            Teachers
          </h4>
        </div>
        <div class="teacher_container">
          <div ng-repeat="teacher in ctrl.editors">
            <div class="teacher_block margin-bottom-0">
              <div class="col-md-4 col-xs-3 no-padding">
                <a ng-controller="LoginCtrl as lctrl" ng-if="!loginService.isLogged">
                  <img ng-if="teacher.photo" style="max-height:120px;" ng-src="{{ ctrl.teacherPicUrl + teacher._id +'/' + teacher.photo }}" style="max-height:120px;" title="{{ teacher.name }}"/>
                  <img ng-if="!teacher.photo" ng-src="assets/images/default-person-icon.png" title="{{ teacher.name }}"/>
                </a>
                <a ng-if="loginService.isLogged" ui-sref="index.teacher.detail.summary({teacherloginname : teacher.username,cs:getCheckSum(teacher.username)})">
                  <img ng-if="teacher.photo" style="max-height:120px;" ng-src="{{ ctrl.teacherPicUrl + teacher._id +'/' + teacher.photo }}" title="{{ teacher.name }}"/>
                  <img ng-if="!teacher.photo" style="max-height:120px;" ng-src="assets/images/default-person-icon.png" title="{{ teacher.name }}"/>
                </a>
              </div>
              <div class="col-md-8 col-xs-9 padding-left-0">
                <h3 style="margin-top:0px;">
                  <a class="cursor-pointer" ng-controller="LoginCtrl as lctrl" ng-if="!loginService.isLogged">
                    {{ teacher.name }}
                  </a>
                  <a ng-if="loginService.isLogged" ui-sref="index.teacher.detail.summary({teacherloginname : editor.username,cs:getCheckSum(editor.username)})">
                    {{ teacher.name }}
                  </a>
                </h3>
                <p>
                  <b>
                    <span>
                      {{teacher.title}}
                    </span>
                  </b>
                </p>
                <p>
                  {{teacher.description}}
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- Tab 0 Ends -->
  <!-- Tab 1 Starts -->
  <div class="col-xs-12 no-padding course_content" ng-class="{'profile-edit tab-pane fade':true, 'in active':showTab == '1'}">
    <ul class="profile crsr" ng-controller="LoginCtrl as lctrl" style="margin: 0">
      <li class=" profile-post color-one relative" ng-click="ctrl.book(app)" ng-if="!app.selected" ng-repeat="app in  ctrl.eventData">
        <span class="profile-post-numb"></span>
        <div class="profile-post-in">
          <h3 class="heading-xs">
            {{app.title}}
          </h3>
          <p>
            {{app.start | date:'h:mma dd-MM-yyyy'}}
          </p>
          <button style="position: absolute; right: 10px; bottom: 10px; border-radius: 4px !important; cursor: pointer;" target="_blank" class="btn-u btn-u-green btn-sm">Book</button>
        </div>
      </li>
    </ul>
    <div class="margin-bottom-20"></div>
  </div>
  <!-- Tab 1 Ends -->
  <!-- Tab 2 Starts -->
  <div ng-class="{'profile-edit tab-pane fade':true, 'in active':showTab == '2'}">
    <ul class="profile crsr" ng-controller="LoginCtrl as lctrl" style="margin: 0">
      <li class=" profile-post color-one" ng-click="ctrl.book(app)" ng-if="!app.selected" ng-repeat="app in  ctrl.apps">
        <div class="news-title">
          <span class="profile-post-numb"></span>
          <div class="profile-post-in">
            <h3 class="heading-xs">
              {{app.sessionname}}
            </h3>
            <p>
              {{app.time | date:'h:mma dd-MM-yyyy'}}
            </p>
          </div>
        </div>
      </li>
      <li ng-if="ctrl.apps.length <= 0">
        <div class="no_record" style="margin:0;" translate="">
          No session Booked
        </div>
      </li>
    </ul>
    <div class="margin-bottom-20"></div>
  </div>
  <!-- Tab 2 Ends -->
</div>
<div class="footer_text margin-bottom-40">
  {{'Powered by' | translate }}
  <a class="color" href="http://bamboosys.com/" target="_blanck">
    {{'BambooCloud' | translate }}
    <sup>
      ®
    </sup>
  </a>
  {{'Online Learning Platform' | translate }}
  <div class="clearfix">
  </div>
  <a href="http://bamboosys.com/" target="_blanck">
    www.bamboosys.com
  </a>
</div>
<div class="clearfix"></div>
<!-- End of origianl code -->