weekly release 3.6dev
[moodle.git] / blocks / timeline / amd / src / view_nav.js
CommitLineData
1e44de35
RW
1// This file is part of Moodle - http://moodle.org/
2//
3// Moodle is free software: you can redistribute it and/or modify
4// it under the terms of the GNU General Public License as published by
5// the Free Software Foundation, either version 3 of the License, or
6// (at your option) any later version.
7//
8// Moodle is distributed in the hope that it will be useful,
9// but WITHOUT ANY WARRANTY; without even the implied warranty of
10// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11// GNU General Public License for more details.
12//
13// You should have received a copy of the GNU General Public License
14// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
15
16/**
17 * Manage the timeline view navigation for the timeline block.
18 *
19 * @package block_timeline
20 * @copyright 2018 Ryan Wyllie <ryan@moodle.com>
21 * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
22 */
23
24define(
25[
26 'jquery',
27 'core/custom_interaction_events',
28 'block_timeline/view'
29],
30function(
31 $,
32 CustomEvents,
33 View
34) {
35
36 var SELECTORS = {
37 TIMELINE_DAY_FILTER: '[data-region="day-filter"]',
38 TIMELINE_DAY_FILTER_OPTION: '[data-from]',
39 TIMELINE_VIEW_SELECTOR: '[data-region="view-selector"]',
40 DATA_DAYS_OFFSET: '[data-days-offset]',
41 DATA_DAYS_LIMIT: '[data-days-limit]',
42 };
43
44 /**
45 * Event listener for the day selector ("Next 7 days", "Next 30 days", etc).
46 *
47 * @param {object} root The root element for the timeline block
48 * @param {object} timelineViewRoot The root element for the timeline view
49 */
50 var registerTimelineDaySelector = function(root, timelineViewRoot) {
51 var timelineDaySelectorContainer = root.find(SELECTORS.TIMELINE_DAY_FILTER);
52
53 CustomEvents.define(timelineDaySelectorContainer, [CustomEvents.events.activate]);
54 timelineDaySelectorContainer.on(
55 CustomEvents.events.activate,
56 SELECTORS.TIMELINE_DAY_FILTER_OPTION,
57 function(e, data) {
58 var option = $(e.target).closest(SELECTORS.TIMELINE_DAY_FILTER_OPTION);
59
60 if (option.hasClass('active')) {
61 // If it's already active then we don't need to do anything.
62 return;
63 }
64
65 var daysOffset = option.attr('data-from');
66 var daysLimit = option.attr('data-to');
67 var elementsWithDaysOffset = root.find(SELECTORS.DATA_DAYS_OFFSET);
68
69 elementsWithDaysOffset.attr('data-days-offset', daysOffset);
70
71 if (daysLimit != undefined) {
72 elementsWithDaysOffset.attr('data-days-limit', daysLimit);
73 } else {
74 elementsWithDaysOffset.removeAttr('data-days-limit');
75 }
76
77 // Reset the views to reinitialise the event lists now that we've
78 // updated the day limits.
79 View.reset(timelineViewRoot);
80
81 data.originalEvent.preventDefault();
82 }
83 );
84 };
85
86 /**
87 * Event listener for the "sort" button in the timeline navigation that allows for
88 * changing between the timeline dates and courses views.
89 *
90 * On a view change we tell the timeline view module that the view has been shown
91 * so that it can handle how to display the appropriate view.
92 *
93 * @param {object} root The root element for the timeline block
94 * @param {object} timelineViewRoot The root element for the timeline view
95 */
96 var registerViewSelector = function(root, timelineViewRoot) {
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.find(SELECTORS.TIMELINE_VIEW_SELECTOR).on('shown shown.bs.tab', function() {
100 View.shown(timelineViewRoot);
101 });
102 };
103
104 /**
105 * Initialise the timeline view navigation by adding event listeners to
106 * the navigation elements.
107 *
108 * @param {object} root The root element for the timeline block
109 * @param {object} timelineViewRoot The root element for the timeline view
110 */
111 var init = function(root, timelineViewRoot) {
112 root = $(root);
113 registerTimelineDaySelector(root, timelineViewRoot);
114 registerViewSelector(root, timelineViewRoot);
115 };
116
117 return {
118 init: init
119 };
120});