MOBILE-2008 courses: Sort courses using sortorder field

www/core/components/courses/controllers/coursecategories.js

@@ -21,7 +21,7 @@ angular.module('mm.core.courses')
  * @ngdoc controller
  * @name mmCourseCategoriesCtrl
  */
-.controller('mmCourseCategoriesCtrl', function($scope, $stateParams, $mmCourses, $mmUtil, $q, $state, $mmSite) {
+.controller('mmCourseCategoriesCtrl', function($scope, $stateParams, $mmCourses, $mmUtil, $q, $mmSite) {
 
     var categoryId = $stateParams.categoryid || 0;
 

www/core/components/courses/services/courses.js

@@ -307,7 +307,25 @@ angular.module('mm.core.courses')
                 };
 
             return site.read('core_course_get_courses_by_field', data, preSets).then(function(courses) {
-                return courses.courses || $q.reject();
+                if (courses.courses) {
+                    // Courses will be sorted using sortorder if avalaible.
+                    return courses.courses.sort(function(a, b) {
+                        if (typeof a.sortorder == "undefined" && typeof b.sortorder == "undefined") {
+                            return b.id - a.id;
+                        }
+
+                        if (typeof a.sortorder == "undefined") {
+                            return 1;
+                        }
+
+                        if (typeof b.sortorder == "undefined") {
+                            return -1;
+                        }
+
+                        return b.sortorder - a.sortorder;
+                    });
+                }
+                return $q.reject();
             });
         });
     };

www/core/components/courses/templates/courselistitem.html

@@ -1,4 +1,4 @@
-<a class="item item-icon-left item-button-right item-text-wrap" ui-sref="site.mm_viewresult({course: course})" title="{{course.fullname}}">
+<a class="item item-icon-left item-button-right item-text-wrap" ui-sref="site.mm_viewresult({course: course})" ng-class="{'item-disabled': course.visible == 0}" title="{{course.fullname}}">
     <i class="icon ion-ionic"></i>
     <h2><mm-format-text watch="true">{{course.fullname}}</mm-format-text></h2>
     <div class="buttons buttons-small">

www/core/scss/styles.scss

@@ -265,6 +265,9 @@ p.item-text-wrap {
 .item.item-disabled,
 .platform-android .item.item-disabled {
   color: $item-disabled-color;
+  h2 {
+    color: $item-disabled-color;
+  }
 }
 
 // Avoid adding too much padding.