1 | (function (global, factory) {
|
2 | if (typeof define === "function" && define.amd) {
|
3 | define(["exports", "../../globals/js/settings", "../../globals/js/misc/mixin", "../../globals/js/mixins/create-component", "../../globals/js/mixins/init-component-by-search", "../../globals/js/mixins/evented-state", "../../globals/js/mixins/handles", "../../globals/js/misc/event-matches", "../../globals/js/misc/on"], factory);
|
4 | } else if (typeof exports !== "undefined") {
|
5 | factory(exports, require("../../globals/js/settings"), require("../../globals/js/misc/mixin"), require("../../globals/js/mixins/create-component"), require("../../globals/js/mixins/init-component-by-search"), require("../../globals/js/mixins/evented-state"), require("../../globals/js/mixins/handles"), require("../../globals/js/misc/event-matches"), require("../../globals/js/misc/on"));
|
6 | } else {
|
7 | var mod = {
|
8 | exports: {}
|
9 | };
|
10 | factory(mod.exports, global.settings, global.mixin, global.createComponent, global.initComponentBySearch, global.eventedState, global.handles, global.eventMatches, global.on);
|
11 | global.contentSwitcher = mod.exports;
|
12 | }
|
13 | })(this, function (_exports, _settings, _mixin2, _createComponent, _initComponentBySearch, _eventedState, _handles, _eventMatches, _on) {
|
14 | "use strict";
|
15 |
|
16 | Object.defineProperty(_exports, "__esModule", {
|
17 | value: true
|
18 | });
|
19 | _exports.default = void 0;
|
20 | _settings = _interopRequireDefault(_settings);
|
21 | _mixin2 = _interopRequireDefault(_mixin2);
|
22 | _createComponent = _interopRequireDefault(_createComponent);
|
23 | _initComponentBySearch = _interopRequireDefault(_initComponentBySearch);
|
24 | _eventedState = _interopRequireDefault(_eventedState);
|
25 | _handles = _interopRequireDefault(_handles);
|
26 | _eventMatches = _interopRequireDefault(_eventMatches);
|
27 | _on = _interopRequireDefault(_on);
|
28 |
|
29 | function _interopRequireDefault(obj) {
|
30 | return obj && obj.__esModule ? obj : {
|
31 | default: obj
|
32 | };
|
33 | }
|
34 |
|
35 | function _typeof(obj) {
|
36 | if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
|
37 | _typeof = function _typeof(obj) {
|
38 | return typeof obj;
|
39 | };
|
40 | } else {
|
41 | _typeof = function _typeof(obj) {
|
42 | return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
43 | };
|
44 | }
|
45 |
|
46 | return _typeof(obj);
|
47 | }
|
48 |
|
49 | function _classCallCheck(instance, Constructor) {
|
50 | if (!(instance instanceof Constructor)) {
|
51 | throw new TypeError("Cannot call a class as a function");
|
52 | }
|
53 | }
|
54 |
|
55 | function _defineProperties(target, props) {
|
56 | for (var i = 0; i < props.length; i++) {
|
57 | var descriptor = props[i];
|
58 | descriptor.enumerable = descriptor.enumerable || false;
|
59 | descriptor.configurable = true;
|
60 | if ("value" in descriptor) descriptor.writable = true;
|
61 | Object.defineProperty(target, descriptor.key, descriptor);
|
62 | }
|
63 | }
|
64 |
|
65 | function _createClass(Constructor, protoProps, staticProps) {
|
66 | if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
67 | if (staticProps) _defineProperties(Constructor, staticProps);
|
68 | return Constructor;
|
69 | }
|
70 |
|
71 | function _possibleConstructorReturn(self, call) {
|
72 | if (call && (_typeof(call) === "object" || typeof call === "function")) {
|
73 | return call;
|
74 | }
|
75 |
|
76 | return _assertThisInitialized(self);
|
77 | }
|
78 |
|
79 | function _assertThisInitialized(self) {
|
80 | if (self === void 0) {
|
81 | throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
82 | }
|
83 |
|
84 | return self;
|
85 | }
|
86 |
|
87 | function _getPrototypeOf(o) {
|
88 | _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
|
89 | return o.__proto__ || Object.getPrototypeOf(o);
|
90 | };
|
91 | return _getPrototypeOf(o);
|
92 | }
|
93 |
|
94 | function _inherits(subClass, superClass) {
|
95 | if (typeof superClass !== "function" && superClass !== null) {
|
96 | throw new TypeError("Super expression must either be null or a function");
|
97 | }
|
98 |
|
99 | subClass.prototype = Object.create(superClass && superClass.prototype, {
|
100 | constructor: {
|
101 | value: subClass,
|
102 | writable: true,
|
103 | configurable: true
|
104 | }
|
105 | });
|
106 | if (superClass) _setPrototypeOf(subClass, superClass);
|
107 | }
|
108 |
|
109 | function _setPrototypeOf(o, p) {
|
110 | _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
111 | o.__proto__ = p;
|
112 | return o;
|
113 | };
|
114 |
|
115 | return _setPrototypeOf(o, p);
|
116 | }
|
117 |
|
118 | var toArray = function toArray(arrayLike) {
|
119 | return Array.prototype.slice.call(arrayLike);
|
120 | };
|
121 |
|
122 | var ContentSwitcher =
|
123 |
|
124 | function (_mixin) {
|
125 | _inherits(ContentSwitcher, _mixin);
|
126 | |
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 |
|
138 |
|
139 |
|
140 |
|
141 |
|
142 |
|
143 |
|
144 | function ContentSwitcher(element, options) {
|
145 | var _this;
|
146 |
|
147 | _classCallCheck(this, ContentSwitcher);
|
148 |
|
149 | _this = _possibleConstructorReturn(this, _getPrototypeOf(ContentSwitcher).call(this, element, options));
|
150 |
|
151 | _this.manage((0, _on.default)(_this.element, 'click', function (event) {
|
152 | _this._handleClick(event);
|
153 | }));
|
154 |
|
155 | return _this;
|
156 | }
|
157 | |
158 |
|
159 |
|
160 |
|
161 |
|
162 |
|
163 |
|
164 | _createClass(ContentSwitcher, [{
|
165 | key: "_handleClick",
|
166 | value: function _handleClick(event) {
|
167 | var button = (0, _eventMatches.default)(event, this.options.selectorButton);
|
168 |
|
169 | if (button) {
|
170 | this.changeState({
|
171 | group: 'selected',
|
172 | item: button,
|
173 | launchingEvent: event
|
174 | });
|
175 | }
|
176 | }
|
177 | |
178 |
|
179 |
|
180 |
|
181 |
|
182 |
|
183 |
|
184 |
|
185 | }, {
|
186 | key: "_changeState",
|
187 | value: function _changeState(_ref, callback) {
|
188 | var _this2 = this;
|
189 |
|
190 | var item = _ref.item;
|
191 |
|
192 | var itemLink = item.querySelector(this.options.selectorLink);
|
193 |
|
194 | if (itemLink) {
|
195 | toArray(this.element.querySelectorAll(this.options.selectorLink)).forEach(function (link) {
|
196 | if (link !== itemLink) {
|
197 | link.setAttribute('aria-selected', 'false');
|
198 | }
|
199 | });
|
200 | itemLink.setAttribute('aria-selected', 'true');
|
201 | }
|
202 |
|
203 | var selectorButtons = toArray(this.element.querySelectorAll(this.options.selectorButton));
|
204 | selectorButtons.forEach(function (button) {
|
205 | if (button !== item) {
|
206 | button.setAttribute('aria-selected', false);
|
207 | button.classList.toggle(_this2.options.classActive, false);
|
208 | toArray(button.ownerDocument.querySelectorAll(button.dataset.target)).forEach(function (element) {
|
209 | element.setAttribute('hidden', '');
|
210 | element.setAttribute('aria-hidden', 'true');
|
211 | });
|
212 | }
|
213 | });
|
214 | item.classList.toggle(this.options.classActive, true);
|
215 | item.setAttribute('aria-selected', true);
|
216 | toArray(item.ownerDocument.querySelectorAll(item.dataset.target)).forEach(function (element) {
|
217 | element.removeAttribute('hidden');
|
218 | element.setAttribute('aria-hidden', 'false');
|
219 | });
|
220 |
|
221 | if (callback) {
|
222 | callback();
|
223 | }
|
224 | }
|
225 | |
226 |
|
227 |
|
228 |
|
229 |
|
230 |
|
231 |
|
232 |
|
233 |
|
234 | }, {
|
235 | key: "setActive",
|
236 | value: function setActive(item, callback) {
|
237 | this.changeState({
|
238 | group: 'selected',
|
239 | item: item
|
240 | }, function (error) {
|
241 | if (error) {
|
242 | if (callback) {
|
243 | callback(Object.assign(error, {
|
244 | item: item
|
245 | }));
|
246 | }
|
247 | } else if (callback) {
|
248 | callback(null, item);
|
249 | }
|
250 | });
|
251 | }
|
252 | |
253 |
|
254 |
|
255 |
|
256 |
|
257 |
|
258 | }], [{
|
259 | key: "options",
|
260 |
|
261 | |
262 |
|
263 |
|
264 |
|
265 |
|
266 |
|
267 |
|
268 |
|
269 |
|
270 |
|
271 |
|
272 |
|
273 |
|
274 |
|
275 |
|
276 |
|
277 | get: function get() {
|
278 | var prefix = _settings.default.prefix;
|
279 | return {
|
280 | selectorInit: '[data-content-switcher]',
|
281 | selectorButton: "input[type=\"radio\"], .".concat(prefix, "--content-switcher-btn"),
|
282 | classActive: "".concat(prefix, "--content-switcher--selected"),
|
283 | eventBeforeSelected: 'content-switcher-beingselected',
|
284 | eventAfterSelected: 'content-switcher-selected'
|
285 | };
|
286 | }
|
287 | }]);
|
288 |
|
289 | ContentSwitcher.components = new WeakMap();
|
290 | return ContentSwitcher;
|
291 | }((0, _mixin2.default)(_createComponent.default, _initComponentBySearch.default, _eventedState.default, _handles.default));
|
292 |
|
293 | var _default = ContentSwitcher;
|
294 | _exports.default = _default;
|
295 | }); |
\ | No newline at end of file |