station 0.0.105 → 0.0.110
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/bin/nexmo-developer +7 -0
- data/lib/nexmo_developer/Gemfile +10 -25
- data/lib/nexmo_developer/Gemfile.lock +131 -147
- data/lib/nexmo_developer/app/assets/config/manifest.js +1 -4
- data/lib/nexmo_developer/app/assets/javascripts/application.js +2 -7
- data/lib/nexmo_developer/app/assets/stylesheets/application.css +1 -1
- data/lib/nexmo_developer/app/controllers/static_controller.rb +3 -11
- data/lib/nexmo_developer/app/helpers/application_helper.rb +2 -0
- data/lib/nexmo_developer/app/models/tutorial.rb +10 -12
- data/lib/nexmo_developer/app/models/tutorial/prerequisite.rb +3 -1
- data/lib/nexmo_developer/app/models/tutorial/task.rb +24 -11
- data/lib/nexmo_developer/app/services/translator/files_list_coordinator.rb +90 -0
- data/lib/nexmo_developer/app/services/translator/smartling/api/download_file.rb +6 -1
- data/lib/nexmo_developer/app/services/translator/smartling/api/file_status.rb +7 -1
- data/lib/nexmo_developer/app/services/translator/utils.rb +1 -1
- data/lib/nexmo_developer/app/views/admin/feedbacks/_steps.html.erb +1 -1
- data/lib/nexmo_developer/app/views/layouts/partials/_footer.html.erb +4 -4
- data/lib/nexmo_developer/app/views/layouts/partials/_head.html.erb +4 -5
- data/lib/nexmo_developer/app/views/layouts/partials/_header.html.erb +3 -3
- data/lib/nexmo_developer/app/views/layouts/partials/_improve_this_page.html.erb +1 -1
- data/lib/nexmo_developer/app/views/static/_products.html.erb +20 -17
- data/lib/nexmo_developer/app/views/static/default_landing/partials/_join_slack.html.erb +1 -1
- data/lib/nexmo_developer/app/views/static/landing.html.erb +8 -8
- data/lib/nexmo_developer/app/views/static/{robots.txt.erb → robots.text.erb} +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Black.woff +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Black.woff2 +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Regular.woff +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Regular.woff2 +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Semibold.woff +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/Lato-Semibold.woff2 +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/icomoon.eot +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/icomoon.json +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/icomoon.svg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/icomoon.ttf +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/fonts/icomoon.woff +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/.keep +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/logo@3x.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/logo_vonage.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/nexmo-developer-logo.svg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/nexmo-logo-collapsed.svg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/nexmo-vonage-white.svg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/chatapp.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/chatapp_small.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/nexmo.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/numberinsight.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/numberinsight_small.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/sms.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/sms_small.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/verify.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/verify_small.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/voice.jpg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/posters/voice_small.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/select-dropdown.png +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/slack.svg +0 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/images/themes/ea/topography.png +0 -0
- data/lib/nexmo_developer/app/webpacker/javascript/code_snippet_events/index.js +23 -85
- data/lib/nexmo_developer/app/webpacker/javascript/volta/volta.js +1 -1
- data/lib/nexmo_developer/app/webpacker/javascript/volta_tabbed_examples/index.js +23 -3
- data/lib/nexmo_developer/app/webpacker/packs/active_admin.js +5 -0
- data/lib/nexmo_developer/app/webpacker/packs/active_admin/print.scss +2 -0
- data/lib/nexmo_developer/app/webpacker/packs/application.js +12 -0
- data/lib/nexmo_developer/app/{assets → webpacker}/stylesheets/active_admin.scss +4 -4
- data/lib/nexmo_developer/app/webpacker/stylesheets/application.scss +0 -1
- data/lib/nexmo_developer/app/webpacker/stylesheets/custom/_core.scss +1 -1
- data/lib/nexmo_developer/app/webpacker/stylesheets/objects/_icons.scss +1 -0
- data/lib/nexmo_developer/app/webpacker/stylesheets/objects/_navigation.scss +1 -2
- data/lib/nexmo_developer/config/environments/development.rb +1 -1
- data/lib/nexmo_developer/config/environments/production.rb +8 -1
- data/lib/nexmo_developer/config/initializers/active_admin.rb +3 -0
- data/lib/nexmo_developer/config/initializers/assets.rb +0 -2
- data/lib/nexmo_developer/config/webpack/environment.js +10 -0
- data/lib/nexmo_developer/config/webpack/plugins/jquery.js +7 -0
- data/lib/nexmo_developer/lib/tasks/smartling.rake +7 -0
- data/lib/nexmo_developer/nexmo_developer.rb +1 -4
- data/lib/nexmo_developer/version.rb +1 -1
- data/package.json +25 -17
- data/station.gemspec +5 -12
- data/yarn.lock +1510 -1021
- metadata +159 -239
- data/lib/nexmo_developer/app/assets/fonts/nexmo-developer.json +0 -36483
- data/lib/nexmo_developer/app/assets/javascripts/active_admin.js.coffee +0 -1
- data/lib/nexmo_developer/app/assets/javascripts/stats.js +0 -14
- data/lib/nexmo_developer/app/assets/regex/matching_chars.rb +0 -1
- data/lib/nexmo_developer/app/assets/regex/sequence_diagram_regex.rb +0 -1
- data/lib/nexmo_developer/app/assets/regex/stats_regex.rb +0 -1
- data/lib/nexmo_developer/app/assets/regex/webfont_regex.rb +0 -1
- data/lib/nexmo_developer/app/views/slack/join.html.erb +0 -25
- data/lib/nexmo_developer/app/views/static/_community.html.erb +0 -24
- data/lib/nexmo_developer/app/views/static/_dotnet.html.erb +0 -26
- data/lib/nexmo_developer/app/views/static/_slack.html.erb +0 -2
- data/lib/nexmo_developer/app/views/static/_xwithy.html.erb +0 -33
- data/lib/nexmo_developer/app/views/static/podcast.html.erb +0 -40
- data/lib/nexmo_developer/app/webpacker/stylesheets/objects/_building-block.scss +0 -32
- data/lib/nexmo_developer/vendor/assets/javascripts/jquery-scrolltofixed.js +0 -567
- data/lib/nexmo_developer/vendor/assets/javascripts/mermaid.js +0 -49
- data/lib/nexmo_developer/vendor/assets/javascripts/underscore.js +0 -5
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/addons/jquery.tablesorter.js +0 -1031
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/addons/prism.js +0 -22
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/side-navigation/volta.menu.js +0 -377
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.accordion.js +0 -249
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.dropdown.js +0 -145
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.flash.js +0 -175
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.modal.js +0 -312
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.tab.js +0 -203
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/components/volta.tooltip.js +0 -71
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/popper.min.js +0 -5
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/svgxuse.min.js +0 -12
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/tooltip.min.js +0 -5
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/volta.core.js +0 -238
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/volta.js +0 -2141
- data/lib/nexmo_developer/vendor/assets/javascripts/volta/volta.min.js +0 -1
@@ -1,2141 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* Copyright (c) 2001-present, Vonage.
|
3
|
-
*
|
4
|
-
* Core of volta
|
5
|
-
*/
|
6
|
-
'use strict';
|
7
|
-
var Volta;
|
8
|
-
|
9
|
-
Volta = function (){
|
10
|
-
return {
|
11
|
-
_closest: closest,
|
12
|
-
_hasClass: hasClass,
|
13
|
-
init: initialise,
|
14
|
-
_isMobile: isMobileDevice,
|
15
|
-
_getElementSiblings: getElementSiblings,
|
16
|
-
_getFunction: getFunctionFromString,
|
17
|
-
_removeFromArr: removeFromArr
|
18
|
-
}
|
19
|
-
|
20
|
-
/**
|
21
|
-
* @private
|
22
|
-
*
|
23
|
-
* @description Finds the first ancestor of the given element, matching a specific selector.
|
24
|
-
* @param {HTMLElement} element Starting element
|
25
|
-
* @param {string} selector Selector to find (can be .class, #id, div...)
|
26
|
-
* @param {string} stopSelector Selector to stop searching on (can be .class, #id, div...)
|
27
|
-
* @returns {HTMLElement|null} The matched element or null if no element is found
|
28
|
-
*/
|
29
|
-
function closest(element, selector, stopSelector) {
|
30
|
-
var match = null;
|
31
|
-
while (element) {
|
32
|
-
if (element.matches(selector)) {
|
33
|
-
match = element;
|
34
|
-
break
|
35
|
-
} else if (stopSelector && element.matches(stopSelector)) {
|
36
|
-
break
|
37
|
-
}
|
38
|
-
element = element.parentElement;
|
39
|
-
}
|
40
|
-
return match;
|
41
|
-
}
|
42
|
-
|
43
|
-
/**
|
44
|
-
* @private
|
45
|
-
* @description Given the name of a function returns the function itself
|
46
|
-
* @param {string} callbackFnName The function name e.g. "testFunction" OR "test.function"
|
47
|
-
* @returns {Function}
|
48
|
-
*/
|
49
|
-
function getFunctionFromString(fnName) {
|
50
|
-
var fn;
|
51
|
-
|
52
|
-
if(fnName) {
|
53
|
-
var fnNames = fnName.split(".");
|
54
|
-
var fn = window;
|
55
|
-
for(var i = 0; i < fnNames.length; i++) {
|
56
|
-
fn = fn[fnNames[i]];
|
57
|
-
}
|
58
|
-
}
|
59
|
-
|
60
|
-
return fn;
|
61
|
-
}
|
62
|
-
|
63
|
-
/**
|
64
|
-
* @private
|
65
|
-
* @description Get all siblings of an element
|
66
|
-
* @param {HTMLElement} el
|
67
|
-
*/
|
68
|
-
function getElementSiblings(element) {
|
69
|
-
var siblings = [];
|
70
|
-
element = element.parentNode.firstChild;
|
71
|
-
do {
|
72
|
-
if(element.nodeType === 1) {
|
73
|
-
siblings.push(element);
|
74
|
-
}
|
75
|
-
} while (element = element.nextSibling);
|
76
|
-
return siblings;
|
77
|
-
}
|
78
|
-
|
79
|
-
/**
|
80
|
-
* @private
|
81
|
-
*
|
82
|
-
* @description Check if the given element has a particular class
|
83
|
-
* @param {HTMLElement} el Element to evaluate
|
84
|
-
* @param {string} className Class name to check for
|
85
|
-
* @returns {boolean} True if the element has the class or false if not
|
86
|
-
*/
|
87
|
-
function hasClass(element, className) {
|
88
|
-
if(!element) {
|
89
|
-
return false;
|
90
|
-
}
|
91
|
-
return (" " + element.className + " ").replace(/[\n\t]/g, " ").indexOf(" " + className+ " ") > -1;
|
92
|
-
}
|
93
|
-
|
94
|
-
/**
|
95
|
-
* @private
|
96
|
-
*
|
97
|
-
* @description Is the current device a mobile
|
98
|
-
* @returns {boolean} True if mobile false if not
|
99
|
-
*/
|
100
|
-
function isMobileDevice() {
|
101
|
-
var isMobile = /Android|webOS|iPhone|iPad|BlackBerry|Windows Phone|Opera Mini|IEMobile|Mobile/i;
|
102
|
-
|
103
|
-
return isMobile.test(navigator.userAgent);
|
104
|
-
}
|
105
|
-
|
106
|
-
/**
|
107
|
-
* @public
|
108
|
-
*
|
109
|
-
* @description Initailise volta with required components
|
110
|
-
* @param {Array} components Array of strings, names of the components to initialise
|
111
|
-
*/
|
112
|
-
function initialise(components) {
|
113
|
-
polyfilsForIE11();
|
114
|
-
|
115
|
-
if(components.indexOf('accordion') !== -1){
|
116
|
-
if(Volta.accordion) {
|
117
|
-
Volta.accordion.init();
|
118
|
-
} else {
|
119
|
-
console.warn('Volta: volta.accordion.js component missing')
|
120
|
-
}
|
121
|
-
}
|
122
|
-
if(components.indexOf('callout') !== -1){
|
123
|
-
if(Volta.callout) {
|
124
|
-
Volta.callout.init();
|
125
|
-
} else {
|
126
|
-
console.warn('Volta: volta.callout.js component missing')
|
127
|
-
}
|
128
|
-
}
|
129
|
-
if(components.indexOf('badge') !== -1){
|
130
|
-
if(Volta.badge) {
|
131
|
-
Volta.badge.init();
|
132
|
-
} else {
|
133
|
-
console.warn('Volta: volta.badge.js component missing')
|
134
|
-
}
|
135
|
-
}
|
136
|
-
if(components.indexOf('dropdown') !== -1){
|
137
|
-
if(Volta.dropdown) {
|
138
|
-
Volta.dropdown.init();
|
139
|
-
} else {
|
140
|
-
console.warn('Volta: volta.dropdown.js component missing')
|
141
|
-
}
|
142
|
-
}
|
143
|
-
if(components.indexOf('flash') !== -1){
|
144
|
-
if(Volta.flash) {
|
145
|
-
Volta.flash.init();
|
146
|
-
} else {
|
147
|
-
console.warn('Volta: volta.dropdown.js component missing')
|
148
|
-
}
|
149
|
-
}
|
150
|
-
if(components.indexOf('menu') !== -1){
|
151
|
-
if(Volta.menu) {
|
152
|
-
Volta.menu.init();
|
153
|
-
} else {
|
154
|
-
console.warn('Volta: volta.menu.js component missing')
|
155
|
-
}
|
156
|
-
}
|
157
|
-
if(components.indexOf('menuCollapse') !== -1){
|
158
|
-
if(Volta.menuCollapse) {
|
159
|
-
Volta.menuCollapse.init();
|
160
|
-
} else {
|
161
|
-
console.warn('Volta: volta.menuCollapse.js component missing')
|
162
|
-
}
|
163
|
-
}
|
164
|
-
if(components.indexOf('modal') !== -1){
|
165
|
-
if(Volta.modal) {
|
166
|
-
Volta.modal.init();
|
167
|
-
} else {
|
168
|
-
console.warn('Volta: volta.modal.js component missing')
|
169
|
-
}
|
170
|
-
}
|
171
|
-
if(components.indexOf('tab') !== -1){
|
172
|
-
if(Volta.tab) {
|
173
|
-
Volta.tab.init();
|
174
|
-
} else {
|
175
|
-
console.warn('Volta: volta.tab.js component missing')
|
176
|
-
}
|
177
|
-
}
|
178
|
-
if(components.indexOf('table') !== -1){
|
179
|
-
if(Volta.table) {
|
180
|
-
Volta.table.init();
|
181
|
-
} else {
|
182
|
-
console.warn('Volta: volta.table.js component missing')
|
183
|
-
}
|
184
|
-
}
|
185
|
-
if(components.indexOf('tooltip') !== -1){
|
186
|
-
if(Volta.tooltip) {
|
187
|
-
Volta.tooltip.init();
|
188
|
-
} else {
|
189
|
-
console.warn('Volta: volta.tooltip.js component missing')
|
190
|
-
}
|
191
|
-
}
|
192
|
-
}
|
193
|
-
|
194
|
-
/**
|
195
|
-
* @private
|
196
|
-
*
|
197
|
-
* @description Remove an element from an array
|
198
|
-
* @param {Array} arr The array containing the element
|
199
|
-
* @param {Element} element The element to remove
|
200
|
-
* @returns {Array} The array minus the element
|
201
|
-
*/
|
202
|
-
function removeFromArr(arr, element) {
|
203
|
-
var index = arr.indexOf(element);
|
204
|
-
arr.splice(index, 1);
|
205
|
-
return arr;
|
206
|
-
}
|
207
|
-
|
208
|
-
/**
|
209
|
-
* @private
|
210
|
-
*
|
211
|
-
*/
|
212
|
-
function polyfilsForIE11() {
|
213
|
-
if (window.NodeList && !NodeList.prototype.forEach) {
|
214
|
-
NodeList.prototype.forEach = function (callback, thisArg) {
|
215
|
-
thisArg = thisArg || window;
|
216
|
-
for (var i = 0; i < this.length; i++) {
|
217
|
-
callback.call(thisArg, this[i], i, this);
|
218
|
-
}
|
219
|
-
};
|
220
|
-
}
|
221
|
-
|
222
|
-
if (!Element.prototype.matches) {
|
223
|
-
Element.prototype.matches =
|
224
|
-
Element.prototype.matchesSelector ||
|
225
|
-
Element.prototype.mozMatchesSelector ||
|
226
|
-
Element.prototype.msMatchesSelector ||
|
227
|
-
Element.prototype.oMatchesSelector ||
|
228
|
-
Element.prototype.webkitMatchesSelector ||
|
229
|
-
function(s) {
|
230
|
-
var matches = (this.document || this.ownerDocument).querySelectorAll(s),
|
231
|
-
i = matches.length;
|
232
|
-
while (--i >= 0 && matches.item(i) !== this) {}
|
233
|
-
return i > -1;
|
234
|
-
};
|
235
|
-
}
|
236
|
-
}
|
237
|
-
}();
|
238
|
-
|
239
|
-
/**
|
240
|
-
* Copyright (c) 2001-present, Vonage.
|
241
|
-
*
|
242
|
-
* Accordions (requires core)
|
243
|
-
*/
|
244
|
-
|
245
|
-
'use strict';
|
246
|
-
|
247
|
-
Volta.accordion = function () {
|
248
|
-
var _class = {
|
249
|
-
standard: {
|
250
|
-
container: 'Vlt-accordion',
|
251
|
-
containerGroup: 'Vlt-accordion--group',
|
252
|
-
trigger: 'Vlt-accordion__trigger',
|
253
|
-
triggerActive: 'Vlt-accordion__trigger_active',
|
254
|
-
content: 'Vlt-accordion__content',
|
255
|
-
contentOpen: 'Vlt-accordion__content_open',
|
256
|
-
contentOpening: 'Vlt-accordion__content_opening',
|
257
|
-
contentClosing: 'Vlt-accordion__content_closing',
|
258
|
-
},
|
259
|
-
js: {
|
260
|
-
content: 'Vlt-js-accordion__content',
|
261
|
-
contentOpen: 'Vlt-js-accordion__content_open',
|
262
|
-
contentOpening: 'Vlt-js-accordion__content_opening',
|
263
|
-
contentClosing: 'Vlt-js-accordion__content_closing',
|
264
|
-
trigger: 'Vlt-js-accordion__trigger',
|
265
|
-
triggerActive: 'Vlt-js-accordion__trigger_active'
|
266
|
-
}
|
267
|
-
}
|
268
|
-
|
269
|
-
function Accordion() {}
|
270
|
-
|
271
|
-
Accordion.prototype = {
|
272
|
-
init: function(element, suppressClickHandler, triggerElem) {
|
273
|
-
if(this.isStandard) {
|
274
|
-
this._initStandard(element, suppressClickHandler);
|
275
|
-
} else {
|
276
|
-
this._initJs(element, suppressClickHandler, triggerElem);
|
277
|
-
}
|
278
|
-
},
|
279
|
-
_initStandard: function(element, suppressClickHandler) {
|
280
|
-
var self = this;
|
281
|
-
|
282
|
-
if(!suppressClickHandler) {
|
283
|
-
element.querySelectorAll('.' + _class.standard.trigger).forEach(function(trigger) {
|
284
|
-
var parent = Volta._closest(trigger, '.' + _class.standard.container, _class.standard.container);
|
285
|
-
|
286
|
-
if(parent && parent == element) {
|
287
|
-
trigger.addEventListener('click', function(){
|
288
|
-
self.toggle(trigger);
|
289
|
-
});
|
290
|
-
}
|
291
|
-
});
|
292
|
-
}
|
293
|
-
},
|
294
|
-
_initJs: function(element, suppressClickHandler, triggerElem) {
|
295
|
-
this._content = element;
|
296
|
-
|
297
|
-
if(triggerElem) {
|
298
|
-
this.trigger = triggerElem;
|
299
|
-
} else if(this._content.dataset.trigger) {
|
300
|
-
var triggerId = this._content.dataset.trigger;
|
301
|
-
this.trigger = document.querySelector('#' + triggerId);
|
302
|
-
} else {
|
303
|
-
console.warn("Volta: js accordion trigger missing");
|
304
|
-
}
|
305
|
-
|
306
|
-
var self = this;
|
307
|
-
if(!suppressClickHandler && this.trigger) {
|
308
|
-
this.trigger.addEventListener('click', function(){
|
309
|
-
self.toggle();
|
310
|
-
});
|
311
|
-
}
|
312
|
-
},
|
313
|
-
close: function(trigger) {
|
314
|
-
var panel = this._content || trigger.nextElementSibling;
|
315
|
-
var trigger = this.trigger || trigger;
|
316
|
-
var classes = this.trigger ? _class.js : _class.standard;
|
317
|
-
|
318
|
-
trigger.classList.remove(classes.triggerActive);
|
319
|
-
panel.classList.add(classes.contentClosing);
|
320
|
-
|
321
|
-
panel.style.height = window.getComputedStyle(panel).height;
|
322
|
-
panel.offsetHeight; // force repaint
|
323
|
-
panel.style.height = '0px';
|
324
|
-
panel.classList.remove(classes.contentOpen);
|
325
|
-
|
326
|
-
var self = this;
|
327
|
-
panel.addEventListener('transitionend', function closingTransitionEndEvent(event) {
|
328
|
-
if (event.propertyName == 'height' && Volta._hasClass(panel, classes.contentClosing)) {
|
329
|
-
panel.classList.remove(classes.contentClosing);
|
330
|
-
panel.style.height = '0px';
|
331
|
-
panel.removeEventListener('transitionend', closingTransitionEndEvent, false);
|
332
|
-
|
333
|
-
if(self.isGroup && self._isTriggerActive(trigger, true)){
|
334
|
-
self._activeGroupTrigger = undefined;
|
335
|
-
}
|
336
|
-
}
|
337
|
-
}, { passive: true, once: true });
|
338
|
-
},
|
339
|
-
isOpening: false,
|
340
|
-
_activeGroupTrigger: undefined,
|
341
|
-
_isTriggerActive: function(trigger, match) {
|
342
|
-
return (this.isGroup && this._activeGroupTrigger && (!match || this._activeGroupTrigger === trigger)) || Volta._hasClass(trigger, _class.standard.triggerActive);
|
343
|
-
},
|
344
|
-
open: function(trigger) {
|
345
|
-
if(!this.trigger) {
|
346
|
-
if(this._isTriggerActive(trigger, false)) {
|
347
|
-
this.close(this._activeGroupTrigger || trigger);
|
348
|
-
}
|
349
|
-
if(this.isGroup) {
|
350
|
-
this._activeGroupTrigger = trigger;
|
351
|
-
}
|
352
|
-
}
|
353
|
-
|
354
|
-
var trig = this.trigger || trigger;
|
355
|
-
var classes = this.trigger ? _class.js : _class.standard;
|
356
|
-
var panel = this._content || trig.nextElementSibling;
|
357
|
-
|
358
|
-
this.isOpening = true;
|
359
|
-
|
360
|
-
trig.classList.add(classes.triggerActive);
|
361
|
-
panel.classList.add(classes.contentOpening);
|
362
|
-
|
363
|
-
var startHeight = panel.style.height;
|
364
|
-
panel.style.height = 'auto';
|
365
|
-
var endHeight = window.getComputedStyle(panel).height;
|
366
|
-
panel.style.height = startHeight;
|
367
|
-
panel.offsetHeight; // force repaint
|
368
|
-
panel.style.height = endHeight;
|
369
|
-
|
370
|
-
var self = this;
|
371
|
-
panel.addEventListener('transitionend', function openingTransitionEndEvent(event) {
|
372
|
-
if (event.propertyName == 'height' && Volta._hasClass(panel, classes.contentOpening)) {
|
373
|
-
panel.style.height = 'auto';
|
374
|
-
panel.classList.remove(classes.contentOpening);
|
375
|
-
panel.classList.add(classes.contentOpen);
|
376
|
-
panel.removeEventListener('transitionend', openingTransitionEndEvent, false);
|
377
|
-
self.isOpening = false;
|
378
|
-
}
|
379
|
-
}, { passive: true, once: true });
|
380
|
-
},
|
381
|
-
toggle: function(trigger) {
|
382
|
-
if(this.isOpening) {
|
383
|
-
return false;
|
384
|
-
}
|
385
|
-
if((this.trigger && Volta._hasClass(this._content, _class.js.contentOpen))
|
386
|
-
|| (!this.trigger && this._isTriggerActive(trigger, true))) {
|
387
|
-
this.close(trigger);
|
388
|
-
} else {
|
389
|
-
this.open(trigger);
|
390
|
-
}
|
391
|
-
}
|
392
|
-
}
|
393
|
-
|
394
|
-
return {
|
395
|
-
create: create,
|
396
|
-
init: initialise
|
397
|
-
}
|
398
|
-
|
399
|
-
/**
|
400
|
-
* @public
|
401
|
-
*
|
402
|
-
* @description Create an individual accordion object
|
403
|
-
* @param {Element|string} elementOrId Reference to the accordion content element or the id
|
404
|
-
* @param {Boolean} suppressClickHandler Whether click events should be attached on creation
|
405
|
-
* @param {Element} trigger Private required for legacy accordions
|
406
|
-
* @param {Boolean} isGroup Private required for legacy accordions
|
407
|
-
* @return {Object}
|
408
|
-
*/
|
409
|
-
function create(elementOrId, suppressClickHandler, trigger, isGroup, isStandard) {
|
410
|
-
if(!elementOrId) {
|
411
|
-
console.warn("Volta: no parameter supplied to accordion.create()");
|
412
|
-
}
|
413
|
-
var accordion = Object.create(Accordion.prototype, {});
|
414
|
-
var element = getElement(elementOrId);
|
415
|
-
|
416
|
-
Object.defineProperties(accordion, {
|
417
|
-
'isStandard': {
|
418
|
-
value: isStandard || Volta._hasClass(element, _class.standard.container),
|
419
|
-
writable: false
|
420
|
-
}
|
421
|
-
});
|
422
|
-
|
423
|
-
Object.defineProperties(accordion, {
|
424
|
-
'isGroup': {
|
425
|
-
value: isGroup,
|
426
|
-
writable: false
|
427
|
-
}
|
428
|
-
});
|
429
|
-
|
430
|
-
accordion.init(element, suppressClickHandler, trigger);
|
431
|
-
|
432
|
-
return accordion;
|
433
|
-
}
|
434
|
-
|
435
|
-
/**
|
436
|
-
* @public
|
437
|
-
*
|
438
|
-
* @description Initialise all the accordions on the current screen
|
439
|
-
*/
|
440
|
-
function initialise() {
|
441
|
-
//standard
|
442
|
-
var standardAccordions = document.querySelectorAll('.' + _class.standard.container);
|
443
|
-
|
444
|
-
if(standardAccordions.length) {
|
445
|
-
standardAccordions.forEach(function(accordion){
|
446
|
-
create(accordion, false, null, Volta._hasClass(accordion, _class.standard.containerGroup), true);
|
447
|
-
});
|
448
|
-
}
|
449
|
-
|
450
|
-
//js
|
451
|
-
var triggers = document.querySelectorAll('.' + _class.js.trigger + '[data-accordion]');
|
452
|
-
if(triggers.length > 0) {
|
453
|
-
triggers.forEach(function(trigger) {
|
454
|
-
var accordionId = trigger.dataset.accordion;
|
455
|
-
if(!accordionId) {
|
456
|
-
return;
|
457
|
-
}
|
458
|
-
create(accordionId, false, trigger);
|
459
|
-
});
|
460
|
-
}
|
461
|
-
|
462
|
-
//js - legacy
|
463
|
-
var jsAccordions = document.querySelectorAll('.' + _class.js.content + '[data-trigger]');
|
464
|
-
if(jsAccordions.length > 0) {
|
465
|
-
jsAccordions.forEach(function(jsLegacy) {
|
466
|
-
create(jsLegacy);
|
467
|
-
});
|
468
|
-
}
|
469
|
-
}
|
470
|
-
|
471
|
-
/**
|
472
|
-
* @private
|
473
|
-
*/
|
474
|
-
function getElement(elementOrId) {
|
475
|
-
var element;
|
476
|
-
|
477
|
-
if(elementOrId.classList) {
|
478
|
-
element = elementOrId;
|
479
|
-
} else if (elementOrId.substring(0, 1) === "#") {
|
480
|
-
element = document.querySelector(elementOrId);
|
481
|
-
} else {
|
482
|
-
element = document.querySelector('#' + elementOrId);
|
483
|
-
}
|
484
|
-
|
485
|
-
return element;
|
486
|
-
}
|
487
|
-
}();
|
488
|
-
|
489
|
-
/**
|
490
|
-
* Copyright (c) 2001-present, Vonage.
|
491
|
-
*
|
492
|
-
* Badges (requires core)
|
493
|
-
*/
|
494
|
-
|
495
|
-
'use strict';
|
496
|
-
|
497
|
-
Volta.badge = function () {
|
498
|
-
var _class = {
|
499
|
-
badge: 'Vlt-badge',
|
500
|
-
dismiss: 'Vlt-badge__dismiss',
|
501
|
-
dismissed: 'Vlt-badge--dismissed'
|
502
|
-
}
|
503
|
-
|
504
|
-
return {
|
505
|
-
dismiss: dismiss,
|
506
|
-
init: attachBadgeHandlers
|
507
|
-
}
|
508
|
-
|
509
|
-
/**
|
510
|
-
* @public
|
511
|
-
*
|
512
|
-
* @description Attach a one time listener to dismissable badges
|
513
|
-
*/
|
514
|
-
function attachBadgeHandlers() {
|
515
|
-
document.querySelectorAll('.' + _class.dismiss).forEach(create);
|
516
|
-
}
|
517
|
-
|
518
|
-
/**
|
519
|
-
* @private
|
520
|
-
*
|
521
|
-
* @description Create a badge
|
522
|
-
* @param {HTMLElement} badge
|
523
|
-
*/
|
524
|
-
function create(badgeOrDismiss) {
|
525
|
-
var badge, badgeDismiss;
|
526
|
-
|
527
|
-
if(Volta._hasClass(badgeOrDismiss, _class.badge)) {
|
528
|
-
badge = badgeOrDismiss;
|
529
|
-
badgeDismiss = badge.querySelector('.' + _class.dismiss);
|
530
|
-
} else if(Volta._hasClass(badgeOrDismiss, _class.dismiss)){
|
531
|
-
badgeDismiss = badgeOrDismiss;
|
532
|
-
badge = badgeDismiss.parentElement;
|
533
|
-
}
|
534
|
-
|
535
|
-
badgeDismiss.addEventListener('click', function(){
|
536
|
-
dismiss(badge);
|
537
|
-
}, { once : true});
|
538
|
-
}
|
539
|
-
|
540
|
-
/**
|
541
|
-
* @public
|
542
|
-
*
|
543
|
-
* @description Dismiss a badge
|
544
|
-
* @param {HTMLElement} badge
|
545
|
-
*/
|
546
|
-
function dismiss(badge) {
|
547
|
-
badge.classList.add(_class.dismissed);
|
548
|
-
|
549
|
-
if(badge.dataset.callback) {
|
550
|
-
return Volta._getFunction(badgeWrapper.dataset.callback)();
|
551
|
-
}
|
552
|
-
}
|
553
|
-
}();
|
554
|
-
/**
|
555
|
-
* Copyright (c) 2001-present, Vonage.
|
556
|
-
*
|
557
|
-
* Callouts (requires core)
|
558
|
-
*/
|
559
|
-
|
560
|
-
'use strict';
|
561
|
-
|
562
|
-
Volta.callout = function () {
|
563
|
-
var _class = {
|
564
|
-
callout: 'Vlt-callout',
|
565
|
-
dismiss: 'Vlt-callout__dismiss',
|
566
|
-
dismissed: 'Vlt-callout--dismissed'
|
567
|
-
}
|
568
|
-
|
569
|
-
return {
|
570
|
-
dismiss: dismiss,
|
571
|
-
init: attachCalloutHandlers
|
572
|
-
}
|
573
|
-
|
574
|
-
/**
|
575
|
-
* @public
|
576
|
-
*
|
577
|
-
* @description Attach a one time listener to dismissable callouts
|
578
|
-
*/
|
579
|
-
function attachCalloutHandlers() {
|
580
|
-
document.querySelectorAll('.' + _class.dismiss).forEach(create);
|
581
|
-
}
|
582
|
-
|
583
|
-
/**
|
584
|
-
* @private
|
585
|
-
*
|
586
|
-
* @description Create a callout
|
587
|
-
* @param {HTMLElement} callout
|
588
|
-
*/
|
589
|
-
function create(calloutOrDismiss) {
|
590
|
-
var callout, calloutDismiss;
|
591
|
-
|
592
|
-
if(Volta._hasClass(calloutOrDismiss, _class.callout)) {
|
593
|
-
callout = calloutOrDismiss;
|
594
|
-
calloutDismiss = callout.querySelector('.' + _class.dismiss);
|
595
|
-
} else if(Volta._hasClass(calloutOrDismiss, _class.dismiss)){
|
596
|
-
calloutDismiss = calloutOrDismiss;
|
597
|
-
callout = calloutDismiss.parentElement;
|
598
|
-
}
|
599
|
-
|
600
|
-
calloutDismiss.addEventListener('click', function(){
|
601
|
-
dismiss(callout);
|
602
|
-
}, { once : true});
|
603
|
-
}
|
604
|
-
|
605
|
-
/**
|
606
|
-
* @public
|
607
|
-
*
|
608
|
-
* @description Dismiss a callout
|
609
|
-
* @param {HTMLElement} callout
|
610
|
-
*/
|
611
|
-
function dismiss(callout) {
|
612
|
-
callout.classList.add(_class.dismissed);
|
613
|
-
|
614
|
-
if(callout.dataset.callback) {
|
615
|
-
return Volta._getFunction(calloutWrapper.dataset.callback)();
|
616
|
-
}
|
617
|
-
}
|
618
|
-
}();
|
619
|
-
/**
|
620
|
-
* Copyright (c) 2001-present, Vonage.
|
621
|
-
*
|
622
|
-
* Dropdowns (requires core)
|
623
|
-
*/
|
624
|
-
|
625
|
-
'use strict';
|
626
|
-
|
627
|
-
Volta.dropdown = function () {
|
628
|
-
var _class = {
|
629
|
-
wrapper: 'Vlt-dropdown',
|
630
|
-
block: 'Vlt-dropdown__block',
|
631
|
-
btn: 'Vlt-dropdown__trigger',
|
632
|
-
btnLegacy: 'Vlt-dropdown__btn',
|
633
|
-
dismissed: 'Vlt-callout--dismissed',
|
634
|
-
expanded: 'Vlt-dropdown--expanded',
|
635
|
-
label: 'Vlt-dropdown__label',
|
636
|
-
link: 'Vlt-dropdown__link',
|
637
|
-
noCloseLink: 'Vlt-dropdown__link--noclose',
|
638
|
-
noCloseBlock: 'Vlt-dropdown__block--noclose',
|
639
|
-
panel: 'Vlt-dropdown__panel',
|
640
|
-
panelContent: 'Vlt-dropdown__panel__content',
|
641
|
-
selection: 'Vlt-dropdown__selection',
|
642
|
-
switch: 'Vlt-switch',
|
643
|
-
switchSlider: 'Vlt-switch__slider'
|
644
|
-
}
|
645
|
-
|
646
|
-
function Dropdown() {}
|
647
|
-
|
648
|
-
Dropdown.prototype = {
|
649
|
-
init: function(element, supressClickHandler) {
|
650
|
-
this.dropdown = element;
|
651
|
-
this.selection = this.dropdown.querySelector('.' + _class.selection);
|
652
|
-
this.isSelectionVisible = !!this.selection;
|
653
|
-
this.btn = this.dropdown.querySelector('.' + _class.btn) || this.dropdown.querySelector('.' + _class.btnLegacy);
|
654
|
-
this._suppress = supressClickHandler;
|
655
|
-
|
656
|
-
if(!this._suppress) {
|
657
|
-
this._addEventListener();
|
658
|
-
}
|
659
|
-
},
|
660
|
-
_addEventListener: function(){
|
661
|
-
var openHandler = this.open.bind(this);
|
662
|
-
this.dropdown.addEventListener('click', openHandler, { once: true })
|
663
|
-
},
|
664
|
-
close: function(text) {
|
665
|
-
if(text) {
|
666
|
-
this._setDropdownSelectionText(text);
|
667
|
-
}
|
668
|
-
this.dropdown.classList.remove(_class.expanded);
|
669
|
-
|
670
|
-
if(!this._suppress){
|
671
|
-
this._addEventListener();
|
672
|
-
}
|
673
|
-
|
674
|
-
},
|
675
|
-
_closeEventHandler: undefined,
|
676
|
-
_closeEvent: function(e) {
|
677
|
-
var targetIsPanel = Volta._hasClass(e.target, _class.panel);
|
678
|
-
var parentIsPanel = Volta._closest(e.target, '.' + _class.panelContent, _class.panel) !== null;
|
679
|
-
var parentLink = Volta._closest(e.target, '.' + _class.link, _class.wrapper);
|
680
|
-
var parentIsLink = parentLink && parentLink.length === 1;
|
681
|
-
var isSwitchSlider = Volta._hasClass(e.target, _class.switchSlider);
|
682
|
-
var isParentSwitch = Volta._closest(e.target,'.' + _class.switch, _class.link);
|
683
|
-
var isNoClose = Volta._hasClass(e.target, _class.noCloseLink) || Volta._hasClass(e.target, _class.noCloseBlock);
|
684
|
-
var isNoCloseParent = Volta._closest(e.target,'.' + _class.noCloseLink, _class.link) || Volta._closest(e.target,'.' + _class.noCloseBlock, _class.noCloseBlock);
|
685
|
-
var isInput = e.target instanceof HTMLInputElement;
|
686
|
-
|
687
|
-
if(!targetIsPanel && !parentIsPanel && !parentIsLink && !isNoClose && !isInput && !isNoCloseParent) {
|
688
|
-
e.preventDefault();
|
689
|
-
e.stopPropagation();
|
690
|
-
}
|
691
|
-
|
692
|
-
if(isSwitchSlider || isParentSwitch || isNoClose || isInput || isNoCloseParent) {
|
693
|
-
return null;
|
694
|
-
}
|
695
|
-
|
696
|
-
var text;
|
697
|
-
if(parentIsPanel && Volta._hasClass(e.target, _class.label)) {
|
698
|
-
text = e.target.innerHTML;
|
699
|
-
} else if (parentIsPanel) {
|
700
|
-
var label = e.target.querySelector('.' + _class.label);
|
701
|
-
if(label) {
|
702
|
-
text = label.innerHTML;
|
703
|
-
}
|
704
|
-
}
|
705
|
-
|
706
|
-
this.close(text);
|
707
|
-
|
708
|
-
document.querySelector('body').removeEventListener('click', this._closeEventHandler );
|
709
|
-
},
|
710
|
-
open: function(event) {
|
711
|
-
if(event) {
|
712
|
-
event.preventDefault();
|
713
|
-
event.stopPropagation();
|
714
|
-
}
|
715
|
-
|
716
|
-
this.dropdown.classList.add(_class.expanded);
|
717
|
-
|
718
|
-
if(!this._suppress){
|
719
|
-
this._closeEventHandler = this._closeEvent.bind(this);
|
720
|
-
document.querySelector('body').addEventListener('click', this._closeEventHandler );
|
721
|
-
}
|
722
|
-
},
|
723
|
-
_setDropdownSelectionText: function(text) {
|
724
|
-
if(this.isSelectionVisible) {
|
725
|
-
this.selection.innerText = text;
|
726
|
-
} else {
|
727
|
-
this.btn.innerText = text;
|
728
|
-
this.btn.value = text;
|
729
|
-
}
|
730
|
-
},
|
731
|
-
_suppress: false
|
732
|
-
}
|
733
|
-
|
734
|
-
return {
|
735
|
-
create: create,
|
736
|
-
init: attachDropdownHandlers
|
737
|
-
}
|
738
|
-
|
739
|
-
/**
|
740
|
-
* @public
|
741
|
-
*
|
742
|
-
* @description Attach a listeners to dropdowns
|
743
|
-
*/
|
744
|
-
function attachDropdownHandlers() {
|
745
|
-
document.querySelectorAll('.' + _class.wrapper).forEach(attachHandler);
|
746
|
-
|
747
|
-
function attachHandler(dropdown) {
|
748
|
-
create(dropdown);
|
749
|
-
}
|
750
|
-
}
|
751
|
-
|
752
|
-
/**
|
753
|
-
* @private
|
754
|
-
*
|
755
|
-
* @description Create a dropdown element
|
756
|
-
* @param {HTMLElement} element
|
757
|
-
*/
|
758
|
-
function create(element){
|
759
|
-
var dropdown = Object.create(Dropdown.prototype, {})
|
760
|
-
dropdown.init(element);
|
761
|
-
return dropdown;
|
762
|
-
}
|
763
|
-
}();
|
764
|
-
/**
|
765
|
-
* Copyright (c) 2001-present, Vonage.
|
766
|
-
*
|
767
|
-
* Tabs (requires core)
|
768
|
-
*/
|
769
|
-
|
770
|
-
'use strict';
|
771
|
-
|
772
|
-
Volta.flash = function () {
|
773
|
-
var _class = {
|
774
|
-
flash: 'Vlt-flash',
|
775
|
-
trigger: 'Vlt-flash-trigger',
|
776
|
-
visible: 'Vlt-flash_visible'
|
777
|
-
}
|
778
|
-
|
779
|
-
var gap = 20,
|
780
|
-
openBottomFlashes = [],
|
781
|
-
openTopFlashes = [],
|
782
|
-
timeouts =[];
|
783
|
-
|
784
|
-
return {
|
785
|
-
closeAll: closeAll,
|
786
|
-
init: attachFlashHandlers,
|
787
|
-
show: show
|
788
|
-
}
|
789
|
-
|
790
|
-
/**
|
791
|
-
* @public
|
792
|
-
*
|
793
|
-
* @description Attach a click listener to each flash's trigger on the screen
|
794
|
-
* @param {HTMLElement} element
|
795
|
-
*/
|
796
|
-
function attachFlashHandlers() {
|
797
|
-
var triggers = document.querySelectorAll('.' + _class.trigger);
|
798
|
-
|
799
|
-
if(triggers.length === 0) {
|
800
|
-
return;
|
801
|
-
}
|
802
|
-
|
803
|
-
triggers.forEach(attachHandler);
|
804
|
-
|
805
|
-
function attachHandler(trigger) {
|
806
|
-
trigger.addEventListener('click', function() {
|
807
|
-
if(trigger.dataset.flash) {
|
808
|
-
var flash = document.querySelector('#' + trigger.dataset.flash);
|
809
|
-
show(flash);
|
810
|
-
} else {
|
811
|
-
console.warn("Volta: flash trigger is missing data-flash attribute");
|
812
|
-
}
|
813
|
-
});
|
814
|
-
}
|
815
|
-
}
|
816
|
-
|
817
|
-
/**
|
818
|
-
* @public
|
819
|
-
*
|
820
|
-
* @description Close all open flashes
|
821
|
-
*/
|
822
|
-
function closeAll() {
|
823
|
-
if(timeouts.length > 0) {
|
824
|
-
timeouts.forEach(function(timeout){
|
825
|
-
clearTimeout(timeout);
|
826
|
-
});
|
827
|
-
}
|
828
|
-
if(openBottomFlashes.length > 0) {
|
829
|
-
clearQueue(openBottomFlashes);
|
830
|
-
}
|
831
|
-
if(openTopFlashes.length > 0) {
|
832
|
-
clearQueue(openTopFlashes);
|
833
|
-
}
|
834
|
-
|
835
|
-
timeouts = [];
|
836
|
-
openBottomFlashes = [];
|
837
|
-
openTopFlashes = [];
|
838
|
-
|
839
|
-
function clearQueue(elementArr) {
|
840
|
-
elementArr.forEach(function(element){
|
841
|
-
_hide(element);
|
842
|
-
});
|
843
|
-
elementArr = [];
|
844
|
-
}
|
845
|
-
}
|
846
|
-
|
847
|
-
/**
|
848
|
-
* @public
|
849
|
-
*
|
850
|
-
* @description Show the flash
|
851
|
-
* @param {HTMLElement} element
|
852
|
-
*/
|
853
|
-
function show(elementOrId, time) {
|
854
|
-
if(!elementOrId || elementOrId.length == 0) {
|
855
|
-
return;
|
856
|
-
}
|
857
|
-
|
858
|
-
time = time || 5000;
|
859
|
-
|
860
|
-
var element = !elementOrId.classList ? document.querySelector('#' + elementOrId) : elementOrId;
|
861
|
-
var position = Volta._hasClass(element, 'Vlt-flash--bottom') ? 'bottom' : 'top';
|
862
|
-
var arr = position === 'bottom' ? openBottomFlashes : openTopFlashes;
|
863
|
-
|
864
|
-
if(arr.indexOf(element) !== -1) {
|
865
|
-
return;
|
866
|
-
}
|
867
|
-
|
868
|
-
_setFlashPosition(arr, element, position);
|
869
|
-
|
870
|
-
arr.push(element);
|
871
|
-
|
872
|
-
element.classList.add(_class.visible);
|
873
|
-
|
874
|
-
var hideTimeout = setTimeout(function(){
|
875
|
-
_hide(element, true);
|
876
|
-
Volta._removeFromArr(timeouts, hideTimeout);
|
877
|
-
}, time);
|
878
|
-
|
879
|
-
timeouts.push(hideTimeout);
|
880
|
-
}
|
881
|
-
|
882
|
-
/**
|
883
|
-
* @private
|
884
|
-
* @description Hide the flash
|
885
|
-
* @param {HTMLElement} element
|
886
|
-
*/
|
887
|
-
function _hide(element, shouldRemove) {
|
888
|
-
var position = Volta._hasClass(element, 'Vlt-flash--bottom') ? 'bottom' : 'top';
|
889
|
-
var arr = position === 'bottom' ? openBottomFlashes : openTopFlashes;
|
890
|
-
|
891
|
-
if(shouldRemove) {
|
892
|
-
Volta._removeFromArr(arr, element);
|
893
|
-
}
|
894
|
-
|
895
|
-
_updateFlashPositions(arr, element, position);
|
896
|
-
|
897
|
-
element.style[position] = '';
|
898
|
-
element.classList.remove(_class.visible);
|
899
|
-
}
|
900
|
-
|
901
|
-
/**
|
902
|
-
* @private
|
903
|
-
* @description Set the position of the flash
|
904
|
-
* @param {HTMLElement} element
|
905
|
-
*/
|
906
|
-
function _setFlashPosition(arr, element, position) {
|
907
|
-
var positionPx = arr.reduce(function(px, flash) {
|
908
|
-
return px + flash.clientHeight;
|
909
|
-
}, 0);
|
910
|
-
if(positionPx > 0) {
|
911
|
-
element.style[position] = (gap * arr.length) + gap + positionPx + 'px';
|
912
|
-
}
|
913
|
-
}
|
914
|
-
|
915
|
-
/**
|
916
|
-
* @private
|
917
|
-
* @description Update the position of all the visible flashes
|
918
|
-
* @param {Array} arr
|
919
|
-
* @param {HTMLElement} element
|
920
|
-
* @param {string} position
|
921
|
-
*/
|
922
|
-
function _updateFlashPositions(arr, element, position){
|
923
|
-
if(arr.length > 0) {
|
924
|
-
var elementHeight = element.clientHeight;
|
925
|
-
|
926
|
-
arr.forEach(function(flash) {
|
927
|
-
var newPosition;
|
928
|
-
|
929
|
-
if(position === 'bottom') {
|
930
|
-
newPosition = Number(flash.style.bottom.substring(0, flash.style.bottom.length - 2));
|
931
|
-
} else {
|
932
|
-
newPosition = flash.getBoundingClientRect()[position];
|
933
|
-
}
|
934
|
-
flash.style[position] = newPosition -elementHeight - gap + "px";
|
935
|
-
});
|
936
|
-
}
|
937
|
-
}
|
938
|
-
}();
|
939
|
-
/**
|
940
|
-
* Copyright (c) 2001-present, Vonage.
|
941
|
-
*
|
942
|
-
* Modals (requires core)
|
943
|
-
*/
|
944
|
-
|
945
|
-
'use strict';
|
946
|
-
|
947
|
-
Volta.modal = function () {
|
948
|
-
var _class = {
|
949
|
-
auto: 'Vlt-modal--auto',
|
950
|
-
bodyModalOpen: 'Vlt-body--modal-open',
|
951
|
-
cancel: 'Vlt-modal__cancel',
|
952
|
-
confirm: 'Vlt-modal__confirm',
|
953
|
-
content: 'Vlt-modal__content',
|
954
|
-
modal: 'Vlt-modal',
|
955
|
-
out: 'Vlt-modal--out',
|
956
|
-
panel: 'Vlt-modal__panel',
|
957
|
-
trigger: 'Vlt-modal-trigger',
|
958
|
-
visible: 'Vlt-modal_visible',
|
959
|
-
dismiss: 'Vlt-modal__dismiss',
|
960
|
-
}
|
961
|
-
|
962
|
-
var body,
|
963
|
-
dismissModalHandler,
|
964
|
-
cancelModalHandler,
|
965
|
-
confirmModalHandler,
|
966
|
-
escHandler,
|
967
|
-
clickHandler,
|
968
|
-
escAttached;
|
969
|
-
|
970
|
-
function Modal() {}
|
971
|
-
|
972
|
-
Modal.prototype = {
|
973
|
-
attachButtons: function() {
|
974
|
-
var _this = this;
|
975
|
-
_this.dismissBtn = _this.modal.querySelector('.' + _class.dismiss);
|
976
|
-
|
977
|
-
if(_this.dismissBtn) {
|
978
|
-
dismissModalHandler = dismissModal.bind(_this);
|
979
|
-
_this.dismissBtn.addEventListener('click', dismissModalHandler);
|
980
|
-
}
|
981
|
-
|
982
|
-
_this.cancelBtn = _this.modal.querySelector('.' + _class.cancel);
|
983
|
-
|
984
|
-
if(_this.cancelBtn) {
|
985
|
-
cancelModalHandler = cancelModal.bind(_this);
|
986
|
-
_this.cancelBtn.addEventListener('click', cancelModalHandler);
|
987
|
-
}
|
988
|
-
|
989
|
-
_this.confirmBtn = _this.modal.querySelector('.' + _class.confirm);
|
990
|
-
|
991
|
-
if(_this.confirmBtn) {
|
992
|
-
confirmModalHandler = confirmModal.bind(_this);
|
993
|
-
_this.confirmBtn.addEventListener('click', confirmModalHandler);
|
994
|
-
}
|
995
|
-
},
|
996
|
-
html: function(newHtml) {
|
997
|
-
this.modal.innerHTML = newHtml;
|
998
|
-
return this;
|
999
|
-
},
|
1000
|
-
init: function(elementOrId) {
|
1001
|
-
if(elementOrId.length) {
|
1002
|
-
this.modal = document.querySelector('#' + elementOrId);
|
1003
|
-
} else {
|
1004
|
-
this.modal = elementOrId;
|
1005
|
-
}
|
1006
|
-
|
1007
|
-
this._callback = Volta._getFunction(this.modal.dataset.callback);
|
1008
|
-
},
|
1009
|
-
open: function(e) {
|
1010
|
-
if(e && e.preventDefault) {
|
1011
|
-
e.preventDefault();
|
1012
|
-
e.stopPropagation();
|
1013
|
-
}
|
1014
|
-
|
1015
|
-
this.modal.classList.remove(_class.out);
|
1016
|
-
this.modal.classList.add(_class.visible);
|
1017
|
-
this.attachButtons();
|
1018
|
-
|
1019
|
-
disableScroll();
|
1020
|
-
|
1021
|
-
if(!escAttached && !this.modal.dataset.disableEsc || this.modal.dataset.disableEsc === "false") {
|
1022
|
-
escHandler = closeModalOnEscape.bind(this);
|
1023
|
-
body.addEventListener('keyup', escHandler, { once: true });
|
1024
|
-
escAttached = true;
|
1025
|
-
}
|
1026
|
-
|
1027
|
-
if(!this.modal.dataset.disableClick || this.modal.dataset.disableClick === "false") {
|
1028
|
-
clickHandler = closeModalOnClick.bind(this);
|
1029
|
-
this.modal.addEventListener('click', clickHandler, { once: true });
|
1030
|
-
}
|
1031
|
-
},
|
1032
|
-
dismiss: function(e, confirmed) {
|
1033
|
-
var _this = this;
|
1034
|
-
|
1035
|
-
if(e && e.preventDefault) {
|
1036
|
-
e.preventDefault();
|
1037
|
-
e.stopPropagation();
|
1038
|
-
}
|
1039
|
-
|
1040
|
-
enableScroll();
|
1041
|
-
|
1042
|
-
if(_this.modal){
|
1043
|
-
_this.modal.classList.remove(_class.visible);
|
1044
|
-
_this.modal.classList.add(_class.out);
|
1045
|
-
}
|
1046
|
-
|
1047
|
-
if(_this._callback) {
|
1048
|
-
_this._callback(confirmed);
|
1049
|
-
}
|
1050
|
-
|
1051
|
-
removeModal(_this);
|
1052
|
-
}
|
1053
|
-
}
|
1054
|
-
|
1055
|
-
return {
|
1056
|
-
create: create,
|
1057
|
-
init: attachModalHandlers
|
1058
|
-
}
|
1059
|
-
|
1060
|
-
/**
|
1061
|
-
* @public
|
1062
|
-
*
|
1063
|
-
* @description Attach a click listener to each modals trigger on the screen, which will open the modal
|
1064
|
-
*/
|
1065
|
-
function attachModalHandlers() {
|
1066
|
-
if(!body) {
|
1067
|
-
body = document.querySelector('body');
|
1068
|
-
}
|
1069
|
-
|
1070
|
-
var triggers = document.querySelectorAll('.' + _class.trigger);
|
1071
|
-
|
1072
|
-
if(triggers.length > 0) {
|
1073
|
-
triggers.forEach(attachTriggerHandler);
|
1074
|
-
}
|
1075
|
-
|
1076
|
-
//Not the recommended way to use modals
|
1077
|
-
var modals = document.querySelectorAll('.' + _class.modal);
|
1078
|
-
|
1079
|
-
if(modals.length > 0) {
|
1080
|
-
modals.forEach(attachModalHandler);
|
1081
|
-
}
|
1082
|
-
|
1083
|
-
function attachModalHandler(modal) {
|
1084
|
-
if(Volta._hasClass(modal, _class.auto)) {
|
1085
|
-
var trigger = document.querySelector('#' + modal.dataset.trigger);
|
1086
|
-
trigger.addEventListener('click', function() {
|
1087
|
-
create(modal).open();
|
1088
|
-
});
|
1089
|
-
}
|
1090
|
-
}
|
1091
|
-
|
1092
|
-
function attachTriggerHandler(trigger) {
|
1093
|
-
if(trigger.dataset.modal) {
|
1094
|
-
var modal = document.querySelector('#' + trigger.dataset.modal);
|
1095
|
-
|
1096
|
-
if(!modal) {
|
1097
|
-
console.warn('Volta: modal ' + trigger.dataset.modal + ' cannot be found');
|
1098
|
-
}
|
1099
|
-
|
1100
|
-
trigger.addEventListener('click', function() {
|
1101
|
-
create(modal).open();
|
1102
|
-
});
|
1103
|
-
}
|
1104
|
-
}
|
1105
|
-
}
|
1106
|
-
|
1107
|
-
/**
|
1108
|
-
* @private
|
1109
|
-
*
|
1110
|
-
* @description Close the modal, triggered by cancel button, passes false to callback function
|
1111
|
-
* @param {event} e
|
1112
|
-
*/
|
1113
|
-
function cancelModal(e) {
|
1114
|
-
return this.dismiss(e, false);
|
1115
|
-
}
|
1116
|
-
|
1117
|
-
/**
|
1118
|
-
* @private
|
1119
|
-
*
|
1120
|
-
* @description Close the modal, triggered by confirm button, passes true to callback function
|
1121
|
-
* @param {event} e
|
1122
|
-
*/
|
1123
|
-
function confirmModal(e) {
|
1124
|
-
return this.dismiss(e, true);
|
1125
|
-
}
|
1126
|
-
|
1127
|
-
/**
|
1128
|
-
* @private
|
1129
|
-
*
|
1130
|
-
* @description Close the modal, triggered by 'x' button, passes false to callback function
|
1131
|
-
* @param {event} e
|
1132
|
-
*/
|
1133
|
-
function dismissModal(e) {
|
1134
|
-
return this.dismiss(e, false);
|
1135
|
-
}
|
1136
|
-
|
1137
|
-
/** @private
|
1138
|
-
*
|
1139
|
-
* @description Close the modal, triggered by 'esc' key, passes false to callback function
|
1140
|
-
* @param {event} e
|
1141
|
-
*/
|
1142
|
-
function closeModalOnEscape(e){
|
1143
|
-
if(e && e.keyCode === 27) {
|
1144
|
-
this.dismiss(e, false);
|
1145
|
-
} else {
|
1146
|
-
body.addEventListener('click', escHandler, { once: true });
|
1147
|
-
}
|
1148
|
-
}
|
1149
|
-
|
1150
|
-
|
1151
|
-
/** @private
|
1152
|
-
*
|
1153
|
-
* @description Close the modal, triggered by 'body click, passes false to callback function
|
1154
|
-
* @param {event} e
|
1155
|
-
*/
|
1156
|
-
function closeModalOnClick(e){
|
1157
|
-
if(!Volta._hasClass(e.target, _class.trigger)
|
1158
|
-
&& !Volta._closest(e.target, '.' + _class.trigger, '.' + _class.trigger)
|
1159
|
-
&& !Volta._closest(e.target, '.' + _class.panel, '.' + _class.panel)) {
|
1160
|
-
this.dismiss(e, false);
|
1161
|
-
} else if(this.modal) {
|
1162
|
-
this.modal.addEventListener('click', clickHandler, { once: true });
|
1163
|
-
}
|
1164
|
-
}
|
1165
|
-
|
1166
|
-
/**
|
1167
|
-
* @public
|
1168
|
-
*
|
1169
|
-
* @description Create the modal object
|
1170
|
-
* @param {HTMLElement|string} elementOrId Reference to the modal element or the id
|
1171
|
-
*. @return {Object} A modal object
|
1172
|
-
*/
|
1173
|
-
function create(elementOrId) {
|
1174
|
-
if(!body) {
|
1175
|
-
body = document.querySelector('body');
|
1176
|
-
}
|
1177
|
-
var modal = Object.create(Modal.prototype, {})
|
1178
|
-
modal.init(elementOrId);
|
1179
|
-
return modal;
|
1180
|
-
}
|
1181
|
-
|
1182
|
-
/**
|
1183
|
-
* Private functions to disable body scroll when modal is open
|
1184
|
-
*/
|
1185
|
-
function disableScroll() {
|
1186
|
-
body.classList.add(_class.bodyModalOpen);
|
1187
|
-
body.addEventListener('touchmove', preventScroll);
|
1188
|
-
|
1189
|
-
if (body.querySelector('.Vlt-main')) {
|
1190
|
-
body.querySelector('.Vlt-main').addEventListener('touchmove', preventScroll);
|
1191
|
-
} else {
|
1192
|
-
body.addEventListener('touchmove', preventScroll);
|
1193
|
-
}
|
1194
|
-
|
1195
|
-
body.querySelector('.' + _class.content).addEventListener('touchmove', allowScroll);
|
1196
|
-
}
|
1197
|
-
|
1198
|
-
function enableScroll() {
|
1199
|
-
body.classList.remove(_class.bodyModalOpen);
|
1200
|
-
body.removeEventListener('touchmove', preventScroll);
|
1201
|
-
|
1202
|
-
if (body.querySelector('.Vlt-main')) {
|
1203
|
-
body.querySelector('.Vlt-main').removeEventListener('touchmove', preventScroll);
|
1204
|
-
} else {
|
1205
|
-
body.removeEventListener('touchmove', preventScroll);
|
1206
|
-
}
|
1207
|
-
|
1208
|
-
var modalContent = body.querySelector('.' + _class.content);
|
1209
|
-
if(modalContent) modalContent.removeEventListener('touchmove', allowScroll);
|
1210
|
-
}
|
1211
|
-
|
1212
|
-
function allowScroll(e) {
|
1213
|
-
e.stopPropagation();
|
1214
|
-
}
|
1215
|
-
|
1216
|
-
function preventScroll(e) {
|
1217
|
-
e.preventDefault();
|
1218
|
-
}
|
1219
|
-
|
1220
|
-
/**
|
1221
|
-
* @private
|
1222
|
-
*
|
1223
|
-
* @description Remove the modal after dismiss, makes sure to delete the modal properties so it can be garbage collected, and removes event listeners
|
1224
|
-
* @param {HTMLElement|string} elementOrId Reference to the modal element or the id
|
1225
|
-
*/
|
1226
|
-
function removeModal(modal) {
|
1227
|
-
delete modal.modal;
|
1228
|
-
|
1229
|
-
if(modal.dismissBtn) {
|
1230
|
-
modal.dismissBtn.removeEventListener('click', dismissModalHandler);
|
1231
|
-
}
|
1232
|
-
|
1233
|
-
if(modal.cancelBtn) {
|
1234
|
-
modal.cancelBtn.removeEventListener('click', cancelModalHandler);
|
1235
|
-
}
|
1236
|
-
|
1237
|
-
if(modal.confirmBtn) {
|
1238
|
-
modal.confirmBtn.removeEventListener('click', confirmModalHandler);
|
1239
|
-
}
|
1240
|
-
|
1241
|
-
if(clickHandler) {
|
1242
|
-
body.removeEventListener('click', clickHandler);
|
1243
|
-
}
|
1244
|
-
|
1245
|
-
if(escHandler) {
|
1246
|
-
body.removeEventListener('keyup', escHandler);
|
1247
|
-
escAttached = false;
|
1248
|
-
}
|
1249
|
-
}
|
1250
|
-
}();
|
1251
|
-
/**
|
1252
|
-
* Copyright (c) 2001-present, Vonage.
|
1253
|
-
*
|
1254
|
-
* Tabs (requires core)
|
1255
|
-
*/
|
1256
|
-
|
1257
|
-
'use strict';
|
1258
|
-
|
1259
|
-
Volta.tab = function () {
|
1260
|
-
var _class = {
|
1261
|
-
link: 'Vlt-tabs__link',
|
1262
|
-
linkJs: 'Vlt-js-tabs__link',
|
1263
|
-
linkActive: 'Vlt-tabs__link_active',
|
1264
|
-
linkDisabled: 'Vlt-tabs__link_disabled',
|
1265
|
-
linkJsActive: 'Vlt-js-tabs__link_active',
|
1266
|
-
panel: 'Vlt-tabs__panel',
|
1267
|
-
panelActive: 'Vlt-tabs__panel_active',
|
1268
|
-
panelJsActive: 'Vlt-js-tabs__panel_active',
|
1269
|
-
tabs: 'Vlt-tabs',
|
1270
|
-
}
|
1271
|
-
|
1272
|
-
function Tabs() { }
|
1273
|
-
|
1274
|
-
Tabs.prototype = {
|
1275
|
-
_keys: {
|
1276
|
-
left: 37,
|
1277
|
-
right: 39
|
1278
|
-
},
|
1279
|
-
|
1280
|
-
init: function (element, isWrapper) {
|
1281
|
-
var _this = this,
|
1282
|
-
tabsHeader,
|
1283
|
-
tabsContent;
|
1284
|
-
|
1285
|
-
if (isWrapper) {
|
1286
|
-
tabsHeader = element.children.item(0);
|
1287
|
-
tabsContent = element.children.item(1);
|
1288
|
-
} else {
|
1289
|
-
_this.isJs = true;
|
1290
|
-
tabsHeader = element;
|
1291
|
-
tabsContent = element.dataset.tabContent ?
|
1292
|
-
document.querySelector('#' + element.dataset.tabContent)
|
1293
|
-
: null;
|
1294
|
-
}
|
1295
|
-
|
1296
|
-
var linkClass = _this.isJs ? _class.linkJs : _class.link;
|
1297
|
-
_this._links = tabsHeader.querySelectorAll('.' + linkClass);
|
1298
|
-
_this._panels = tabsContent ? tabsContent.children : undefined;
|
1299
|
-
|
1300
|
-
this._deactivateElements();
|
1301
|
-
this._setActiveElements();
|
1302
|
-
|
1303
|
-
if (_this._panels && _this._panels.length === _this._links.length) {
|
1304
|
-
_this._links.forEach(function (link, index) {
|
1305
|
-
var link = link;
|
1306
|
-
|
1307
|
-
link.index = index;
|
1308
|
-
link.addEventListener('keyup', _this._keyUpEventListener.bind(_this));
|
1309
|
-
link.addEventListener('click', function () {
|
1310
|
-
_this.toggle(link);
|
1311
|
-
});
|
1312
|
-
});
|
1313
|
-
} else if (_this._panels && _this._panels.length > 0) {
|
1314
|
-
console.log('Volta: Tabs, number of links and panels do not match');
|
1315
|
-
}
|
1316
|
-
},
|
1317
|
-
toggle: function (linkElement) {
|
1318
|
-
var linkActiveClass = this.isJs ? _class.linkJsActive : _class.linkActive;
|
1319
|
-
var panelActiveClass = this.isJs ? _class.panelJsActive : _class.panelActive;
|
1320
|
-
|
1321
|
-
if (!Volta._hasClass(linkElement, _class.linkDisabled) && (!this._activeLink || this._activeLink !== linkElement)) {
|
1322
|
-
if (this._activeLink) {
|
1323
|
-
this._activeLink.classList.remove(linkActiveClass);
|
1324
|
-
this._activePanel.classList.remove(panelActiveClass);
|
1325
|
-
}
|
1326
|
-
|
1327
|
-
this._deactivateElements();
|
1328
|
-
this._setActiveElements(linkElement);
|
1329
|
-
|
1330
|
-
this._activeLink.classList.add(linkActiveClass);
|
1331
|
-
this._activePanel.classList.add(panelActiveClass);
|
1332
|
-
|
1333
|
-
if (Volta.tooltip) {
|
1334
|
-
Volta.tooltip.init();
|
1335
|
-
}
|
1336
|
-
}
|
1337
|
-
},
|
1338
|
-
_deactivateElements: function () {
|
1339
|
-
this._links.forEach(function (link) {
|
1340
|
-
link.setAttribute('tabIndex', '-1');
|
1341
|
-
link.setAttribute('aria-selected', 'false');
|
1342
|
-
});
|
1343
|
-
Array.from(this._panels).forEach(function (panel) {
|
1344
|
-
panel.setAttribute('hidden', 'hidden');
|
1345
|
-
});
|
1346
|
-
},
|
1347
|
-
_setActiveElements: function (linkElement) {
|
1348
|
-
var linkActiveClass = this.isJs ? _class.linkJsActive : _class.linkActive;
|
1349
|
-
|
1350
|
-
if (!linkElement) {
|
1351
|
-
this._activeLink = this._links.item(linkActiveClass);
|
1352
|
-
} else {
|
1353
|
-
this._activeLink = linkElement;
|
1354
|
-
}
|
1355
|
-
|
1356
|
-
var tabIndex;
|
1357
|
-
var currentNode = 0;
|
1358
|
-
|
1359
|
-
while (!tabIndex && currentNode < this._links.length) {
|
1360
|
-
if (this._links.item(currentNode) === this._activeLink) {
|
1361
|
-
tabIndex = currentNode;
|
1362
|
-
break;
|
1363
|
-
}
|
1364
|
-
currentNode++;
|
1365
|
-
}
|
1366
|
-
|
1367
|
-
if (this._panels) {
|
1368
|
-
this._activePanel = this._panels.item(tabIndex);
|
1369
|
-
}
|
1370
|
-
|
1371
|
-
this._activeLink.setAttribute('tabindex', '0');
|
1372
|
-
this._activeLink.setAttribute('aria-selected', 'true');
|
1373
|
-
this._activeLink.focus();
|
1374
|
-
if (this._activePanel) {
|
1375
|
-
this._activePanel.removeAttribute('hidden');
|
1376
|
-
}
|
1377
|
-
},
|
1378
|
-
_keyUpEventListener: function (event) {
|
1379
|
-
var key = event.keyCode;
|
1380
|
-
|
1381
|
-
switch (key) {
|
1382
|
-
case this._keys.left:
|
1383
|
-
case this._keys.right:
|
1384
|
-
this._switchTab(event);
|
1385
|
-
break;
|
1386
|
-
}
|
1387
|
-
},
|
1388
|
-
_switchTab: function (event) {
|
1389
|
-
var nextTab;
|
1390
|
-
|
1391
|
-
if (this._keys.left === event.keyCode) {
|
1392
|
-
nextTab = this._findNextTab(-1);
|
1393
|
-
} else if (this._keys.right === event.keyCode) {
|
1394
|
-
nextTab = this._findNextTab(1);
|
1395
|
-
}
|
1396
|
-
this.toggle(nextTab);
|
1397
|
-
},
|
1398
|
-
_findNextTab: function (direction) {
|
1399
|
-
var tab, nextTab;
|
1400
|
-
var currentIndex = this._activeLink.index;
|
1401
|
-
for (var i = currentIndex + direction; !nextTab && (this._calculateIndex(i) !== currentIndex); i += direction) {
|
1402
|
-
tab = this._links.item(this._calculateIndex(i));
|
1403
|
-
if (!Volta._hasClass(tab, _class.linkDisabled)) {
|
1404
|
-
nextTab = tab;
|
1405
|
-
}
|
1406
|
-
}
|
1407
|
-
return nextTab;
|
1408
|
-
},
|
1409
|
-
_calculateIndex: function (i) {
|
1410
|
-
var length = this._links.length;
|
1411
|
-
return ((i % length) + length) % length;
|
1412
|
-
}
|
1413
|
-
}
|
1414
|
-
|
1415
|
-
return {
|
1416
|
-
create: create,
|
1417
|
-
init: attachTabHandlers
|
1418
|
-
}
|
1419
|
-
|
1420
|
-
/**
|
1421
|
-
* @public
|
1422
|
-
*
|
1423
|
-
* @description Attach a listener to the tab header
|
1424
|
-
*/
|
1425
|
-
function attachTabHandlers() {
|
1426
|
-
//traditional tabs
|
1427
|
-
document.querySelectorAll('.' + _class.tabs).forEach(create);
|
1428
|
-
|
1429
|
-
document.querySelectorAll('[data-tab-content]').forEach(create);
|
1430
|
-
}
|
1431
|
-
|
1432
|
-
/**
|
1433
|
-
* @public
|
1434
|
-
*
|
1435
|
-
* @description Create a tabs component
|
1436
|
-
* @param {HTMLElement} element
|
1437
|
-
*/
|
1438
|
-
function create(element) {
|
1439
|
-
var tabs = Object.create(Tabs.prototype, {})
|
1440
|
-
|
1441
|
-
if (Volta._hasClass(element, _class.tabs)) {
|
1442
|
-
tabs.init(element, true);
|
1443
|
-
} else {
|
1444
|
-
tabs.init(element);
|
1445
|
-
}
|
1446
|
-
|
1447
|
-
return tabs;
|
1448
|
-
}
|
1449
|
-
}();
|
1450
|
-
|
1451
|
-
/**
|
1452
|
-
* Copyright (c) 2001-present, Vonage.
|
1453
|
-
*
|
1454
|
-
* tables (requires core)
|
1455
|
-
*/
|
1456
|
-
|
1457
|
-
'use strict';
|
1458
|
-
|
1459
|
-
Volta.table = function () {
|
1460
|
-
var _class = {
|
1461
|
-
table: 'Vlt-table',
|
1462
|
-
tall: 'Vlt-table--tall',
|
1463
|
-
short: 'Vlt-table--short',
|
1464
|
-
trigger: 'Vlt-table__density',
|
1465
|
-
buttonActive: 'Vlt-btn_active'
|
1466
|
-
}
|
1467
|
-
|
1468
|
-
return {
|
1469
|
-
init: attachTableDensityHandlers
|
1470
|
-
}
|
1471
|
-
|
1472
|
-
/**
|
1473
|
-
* @public
|
1474
|
-
*
|
1475
|
-
* @description Attach a listener to the table density triggers
|
1476
|
-
*/
|
1477
|
-
function attachTableDensityHandlers() {
|
1478
|
-
var triggers = document.querySelectorAll('.' + _class.trigger);
|
1479
|
-
|
1480
|
-
if(triggers.length > 0) {
|
1481
|
-
triggers.forEach(attachTriggerHandler);
|
1482
|
-
}
|
1483
|
-
|
1484
|
-
function attachTriggerHandler(trigger) {
|
1485
|
-
if(trigger.dataset.table) {
|
1486
|
-
var table = document.querySelector('#' + trigger.dataset.table);
|
1487
|
-
|
1488
|
-
if(!table) {
|
1489
|
-
console.warn('Volta: table ' + trigger.dataset.table + ' cannot be found');
|
1490
|
-
return;
|
1491
|
-
}
|
1492
|
-
|
1493
|
-
var activeButton = trigger.querySelector('.' + _class.buttonActive);
|
1494
|
-
|
1495
|
-
trigger.querySelectorAll('.Vlt-btn').forEach( function(button) {
|
1496
|
-
button.addEventListener('click', function() {
|
1497
|
-
if (this.dataset.density) {
|
1498
|
-
console.log('in')
|
1499
|
-
if (this.dataset.density == 'short') {
|
1500
|
-
table.classList.add(_class.short)
|
1501
|
-
table.classList.remove(_class.tall)
|
1502
|
-
} else if (this.dataset.density == 'tall') {
|
1503
|
-
table.classList.add(_class.tall)
|
1504
|
-
table.classList.remove(_class.short)
|
1505
|
-
} else {
|
1506
|
-
table.classList.remove(_class.tall)
|
1507
|
-
table.classList.remove(_class.short)
|
1508
|
-
}
|
1509
|
-
|
1510
|
-
// update classes on buttons
|
1511
|
-
if(activeButton) {
|
1512
|
-
activeButton.classList.remove(_class.buttonActive);
|
1513
|
-
}
|
1514
|
-
activeButton = this;
|
1515
|
-
this.classList.add(_class.buttonActive);
|
1516
|
-
}
|
1517
|
-
})
|
1518
|
-
});
|
1519
|
-
}
|
1520
|
-
}
|
1521
|
-
}
|
1522
|
-
|
1523
|
-
}();
|
1524
|
-
/**
|
1525
|
-
* Copyright (c) 2001-present, Vonage.
|
1526
|
-
*
|
1527
|
-
* Tooltips (requires popper.js, tooltip.js)
|
1528
|
-
*/
|
1529
|
-
'use strict';
|
1530
|
-
|
1531
|
-
Volta.tooltip = function () {
|
1532
|
-
var _class = {
|
1533
|
-
bottom: 'Vlt-tooltip--bottom',
|
1534
|
-
left: 'Vlt-tooltip--left',
|
1535
|
-
tooltip: 'Vlt-tooltip',
|
1536
|
-
top: 'Vlt-tooltip--top',
|
1537
|
-
right: 'Vlt-tooltip--right'
|
1538
|
-
}
|
1539
|
-
|
1540
|
-
var currentTooltip = undefined,
|
1541
|
-
currentTooltipContent = undefined;
|
1542
|
-
|
1543
|
-
return {
|
1544
|
-
create: create,
|
1545
|
-
init: attachTooltipHandlers
|
1546
|
-
}
|
1547
|
-
|
1548
|
-
/**
|
1549
|
-
* @public
|
1550
|
-
*
|
1551
|
-
* @description Create a Tooltip instance for every Vlt-tooltip
|
1552
|
-
*/
|
1553
|
-
function attachTooltipHandlers() {
|
1554
|
-
document.querySelectorAll('.' + _class.tooltip).forEach(create);
|
1555
|
-
}
|
1556
|
-
|
1557
|
-
/**
|
1558
|
-
* @public
|
1559
|
-
*
|
1560
|
-
* @description Create a Tooltip instance
|
1561
|
-
* @param {HTMLElement} tooltip
|
1562
|
-
* @return {object} a Tooltip element
|
1563
|
-
*/
|
1564
|
-
function create(tooltip) {
|
1565
|
-
var placement;
|
1566
|
-
|
1567
|
-
if (Volta._hasClass(tooltip, _class.bottom)) {
|
1568
|
-
placement = 'bottom';
|
1569
|
-
} else if (Volta._hasClass(tooltip, _class.top)) {
|
1570
|
-
placement = 'top';
|
1571
|
-
} else if (Volta._hasClass(tooltip, _class.left)) {
|
1572
|
-
placement = 'left';
|
1573
|
-
} else if (Volta._hasClass(tooltip, _class.right)) {
|
1574
|
-
placement = 'right';
|
1575
|
-
}
|
1576
|
-
|
1577
|
-
var template =
|
1578
|
-
'<div class="Vlt-tooltip--js" role="tooltip">' +
|
1579
|
-
'<div class="tooltip-arrow Vlt-tooltip__arrow"></div>' +
|
1580
|
-
'<div class="tooltip-inner Vlt-tooltip__content"></div>' +
|
1581
|
-
'</div>';
|
1582
|
-
|
1583
|
-
var title = tooltip.title;
|
1584
|
-
//remove the title so deafult title does not show
|
1585
|
-
tooltip.title = "";
|
1586
|
-
|
1587
|
-
return new Tooltip(tooltip, {
|
1588
|
-
html: true,
|
1589
|
-
template: template,
|
1590
|
-
title: title,
|
1591
|
-
placement: placement
|
1592
|
-
});
|
1593
|
-
}
|
1594
|
-
}();
|
1595
|
-
/**
|
1596
|
-
* Copyright (c) 2001-present, Vonage.
|
1597
|
-
*
|
1598
|
-
* Menu Collapse (requires core, menu)
|
1599
|
-
*/
|
1600
|
-
|
1601
|
-
'use strict';
|
1602
|
-
|
1603
|
-
Volta.menuCollapse = function () {
|
1604
|
-
var _class = {
|
1605
|
-
animate: 'Vlt-sidenav--animate',
|
1606
|
-
collapsed: 'Vlt-sidenav--collapsed',
|
1607
|
-
visible: 'Vlt-sidenav_visible'
|
1608
|
-
}
|
1609
|
-
|
1610
|
-
var _id = {
|
1611
|
-
collapse: '#Vlt-sidenav-collapse-trigger'
|
1612
|
-
}
|
1613
|
-
|
1614
|
-
var menuCollapseString = "menuCollapse";
|
1615
|
-
|
1616
|
-
return {
|
1617
|
-
attachCloseHandler: attachCloseHandler,
|
1618
|
-
init: initialise
|
1619
|
-
}
|
1620
|
-
|
1621
|
-
/**
|
1622
|
-
* @private
|
1623
|
-
*
|
1624
|
-
* @description Attach listener to trigger for collapsing the menu
|
1625
|
-
*/
|
1626
|
-
function attachMenuCollapseHandler() {
|
1627
|
-
var collapseTrigger = document.querySelector(_id.collapse);
|
1628
|
-
|
1629
|
-
if(collapseTrigger) {
|
1630
|
-
collapseTrigger.addEventListener('click', function(e) {
|
1631
|
-
e.preventDefault();
|
1632
|
-
e.stopPropagation();
|
1633
|
-
|
1634
|
-
var hasCollapsedClass = Volta._hasClass(Volta.menu._element, _class.collapsed);
|
1635
|
-
var isMobile = Volta._hasClass(Volta.menu._element, _class.visible);
|
1636
|
-
|
1637
|
-
Volta.menu._element.classList.add(_class.animate);
|
1638
|
-
|
1639
|
-
if (isMobile) {
|
1640
|
-
Volta.menu._element.classList.remove(_class.visible);
|
1641
|
-
} else if (hasCollapsedClass) {
|
1642
|
-
unCollapseMenu(Volta.menu._element);
|
1643
|
-
} else {
|
1644
|
-
collapseMenu(Volta.menu._element);
|
1645
|
-
}
|
1646
|
-
});
|
1647
|
-
}
|
1648
|
-
}
|
1649
|
-
|
1650
|
-
/**
|
1651
|
-
* @public
|
1652
|
-
*
|
1653
|
-
* @description Attach listener to trigger for closing the menu
|
1654
|
-
*/
|
1655
|
-
function attachCloseHandler(expandedMenus) {
|
1656
|
-
if(document.querySelector('.' + _class.collapsed) && expandedMenus) {
|
1657
|
-
document.querySelector('body').addEventListener('click', closeMenu, { once: true });
|
1658
|
-
}
|
1659
|
-
|
1660
|
-
function closeMenu(e) {
|
1661
|
-
if(!Volta._hasClass(e.target, Volta.menu._class.link)
|
1662
|
-
&& !Volta._hasClass(e.target.parentElement, Volta.menu._class.link)) {
|
1663
|
-
e.preventDefault();
|
1664
|
-
e.stopPropagation();
|
1665
|
-
|
1666
|
-
Volta.menu.closeAll();
|
1667
|
-
} else {
|
1668
|
-
document.querySelector('body').addEventListener('click', closeMenu, { once: true });
|
1669
|
-
}
|
1670
|
-
}
|
1671
|
-
}
|
1672
|
-
|
1673
|
-
/**
|
1674
|
-
* @private
|
1675
|
-
*
|
1676
|
-
* @description Collapse the expanded menu
|
1677
|
-
*/
|
1678
|
-
function collapseMenu() {
|
1679
|
-
Volta.menu.closeAll();
|
1680
|
-
Volta.menu.selectActiveTab();
|
1681
|
-
|
1682
|
-
Volta.menu._element.classList.add(_class.collapsed);
|
1683
|
-
|
1684
|
-
document.querySelectorAll(Volta.menu._class.trigger).forEach(function(menuItem){
|
1685
|
-
menuItem.nextElementSibling.style = "top: " + menuItem.positionTop;
|
1686
|
-
});
|
1687
|
-
|
1688
|
-
if(localStorage) {
|
1689
|
-
localStorage.setItem(menuCollapseString, true);
|
1690
|
-
}
|
1691
|
-
|
1692
|
-
var sideTabs = Volta.menu._element.querySelector('.' + Volta.menu._class.sideTabs);
|
1693
|
-
|
1694
|
-
if(sideTabs) {
|
1695
|
-
sideTabs.querySelectorAll('.' + Volta.menu._class.sideTabsTrigger).forEach(function(trigger){
|
1696
|
-
trigger.classList.remove(Volta.menu._class.sideTabsTrigger);
|
1697
|
-
trigger.classList.add(Volta.menu._class.trigger);
|
1698
|
-
trigger.addEventListener('click', Volta.menu.showCollapsed);
|
1699
|
-
});
|
1700
|
-
|
1701
|
-
sideTabs.querySelectorAll('.' + Volta.menu._class.sideTabsLink).forEach(function(link){
|
1702
|
-
link.classList.remove(Volta.menu._class.sideTabsLink);
|
1703
|
-
link.classList.add(Volta.menu._class.link);
|
1704
|
-
});
|
1705
|
-
}
|
1706
|
-
|
1707
|
-
Volta.menu.styleActiveTrigger();
|
1708
|
-
}
|
1709
|
-
|
1710
|
-
/**
|
1711
|
-
* @public
|
1712
|
-
*
|
1713
|
-
* @description Initailise the menu collapsing
|
1714
|
-
*/
|
1715
|
-
function initialise() {
|
1716
|
-
if(!Volta.menu || !Volta.menu._element) return;
|
1717
|
-
|
1718
|
-
attachMenuCollapseHandler();
|
1719
|
-
|
1720
|
-
var menuCollapsedFlag = localStorage ? localStorage.getItem(menuCollapseString) : false;
|
1721
|
-
|
1722
|
-
if(menuCollapsedFlag) {
|
1723
|
-
Volta.menu._element.querySelectorAll('.' + Volta.menu._class.triggerActive).forEach(function(trigger) {
|
1724
|
-
trigger.classList.remove(Volta.menu._class.triggerActive);
|
1725
|
-
});
|
1726
|
-
collapseMenu();
|
1727
|
-
} else {
|
1728
|
-
Volta.menu.expand();
|
1729
|
-
}
|
1730
|
-
}
|
1731
|
-
|
1732
|
-
/**
|
1733
|
-
* @public
|
1734
|
-
*
|
1735
|
-
* @description Expand the collapsed menu
|
1736
|
-
*/
|
1737
|
-
function unCollapseMenu() {
|
1738
|
-
Volta.menu._element.classList.remove(_class.collapsed);
|
1739
|
-
|
1740
|
-
if(localStorage) {
|
1741
|
-
localStorage.removeItem(menuCollapseString);
|
1742
|
-
}
|
1743
|
-
|
1744
|
-
var sideTabs = Volta.menu._element.querySelector('.' + Volta.menu._class.sideTabs);
|
1745
|
-
|
1746
|
-
if(sideTabs) {
|
1747
|
-
sideTabs.querySelectorAll('.' + Volta.menu._class.trigger).forEach(function(trigger){
|
1748
|
-
trigger.classList.add(Volta.menu._class.sideTabsTrigger);
|
1749
|
-
trigger.classList.remove(Volta.menu._class.trigger);
|
1750
|
-
trigger.removeEventListener('click', Volta.menu.showCollapsed);
|
1751
|
-
});
|
1752
|
-
|
1753
|
-
sideTabs.querySelectorAll('.' + Volta.menu._class.link).forEach(function(link){
|
1754
|
-
link.classList.add(Volta.menu._class.sideTabsLink);
|
1755
|
-
link.classList.remove(Volta.menu._class.link);
|
1756
|
-
});
|
1757
|
-
}
|
1758
|
-
|
1759
|
-
Volta.menu.expand(true);
|
1760
|
-
}
|
1761
|
-
}();
|
1762
|
-
/**
|
1763
|
-
* Copyright (c) 2001-present, Vonage.
|
1764
|
-
*
|
1765
|
-
* Menu (requires core)
|
1766
|
-
*/
|
1767
|
-
|
1768
|
-
'use strict';
|
1769
|
-
|
1770
|
-
Volta.menu = function () {
|
1771
|
-
var _class = {
|
1772
|
-
mobile: 'Vlt-sidenav__mobile',
|
1773
|
-
mobileOpen: 'Vlt-body--mobile-menu-open',
|
1774
|
-
mobileTrigger: 'Vlt-sidenav__mobile-trigger',
|
1775
|
-
link: 'Vlt-sidemenu__link',
|
1776
|
-
linkActive: 'Vlt-sidemenu__link_active',
|
1777
|
-
sideMenu: 'Vlt-sidemenu',
|
1778
|
-
sideTabs: 'Vlt-sidetabs',
|
1779
|
-
sideTabsLinkActive: 'Vlt-js-tabs__link_active',
|
1780
|
-
sideTabsPanel: 'Vlt-js-tabs__panel',
|
1781
|
-
sideTabsPanelActive: 'Vlt-js-tabs__panel_active',
|
1782
|
-
sideTabsLink: 'Vlt-sidetabs__link',
|
1783
|
-
sideTabsTrigger: 'Vlt-sidetabs__trigger',
|
1784
|
-
trigger: 'Vlt-sidemenu__trigger',
|
1785
|
-
triggerActive: 'Vlt-sidemenu__trigger_active',
|
1786
|
-
triggerCurrent: 'Vlt-sidemenu__trigger_current',
|
1787
|
-
triggerEnabled: '.Vlt-tabs__link:not(.Vlt-tabs__link_disabled)',
|
1788
|
-
visible: 'Vlt-sidenav_visible'
|
1789
|
-
}
|
1790
|
-
|
1791
|
-
var _id = {
|
1792
|
-
menu: '#Vlt-sidenav',
|
1793
|
-
mobileTrigger: '#Vlt-sidenav-mobile-trigger'
|
1794
|
-
}
|
1795
|
-
|
1796
|
-
var expandedMenus = [],
|
1797
|
-
mobileMenuTriggeredTwice;
|
1798
|
-
|
1799
|
-
return {
|
1800
|
-
_class: _class,
|
1801
|
-
_element: undefined,
|
1802
|
-
|
1803
|
-
closeAll: removeAllMenuItemsFromSelectedArr,
|
1804
|
-
init: initialise,
|
1805
|
-
expand: expandActiveMenu,
|
1806
|
-
showCollapsed: expandMenu,
|
1807
|
-
_triggerHandler: attachTriggerHandlers,
|
1808
|
-
selectActiveTab: selectActiveTab,
|
1809
|
-
styleActiveTrigger: styleActiveTrigger
|
1810
|
-
}
|
1811
|
-
|
1812
|
-
/**
|
1813
|
-
* @private
|
1814
|
-
*
|
1815
|
-
* @description Adds the parents of the active menu to the exoanded menus array
|
1816
|
-
* @param {HTMLElement} element The active menu
|
1817
|
-
*/
|
1818
|
-
function addExpandedParentMenuToArr(element){
|
1819
|
-
var nestedMenuUl = Volta._closest(element, 'ul', '.' + _class.sideMenu);
|
1820
|
-
var nestedMenuTrigger = nestedMenuUl.previousElementSibling;
|
1821
|
-
|
1822
|
-
if(nestedMenuTrigger && Volta._hasClass(nestedMenuTrigger, _class.trigger)) {
|
1823
|
-
if(!Volta._hasClass(nestedMenuTrigger, _class.triggerActive)) {
|
1824
|
-
nestedMenuTrigger.classList.add(_class.triggerActive);
|
1825
|
-
}
|
1826
|
-
|
1827
|
-
expandedMenus.push(nestedMenuTrigger);
|
1828
|
-
addExpandedParentMenuToArr(nestedMenuTrigger);
|
1829
|
-
}
|
1830
|
-
}
|
1831
|
-
|
1832
|
-
/**
|
1833
|
-
* @private
|
1834
|
-
*
|
1835
|
-
* @description Attach the listener for the mobile menu trigger
|
1836
|
-
*/
|
1837
|
-
function attachMobileTriggerHandler() {
|
1838
|
-
var mobileMenuTrigger = document.querySelector(_id.mobileTrigger);
|
1839
|
-
|
1840
|
-
if(mobileMenuTrigger) {
|
1841
|
-
mobileMenuTrigger.addEventListener('click', function(e){
|
1842
|
-
if(mobileMenuTriggeredTwice) {
|
1843
|
-
mobileMenuTriggeredTwice = false;
|
1844
|
-
e.stopPropagation();
|
1845
|
-
return;
|
1846
|
-
}
|
1847
|
-
if(!Volta._hasClass(Volta.menu._element, _class.visible)) {
|
1848
|
-
Volta.menu._element.classList.add(_class.visible);
|
1849
|
-
document.body.classList.add(_class.mobileOpen);
|
1850
|
-
|
1851
|
-
//stop propagation otherwise will immediately call handler
|
1852
|
-
e.stopPropagation();
|
1853
|
-
addMobileMenuCollapseListeners();
|
1854
|
-
}
|
1855
|
-
});
|
1856
|
-
}
|
1857
|
-
}
|
1858
|
-
|
1859
|
-
/**
|
1860
|
-
* @private
|
1861
|
-
*
|
1862
|
-
* @description Attach the listeners for closing the expanded mobile menu
|
1863
|
-
*/
|
1864
|
-
function addMobileMenuCollapseListeners() {
|
1865
|
-
document.querySelector('body').addEventListener('click', closeMenu, { once: true });
|
1866
|
-
document.querySelector('body').addEventListener('touchstart', closeMenu, { once: true });
|
1867
|
-
}
|
1868
|
-
|
1869
|
-
/**
|
1870
|
-
* @public
|
1871
|
-
*
|
1872
|
-
* @description Attach the listeners to the trigger elements of the menu
|
1873
|
-
*/
|
1874
|
-
function attachTriggerHandlers() {
|
1875
|
-
attachMobileTriggerHandler();
|
1876
|
-
Volta.menu._element.querySelectorAll('.' + _class.trigger).forEach(attachHandler);
|
1877
|
-
|
1878
|
-
function attachHandler(triggerElem) {
|
1879
|
-
triggerElem.addEventListener('click', expandMenu);
|
1880
|
-
}
|
1881
|
-
}
|
1882
|
-
|
1883
|
-
/**
|
1884
|
-
* @private
|
1885
|
-
*
|
1886
|
-
* @description Checks if the passed in menu is nested
|
1887
|
-
* @param {HTMLElement} menuItem
|
1888
|
-
* @return {boolean} If the menu item is nested returns true, otherwise false
|
1889
|
-
*/
|
1890
|
-
function checkMenuItemIsNested(menuItem) {
|
1891
|
-
return isNestedDescendant(menuItem);
|
1892
|
-
}
|
1893
|
-
|
1894
|
-
/**
|
1895
|
-
* @private
|
1896
|
-
*
|
1897
|
-
* @description Recursive function to check if the passed in menu is nested
|
1898
|
-
* @param {HTMLElement} menuItem
|
1899
|
-
* @param {Boolean} isAncestor
|
1900
|
-
* @return {boolean} If the menu item is nested returns true, otherwise false
|
1901
|
-
*/
|
1902
|
-
function isNestedDescendant(menuItem, isAncestor) {
|
1903
|
-
var isNested = false;
|
1904
|
-
var ancestor = isAncestor ? menuItem.parentElement : menuItem.parentElement.parentElement;
|
1905
|
-
var ancestorSibling = ancestor.previousElementSibling;
|
1906
|
-
|
1907
|
-
if(ancestorSibling) {
|
1908
|
-
isNested = Volta._hasClass(ancestorSibling, _class.trigger);
|
1909
|
-
}
|
1910
|
-
|
1911
|
-
if(ancestorSibling && !isNested) {
|
1912
|
-
return isNestedDescendant(ancestor, true);
|
1913
|
-
}
|
1914
|
-
|
1915
|
-
return isNested;
|
1916
|
-
}
|
1917
|
-
|
1918
|
-
/**
|
1919
|
-
* @private
|
1920
|
-
*
|
1921
|
-
* @description Attach the listeners to the trigger elements of the menu
|
1922
|
-
* @param {HTMLElement} menuItem
|
1923
|
-
* @return {boolean} If the menu item is nested returns true, otherwise false
|
1924
|
-
*/
|
1925
|
-
function closeMenu(e) {
|
1926
|
-
if(!Volta._hasClass(e.target, _class.sideMenu) && !Volta._closest(e.target, '.' + _class.sideMenu) &&
|
1927
|
-
!Volta._hasClass(e.target, _class.sideTabs) && !Volta._closest(e.target, '.' + _class.sideTabs)) {
|
1928
|
-
Volta.menu._element.classList.remove(_class.visible);
|
1929
|
-
|
1930
|
-
document.body.classList.remove(_class.mobileOpen);
|
1931
|
-
|
1932
|
-
var isMobileMenu = Volta._closest(e.target, '.' + _class.mobile);
|
1933
|
-
if(Volta._hasClass(e.target, _class.mobileTrigger) || isMobileMenu) {
|
1934
|
-
mobileMenuTriggeredTwice = true;
|
1935
|
-
}
|
1936
|
-
} else {
|
1937
|
-
addMobileMenuCollapseListeners();
|
1938
|
-
}
|
1939
|
-
}
|
1940
|
-
|
1941
|
-
/**
|
1942
|
-
* @private
|
1943
|
-
*
|
1944
|
-
* @description Expand the nested menu
|
1945
|
-
* @param {event} e
|
1946
|
-
*/
|
1947
|
-
function expandMenu(e) {
|
1948
|
-
e.preventDefault();
|
1949
|
-
e.stopPropagation();
|
1950
|
-
|
1951
|
-
var _this = this;
|
1952
|
-
|
1953
|
-
var isNestedMenu = checkMenuItemIsNested(_this);
|
1954
|
-
|
1955
|
-
if (expandedMenus.indexOf(_this) >= 0 && isNestedMenu) {
|
1956
|
-
removeMenuFromSelectedArr(_this);
|
1957
|
-
} else if(expandedMenus.indexOf(_this) >= 0) {
|
1958
|
-
removeAllMenuItemsFromSelectedArr();
|
1959
|
-
} else {
|
1960
|
-
if(!isNestedMenu) {
|
1961
|
-
removeAllMenuItemsFromSelectedArr();
|
1962
|
-
} else {
|
1963
|
-
removeSiblingFromSelectedArr(_this);
|
1964
|
-
}
|
1965
|
-
expandedMenus.push(_this);
|
1966
|
-
_this.classList.add(_class.triggerActive);
|
1967
|
-
}
|
1968
|
-
|
1969
|
-
if(Volta.menuCollapse) {
|
1970
|
-
Volta.menuCollapse.attachCloseHandler(expandedMenus);
|
1971
|
-
}
|
1972
|
-
}
|
1973
|
-
|
1974
|
-
/**
|
1975
|
-
* @public
|
1976
|
-
*
|
1977
|
-
* @description Expand the active menu - typically used on page load
|
1978
|
-
* @param {boolean} isUserForced Whether the action has been trigger by the user
|
1979
|
-
*/
|
1980
|
-
function expandActiveMenu(isUserForced) {
|
1981
|
-
var activeMenuItem = Volta.menu._element.querySelector('.' + _class.linkActive);
|
1982
|
-
|
1983
|
-
selectActiveTab(activeMenuItem);
|
1984
|
-
|
1985
|
-
if(activeMenuItem) {
|
1986
|
-
var activeTriggerUl = Volta._closest(activeMenuItem, 'ul', '.' + _class.sideMenu);
|
1987
|
-
var activeTrigger = activeTriggerUl ? activeTriggerUl.previousElementSibling : null;
|
1988
|
-
if(activeTrigger) {
|
1989
|
-
var isNestedMenu = checkMenuItemIsNested(activeTrigger);
|
1990
|
-
if(isNestedMenu) {
|
1991
|
-
addExpandedParentMenuToArr(activeTrigger);
|
1992
|
-
}
|
1993
|
-
|
1994
|
-
if(!Volta._hasClass(activeTrigger, _class.triggerActive)) {
|
1995
|
-
activeTrigger.classList.add(_class.triggerActive);
|
1996
|
-
//console.log("HEY!!!");
|
1997
|
-
}
|
1998
|
-
|
1999
|
-
expandedMenus.push(activeTrigger);
|
2000
|
-
}
|
2001
|
-
styleActiveTrigger(activeMenuItem);
|
2002
|
-
}
|
2003
|
-
}
|
2004
|
-
|
2005
|
-
/**
|
2006
|
-
* @public
|
2007
|
-
*
|
2008
|
-
* @description Initialise the menu
|
2009
|
-
* @param {boolean} menuCollapse Whether the collapse module has been included
|
2010
|
-
*/
|
2011
|
-
function initialise(menuCollapse) {
|
2012
|
-
expandedMenus = [];
|
2013
|
-
Volta.menu._element = document.querySelector(_id.menu);
|
2014
|
-
|
2015
|
-
if(Volta.menu._element) {
|
2016
|
-
if(!Volta.menuCollapse) {
|
2017
|
-
expandActiveMenu();
|
2018
|
-
} else if(menuCollapse) {
|
2019
|
-
Volta.menuCollapse.init();
|
2020
|
-
}
|
2021
|
-
|
2022
|
-
attachTriggerHandlers();
|
2023
|
-
}
|
2024
|
-
}
|
2025
|
-
|
2026
|
-
/**
|
2027
|
-
* @public
|
2028
|
-
*
|
2029
|
-
* @description Clear the selected menus array, and close all of the nested menus
|
2030
|
-
*/
|
2031
|
-
function removeAllMenuItemsFromSelectedArr(){
|
2032
|
-
expandedMenus.forEach(function(menuItem){
|
2033
|
-
menuItem.classList.remove(_class.triggerActive);
|
2034
|
-
});
|
2035
|
-
expandedMenus = [];
|
2036
|
-
}
|
2037
|
-
|
2038
|
-
/**
|
2039
|
-
* @private
|
2040
|
-
*
|
2041
|
-
* @description Remove a specific menu item from the selected array and close
|
2042
|
-
*/
|
2043
|
-
function removeMenuFromSelectedArr(menuItem) {
|
2044
|
-
var menuIndex = expandedMenus.indexOf(menuItem);
|
2045
|
-
menuItem.classList.remove(_class.triggerActive);
|
2046
|
-
expandedMenus.splice(menuIndex, 1);
|
2047
|
-
}
|
2048
|
-
|
2049
|
-
/**
|
2050
|
-
* @private
|
2051
|
-
*
|
2052
|
-
* @description Remove sibling menu item from the selected array and close
|
2053
|
-
*/
|
2054
|
-
function removeSiblingFromSelectedArr(menuItem) {
|
2055
|
-
var ancestors = menuItem.parentElement.parentElement.children;
|
2056
|
-
var openSibling;
|
2057
|
-
var count = ancestors.length - 1;
|
2058
|
-
|
2059
|
-
while(openSibling === undefined && count >= 0) {
|
2060
|
-
var siblingIndex = expandedMenus.indexOf(ancestors[count].children[0]);
|
2061
|
-
if(siblingIndex >= 0) {
|
2062
|
-
openSibling = expandedMenus[siblingIndex];
|
2063
|
-
}
|
2064
|
-
count--;
|
2065
|
-
}
|
2066
|
-
|
2067
|
-
if(openSibling) {
|
2068
|
-
removeMenuFromSelectedArr(openSibling);
|
2069
|
-
}
|
2070
|
-
}
|
2071
|
-
|
2072
|
-
/**
|
2073
|
-
* @public
|
2074
|
-
*
|
2075
|
-
* @description Select the active side tab
|
2076
|
-
* @param {activeMenuItem} Element(optional) The active menu item
|
2077
|
-
*/
|
2078
|
-
function selectActiveTab(activeMenuItem) {
|
2079
|
-
activeMenuItem = activeMenuItem || Volta.menu._element.querySelector('.' + _class.linkActive);
|
2080
|
-
var navTabs = document.querySelector(_id.menu + ' .' + _class.sideTabs);
|
2081
|
-
|
2082
|
-
if(!navTabs || !activeMenuItem) {
|
2083
|
-
return null;
|
2084
|
-
}
|
2085
|
-
|
2086
|
-
var sideMenus = Volta.menu._element.querySelectorAll('.' + _class.sideMenu);
|
2087
|
-
var menuTab = Volta._closest(activeMenuItem, '.' + _class.sideTabsPanel, '.' + _class.sideMenu);
|
2088
|
-
|
2089
|
-
var tabIndex;
|
2090
|
-
var currentNode = 0;
|
2091
|
-
|
2092
|
-
while(!tabIndex && currentNode < sideMenus.length) {
|
2093
|
-
if(sideMenus.item(currentNode) === menuTab) {
|
2094
|
-
tabIndex = currentNode;
|
2095
|
-
break;
|
2096
|
-
}
|
2097
|
-
currentNode++;
|
2098
|
-
}
|
2099
|
-
var sideTabs = Volta.menu._element.querySelectorAll('.' + _class.sideTabsLink);
|
2100
|
-
sideTabs[tabIndex].click();
|
2101
|
-
}
|
2102
|
-
|
2103
|
-
/**
|
2104
|
-
* @public
|
2105
|
-
*
|
2106
|
-
* @description Adds a class to the top level active trigger
|
2107
|
-
* @param {activeMenuItem} Element(optional) The active menu item
|
2108
|
-
*/
|
2109
|
-
function styleActiveTrigger(activeMenuItem) {
|
2110
|
-
activeMenuItem = activeMenuItem || Volta.menu._element.querySelector('.' + _class.linkActive);
|
2111
|
-
|
2112
|
-
if(activeMenuItem) {
|
2113
|
-
var topLevelTrigger = getTopLevelTrigger(activeMenuItem);
|
2114
|
-
|
2115
|
-
if(topLevelTrigger) {
|
2116
|
-
topLevelTrigger.classList.add(_class.triggerCurrent);
|
2117
|
-
}
|
2118
|
-
}
|
2119
|
-
|
2120
|
-
function getTopLevelTrigger(activeMenuItem) {
|
2121
|
-
var element = activeMenuItem;
|
2122
|
-
var trigger = null;
|
2123
|
-
|
2124
|
-
while (element) {
|
2125
|
-
if(element.matches('ul') && Volta._hasClass(element, _class.sideMenu)) {
|
2126
|
-
break;
|
2127
|
-
}
|
2128
|
-
|
2129
|
-
if (element.matches('ul')) {
|
2130
|
-
trigger = element;
|
2131
|
-
}
|
2132
|
-
|
2133
|
-
element = element.parentElement;
|
2134
|
-
}
|
2135
|
-
|
2136
|
-
return trigger ? trigger.previousElementSibling : null;
|
2137
|
-
}
|
2138
|
-
}
|
2139
|
-
}();
|
2140
|
-
|
2141
|
-
export default Volta;
|