MDL-57197 js: fix AMD module warnings
[moodle.git] / theme / boost / amd / src / drawer.js
CommitLineData
99061152
DW
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 * Contain the logic for a drawer.
18 *
19 * @package theme_boost
20 * @copyright 2016 Damyon Wiese
21 * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
22 */
4a3d8169
DW
23define(['jquery', 'core/custom_interaction_events', 'core/log'],
24 function($, CustomEvents, Log) {
99061152
DW
25
26 var SELECTORS = {
27 TOGGLE_REGION: '[data-region="drawer-toggle"]',
28 TOGGLE_ACTION: '[data-action="toggle-drawer"]',
29 TOGGLE_TARGET: 'aria-controls',
30 TOGGLE_SIDE: 'left',
31 BODY: 'body'
32 };
33
34 /**
35 * Constructor for the Drawer.
36 *
37 * @param {object} root The root jQuery element for the modal
38 */
39 var Drawer = function() {
40
41 if (!$(SELECTORS.TOGGLE_REGION).length) {
4a3d8169 42 Log.debug('Page is missing a drawer region');
99061152
DW
43 }
44 if (!$(SELECTORS.TOGGLE_ACTION).length) {
4a3d8169 45 Log.debug('Page is missing a drawer toggle link');
99061152
DW
46 }
47 $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {
48 var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);
4a3d8169
DW
49 var drawerid = trigger.attr('aria-controls');
50 var drawer = $(document.getElementById(drawerid));
99061152
DW
51 var hidden = trigger.attr('aria-expanded') == 'false';
52 var side = trigger.attr('data-side');
53 var body = $(SELECTORS.BODY);
54
4a3d8169
DW
55 drawer.on('mousewheel DOMMouseScroll', this.preventPageScroll);
56
99061152
DW
57 if (!hidden) {
58 body.addClass('drawer-open-' + side);
59 trigger.attr('aria-expanded', 'true');
60 } else {
61 trigger.attr('aria-expanded', 'false');
62 }
63 }.bind(this));
64
65 this.registerEventListeners();
ef25d51f
DW
66 var small = $(document).width() < 768;
67 if (small) {
68 this.closeAll();
69 }
99061152
DW
70 };
71
72 Drawer.prototype.closeAll = function() {
73 $(SELECTORS.TOGGLE_REGION).each(function(index, ele) {
74 var trigger = $(ele).find(SELECTORS.TOGGLE_ACTION);
75 var side = trigger.attr('data-side');
76 var body = $(SELECTORS.BODY);
77 var drawerid = trigger.attr('aria-controls');
78 var drawer = $(document.getElementById(drawerid));
79 var preference = trigger.attr('data-preference');
80
81 trigger.attr('aria-expanded', 'false');
82 body.removeClass('drawer-open-' + side);
83 drawer.attr('aria-hidden', 'true');
84 drawer.addClass('closed');
85 M.util.set_user_preference(preference, 'false');
ce7149b1 86 });
99061152
DW
87 };
88
89 /**
90 * Open / close the blocks drawer.
91 *
92 * @method toggleDrawer
93 * @param {Event} e
94 */
95 Drawer.prototype.toggleDrawer = function(e) {
96 var trigger = $(e.target).closest('[data-action=toggle-drawer]');
97 var drawerid = trigger.attr('aria-controls');
98 var drawer = $(document.getElementById(drawerid));
99 var body = $(SELECTORS.BODY);
100 var side = trigger.attr('data-side');
101 var preference = trigger.attr('data-preference');
102
103 body.addClass('drawer-ease');
104 var open = trigger.attr('aria-expanded') == 'true';
105 if (!open) {
ef25d51f 106 var small = $(document).width() < 768;
99061152
DW
107 if (small) {
108 this.closeAll();
109 }
110 // Open.
111 trigger.attr('aria-expanded', 'true');
112 drawer.attr('aria-hidden', 'false');
8cdff4be 113 drawer.focus();
99061152
DW
114 body.addClass('drawer-open-' + side);
115 drawer.removeClass('closed');
116 M.util.set_user_preference(preference, 'true');
117 } else {
118 // Close.
119 body.removeClass('drawer-open-' + side);
120 trigger.attr('aria-expanded', 'false');
121 drawer.attr('aria-hidden', 'true');
122 drawer.addClass('closed');
123 M.util.set_user_preference(preference, 'false');
124 }
125 };
126
4a3d8169
DW
127 /**
128 * Prevent the page from scrolling when the drawer is at max scroll.
129 *
130 * @method preventPageScroll
ce7149b1 131 * @param {Event} e
4a3d8169
DW
132 */
133 Drawer.prototype.preventPageScroll = function(e) {
134 var delta = e.wheelDelta || (e.originalEvent && e.originalEvent.wheelDelta) || -e.originalEvent.detail,
135 bottomOverflow = (this.scrollTop + $(this).outerHeight() - this.scrollHeight) >= 0,
136 topOverflow = this.scrollTop <= 0;
137
138 if ((delta < 0 && bottomOverflow) || (delta > 0 && topOverflow)) {
139 e.preventDefault();
140 }
141 };
142
99061152
DW
143 /**
144 * Set up all of the event handling for the modal.
145 *
146 * @method registerEventListeners
147 */
148 Drawer.prototype.registerEventListeners = function() {
99061152 149
fe009bde
DW
150 $(SELECTORS.TOGGLE_ACTION).each(function(index, element) {
151 CustomEvents.define($(element), [CustomEvents.events.activate]);
152 $(element).on(CustomEvents.events.activate, function(e, data) {
153 this.toggleDrawer(data.originalEvent);
154 data.originalEvent.preventDefault();
155 }.bind(this));
99061152 156 }.bind(this));
fe009bde 157
99061152
DW
158 };
159
160 return {
161 'init': function() {
162 return new Drawer();
163 }
164 };
165});