MDL-58464 block_myoverview: remove additional placeholder in timeline
[moodle.git] / blocks / myoverview / templates / timeline-view-courses.mustache
CommitLineData
6a122325
CB
1{{!
2 This file is part of Moodle - http://moodle.org/
3
4 Moodle is free software: you can redistribute it and/or modify
5 it under the terms of the GNU General Public License as published by
6 the Free Software Foundation, either version 3 of the License, or
7 (at your option) any later version.
8
9 Moodle is distributed in the hope that it will be useful,
10 but WITHOUT ANY WARRANTY; without even the implied warranty of
11 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
12 GNU General Public License for more details.
13
14 You should have received a copy of the GNU General Public License
15 along with Moodle. If not, see <http://www.gnu.org/licenses/>.
16}}
17{{!
18 @template block_myoverview/timeline-view-courses
19
20 This template renders the timeline view by courses for the myoverview block.
50819832
RW
21
22 Example context (json):
23 {}
6a122325 24}}
b9ce916a
RW
25<div id="sort-by-courses-view-{{uniqid}}">
26 {{#coursesview}}
27 {{#inprogress}}
28 {{#haspages}}
29 {{#pages}}
30 <ul class="list-group unstyled hidden" data-region="course-block">
31 {{#courses}} {{> block_myoverview/course-item }} {{/courses}}
32 </ul>
33 {{/pages}}
34 <div class="text-xs-center text-center m-t-1">
35 <button type="button" class="btn btn-secondary" data-action="more-courses">
36 {{#str}} morecourses, block_myoverview {{/str}}
37 <span class="hidden" data-region="loading-icon-container">
38 {{> core/loading }}
39 </span>
40 </button>
41 </div>
42 {{/haspages}}
43 {{^haspages}}
44 <div class="text-xs-center text-center m-t-3">
45 <img class="empty-placeholder-image-lg"
46 src="{{urls.noevents}}"
47 alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
48 <p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
49 </div>
50 {{/haspages}}
51 {{/inprogress}}
52 {{^inprogress}}
53 <div class="text-xs-center text-center m-t-3">
54 <img class="empty-placeholder-image-lg"
55 src="{{urls.noevents}}"
56 alt="{{#str}} nocoursesinprogress, block_myoverview {{/str}}">
57 <p class="text-muted m-t-1">{{#str}} nocoursesinprogress, block_myoverview {{/str}}</p>
58 </div>
59 {{/inprogress}}
b9ce916a
RW
60 {{/coursesview}}
61</div>
be99bd61 62{{#js}}
b9ce916a
RW
63 require(['jquery', 'core/custom_interaction_events', 'block_myoverview/event_list_by_course'],
64 function($, CustomEvents, EventListByCourse) {
65
66 var root = $("#sort-by-courses-view-{{uniqid}}");
67 // This flag is used so that we can delay the loading of the events until the tab
68 // is toggled by the user.
69 var seen = false;
70
71 CustomEvents.define(root, [CustomEvents.events.activate]);
72 // Show more courses and load their events when the user clicks the "more courses"
73 // button.
74 root.on(CustomEvents.events.activate, '[data-action="more-courses"]', function(e) {
75 var button = $(e.target);
76 var blocks = root.find('[data-region="course-block"].hidden');
77
78 if (blocks && blocks.length) {
79 var block = blocks.first();
80 EventListByCourse.init(block);
81 block.removeClass('hidden');
82 }
83
84 // If there was only one hidden block then we have no more to show now
85 // so we can disable the button.
86 if (blocks && blocks.length == 1) {
87 button.prop('disabled', true);
88 }
89
90 if (data) {
91 data.originalEvent.preventDefault();
92 data.originalEvent.stopPropagation();
93 }
94 e.stopPropagation();
95 });
96
97 // Listen for when the user changes tab so that we can show the first set of courses
98 // and load their events when they request the sort by courses view for the first time.
99 root.closest('[data-region="timeline-view"]').on('shown shown.bs.tab', function(e) {
100 if (seen) {
101 return;
102 }
103
104 var tab = $(e.target);
105 var tabTarget = $(tab.attr('href'));
106
107 if (!tabTarget || !tabTarget.length) {
108 return;
109 }
110
111 var viewCourses = tabTarget.find('#sort-by-courses-view-{{uniqid}}');
112
113 if (viewCourses && viewCourses.length && !seen) {
114 seen = true;
115 viewCourses.find('[data-action="more-courses"]').trigger(CustomEvents.events.activate);
116 }
117 });
be99bd61 118 });
cbd3c4fe 119{{/js}}