unserver-unify/src/app/course/list.html

<div ng-controller="CoursesCtrl as ctrl">

  <div class="col-md-12 transition_all" ng-if="ctrl.searchCourseFlag || ctrl.searchCateFlag" style="margin-top:-10px; margin-bottom:10px;">
    <span class="search_result" style="font-size: 22px; line-height: 50px; padding-left: 10px;">{{'As per your search we found'|translate}} <span>{{setting.totalCount}}</span> {{ {eng:'Courses', chn:'个课程'}|trans }}</span>
    <div class="clearfix"></div>
    <ul class="filter_holder">
      <i class="fa fa-filter"></i>
      <li class="search_keyword" ng-if="ctrl.searchCourseFlag">
        {{ctrl.q}}
        <i class="fa fa-times cursor-pointer" ng-click="ctrl.clearSearchCourse();"></i>
      </li>
      <li class="search_keyword" ng-if="ctrl.searchCateFlag">
        {{ctrl.option}}
        <i class="fa fa-times cursor-pointer" ng-click="ctrl.clearSearchCate();"></i>
      </li>
      <li class="search_clear"><a href="javascript:;" ng-click="ctrl.clearSearch()" translate="">Clear all</a></li>
    </ul>
  </div>
  <div class="clearfix"></div>
  <div class="col-md-3">
    <script id="menuTree.html" type="text/ng-template">
      <ul class="{(item.key==ctrl.option) ? 'active' : ''}} side-nav">
        <i class="sidebar_arrow {{item.items.length>0 ? 'fa fa-angle-right':''}}">
        </i>
        <a ng-click="ctrl.list(item.key)" class="{{(item.key==ctrl.option) ? 'active' : ''}} list">
          <span style="cursor: pointer;">
            {{item.title}}&nbsp;
            <span ng-if='item.value==0' class="itm_cntr" style="width:auto!important">
              ({{item.counter||0}})
            </span>
          </span>
        </a>
        <ul class="second_level">
          <li ng-repeat="item in item.items" ng-include="'menuTree.html'">
          </li>
        </ul>
      </ul>
    </script>
    <ul class="sidebar_responsive" ng-class="{'sidebar_active':dropdown}" ng-if="!loginService.school.coursebyDepartment">
      <li ng-class="{'sidebar_responsive_active':dropdown}">
        <button class="btn btn-primary" ng-click="ctrl.toggledrop()" type="button">
          <span class="fa fa-bars">
          </span>
        </button>
        <ul class="list-group sidebar-nav-v1">
          <li class="list-group-item {(''==ctrl.option) ? 'active' : ''}} side-nav" style="position:relative">
            <a class="{{(''== ctrl.option) ? 'active' : ''}} list" ng-click="ctrl.clearSearch()">
              <span style="cursor: pointer;">
                <strong style="float:left">
                  {{'All Courses' | translate}}
                </strong>
                <span class="itm_cntr" style="width:auto!important">
                  ({{ loginService.school.summary.publishCourse || ctrl.total|| 0}})
                </span>
              </span>
            </a>
          </li>
          <li class="list-group-item" ng-if="!setting.items">
            <div class="no_record" translate="">
              No Record
            </div>
          </li>
          <li class="list-group-item" ng-if="item.counter != 0" ng-include="'menuTree.html'" ng-repeat="item in catitems" style="position:relative">
          </li>
        </ul>
      </li>
    </ul>
    <ul class="list-group sidebar-nav-v1" ng-if="loginService.school.coursebyDepartment">
      <li class="list-group-item" ng-class="{'active': ctrl.option == ''}">
        <a ng-click="ctrl.listdepartment('')" style="cursor:pointer;">
          <strong translate="">
            All
          </strong>
          <strong>
            ({{ctrl.totalCoursesCountUnderDepartment}})
          </strong>
        </a>
      </li>
      <li class="list-group-item" ng-class="{'active': item.department == ctrl.department}" ng-repeat="item in ctrl.Departments">
        <a href="javascript:void(0)" ng-click="ctrl.listdepartment(item.department)">
          {{item.department}}
          <span class="itm_cntr" style="width:auto!important">
            ({{item.counter||0}})
          </span>
        </a>
      </li>
    </ul>
    <div class="clearfix">
    </div>
  </div>
  <div class="col-md-9">
    <div class="forum">
      <div class="input-group col-lg-3 col-md-3 col-sm-3 top-search" ng-class="{'enable': ctrl.q.length > 0, 'filter_search': (ctrl.searchCourseFlag || ctrl.searchCateFlag)}">
        <input class="form-control" ng-model="ctrl.q" ng-enter="ctrl.searchCourseByName(ctrl.q)" placeholder="{{ 'search course' | translate }}" type="text"/>
        <span class="input-group-btn">
          <button class="btn btn-primary srch_btn" ng-click="ctrl.searchCourseByName(ctrl.q)" type="button">
            <i class="fa fa-search">
            </i>
          </button>
        </span>
      </div>
      <div ng-if="!ctrl.searchCourseFlag" class="form-inline pull-left ipad_count_aln" style="line-height: 38px;">
        {{"Total Count"| translate}}:
        <span class="badge badge-green rounded-2x">
          {{setting.totalCount}}
        </span>
      </div>
      <div class="form-inline pull-right sorting sorting_adj" ng-if="!ctrl.searchCourseFlag&&!ctrl.searchCateFlag">
        <a class="hottest" ng-class="{'active': ctrl.sortmethod == ''}" ng-click="ctrl.getAllCourses()">
          <i class="glyphicon glyphicon-fire">
          </i>
          {{{eng:'ALL',chn:'全部课程'} | trans}}
        </a>
        <a class="hottest" ng-class="{'active': ctrl.sortmethod == 'comming'}" ng-click="ctrl.getComingCourses()" ng-if="currentSchool.earlyPublishCourse&&ctrl.dynamicTypes.length==0">
          <i class="fa fa-clock-o" style="color:blue;">
          </i>
          {{{eng:'Coming',chn:'即将开始'} | trans}}
        </a>
        <a class="hottest" ng-if="loginService.subDomain != 'xijing'&&ctrl.dynamicTypes.length==0" ng-class="{'active': ctrl.sortmethod == 'visitercounter'}" ng-click="ctrl.getHotestCourses()">
          <i class="glyphicon glyphicon-fire">
          </i>
          {{"common.hotestcourses" | translate}}
        </a>
        <a class="latest" ng-if="loginService.subDomain != 'xijing'&&ctrl.dynamicTypes.length==0"  ng-class="{'active': ctrl.sortmethod == 'update'}" ng-click="ctrl.getNewCourses()">
          <i class="fa fa-clock-o">
          </i>
          {{"common.latestcourses" | translate}}
        </a>
        <a class="topest" ng-if="loginService.subDomain == 'xijing'&&ctrl.dynamicTypes.length==0" ng-class="{'active': ctrl.sortmethod == 'star'}" ng-click="ctrl.getStarCourses()" ng-if="currentSchool.topCoursesFlag">
          <i class="fa fa-graduation-cap">
          </i>
          {{"common.starcourses" | translate}}
        </a>
        <a class="topest" ng-class="{'active': ctrl.sortmethod == 'top'}" ng-click="ctrl.getTopCourses()" ng-if="currentSchool.topCoursesFlag&&ctrl.dynamicTypes.length==0">
          <i class="fa fa-graduation-cap">
          </i>
          {{"common.topcourses" | translate}}
        </a>
        <a class="topest" ng-if="ctrl.dynamicTypes.length==0" ng-class="{'active': ctrl.sortmethod == tag}" ng-click="ctrl.searchCourseByTag(tag)" ng-repeat="tag in ctrl.courseTags">
          <i class="fa fa-graduation-cap">
          </i>
          {{tag | translate}}
        </a>
        <a class="topest" ng-class="{'active': ctrl.sortmethod == type}" ng-click="ctrl.searchCourseByType(type)" ng-repeat="type in ctrl.dynamicTypes">
          <i class="fa fa-graduation-cap">
          </i>
          {{ type | translate}}
        </a>
        <!--       <a class="topest" ng-if="currentSchool.goodCoursesFlag" ng-class="{'active': ctrl.sortmethod == 'goodC'}" ng-click="ctrl.getGoodCourses()">
            <i class="fa fa-thumbs-up">
            </i>
            {{{eng:'Good',chn:'优秀课程'} | trans}}
          </a>
          <a class="topest" ng-if="currentSchool.passCoursesFlag" ng-class="{'active': ctrl.sortmethod == 'passC'}" ng-click="ctrl.getPassCourses()">
            <i class="fa fa-check">
            </i>
            {{{eng:'Pass',chn:'合格课程'} | trans}}
          </a>
          <a class="topest" ng-if="currentSchool.nominationCourseFlag" ng-class="{'active': ctrl.sortmethod == 'nominationC'}" ng-click="ctrl.getNominationCourses()">
            <i class="fa fa-graduation-cap">
            </i>
            {{{eng:'Nomination',chn:'提名课程'} | trans}}
          </a>
          <a class="recommended" ng-class="{'active': ctrl.sortmethod == 'position'}" ng-click="ctrl.getPositionCourses()">
            <i class="fa fa-thumbs-o-up">
            </i>
            {{"common.recommenedcourses" | translate}}
          </a>
          <a class="hottest" ng-class="{'active': ctrl.sortmethod == 'star'}" ng-click="ctrl.getStarCourses()" ng-if="loginService.subDomain != 'caregiverasia'">
            <i class="fa fa-star">
            </i>
            {{"common.starcourses" | translate}}
          </a> -->
      </div>
    </div>
    <div class="clearfix">
    </div>
    <div class="row">
      <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12" current-page="setting.currentPage" dir-paginate="item in setting.items | itemsPerPage: setting.pageSize" pagination-id="setting.listName" total-items="setting.totalCount">
        <div class="thumbnails thumbnail-style thumbnail-kenburn new_listing overflow-hidden relative">
          <span class="new_course" ng-if="item.newflag" translate="">
            New Course
          </span>
          <div class="thumbnail-img">
            <div ng-if="item.completed == true" class="completed_status transition" translate="">Completed</div>
            <div class="overflow-hidden text-center">
              <a ui-sref="{{item.courseurl}}({ cid: item._id ,cs:getCheckSum(item._id)})">
                <img alt="{{ item.name }}" class="img-responsive" ng-src="{{item.photo? ctrl.coursePhotoUrl+item._id +'/'+ item.photo : (item.mvpic? ctrl.subjectPicUrl+ item.mvpic : ctrl.defaultpic)}}" style="height:135px;" title="{{ item.name }}"/>
              </a>
              <span class="badge badge-warning list_micro" ng-if="item.singlesection">
                {{'Micro'|translate}}
              </span>
              <a class="btn-more hover-effect" ui-sref="{{item.courseurl}}({ cid: item._id ,cs:getCheckSum(item._id) })">
                <span class="btn-more prvt_btn" ng-if="item.privacy=='private'" translate="">
                  Private ...
                </span>
                <span class="btn-more prvt_btn" ng-if="item.privacy=='member'">
                  {{ {eng:'Member ...', chn:'会员课程...'}|trans }}
                </span>
                <!-- <span class="btn-more" ng-if="item.privacy=='public'">
                  {{'More'|translate}} +
                </span> -->
              </a>
            </div>
          </div>
          <div class="list_rating">
            <span class="average dummy_avg" ng-if="!item.rating">
              <div class="average-rating-container">
                <ul class="rating background">
                  <li class="star">
                    <i class="fa fa-star">
                    </i>
                  </li>
                  <li class="star">
                    <i class="fa fa-star">
                    </i>
                  </li>
                  <li class="star">
                    <i class="fa fa-star">
                    </i>
                  </li>
                  <li class="star">
                    <i class="fa fa-star">
                    </i>
                  </li>
                  <li class="star">
                    <i class="fa fa-star">
                    </i>
                  </li>
                </ul>
              </div>
            </span>
            <span class="average" ng-if="item.rating">
              <average-star-rating max="5" rating-value="item.rating">
              </average-star-rating>
              <span ng-if="item.rating">
                {{item.rating|number :2}}/5
              </span>
            </span>
            <span class="list_reviews">
              ({{item.ratingcounter||0}} {{'reviews'|translate}})
            </span>
          </div>
          <div class="clearfix">
          </div>
          <div class="caption overflow-hidden clst">
            <h3>
              <a class="hover-effect" ui-sref="{{item.courseurl}}({ cid: item._id,cs:getCheckSum(item._id)  })">
                {{ item.name }}
              </a>
            </h3>
            <p class="product_price" ng-if="item.price">
              {{ctrl.currency}} {{ item.price | number : 2 }}
            </p>
            <p class="product_price" ng-if="!item.price && currentSchool.paymentFlag && lcourse.privacy=='fee'">
              {{ctrl.currency}} {{'Free' | translate}}
            </p>
            <p>
              {{ item.description }}
            </p>
          </div>
          <ul class="list-inline text-left course_btm" ng-style="coursebtmStyle">
            <li class="padding-left-0">
              <span ng-if="loginService.subDomain != 'caregiverasia'" uib-tooltip="{{'Enrolled Users' | translate}}">
                <i class="fa fa-users">
                </i>
                <span>
                  {{item.enrolledcounter}}
                </span>
              </span>
              &nbsp;
              <span uib-tooltip="{{'Views' | translate}}">
                <i class="fa fa-eye">
                </i>
                <span>
                  {{item.visitercounter}}
                </span>
              </span>
            </li>
            <li class="pull-right" ng-if="item.privacy!='fee'">
              <span uib-tooltip="{{'Creater' | translate}}">
                {{item.creatorfullname||item.creater}}
              </span>
            </li>
            <li class="pull-right list_price" ng-if="item.privacy=='fee'">
              <span ng-if="item.price" uib-tooltip="{{'Price' | translate}}">
                ${{item.price}}
              </span>
              <span ng-if="!item.price" uib-tooltip="{{'Price' | translate}}">
                Free
              </span>
            </li>
          </ul>
        </div>
        <div class="ribbon-horizontal-right margin-right-10 missedAnswer" ng-if="item.infoOnlyFlag && currentSchool.infoOnlyCourseFlag">
          <ul class="crs_info list-inline">
            <li>
              <i class="fa fa-users">
              </i>
              {{'Classroom' | translate }}
            </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="row" ng-show="setting.totalCount >setting.pageSize">
      <div class="col-md-12 forum">
        <div class="text-right pagination_aln">
          <dir-pagination-controls boundary-links="true" class="with-others" on-page-change="ctrl.pageChanged(newPageNumber)" pagination-id="setting.listName" template-url="components/content/dirPagination.tpl.html">
          </dir-pagination-controls>
        </div>
      </div>
    </div>
    <div class="no_record" ng-if="setting.items.length == 0 && (!ctrl.latestCourse || ctrl.searchCourseFlag)" translate="" style="padding-top: 14%">
      Your search did not match with any courses, modify your keyword and try again
    </div>
    <div class="no_record" ng-if="setting.items.length == 0 && ctrl.latestCourse&&!ctrl.searchCourseFlag" translate="">
      There is no new course updated in last 30 days
    </div>
  </div>
</div>