MDL-58464 block_myoverview: paginate timeline sort by courses view

This commit is contained in:
Ryan Wyllie
2017-04-13 15:24:14 +01:00
committed by Dan Poltawski
parent 32c249621b
commit b9ce916ac9
5 changed files with 104 additions and 98 deletions
@@ -1,82 +0,0 @@
<?php
// 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/>.
/**
* Class containing data for my overview block.
*
* @package block_myoverview
* @copyright 2017 Simey Lameze <[email protected]>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
namespace block_myoverview\output;
defined('MOODLE_INTERNAL') || die();
use core_course\external\course_summary_exporter;
use renderable;
use renderer_base;
use templatable;
/**
* Class containing data for my overview block.
*
* @copyright 2017 Simey Lameze <[email protected]>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
class course_summary implements renderable, templatable {
/** @var array $courses List of courses the user is enrolled in. */
protected $courses = [];
/** @var array $coursesprogress List of progress percentage for each course. */
protected $coursesprogress = [];
/**
* The course_summary constructor.
*
* @param array $courses list of courses.
* @param array $coursesprogress list of courses progress.
*/
public function __construct($courses, $coursesprogress) {
$this->courses = $courses;
$this->coursesprogress = $coursesprogress;
}
/**
* Export this data so it can be used as the context for a mustache template.
*
* @param \renderer_base $output
* @return array
*/
public function export_for_template(renderer_base $output) {
$data = [];
foreach ($this->courses as $courseid => $course) {
$context = \context_course::instance($courseid);
// Convert summary to plain text.
$course->summary = content_to_text($course->summary, false);
$exporter = new course_summary_exporter($course, array('context' => $context));
$exportedcourse = $exporter->export($output);
if (isset($this->coursesprogress[$courseid])) {
$courseprogress = $this->coursesprogress[$courseid];
$exportedcourse->hasprogress = !is_null($courseprogress);
$exportedcourse->progress = $courseprogress;
}
$data[] = $exportedcourse;
}
return $data;
}
}
@@ -97,6 +97,7 @@ class courses_view implements renderable, templatable {
$coursesview['future']['pages'][$futurepages]['courses'][] = $exportedcourse;
$coursesview['future']['pages'][$futurepages]['active'] = ($futurepages == 0 ? true : false);
$coursesview['future']['pages'][$futurepages]['page'] = $futurepages + 1;
$coursesview['future']['haspages'] = true;
$coursesbystatus['future']++;
} else if (!empty($enddate) && $enddate < $today) {
@@ -106,6 +107,7 @@ class courses_view implements renderable, templatable {
$coursesview['past']['pages'][$pastpages]['courses'][] = $exportedcourse;
$coursesview['past']['pages'][$pastpages]['active'] = ($pastpages == 0 ? true : false);
$coursesview['past']['pages'][$pastpages]['page'] = $pastpages + 1;
$coursesview['past']['haspages'] = true;
$coursesbystatus['past']++;
} else {
@@ -115,6 +117,7 @@ class courses_view implements renderable, templatable {
$coursesview['inprogress']['pages'][$inprogresspages]['courses'][] = $exportedcourse;
$coursesview['inprogress']['pages'][$inprogresspages]['active'] = ($inprogresspages == 0 ? true : false);
$coursesview['inprogress']['pages'][$inprogresspages]['page'] = $inprogresspages + 1;
$coursesview['inprogress']['haspages'] = true;
$coursesbystatus['inprogress']++;
}
}
@@ -57,13 +57,11 @@ class main implements renderable, templatable {
$coursesprogress[$course->id] = $percentage;
}
$coursesummary = new course_summary($courses, $coursesprogress);
$coursesview = new courses_view($courses, $coursesprogress);
$nocoursesurl = $output->image_url('courses', 'block_myoverview')->out();
$noeventsurl = $output->image_url('activities', 'block_myoverview')->out();
return [
'courses' => $coursesummary->export_for_template($output),
'coursesview' => $coursesview->export_for_template($output),
'urls' => [
'nocourses' => $nocoursesurl,
@@ -24,6 +24,7 @@
$string['future'] = 'Future';
$string['inprogress'] = 'In progress';
$string['morecourses'] = 'More courses';
$string['myoverview:addinstance'] = 'Add a new my overview block';
$string['myoverview:myaddinstance'] = 'Add a new my overview block to Dashboard';
$string['nocourses'] = 'No courses';
@@ -22,20 +22,106 @@
Example context (json):
{}
}}
<ul class="list-group unstyled" id="timeline-view-courses-{{uniqid}}">
{{#courses}} {{> block_myoverview/course-item }} {{/courses}}
{{^courses}}
<div class="text-xs-center text-center m-t-3">
<img class="empty-placeholder-image-lg"
src="{{urls.noevents}}"
alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
<p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
</div>
{{/courses}}
</ul>
<div id="sort-by-courses-view-{{uniqid}}">
{{#coursesview}}
{{#inprogress}}
{{#haspages}}
{{#pages}}
<ul class="list-group unstyled hidden" data-region="course-block">
{{#courses}} {{> block_myoverview/course-item }} {{/courses}}
</ul>
{{/pages}}
<div class="text-xs-center text-center m-t-1">
<button type="button" class="btn btn-secondary" data-action="more-courses">
{{#str}} morecourses, block_myoverview {{/str}}
<span class="hidden" data-region="loading-icon-container">
{{> core/loading }}
</span>
</button>
</div>
{{/haspages}}
{{^haspages}}
<div class="text-xs-center text-center m-t-3">
<img class="empty-placeholder-image-lg"
src="{{urls.noevents}}"
alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
<p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
</div>
{{/haspages}}
{{/inprogress}}
{{^inprogress}}
<div class="text-xs-center text-center m-t-3">
<img class="empty-placeholder-image-lg"
src="{{urls.noevents}}"
alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
<p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
</div>
{{/inprogress}}
{{^hascourses}}
<div class="text-xs-center text-center m-t-3">
<img class="empty-placeholder-image-lg"
src="{{urls.noevents}}"
alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
<p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
</div>
{{/hascourses}}
{{/coursesview}}
</div>
{{#js}}
require(['jquery', 'block_myoverview/event_list_by_course'], function($, EventListByCourse) {
var root = $("#timeline-view-courses-{{uniqid}}");
EventListByCourse.init(root);
require(['jquery', 'core/custom_interaction_events', 'block_myoverview/event_list_by_course'],
function($, CustomEvents, EventListByCourse) {
var root = $("#sort-by-courses-view-{{uniqid}}");
// This flag is used so that we can delay the loading of the events until the tab
// is toggled by the user.
var seen = false;
CustomEvents.define(root, [CustomEvents.events.activate]);
// Show more courses and load their events when the user clicks the "more courses"
// button.
root.on(CustomEvents.events.activate, '[data-action="more-courses"]', function(e) {
var button = $(e.target);
var blocks = root.find('[data-region="course-block"].hidden');
if (blocks && blocks.length) {
var block = blocks.first();
EventListByCourse.init(block);
block.removeClass('hidden');
}
// If there was only one hidden block then we have no more to show now
// so we can disable the button.
if (blocks && blocks.length == 1) {
button.prop('disabled', true);
}
if (data) {
data.originalEvent.preventDefault();
data.originalEvent.stopPropagation();
}
e.stopPropagation();
});
// Listen for when the user changes tab so that we can show the first set of courses
// and load their events when they request the sort by courses view for the first time.
root.closest('[data-region="timeline-view"]').on('shown shown.bs.tab', function(e) {
if (seen) {
return;
}
var tab = $(e.target);
var tabTarget = $(tab.attr('href'));
if (!tabTarget || !tabTarget.length) {
return;
}
var viewCourses = tabTarget.find('#sort-by-courses-view-{{uniqid}}');
if (viewCourses && viewCourses.length && !seen) {
seen = true;
viewCourses.find('[data-action="more-courses"]').trigger(CustomEvents.events.activate);
}
});
});
{{/js}}