MDL-64376 recentlyaccessedcourses: stop reloading on favourite

Stop reloading the whole content when a single course is favourited
or unfavourited.
This commit is contained in:
Ryan Wyllie 2018-12-12 10:06:00 +08:00 committed by Ryan Wyllie
parent 07203d34f1
commit 6d9727628a
6 changed files with 71 additions and 69 deletions

File diff suppressed because one or more lines are too long

View file

@ -217,7 +217,7 @@ function(
setCourseFavouriteState(courseId, true).then(function(success) {
if (success) {
PubSub.publish(CourseEvents.favourited);
PubSub.publish(CourseEvents.favourited, courseId);
removeAction.removeClass('hidden');
addAction.addClass('hidden');
showFavouriteIcon(root, courseId);
@ -240,7 +240,7 @@ function(
setCourseFavouriteState(courseId, false).then(function(success) {
if (success) {
PubSub.publish(CourseEvents.unfavorited);
PubSub.publish(CourseEvents.unfavorited, courseId);
removeAction.addClass('hidden');
addAction.removeClass('hidden');
hideFavouriteIcon(root, courseId);

View file

@ -1 +1 @@
define(["jquery","core_course/repository","core/templates","core/notification","core/pubsub","core_course/events"],function(a,b,c,d,e,f){var g={COURSES_VIEW:'[data-region="recentlyaccessedcourses-view"]',COURSES_VIEW_CONTENT:'[data-region="recentlyaccessedcourses-view-content"]'},h=10,i=function(a,c){return b.getLastAccessedCourses(a,c)},j=function(a,b){if(b.length>0)return c.render("core_course/view-cards",{courses:b});var d=a.attr("data-nocoursesimg");return c.render("block_recentlyaccessedcourses/no-courses",{nocoursesimg:d})},k=function(a,b){var e=b.find(g.COURSES_VIEW),f=b.find(g.COURSES_VIEW_CONTENT),k=i(a,h);return k.then(function(a){var b=j(e,a);return b.then(function(a,b){return c.replaceNodeContents(f,a,b)})["catch"](d.exception),k})["catch"](d.exception)},l=function(a,b){e.subscribe(f.favourited,function(){k(a,b)}),e.subscribe(f.unfavorited,function(){k(a,b)})},m=function(b,c){c=a(c),l(b,c),k(b,c)};return{init:m}});
define(["jquery","core_course/repository","core/templates","core/notification","core/pubsub","core_course/events"],function(a,b,c,d,e,f){var g={COURSE_IS_FAVOURITE:'[data-region="is-favourite"]',COURSES_VIEW:'[data-region="recentlyaccessedcourses-view"]',COURSES_VIEW_CONTENT:'[data-region="recentlyaccessedcourses-view-content"]',EMPTY_MESSAGE:'[data-region="empty-message"]'},h=10,i=function(a){a.find(g.EMPTY_MESSAGE).removeClass("hidden"),a.find(g.COURSES_VIEW_CONTENT).addClass("hidden")},j=function(a,b){var c=a.find('[data-course-id="'+b+'"]');c.length&&c.find(g.COURSE_IS_FAVOURITE).removeClass("hidden")},k=function(a,b){var c=a.find('[data-course-id="'+b+'"]');c.length&&c.find(g.COURSE_IS_FAVOURITE).addClass("hidden")},l=function(a,b){return c.render("core_course/view-cards",{courses:b}).then(function(b,d){var e=a.find(g.COURSES_VIEW_CONTENT);return c.replaceNodeContents(e,b,d)})},m=function(a,c){b.getLastAccessedCourses(a,h).then(function(a){return a.length?l(c,a):i(c)})["catch"](d.exception)},n=function(a){e.subscribe(f.favourited,function(b){j(a,b)}),e.subscribe(f.unfavorited,function(b){k(a,b)})},o=function(b,c){c=a(c),n(c),m(b,c)};return{init:o}});

View file

@ -41,22 +41,48 @@ define(
) {
var SELECTORS = {
COURSE_IS_FAVOURITE: '[data-region="is-favourite"]',
COURSES_VIEW: '[data-region="recentlyaccessedcourses-view"]',
COURSES_VIEW_CONTENT: '[data-region="recentlyaccessedcourses-view-content"]'
COURSES_VIEW_CONTENT: '[data-region="recentlyaccessedcourses-view-content"]',
EMPTY_MESSAGE: '[data-region="empty-message"]'
};
var NUM_COURSES_TOTAL = 10;
/**
* Get enrolled courses from backend.
* Show the empty message when no course are found.
*
* @method getRecentCourses
* @param {int} userid User from which the courses will be obtained
* @param {int} limit Only return this many results
* @return {array} Courses user has accessed
* @param {object} root The root element for the courses view.
*/
var getRecentCourses = function(userid, limit) {
return CoursesRepository.getLastAccessedCourses(userid, limit);
var showEmptyMessage = function(root) {
root.find(SELECTORS.EMPTY_MESSAGE).removeClass('hidden');
root.find(SELECTORS.COURSES_VIEW_CONTENT).addClass('hidden');
};
/**
* Show the favourite indicator for the given course (if it's in the list).
*
* @param {object} root The root element for the courses view.
* @param {number} courseId The id of the course to be favourited.
*/
var favouriteCourse = function(root, courseId) {
var course = root.find('[data-course-id="' + courseId + '"]');
if (course.length) {
course.find(SELECTORS.COURSE_IS_FAVOURITE).removeClass('hidden');
}
};
/**
* Hide the favourite indicator for the given course (if it's in the list).
*
* @param {object} root The root element for the courses view.
* @param {number} courseId The id of the course to be unfavourited.
*/
var unfavouriteCourse = function(root, courseId) {
var course = root.find('[data-course-id="' + courseId + '"]');
if (course.length) {
course.find(SELECTORS.COURSE_IS_FAVOURITE).addClass('hidden');
}
};
/**
@ -68,16 +94,13 @@ define(
* @return {promise} Resolved with HTML and JS strings
*/
var renderCourses = function(root, courses) {
if (courses.length > 0) {
return Templates.render('core_course/view-cards', {
courses: courses
});
} else {
var nocoursesimgurl = root.attr('data-nocoursesimg');
return Templates.render('block_recentlyaccessedcourses/no-courses', {
nocoursesimg: nocoursesimgurl
});
}
return Templates.render('core_course/view-cards', {
courses: courses
})
.then(function(html, js) {
var contentContainer = root.find(SELECTORS.COURSES_VIEW_CONTENT);
return Templates.replaceNodeContents(contentContainer, html, js);
});
};
/**
@ -87,36 +110,30 @@ define(
* @param {object} root The root element for the recentlyaccessedcourses view.
* @returns {promise} The updated content for the block.
*/
var reloadContent = function(userid, root) {
var recentcoursesViewRoot = root.find(SELECTORS.COURSES_VIEW);
var recentcoursesViewContent = root.find(SELECTORS.COURSES_VIEW_CONTENT);
var coursesPromise = getRecentCourses(userid, NUM_COURSES_TOTAL);
return coursesPromise.then(function(courses) {
var pagedContentPromise = renderCourses(recentcoursesViewRoot, courses);
pagedContentPromise.then(function(html, js) {
return Templates.replaceNodeContents(recentcoursesViewContent, html, js);
}).catch(Notification.exception);
return coursesPromise;
}).catch(Notification.exception);
var loadContent = function(userid, root) {
CoursesRepository.getLastAccessedCourses(userid, NUM_COURSES_TOTAL)
.then(function(courses) {
if (courses.length) {
return renderCourses(root, courses);
} else {
return showEmptyMessage(root);
}
})
.catch(Notification.exception);
};
/**
* Register event listeners for the block.
*
* @param {int} userid User whose courses will be shown
* @param {object} root The root element for the recentlyaccessedcourses block.
*/
var registerEventListeners = function(userid, root) {
PubSub.subscribe(CourseEvents.favourited, function() {
reloadContent(userid, root);
var registerEventListeners = function(root) {
PubSub.subscribe(CourseEvents.favourited, function(courseId) {
favouriteCourse(root, courseId);
});
PubSub.subscribe(CourseEvents.unfavorited, function() {
reloadContent(userid, root);
PubSub.subscribe(CourseEvents.unfavorited, function(courseId) {
unfavouriteCourse(root, courseId);
});
};
@ -129,8 +146,8 @@ define(
var init = function(userid, root) {
root = $(root);
registerEventListeners(userid, root);
reloadContent(userid, root);
registerEventListeners(root);
loadContent(userid, root);
};
return {

View file

@ -1,21 +0,0 @@
{{!
This file is part of Moodle - http://moodle.org/
Moodle is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Moodle is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Moodle. If not, see <http://www.gnu.org/licenses/>.
}}
{{< core_course/no-courses}}
{{$nocoursestring}}
{{#str}} nocourses, block_recentlyaccessedcourses {{/str}}
{{/nocoursestring}}
{{/ core_course/no-courses}}

View file

@ -25,8 +25,7 @@
}
}}
<div id="recentlyaccessedcourses-view-{{uniqid}}"
data-region="recentlyaccessedcourses-view"
data-nocoursesimg="{{nocoursesimg}}">
data-region="recentlyaccessedcourses-view">
<div data-region="recentlyaccessedcourses-view-content">
<div data-region="recentlyaccessedcourses-loading-placeholder">
<div class="card-deck dashboard-card-deck one-row" style="height: 11.1rem">
@ -37,4 +36,11 @@
</div>
</div>
</div>
<div class="hidden text-xs-center text-center m-t-3" data-region="empty-message">
<img class="empty-placeholder-image-lg m-t-1"
src="{{nocoursesimgurl}}"
alt="{{#str}} nocourses, block_recentlyaccessedcourses {{/str}}"
role="presentation">
<p class="text-muted mt-3">{{#str}} nocourses, block_recentlyaccessedcourses {{/str}}</p>
</div>
</div>