@iamproperty/components 3.4.4 → 3.4.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/README.md +30 -66
  2. package/assets/css/components/accordion.css +1 -0
  3. package/assets/css/components/accordion.css.map +1 -0
  4. package/assets/css/components/alert.css +1 -0
  5. package/assets/css/components/alert.css.map +1 -0
  6. package/assets/css/components/buttons.css +1 -0
  7. package/assets/css/components/buttons.css.map +1 -0
  8. package/assets/css/components/card.css +1 -0
  9. package/assets/css/components/card.css.map +1 -0
  10. package/assets/css/components/cardDeck.css +1 -0
  11. package/assets/css/components/cardDeck.css.map +1 -0
  12. package/assets/css/components/carousel.css +1 -0
  13. package/assets/css/components/carousel.css.map +1 -0
  14. package/assets/css/components/charts.css +1 -0
  15. package/assets/css/components/charts.css.map +1 -0
  16. package/assets/css/components/container.css +1 -0
  17. package/assets/css/components/container.css.map +1 -0
  18. package/assets/css/components/forms.css +1 -0
  19. package/assets/css/components/forms.css.map +1 -0
  20. package/assets/css/components/header.css +1 -0
  21. package/assets/css/components/header.css.map +1 -0
  22. package/assets/css/components/links.css +1 -0
  23. package/assets/css/components/links.css.map +1 -0
  24. package/assets/css/components/lists.css +1 -0
  25. package/assets/css/components/lists.css.map +1 -0
  26. package/assets/css/components/modal.css +1 -0
  27. package/assets/css/components/modal.css.map +1 -0
  28. package/assets/css/components/nav.css +1 -0
  29. package/assets/css/components/nav.css.map +1 -0
  30. package/assets/css/components/panel.css +1 -0
  31. package/assets/css/components/panel.css.map +1 -0
  32. package/assets/css/components/property-searchbar.css +1 -0
  33. package/assets/css/components/property-searchbar.css.map +1 -0
  34. package/assets/css/components/snapshot.css +1 -0
  35. package/assets/css/components/snapshot.css.map +1 -0
  36. package/assets/css/components/stepper.css +1 -0
  37. package/assets/css/components/stepper.css.map +1 -0
  38. package/assets/css/components/tables.css +1 -0
  39. package/assets/css/components/tables.css.map +1 -0
  40. package/assets/css/components/tabs.css +1 -0
  41. package/assets/css/components/tabs.css.map +1 -0
  42. package/assets/css/components/testimonial.css +1 -0
  43. package/assets/css/components/testimonial.css.map +1 -0
  44. package/assets/css/components/timeline.css +1 -0
  45. package/assets/css/components/timeline.css.map +1 -0
  46. package/assets/css/components/tooltips.css +1 -0
  47. package/assets/css/components/tooltips.css.map +1 -0
  48. package/assets/css/core.min.css +1 -1
  49. package/assets/css/core.min.css.map +1 -1
  50. package/assets/css/style.min.css +1 -1
  51. package/assets/css/style.min.css.map +1 -1
  52. package/assets/fonts/qanelas-bold-webfont.woff +0 -0
  53. package/assets/fonts/qanelas-bold-webfont.woff2 +0 -0
  54. package/assets/js/bundle.js +61 -0
  55. package/assets/js/components/accordion/accordion.component.js +27 -0
  56. package/assets/js/components/accordion/accordion.component.min.js +14 -0
  57. package/assets/js/components/accordion/accordion.component.min.js.map +1 -0
  58. package/assets/js/components/header/header.component.js +45 -0
  59. package/assets/js/components/header/header.component.min.js +30 -0
  60. package/assets/js/components/header/header.component.min.js.map +1 -0
  61. package/assets/js/components/tabs/tabs.component.js +28 -0
  62. package/assets/js/dynamic.js +85 -0
  63. package/assets/js/dynamic.min.js +56 -0
  64. package/assets/js/dynamic.min.js.map +1 -0
  65. package/assets/js/{main.js → flat-components.js} +15 -11
  66. package/assets/js/modules/accordion.js +11 -14
  67. package/assets/js/modules/helpers.js +9 -4
  68. package/assets/js/modules/tabs.js +91 -0
  69. package/assets/js/scripts.bundle.js +92 -980
  70. package/assets/js/scripts.bundle.js.map +1 -1
  71. package/assets/js/scripts.bundle.min.js +3 -4
  72. package/assets/js/scripts.bundle.min.js.map +1 -1
  73. package/assets/sass/_fonts.scss +4 -4
  74. package/assets/sass/_func.scss +1 -0
  75. package/assets/sass/_functions/functions.scss +6 -0
  76. package/assets/sass/_functions/mixins.scss +9 -9
  77. package/assets/sass/_functions/variables.scss +96 -68
  78. package/assets/sass/_tests/mixins.spec.scss +1 -1
  79. package/assets/sass/_tests/typography.spec.scss +2 -2
  80. package/assets/sass/components/accordion.scss +9 -6
  81. package/assets/sass/components/card.scss +7 -0
  82. package/assets/sass/components/container.scss +6 -6
  83. package/assets/sass/components/forms.scss +2 -0
  84. package/assets/sass/components/header.scss +34 -11
  85. package/assets/sass/components/links.scss +3 -2
  86. package/assets/sass/components/panel.scss +3 -4
  87. package/assets/sass/components/snapshot.scss +1 -1
  88. package/assets/sass/components/tabs.scss +52 -36
  89. package/assets/sass/components/timeline.scss +2 -2
  90. package/assets/sass/foundations/reboot.scss +2 -2
  91. package/assets/sass/foundations/root.scss +12 -5
  92. package/assets/sass/foundations/type.scss +90 -66
  93. package/assets/ts/README.md +12 -0
  94. package/assets/ts/bundle.ts +76 -0
  95. package/assets/ts/components/accordion/README.md +17 -0
  96. package/assets/ts/components/accordion/accordion.component.ts +36 -0
  97. package/assets/ts/components/header/README.md +26 -0
  98. package/assets/ts/components/header/header.component.ts +53 -0
  99. package/assets/ts/components/tabs/README.md +18 -0
  100. package/assets/ts/components/tabs/tabs.component.ts +34 -0
  101. package/assets/ts/dynamic.ts +105 -0
  102. package/assets/ts/{main.ts → flat-components.ts} +15 -11
  103. package/assets/ts/html.d.ts +4 -0
  104. package/assets/ts/modules/accordion.ts +15 -21
  105. package/assets/ts/modules/helpers.ts +12 -4
  106. package/assets/ts/modules/tabs.ts +129 -0
  107. package/dist/components.es.js +845 -873
  108. package/dist/components.umd.js +63 -19
  109. package/dist/style.css +1 -1
  110. package/package.json +19 -10
  111. package/src/components/Accordion/Accordion.spec.js +1 -1
  112. package/src/components/Accordion/Accordion.vue +7 -5
  113. package/src/components/Accordion/AccordionItem.vue +3 -6
  114. package/src/components/Accordion/README.md +0 -2
  115. package/src/components/Header/Header.spec.js +5 -4
  116. package/src/components/Header/Header.vue +14 -20
  117. package/src/components/Snapshot/Snapshot.vue +1 -1
  118. package/src/components/Tabs/README.md +0 -2
  119. package/src/components/Tabs/Tab.vue +3 -2
  120. package/src/components/Tabs/Tabs.vue +8 -64
  121. package/src/index.js +0 -1
  122. package/assets/fonts/qanelassoft-extrabold-webfont.woff +0 -0
  123. package/assets/fonts/qanelassoft-extrabold-webfont.woff2 +0 -0
  124. package/assets/sass/components/drawer.scss +0 -47
  125. package/src/components/Drawer/Drawer.vue +0 -53
  126. package/src/components/Drawer/README.md +0 -23
@@ -1,988 +1,100 @@
1
1
  /*!
2
- * Bootstrap [object Object] v3.4.4
3
- * Copyright 2011-2023 [object Object]
4
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5
- */
6
- (function (factory) {
7
- typeof define === 'function' && define.amd ? define(factory) :
8
- factory();
9
- })((function () { 'use strict';
10
-
11
- // @ts-nocheck
12
- /**
13
- * Global helper functions to help maintain and enhance framework elements.
14
- * @module Helpers
15
- */
16
- /**
17
- * Add global classes used by the CSS and later JavaScript.
18
- * @param {HTMLElement} body Dom element, this doesn't have to be the body but it is recommended.
19
- */
20
- var addBodyClasses = body => {
21
- body.classList.add("js-enabled");
22
- if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) {
23
- body.classList.add("ie");
24
- }
25
- return null;
26
- };
27
- /**
28
- * Add global events.
29
- * @param {HTMLElement} body Dom element, this doesn't have to be the body but it is recommended.
30
- */
31
- var addGlobalEvents = body => {
32
- window.addEventListener('hashchange', function () {
33
- var hash = location.hash.replace('#', '');
34
- var label = document.querySelector("label[for=\"".concat(hash, "\"]"));
35
- var detail = document.querySelector("details[id=\"".concat(hash, "\"]:not([open])"));
36
- if (label) label.click();else if (detail) detail.setAttribute('open', 'open');
37
- }, false);
38
- return null;
39
- };
40
- /**
41
- * Check if an element contains certain elements that needs enhancing with the JavaScript helpers, it is recommended to do this on the page body after the dom is loaded. Elements that are loaded via ajax should also run this function.
42
- * @param {HTMLElement} element Dom element, this doesn't have to be the body but it is recommended.
43
- */
44
- var checkElements = element => {
45
- // Tables
46
- Array.from(element.querySelectorAll('table')).forEach((table, index) => {
47
- tableStacked(table);
48
- tableWrap(table);
49
- });
50
- };
51
- /**
52
- * Wrap tables with a table wrapper div to help maintain its responsive design.
53
- * @param {HTMLElement} table Dom table element
54
- */
55
- var tableWrap = table => {
56
- if (!table.parentNode.classList.contains('table__wrapper')) {
57
- var tableHTML = table.outerHTML;
58
- table.outerHTML = "<div class=\"table__wrapper\">".concat(tableHTML, "</div>");
59
- }
60
- };
61
- /**
62
- * Creates data attributes to be used by the CSS for mobile views.
63
- * @param {HTMLElement} table Dom table element
64
- */
65
- var tableStacked = table => {
66
- var colHeadings = Array.from(table.querySelectorAll('thead th'));
67
- var colRows = Array.from(table.querySelectorAll('tbody tr'));
68
- colRows.forEach((row, index) => {
69
- var cells = Array.from(row.querySelectorAll('th, td'));
70
- cells.forEach((cell, cellIndex) => {
71
- var heading = colHeadings[cellIndex];
72
- if (typeof heading != "undefined") {
73
- var tempDiv = document.createElement("div");
74
- tempDiv.innerHTML = heading.innerHTML;
75
- var headingText = tempDiv.textContent || tempDiv.innerText || "";
76
- cell.setAttribute('data-label', headingText);
77
- }
78
- });
79
- });
80
- };
81
- var isNumeric = function isNumeric(str) {
82
- if (typeof str != "string") return false; // we only process strings!
83
- return !isNaN(str) &&
84
- // use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)...
85
- !isNaN(parseFloat(str)); // ...and ensure strings of whitespace fail
86
- };
87
-
88
- var zeroPad = (num, places) => String(num).padStart(places, '0');
89
-
90
- // @ts-nocheck
91
- var navbar = element => {
92
- Array.from(element.querySelectorAll('details')).forEach((detail, index) => {
93
- detail.addEventListener('mouseenter', function (e) {
94
- if (window.matchMedia('(min-width: 62em)').matches) detail.setAttribute('open', 'true');
95
- }, false);
96
- detail.addEventListener('mouseleave', function (e) {
97
- if (window.matchMedia('(min-width: 62em)').matches) detail.removeAttribute('open');
98
- }, false);
99
- });
100
- if ('IntersectionObserver' in window) {
101
- var observer = new IntersectionObserver(_ref => {
102
- var [e] = _ref;
103
- return e.target.classList.toggle("is-stuck", e.intersectionRatio < 1);
104
- }, {
105
- threshold: [1]
106
- });
107
- observer.observe(element);
108
- }
109
- };
110
-
111
- // @ts-nocheck
112
- function table(tableElement) {
113
- if (typeof tableElement != "object") return false;
114
- var thead = tableElement.querySelector('thead');
115
- var tbody = tableElement.querySelector('tbody');
116
- var storedData = tbody.cloneNode(true);
117
- var sortedEvent = new Event('sorted');
118
- var filteredEvent = new Event('filtered');
119
- var reorderedEvent = new Event('reordered');
120
- var randID = 'table_' + Math.random().toString(36).substr(2, 9); // Random to make sure IDs created are unique
121
- var draggedRow;
122
- tableElement.setAttribute('id', randID);
123
- // #region Sortable
124
- var sortTable = function sortTable(sortBy, sort) {
125
- // Create an array from the table rows, the index created is then used to sort the array
126
- var tableArr = [];
127
- Array.from(tbody.querySelectorAll('tr')).forEach((tableRow, index) => {
128
- var rowIndex = tableRow.querySelector('td[data-label="' + sortBy + '"], th[data-label="' + sortBy + '"]').textContent;
129
- if (isNumeric(rowIndex)) rowIndex = zeroPad(rowIndex, 10);
130
- var dataRow = {
131
- index: rowIndex,
132
- row: tableRow
133
- };
134
- tableArr.push(dataRow);
135
- });
136
- // Sort array
137
- tableArr.sort((a, b) => a.index > b.index ? 1 : -1);
138
- // Reverse if descending
139
- if (sort == "descending") tableArr = tableArr.reverse();
140
- // Create a string to return and populate the tbody
141
- var strTbody = '';
142
- tableArr.forEach((tableRow, index) => {
143
- strTbody += tableRow.row.outerHTML;
144
- });
145
- tbody.innerHTML = strTbody;
146
- // Dispatch the sortable event
147
- tableElement.dispatchEvent(sortedEvent);
148
- };
149
- // Declare event handlers
150
- tableElement.addEventListener('click', function (e) {
151
- for (var target = e.target; target && target != this; target = target.parentNode) {
152
- if (target.matches('[data-sortable]')) {
153
- // Get current sort order
154
- var sort = target.getAttribute('aria-sort') == "ascending" ? "descending" : "ascending";
155
- // unset sort attributes
156
- Array.from(tableElement.querySelectorAll('[data-sortable]')).forEach((col, index) => {
157
- col.setAttribute('aria-sort', 'none');
158
- });
159
- // Set the sort order attribute
160
- target.setAttribute('aria-sort', sort);
161
- // Save the sort options on the table element so that it can be re-sorted later
162
- tableElement.setAttribute('data-sort', sort);
163
- tableElement.setAttribute('data-sortBy', target.textContent);
164
- // Sort the table
165
- sortTable(target.textContent, sort);
166
- Array.from(tableElement.querySelectorAll('tr[draggable]')).forEach((tableRow, index) => {
167
- tableRow.removeAttribute('draggable');
168
- });
169
- break;
170
- }
171
- }
172
- }, false);
173
- // On page load check if the table should be pre-sorted, if so trigger a click
174
- if (tableElement.getAttribute('data-sortBy')) {
175
- var sort = tableElement.getAttribute('data-sort') == "ascending" ? "descending" : "ascending";
176
- Array.from(tableElement.querySelectorAll('[data-sortable]')).forEach((col, index) => {
177
- if (col.textContent == tableElement.getAttribute('data-sortBy')) {
178
- col.setAttribute('aria-sort', sort);
179
- col.click();
180
- }
181
- });
182
- }
183
- // #endregion Sortable
184
- // #region Filters
185
- var createFilterForm = function createFilterForm(count) {
186
- // Create wrapper div
187
- var form = document.createElement("div");
188
- form.classList.add('table__filters');
189
- form.classList.add('row');
190
- form.classList.add('pt-1');
191
- form.classList.add('pb-3');
192
- // Create the filter options array
193
- var filterColumns = Array.from(tableElement.querySelectorAll('th[data-filterable]'));
194
- // Populate a list of searchable terms from the cells of the columns that could be used as a filter
195
- var searchableTerms = {};
196
- filterColumns.forEach((columnHeading, index) => {
197
- Array.from(tableElement.querySelectorAll('td[data-label="' + columnHeading.textContent + '"]')).forEach((label, index) => {
198
- searchableTerms[label.textContent] = label.textContent;
199
- });
200
- });
201
- // Create the form
202
- var filterTitle = filterColumns.length == 1 ? "Filter by " + filterColumns[0].textContent : "Filter"; // Update title if only one filter is chosen
203
- var checkboxClass = filterColumns.length == 1 ? "d-none" : "d-sm-flex"; // Hide controls when only one filter is chosen
204
- form.innerHTML = "<div class=\"col-sm-6 col-md-4 pb-3\">\n <div class=\"form-control__wrapper form-control-inline mb-0\">\n <label for=\"".concat(randID, "_filter\" class=\"form-label\">").concat(filterTitle, ":</label>\n <input type=\"search\" name=\"").concat(randID, "_filter\" id=\"").concat(randID, "_filter\" class=\"form-control form-control-sm\" placeholder=\"\" list=\"").concat(randID, "_list\" />\n </div>\n <datalist id=\"").concat(randID, "_list\">\n ").concat(Object.keys(searchableTerms).map(term => "<option value=\"".concat(term, "\"></option>")).join(""), "\n </datalist>\n</div>\n<div class=\"col-md-8 align-items-center pb-3 ").concat(checkboxClass, "\">\n ").concat("<span class=\"pe-3 text-nowrap h5 mb-0\">Filter by: </span>" + filterColumns.map(column => "<div class=\"form-check pe-3 mt-0 mb-0\"><input class=\"form-check-input\" type=\"checkbox\" id=\"".concat(randID, "_").concat(column.textContent.replace(' ', '_').toLowerCase(), "\" checked=\"checked\" /><label class=\"form-check-label text-nowrap\" for=\"").concat(randID, "_").concat(column.textContent.replace(' ', '_').toLowerCase(), "\">").concat(column.textContent, "</label></div>")).join(""), "\n</div>");
205
- // Add before the actual table
206
- tableElement.prepend(form);
207
- };
208
- var filterTable = function filterTable(searchTerm) {
209
- // Create an array of rows that match the search term
210
- var tableArr = [];
211
- Array.from(storedData.querySelectorAll('tr')).forEach((tableRow, index) => {
212
- // We want one long search string per row including each filterable table cell
213
- var rowSearchString = '';
214
- Array.from(tableElement.querySelectorAll('[type="checkbox"]:checked + label')).forEach((label, index) => {
215
- rowSearchString += tableRow.querySelector('td[data-label="' + label.textContent + '"]').textContent + ' | ';
216
- });
217
- // Check if the table row search string contains the search term
218
- if (rowSearchString.indexOf(searchTerm) >= 0) {
219
- var dataRow = {
220
- row: tableRow
221
- };
222
- tableArr.push(dataRow);
223
- }
224
- });
225
- // Create a string to return and populate the tbody
226
- var strTbody = '';
227
- tableArr.forEach((tableRow, index) => {
228
- strTbody += tableRow.row.outerHTML;
229
- });
230
- tbody.innerHTML = strTbody;
231
- // Dispatch the filter event.
232
- tableElement.dispatchEvent(filteredEvent);
233
- };
234
- var createFilterList = function createFilterList() {
235
- // Check which options are checked
236
- var filterOptions = [];
237
- Array.from(tableElement.querySelectorAll('[type="checkbox"]:checked + label')).forEach((label, index) => {
238
- filterOptions.push(label.textContent);
239
- });
240
- // Build up the list of searchable terms
241
- var searchableTerms = [];
242
- filterOptions.forEach((option, index) => {
243
- Array.from(tableElement.querySelectorAll('td[data-label="' + option + '"]')).forEach((label, index) => {
244
- searchableTerms[label.textContent] = label.textContent;
245
- });
246
- });
247
- // Rebuild the list
248
- var dataList = tableElement.querySelector('datalist');
249
- dataList.innerHTML = Object.keys(searchableTerms).map(term => "<option value=\"".concat(term, "\"></option>")).join("");
250
- };
251
- // On page load check if filters are needed
252
- if (Array.from(tableElement.querySelectorAll('[data-filterable]')).length) {
253
- // Create the filter options
254
- createFilterForm(tableElement, Array.from(tableElement.querySelectorAll('[data-filterable]')).length);
255
- // Add event handlers for the filter options
256
- tableElement.addEventListener('keyup', function (e) {
257
- for (var target = e.target; target && target != this; target = target.parentNode) {
258
- if (target.matches('input[type="search"]')) {
259
- var searchTerm = target.value;
260
- filterTable(searchTerm);
261
- }
262
- }
263
- });
264
- tableElement.addEventListener('change', function (e) {
265
- for (var target = e.target; target && target != this; target = target.parentNode) {
266
- if (target.matches('input[type="search"]')) {
267
- var searchTerm = target.value;
268
- filterTable(searchTerm);
269
- }
270
- }
271
- });
272
- tableElement.addEventListener('change', function (e) {
273
- for (var target = e.target; target && target != this; target = target.parentNode) {
274
- if (target.matches('input[type="checkbox"]')) {
275
- var searchTerm = tableElement.querySelector('input[type="search"]').value;
276
- filterTable(searchTerm);
277
- createFilterList();
278
- }
279
- }
280
- });
281
- }
282
- // #endregion Filters
283
- // #region Pagination
284
- var paginateRows = function paginateRows(show, page) {
285
- // Create some inline CSS to control what is viewed on the table, unline the filters we are just hiding the rable rows not removing them from the DOM.
286
- var style = document.getElementById(randID + '_style');
287
- if (style == null) {
288
- style = document.createElement("style");
289
- style.setAttribute('id', randID + '_style');
290
- }
291
- var startShowing = show * (page - 1) + 1;
292
- var stopShowing = show * page;
293
- style.innerHTML = "\n #".concat(randID, " tbody tr {\n display: none;\n }\n #").concat(randID, " tbody tr:nth-child(").concat(startShowing, "),\n #").concat(randID, " tbody tr:nth-child(").concat(startShowing, ") ~ tr{\n display: block;\n }\n @media screen and (min-width: 36em) {\n #").concat(randID, " tbody tr:nth-child(").concat(startShowing, "),\n #").concat(randID, " tbody tr:nth-child(").concat(startShowing, ") ~ tr{\n display: table-row;\n }\n }\n #").concat(randID, " tbody tr:nth-child(").concat(stopShowing, ") ~ tr{\n display: none;\n }\n ");
294
- tableElement.append(style);
295
- };
296
- // On page load check if the table should be paginated
297
- if (tableElement.getAttribute('data-show')) {
298
- var show = parseInt(tableElement.getAttribute('data-show'));
299
- var page = parseInt(tableElement.getAttribute('data-page')) ? parseInt(tableElement.getAttribute('data-page')) : 1;
300
- var totalRows = tableElement.querySelectorAll('tbody tr').length;
301
- if (show < totalRows) {
302
- paginateRows(show, page);
303
- createPaginationForm(randID, tableElement, show, page, totalRows);
304
- createPaginationButttons(randID, tableElement, show, page, totalRows);
305
- tableElement.addEventListener('change', function (e) {
306
- for (var target = e.target; target && target != this; target = target.parentNode) {
307
- if (target.matches('.table__pagination input[type="number"]')) {
308
- paginateRows(target.value, page);
309
- createPaginationButttons(randID, tableElement, target.value, page, totalRows);
310
- tableElement.setAttribute('data-show', target.value);
311
- }
312
- }
313
- });
314
- tableElement.addEventListener('click', function (e) {
315
- for (var target = e.target; target && target != this; target = target.parentNode) {
316
- if (target.matches('.page-item:not(.active):not(.disabled) .page-link')) {
317
- paginateRows(tableElement.getAttribute('data-show'), target.getAttribute('data-page'));
318
- createPaginationButttons(randID, tableElement, tableElement.getAttribute('data-show'), target.getAttribute('data-page'), totalRows);
319
- }
320
- }
321
- }, false);
322
- tableElement.addEventListener('change', function (e) {
323
- for (var target = e.target; target && target != this; target = target.parentNode) {
324
- if (target.matches('.table__pagination select')) {
325
- paginateRows(tableElement.getAttribute('data-show'), target.value);
326
- createPaginationButttons(randID, tableElement, tableElement.getAttribute('data-show'), target.value, totalRows);
327
- }
328
- }
329
- });
330
- }
331
- }
332
- // #endregion Pagination
333
- // #region Reorderable
334
- // Set the row thats being dragged and copy the row
335
- function setDraggedRow(e) {
336
- e.dataTransfer.setData("text/plain", e.target.id);
337
- draggedRow = e.target;
338
- e.target.classList.add('tr--dragging');
339
- }
340
- // Create the order column and event handler for rows
341
- var setReorderRows = function setReorderRows() {
342
- Array.from(tbody.querySelectorAll('tr')).forEach((tableRow, index) => {
343
- // Create column if not already created
344
- if (tableRow.querySelector('[data-label="Order"]') == null) {
345
- var orderColumn = document.createElement('th');
346
- orderColumn.innerHTML = index + 1;
347
- orderColumn.setAttribute('data-label', 'Order');
348
- tableRow.prepend(orderColumn);
349
- }
350
- // Make draggable
351
- tableRow.setAttribute('id', randID + '_row_' + (index + 1));
352
- tableRow.setAttribute('data-order', index + 1);
353
- tableRow.setAttribute('draggable', 'true');
354
- tableRow.addEventListener("dragstart", setDraggedRow);
355
- });
356
- };
357
- if (tableElement.getAttribute('data-reorder') && tableElement.getAttribute('data-reorder') != "false") {
358
- // Add column heading
359
- var orderHeading = document.createElement('th');
360
- orderHeading.innerHTML = 'Order';
361
- orderHeading.title = 'Click here to enable re-ordering via drag and drop';
362
- orderHeading.classList.add('table-order-reset');
363
- thead.querySelector('tr').prepend(orderHeading);
364
- setReorderRows();
365
- // Reset order button
366
- tableElement.addEventListener('click', function (e) {
367
- for (var target = e.target; target && target != this; target = target.parentNode) {
368
- if (target.matches('.table-order-reset')) {
369
- // unset sort attributes
370
- Array.from(tableElement.querySelectorAll('[data-sortable]')).forEach((col, index) => {
371
- col.setAttribute('aria-sort', 'none');
372
- });
373
- // Save the sort options on the table element so that it can be re-sorted later
374
- tableElement.removeAttribute('data-sort');
375
- tableElement.removeAttribute('data-sortBy');
376
- // Sort the table
377
- sortTable('Order', 'ascending');
378
- Array.from(tableElement.querySelectorAll('tbody tr')).forEach((tableRow, index) => {
379
- tableRow.setAttribute('draggable', 'true');
380
- });
381
- break;
382
- }
383
- }
384
- }, false);
385
- document.addEventListener("dragover", function (e) {
386
- // prevent default to allow drop
387
- e.preventDefault();
388
- }, false);
389
- document.addEventListener("dragenter", function (e) {
390
- // prevent default to allow drop
391
- e.preventDefault();
392
- e.dataTransfer.dropEffect = "move";
393
- for (var target = e.target; target && target != this; target = target.parentNode) {
394
- if (target.matches('[data-reorder] tbody tr')) {
395
- target.classList.add('tr--dropable');
396
- }
397
- }
398
- }, false);
399
- document.addEventListener("dragleave", function (e) {
400
- // prevent default to allow drop
401
- e.preventDefault();
402
- for (var target = e.target; target && target != this; target = target.parentNode) {
403
- if (target.matches('[data-reorder] tbody tr')) {
404
- target.classList.remove('tr--dropable');
405
- }
406
- }
407
- }, false);
408
- document.addEventListener("drop", function (e) {
409
- e.preventDefault();
410
- for (var target = e.target; target && target != this; target = target.parentNode) {
411
- if (target.matches('[data-reorder] tbody tr')) {
412
- if (target.parentNode != null && draggedRow.parentNode != null && target != draggedRow) {
413
- draggedRow.parentNode.removeChild(draggedRow);
414
- if (draggedRow.getAttribute('data-order') > target.getAttribute('data-order')) target.parentNode.insertBefore(draggedRow, target);else target.parentNode.insertBefore(draggedRow, target.nextElementSibling);
415
- // Re label the rows
416
- Array.from(tbody.querySelectorAll('tr')).forEach((tableRowOrder, index) => {
417
- tableRowOrder.classList.remove('tr--dragging');
418
- tableRowOrder.classList.remove('tr--dropable');
419
- tableRowOrder.querySelector('th').innerHTML = index + 1;
420
- tableRowOrder.setAttribute('data-order', index + 1);
421
- });
422
- tableElement.dispatchEvent(reorderedEvent);
423
- }
424
- break;
425
- }
426
- }
427
- }, false);
428
- }
429
- // #endregion Reorderable
430
- // Watch for the filterable event and re-sort the tbody
431
- tableElement.addEventListener('filtered', function (e) {
432
- if (tableElement.getAttribute('data-sortBy') && tableElement.getAttribute('data-sort')) sortTable(tableElement.getAttribute('data-sortBy'), tableElement.getAttribute('data-sort'));
433
- if (tableElement.getAttribute('data-show')) {
434
- var _show = parseInt(tableElement.getAttribute('data-show'));
435
- var _totalRows = tableElement.querySelectorAll('tbody tr').length;
436
- var tablePagination = tableElement.querySelector('.table__pagination');
437
- if (tablePagination != null) tablePagination.remove();
438
- if (_show < _totalRows) {
439
- paginateRows(_show, 1);
440
- createPaginationForm(randID, tableElement, _show, 1, _totalRows);
441
- createPaginationButttons(randID, tableElement, _show, 1, _totalRows);
442
- }
443
- }
444
- if (tableElement.getAttribute('data-reorder')) {
445
- setReorderRows();
446
- }
447
- }, false);
448
- tableElement.addEventListener('sorted', function (e) {
449
- if (tableElement.getAttribute('data-reorder')) {
450
- setReorderRows();
451
- }
452
- }, false);
453
- tableElement.addEventListener('populated', function (e) {
454
- var tableFilter = tableElement.querySelector('.table__filters');
455
- tableFilter.remove();
456
- var tablePagination = tableElement.querySelector('.table__pagination');
457
- tablePagination.remove();
458
- var newTable = tableElement.cloneNode(true);
459
- tableElement.parentNode.replaceChild(newTable, tableElement);
460
- table(newTable);
461
- }, false);
2
+ * iamKey v3.4.6
3
+ * Copyright 2022-2023 iamproperty
4
+ */(function(k){typeof define=="function"&&define.amd?define(k):k()})(function(){"use strict";var k=e=>(e.classList.add("js-enabled"),(navigator.userAgent.indexOf("MSIE")!==-1||navigator.appVersion.indexOf("Trident/")>0)&&e.classList.add("ie"),null),P=e=>{if(location.hash&&document.querySelector(location.hash+":not([open]) summary")){var o=document.querySelector(location.hash+" summary");o instanceof HTMLElement&&o.click()}return window.addEventListener("hashchange",function(){var r=location.hash.replace("#",""),i=document.querySelector('label[for="'.concat(r,'"]')),n=document.querySelector(location.hash+" summary");i instanceof HTMLElement?i.click():n instanceof HTMLElement&&n.click()},!1),null},F=e=>{Array.from(e.querySelectorAll("table")).forEach((o,r)=>{O(o),D(o)})},D=e=>{if(!e.parentNode.classList.contains("table__wrapper")){var o=e.outerHTML;e.outerHTML='<div class="table__wrapper">'.concat(o,"</div>")}},O=e=>{var o=Array.from(e.querySelectorAll("thead th")),r=Array.from(e.querySelectorAll("tbody tr"));r.forEach((i,n)=>{var s=Array.from(i.querySelectorAll("th, td"));s.forEach((c,a)=>{var d=o[a];if(typeof d<"u"){var v=document.createElement("div");v.innerHTML=d.innerHTML;var p=v.textContent||v.innerText||"";c.setAttribute("data-label",p)}})})},j=function(o){return typeof o!="string"?!1:!isNaN(o)&&!isNaN(parseFloat(o))},R=(e,o)=>String(e).padStart(o,"0"),E=e=>{if(Array.from(e.querySelectorAll("details")).forEach((r,i)=>{r.addEventListener("mouseenter",function(n){window.matchMedia("(min-width: 62em)").matches&&r.setAttribute("open","true")},!1),r.addEventListener("mouseleave",function(n){window.matchMedia("(min-width: 62em)").matches&&r.removeAttribute("open")},!1)}),"IntersectionObserver"in window){var o=new IntersectionObserver(r=>{var[i]=r;return i.target.classList.toggle("is-stuck",i.intersectionRatio<1)},{threshold:[1]});o.observe(e)}};function H(e){if(typeof e!="object")return!1;var o=e.querySelector("thead"),r=e.querySelector("tbody"),i=r.cloneNode(!0),n=new Event("sorted"),s=new Event("filtered"),c=new Event("reordered"),a="table_"+Math.random().toString(36).substr(2,9),d;e.setAttribute("id",a);var v=function(t,l){var f=[];Array.from(r.querySelectorAll("tr")).forEach((b,A)=>{var m=b.querySelector('td[data-label="'+t+'"], th[data-label="'+t+'"]').textContent;j(m)&&(m=R(m,10));var T={index:m,row:b};f.push(T)}),f.sort((b,A)=>b.index>A.index?1:-1),l=="descending"&&(f=f.reverse());var h="";f.forEach((b,A)=>{h+=b.row.outerHTML}),r.innerHTML=h,e.dispatchEvent(n)};if(e.addEventListener("click",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches("[data-sortable]")){var l=t.getAttribute("aria-sort")=="ascending"?"descending":"ascending";Array.from(e.querySelectorAll("[data-sortable]")).forEach((f,h)=>{f.setAttribute("aria-sort","none")}),t.setAttribute("aria-sort",l),e.setAttribute("data-sort",l),e.setAttribute("data-sortBy",t.textContent),v(t.textContent,l),Array.from(e.querySelectorAll("tr[draggable]")).forEach((f,h)=>{f.removeAttribute("draggable")});break}},!1),e.getAttribute("data-sortBy")){var p=e.getAttribute("data-sort")=="ascending"?"descending":"ascending";Array.from(e.querySelectorAll("[data-sortable]")).forEach((u,t)=>{u.textContent==e.getAttribute("data-sortBy")&&(u.setAttribute("aria-sort",p),u.click())})}var y=function(t){var l=document.createElement("div");l.classList.add("table__filters"),l.classList.add("row"),l.classList.add("pt-1"),l.classList.add("pb-3");var f=Array.from(e.querySelectorAll("th[data-filterable]")),h={};f.forEach((m,T)=>{Array.from(e.querySelectorAll('td[data-label="'+m.textContent+'"]')).forEach((C,ne)=>{h[C.textContent]=C.textContent})});var b=f.length==1?"Filter by "+f[0].textContent:"Filter",A=f.length==1?"d-none":"d-sm-flex";l.innerHTML=`<div class="col-sm-6 col-md-4 pb-3">
5
+ <div class="form-control__wrapper form-control-inline mb-0">
6
+ <label for="`.concat(a,'_filter" class="form-label">').concat(b,`:</label>
7
+ <input type="search" name="`).concat(a,'_filter" id="').concat(a,'_filter" class="form-control form-control-sm" placeholder="" list="').concat(a,`_list" />
8
+ </div>
9
+ <datalist id="`).concat(a,`_list">
10
+ `).concat(Object.keys(h).map(m=>'<option value="'.concat(m,'"></option>')).join(""),`
11
+ </datalist>
12
+ </div>
13
+ <div class="col-md-8 align-items-center pb-3 `).concat(A,`">
14
+ `).concat('<span class="pe-3 text-nowrap h5 mb-0">Filter by: </span>'+f.map(m=>'<div class="form-check pe-3 mt-0 mb-0"><input class="form-check-input" type="checkbox" id="'.concat(a,"_").concat(m.textContent.replace(" ","_").toLowerCase(),'" checked="checked" /><label class="form-check-label text-nowrap" for="').concat(a,"_").concat(m.textContent.replace(" ","_").toLowerCase(),'">').concat(m.textContent,"</label></div>")).join(""),`
15
+ </div>`),e.prepend(l)},g=function(t){var l=[];Array.from(i.querySelectorAll("tr")).forEach((h,b)=>{var A="";if(Array.from(e.querySelectorAll('[type="checkbox"]:checked + label')).forEach((T,C)=>{A+=h.querySelector('td[data-label="'+T.textContent+'"]').textContent+" | "}),A.indexOf(t)>=0){var m={row:h};l.push(m)}});var f="";l.forEach((h,b)=>{f+=h.row.outerHTML}),r.innerHTML=f,e.dispatchEvent(s)},I=function(){var t=[];Array.from(e.querySelectorAll('[type="checkbox"]:checked + label')).forEach((h,b)=>{t.push(h.textContent)});var l=[];t.forEach((h,b)=>{Array.from(e.querySelectorAll('td[data-label="'+h+'"]')).forEach((A,m)=>{l[A.textContent]=A.textContent})});var f=e.querySelector("datalist");f.innerHTML=Object.keys(l).map(h=>'<option value="'.concat(h,'"></option>')).join("")};Array.from(e.querySelectorAll("[data-filterable]")).length&&(y(e,Array.from(e.querySelectorAll("[data-filterable]")).length),e.addEventListener("keyup",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches('input[type="search"]')){var l=t.value;g(l)}}),e.addEventListener("change",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches('input[type="search"]')){var l=t.value;g(l)}}),e.addEventListener("change",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches('input[type="checkbox"]')){var l=e.querySelector('input[type="search"]').value;g(l),I()}}));var q=function(t,l){var f=document.getElementById(a+"_style");f==null&&(f=document.createElement("style"),f.setAttribute("id",a+"_style"));var h=t*(l-1)+1,b=t*l;f.innerHTML=`
16
+ #`.concat(a,` tbody tr {
17
+ display: none;
462
18
  }
463
- var createPaginationForm = function createPaginationForm(randID, tableElement, show, page, totalRows) {
464
- var form = document.createElement("div");
465
- form.classList.add('table__pagination');
466
- form.classList.add('row');
467
- form.classList.add('pt-3');
468
- form.classList.add('pb-3');
469
- // Create the form and create a container div to hold the pagination buttons
470
- form.innerHTML = "<div class=\"col mw-fit-content mb-3\">\n<div class=\"form-control__wrapper form-control-inline mb-0\">\n <label for=\"".concat(randID, "_showing\" class=\"form-label\">Showing:</label>\n <input type=\"number\" name=\"").concat(randID, "_showing\" id=\"").concat(randID, "_showing\" class=\"form-control form-control-sm showing-input-field\" placeholder=\"\" list=\"").concat(randID, "_pagination\" value=\"").concat(show, "\" min=\"1\" max=\"").concat(totalRows, "\" />\n</div>\n<datalist id=\"").concat(randID, "_pagination\">\n<option value=\"5\">5</option>\n").concat(totalRows > 10 ? "<option value=\"10\">10</option>" : '', "\n").concat(totalRows > 20 ? "<option value=\"20\">20</option>" : '', "\n<option value=\"").concat(totalRows, "\">").concat(totalRows, "</option>\n</datalist>\n</div>\n<div class=\"col mw-fit-content me-auto d-flex align-items-center mb-3\"><span class=\"label\">per page</span></div>\n<div class=\"col mw-fit-content d-sm-flex justify-content-end align-items-center\" id=\"").concat(randID, "_paginationBtns\"></div>");
471
- // Add after the actual table
472
- tableElement.append(form);
473
- };
474
- var createPaginationButttons = function createPaginationButttons(randID, tableElement, show, page, totalRows) {
475
- var paginationButtonsWrapper = document.getElementById(randID + '_paginationBtns');
476
- if (paginationButtonsWrapper == null) return false;
477
- var numberPages = Math.ceil(totalRows / show);
478
- if (numberPages == 1) {
479
- // Remore the buttons or dont display any if we dont need them
480
- paginationButtonsWrapper.innerHTML = '';
481
- } else if (numberPages < 5) {
482
- // If less than 5 pages (which fits comfortably on mobile) we display buttons
483
- var strButtons = '';
484
- for (var i = 1; i <= numberPages; i++) {
485
- if (i == page) strButtons += "<li class=\"page-item active\" aria-current=\"page\"><span class=\"page-link\">".concat(i, "</span></li>");else strButtons += "<li class=\"page-item\"><button class=\"page-link\" data-page=\"".concat(i, "\">").concat(i, "</button></li>");
486
- }
487
- paginationButtonsWrapper.innerHTML = "<span class=\"pe-2 mb-3\">Page: </span><ul class=\"pagination mb-3\">\n ".concat(page == 1 ? "<li class=\"page-item disabled\"><span class=\"page-link\">Previous</span></li>" : "<li class=\"page-item\"><button class=\"page-link\" data-page=\"".concat(parseInt(page) - 1, "\">Previous</button></li>"), "\n ").concat(strButtons, "\n ").concat(page == numberPages ? "<li class=\"page-item disabled\"><span class=\"page-link\">Next</span></li>" : "<li class=\"page-item\"><button class=\"page-link\" data-page=\"".concat(parseInt(page) + 1, "\">Next</button></li>"), "\n </ul>");
488
- } else {
489
- // If more than 5 lets show a select field instead so that we dont have loads and loads of buttons
490
- var strOptions = '';
491
- for (var _i = 1; _i <= numberPages; _i++) {
492
- if (_i == page) strOptions += "<option value=\"".concat(_i, "\" selected>Page ").concat(_i, "</option>");else strOptions += "<option value=\"".concat(_i, "\">Page ").concat(_i, "</option>");
493
- }
494
- paginationButtonsWrapper.innerHTML = "\n<div class=\"form-control__wrapper page-number mb-2\">\n<select class=\"form-select\">\n".concat(strOptions, "\n</select>\n</div>\n ");
495
- }
496
- };
497
-
498
- // @ts-nocheck
499
- function accordion(accordionElement) {
500
- // Fetch all the details element.
501
- if (!accordionElement.classList.contains('accordion--keep-open')) {
502
- var details = accordionElement.querySelectorAll(":scope > details");
503
- // Add the onclick listeners.
504
- details.forEach(targetDetail => {
505
- targetDetail.addEventListener("click", () => {
506
- // Close all the details that are not targetDetail.
507
- details.forEach(detail => {
508
- if (detail !== targetDetail) {
509
- detail.removeAttribute("open");
510
- }
511
- });
512
- });
513
- });
514
- }
515
- if (window.location.hash && document.querySelector(window.location.hash + ':not([open]) summary')) {
516
- var detail = document.querySelector(window.location.hash + ' summary');
517
- if (detail instanceof HTMLElement) {
518
- detail.click();
519
- }
520
- }
521
- window.addEventListener('hashchange', function () {
522
- if (window.location.hash && document.querySelector(window.location.hash + ' summary')) {
523
- var _detail = document.querySelector(window.location.hash + ' summary');
524
- if (_detail instanceof HTMLElement) {
525
- _detail.click();
526
- }
527
- }
528
- });
19
+ #`).concat(a," tbody tr:nth-child(").concat(h,`),
20
+ #`).concat(a," tbody tr:nth-child(").concat(h,`) ~ tr{
21
+ display: block;
529
22
  }
530
-
531
- // @ts-nocheck
532
- function testimonial(testimonialElement) {
533
- var scrollTimeout;
534
- var imagesCarousel = testimonialElement.querySelector('.testimonial__images');
535
- var itemCount = imagesCarousel.querySelectorAll('img').length;
536
- // If we only have 1 item lets not bother doing anything else
537
- if (itemCount == 1) {
538
- return false;
23
+ @media screen and (min-width: 36em) {
24
+ #`).concat(a," tbody tr:nth-child(").concat(h,`),
25
+ #`).concat(a," tbody tr:nth-child(").concat(h,`) ~ tr{
26
+ display: table-row;
539
27
  }
540
- testimonialElement.classList.add('testimonial--multi');
541
- // Set where the buttons go to
542
- var setButtons = function setButtons(scrollTo) {
543
- var nextButton = testimonialElement.querySelector('.btn-next');
544
- var prevButton = testimonialElement.querySelector('.btn-prev');
545
- nextButton.setAttribute('data-go', scrollTo + 1);
546
- prevButton.setAttribute('data-go', scrollTo - 1);
547
- nextButton.removeAttribute('disabled');
548
- prevButton.removeAttribute('disabled');
549
- if (scrollTo == 1) prevButton.setAttribute('disabled', true);else if (scrollTo == itemCount) nextButton.setAttribute('disabled', true);
550
- };
551
- // On scroll we need to make sure the buttons get corrected and the next testimonial is shown
552
- imagesCarousel.addEventListener('scroll', function (e) {
553
- clearTimeout(scrollTimeout);
554
- scrollTimeout = setTimeout(function () {
555
- var scrollWidth = imagesCarousel.scrollWidth;
556
- var scrollHeight = imagesCarousel.scrollHeight;
557
- var scrollLeft = imagesCarousel.scrollLeft;
558
- var scrollDown = imagesCarousel.scrollTop;
559
- var scrollTo = Math.round(scrollLeft / scrollWidth * itemCount) + 1;
560
- // Change in scroll direction
561
- if (scrollLeft == 0 && scrollDown != 0) scrollTo = Math.round(scrollDown / scrollHeight * itemCount) + 1;
562
- testimonialElement.setAttribute('data-show', scrollTo);
563
- setButtons(scrollTo);
564
- }, 300);
565
- }, false);
566
- // when the buttons are used we need to make sure the carousel scrolls to the correct place
567
- testimonialElement.addEventListener('click', function (e) {
568
- for (var target = e.target; target && target != this; target = target.parentNode) {
569
- if (target.matches('[data-go]')) {
570
- var scrollTo = parseInt(target.getAttribute('data-go'));
571
- var scrollDown = 0;
572
- var scrollLeft = 0;
573
- var scrollWidth = imagesCarousel.scrollWidth;
574
- var scrollHeight = imagesCarousel.scrollHeight;
575
- if (scrollWidth > scrollHeight) scrollLeft = Math.floor(scrollWidth * ((scrollTo - 1) / itemCount));else scrollDown = Math.floor(scrollHeight * ((scrollTo - 1) / itemCount));
576
- // Trigger the scroll
577
- imagesCarousel.scroll({
578
- top: scrollDown,
579
- left: scrollLeft,
580
- behavior: 'smooth'
581
- });
582
- break;
583
- }
584
- }
585
- }, false);
586
- }
587
-
588
- // @ts-nocheck
589
- function carousel(carouselElement) {
590
- var scrollTimeout;
591
- var carouselInner = carouselElement.querySelector('.carousel__inner');
592
- var itemCount = carouselElement.querySelectorAll('.carousel__item').length;
593
- carouselElement.getAttribute('data-cols');
594
- var smCols = carouselElement.getAttribute('data-sm-cols');
595
- var mdCols = carouselElement.getAttribute('data-md-cols');
596
- carouselElement.querySelector('.carousel__controls a').classList.add('active');
597
- // On scroll we need to make sure the buttons get corrected and the next testimonial is shown
598
- carouselInner.addEventListener('scroll', function (e) {
599
- clearTimeout(scrollTimeout);
600
- scrollTimeout = setTimeout(function () {
601
- var scrollArea = carouselInner.clientWidth;
602
- var scrollWidth = carouselInner.scrollWidth;
603
- var scrollLeft = carouselInner.scrollLeft;
604
- var targetSlide = Math.round(scrollLeft / scrollWidth * itemCount) + 1;
605
- var lastItemOffset = carouselElement.querySelector('.carousel__item:last-child').offsetLeft;
606
- Array.from(carouselElement.querySelectorAll('.carousel__controls a')).forEach((link, index) => {
607
- link.classList.remove('active');
608
- });
609
- carouselElement.querySelector('.control-' + targetSlide).classList.add('active');
610
- // Disable the previous button
611
- if (targetSlide == 1) carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');else carouselElement.querySelector('.btn-prev').removeAttribute('disabled');
612
- // Disable the next button if the last item is in view
613
- if (carouselInner.scrollLeft + scrollArea > lastItemOffset) carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');else carouselElement.querySelector('.btn-next').removeAttribute('disabled');
614
- }, 100);
615
- }, false);
616
- // when the buttons are used we need to make sure the carousel scrolls to the correct place
617
- carouselElement.addEventListener('click', function (e) {
618
- for (var target = e.target; target && target != this; target = target.parentNode) {
619
- if (target.matches('.carousel__controls a')) {
620
- e.preventDefault();
621
- Array.from(carouselElement.querySelectorAll('.carousel__controls a')).forEach((link, index) => {
622
- link.classList.remove('active');
623
- });
624
- target.classList.add('active');
625
- var el = document.querySelector(target.getAttribute('href'));
626
- carouselInner.scroll({
627
- top: 0,
628
- left: el.offsetLeft,
629
- behavior: 'smooth'
630
- });
631
- break;
632
- }
633
- }
634
- }, false);
635
- carouselElement.addEventListener('click', function (e) {
636
- for (var target = e.target; target && target != this; target = target.parentNode) {
637
- if (target.matches('.btn-next, .btn-prev')) {
638
- e.preventDefault();
639
- var scrollTo = target.classList.contains('btn-prev') ? carouselInner.scrollLeft - carouselInner.clientWidth : carouselInner.scrollLeft + carouselInner.clientWidth;
640
- carouselInner.scroll({
641
- top: 0,
642
- left: scrollTo,
643
- behavior: 'smooth'
644
- });
645
- break;
646
- }
647
- }
648
- }, false);
649
- // Add responsive hide button classes
650
- if (itemCount == 1) carouselElement.classList.add('hide-btns');
651
- if (smCols >= itemCount) carouselElement.classList.add('hide-sm-btns');
652
- if (mdCols >= itemCount) carouselElement.classList.add('hide-md-btns');
653
- }
654
-
655
- // @ts-nocheck
656
- // Create a link between two input/selects with one acting as setting a minimum value and the second a maximum
657
- // The link between the two will prevent the max input field form setting a lower value than the min and vice versa
658
- function inputRange(inputWrapper) {
659
- inputWrapper.addEventListener('change', function (e) {
660
- var min = parseInt(inputWrapper.querySelector('[data-min] select,[data-min] input').value);
661
- var max = parseInt(inputWrapper.querySelector('[data-max] select,[data-max] input').value);
662
- // Set attributes for input fields
663
- Array.from(inputWrapper.querySelectorAll('[data-min] input')).forEach((input, index) => {
664
- input.setAttribute('max', max);
665
- });
666
- Array.from(inputWrapper.querySelectorAll('[data-max] input')).forEach((input, index) => {
667
- input.setAttribute('min', min);
668
- });
669
- // Hide select options if they are higher or lower than the min and max values
670
- Array.from(inputWrapper.querySelectorAll('[data-min] select option')).forEach((option, index) => {
671
- if (parseInt(option.getAttribute('value')) > max) option.classList.add('d-none');else option.classList.remove('d-none');
672
- });
673
- Array.from(inputWrapper.querySelectorAll('[data-max] select option')).forEach((option, index) => {
674
- if (parseInt(option.getAttribute('value')) < min) option.classList.add('d-none');else option.classList.remove('d-none');
675
- });
676
- }, false);
677
28
  }
678
- function inputRedirect(inputWrapper) {
679
- inputWrapper.addEventListener('change', function (e) {
680
- if (inputWrapper.matches('[data-value-if]')) {
681
- var url = inputWrapper.getAttribute('data-redirect');
682
- var desiredValue = inputWrapper.getAttribute('data-value-if');
683
- if (inputWrapper.value == desiredValue) document.location.href = url;
684
- } else {
685
- if (typeof inputWrapper.value != "undefined") document.location.href = inputWrapper.value;
686
- }
687
- }, false);
29
+ #`).concat(a," tbody tr:nth-child(").concat(b,`) ~ tr{
30
+ display: none;
688
31
  }
689
- //
690
- function multipleFileUploads(wrapper) {
691
- var fileTenplate = wrapper.querySelector('.row');
692
- var clone = fileTenplate.cloneNode(true);
693
- var addButton = wrapper.querySelector('[data-add]');
694
- wrapper.addEventListener('click', function (e) {
695
- for (var target = e.target; target && target != this; target = target.parentNode) {
696
- if (target.matches('[data-add]')) {
697
- // Add a new row upload file input fields
698
- var tempClone = clone.cloneNode(true);
699
- wrapper.insertBefore(tempClone, target);
700
- if (addButton.matches('[data-maxfiles]') && Array.from(wrapper.querySelectorAll(':scope > .row')).length >= addButton.dataset.maxfiles) addButton.setAttribute('disabled', 'disabled');
701
- break;
702
- }
703
- if (target.matches('[data-delete]')) {
704
- // Delete the current row
705
- var row = target.closest('.row');
706
- row.remove();
707
- if (addButton.matches('[data-maxfiles]') && Array.from(wrapper.querySelectorAll(':scope > .row')).length < addButton.dataset.maxfiles) addButton.removeAttribute('disabled');
708
- break;
709
- }
710
- }
711
- }, false);
32
+ `),e.append(f)};if(e.getAttribute("data-show")){var _=parseInt(e.getAttribute("data-show")),w=parseInt(e.getAttribute("data-page"))?parseInt(e.getAttribute("data-page")):1,L=e.querySelectorAll("tbody tr").length;_<L&&(q(_,w),B(a,e,_,w,L),S(a,e,_,w,L),e.addEventListener("change",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)t.matches('.table__pagination input[type="number"]')&&(q(t.value,w),S(a,e,t.value,w,L),e.setAttribute("data-show",t.value))}),e.addEventListener("click",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)t.matches(".page-item:not(.active):not(.disabled) .page-link")&&(q(e.getAttribute("data-show"),t.getAttribute("data-page")),S(a,e,e.getAttribute("data-show"),t.getAttribute("data-page"),L))},!1),e.addEventListener("change",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)t.matches(".table__pagination select")&&(q(e.getAttribute("data-show"),t.value),S(a,e,e.getAttribute("data-show"),t.value,L))}))}function oe(u){u.dataTransfer.setData("text/plain",u.target.id),d=u.target,u.target.classList.add("tr--dragging")}var N=function(){Array.from(r.querySelectorAll("tr")).forEach((t,l)=>{if(t.querySelector('[data-label="Order"]')==null){var f=document.createElement("th");f.innerHTML=l+1,f.setAttribute("data-label","Order"),t.prepend(f)}t.setAttribute("id",a+"_row_"+(l+1)),t.setAttribute("data-order",l+1),t.setAttribute("draggable","true"),t.addEventListener("dragstart",oe)})};if(e.getAttribute("data-reorder")&&e.getAttribute("data-reorder")!="false"){var x=document.createElement("th");x.innerHTML="Order",x.title="Click here to enable re-ordering via drag and drop",x.classList.add("table-order-reset"),o.querySelector("tr").prepend(x),N(),e.addEventListener("click",function(u){for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches(".table-order-reset")){Array.from(e.querySelectorAll("[data-sortable]")).forEach((l,f)=>{l.setAttribute("aria-sort","none")}),e.removeAttribute("data-sort"),e.removeAttribute("data-sortBy"),v("Order","ascending"),Array.from(e.querySelectorAll("tbody tr")).forEach((l,f)=>{l.setAttribute("draggable","true")});break}},!1),document.addEventListener("dragover",function(u){u.preventDefault()},!1),document.addEventListener("dragenter",function(u){u.preventDefault(),u.dataTransfer.dropEffect="move";for(var t=u.target;t&&t!=this;t=t.parentNode)t.matches("[data-reorder] tbody tr")&&t.classList.add("tr--dropable")},!1),document.addEventListener("dragleave",function(u){u.preventDefault();for(var t=u.target;t&&t!=this;t=t.parentNode)t.matches("[data-reorder] tbody tr")&&t.classList.remove("tr--dropable")},!1),document.addEventListener("drop",function(u){u.preventDefault();for(var t=u.target;t&&t!=this;t=t.parentNode)if(t.matches("[data-reorder] tbody tr")){t.parentNode!=null&&d.parentNode!=null&&t!=d&&(d.parentNode.removeChild(d),d.getAttribute("data-order")>t.getAttribute("data-order")?t.parentNode.insertBefore(d,t):t.parentNode.insertBefore(d,t.nextElementSibling),Array.from(r.querySelectorAll("tr")).forEach((l,f)=>{l.classList.remove("tr--dragging"),l.classList.remove("tr--dropable"),l.querySelector("th").innerHTML=f+1,l.setAttribute("data-order",f+1)}),e.dispatchEvent(c));break}},!1)}e.addEventListener("filtered",function(u){if(e.getAttribute("data-sortBy")&&e.getAttribute("data-sort")&&v(e.getAttribute("data-sortBy"),e.getAttribute("data-sort")),e.getAttribute("data-show")){var t=parseInt(e.getAttribute("data-show")),l=e.querySelectorAll("tbody tr").length,f=e.querySelector(".table__pagination");f?.remove(),t<l&&(q(t,1),B(a,e,t,1,l),S(a,e,t,1,l))}e.getAttribute("data-reorder")&&N()},!1),e.addEventListener("sorted",function(u){e.getAttribute("data-reorder")&&N()},!1),e.addEventListener("populated",function(u){var t=e.querySelector(".table__filters");t.remove();var l=e.querySelector(".table__pagination");l.remove();var f=e.cloneNode(!0);e.parentNode.replaceChild(f,e),H(f)},!1)}var B=function(o,r,i,n,s){var c=document.createElement("div");c.classList.add("table__pagination"),c.classList.add("row"),c.classList.add("pt-3"),c.classList.add("pb-3"),c.innerHTML=`<div class="col mw-fit-content mb-3">
33
+ <div class="form-control__wrapper form-control-inline mb-0">
34
+ <label for="`.concat(o,`_showing" class="form-label">Showing:</label>
35
+ <input type="number" name="`).concat(o,'_showing" id="').concat(o,'_showing" class="form-control form-control-sm showing-input-field" placeholder="" list="').concat(o,'_pagination" value="').concat(i,'" min="1" max="').concat(s,`" />
36
+ </div>
37
+ <datalist id="`).concat(o,`_pagination">
38
+ <option value="5">5</option>
39
+ `).concat(s>10?'<option value="10">10</option>':"",`
40
+ `).concat(s>20?'<option value="20">20</option>':"",`
41
+ <option value="`).concat(s,'">').concat(s,`</option>
42
+ </datalist>
43
+ </div>
44
+ <div class="col mw-fit-content me-auto d-flex align-items-center mb-3"><span class="label">per page</span></div>
45
+ <div class="col mw-fit-content d-sm-flex justify-content-end align-items-center" id="`).concat(o,'_paginationBtns"></div>'),r.append(c)},S=function(o,r,i,n,s){var c=document.getElementById(o+"_paginationBtns");if(c==null)return!1;var a=Math.ceil(s/i);if(a==1)c.innerHTML="";else if(a<5){for(var d="",v=1;v<=a;v++)v==n?d+='<li class="page-item active" aria-current="page"><span class="page-link">'.concat(v,"</span></li>"):d+='<li class="page-item"><button class="page-link" data-page="'.concat(v,'">').concat(v,"</button></li>");c.innerHTML=`<span class="pe-2 mb-3">Page: </span><ul class="pagination mb-3">
46
+ `.concat(n==1?'<li class="page-item disabled"><span class="page-link">Previous</span></li>':'<li class="page-item"><button class="page-link" data-page="'.concat(parseInt(n)-1,'">Previous</button></li>'),`
47
+ `).concat(d,`
48
+ `).concat(n==a?'<li class="page-item disabled"><span class="page-link">Next</span></li>':'<li class="page-item"><button class="page-link" data-page="'.concat(parseInt(n)+1,'">Next</button></li>'),`
49
+ </ul>`)}else{for(var p="",y=1;y<=a;y++)y==n?p+='<option value="'.concat(y,'" selected>Page ').concat(y,"</option>"):p+='<option value="'.concat(y,'">Page ').concat(y,"</option>");c.innerHTML=`
50
+ <div class="form-control__wrapper page-number mb-2">
51
+ <select class="form-select">
52
+ `.concat(p,`
53
+ </select>
54
+ </div>
55
+ `)}};function V(e){var o,r=e.querySelector(".testimonial__images"),i=r.querySelectorAll("img").length;if(i==1)return!1;e.classList.add("testimonial--multi");var n=function(c){var a=e.querySelector(".btn-next"),d=e.querySelector(".btn-prev");a.setAttribute("data-go",c+1),d.setAttribute("data-go",c-1),a.removeAttribute("disabled"),d.removeAttribute("disabled"),c==1?d.setAttribute("disabled",!0):c==i&&a.setAttribute("disabled",!0)};r.addEventListener("scroll",function(s){clearTimeout(o),o=setTimeout(function(){var c=r.scrollWidth,a=r.scrollHeight,d=r.scrollLeft,v=r.scrollTop,p=Math.round(d/c*i)+1;d==0&&v!=0&&(p=Math.round(v/a*i)+1),e.setAttribute("data-show",p),n(p)},300)},!1),e.addEventListener("click",function(s){for(var c=s.target;c&&c!=this;c=c.parentNode)if(c.matches("[data-go]")){var a=parseInt(c.getAttribute("data-go")),d=0,v=0,p=r.scrollWidth,y=r.scrollHeight;p>y?v=Math.floor(p*((a-1)/i)):d=Math.floor(y*((a-1)/i)),r.scroll({top:d,left:v,behavior:"smooth"});break}},!1)}function z(e){var o,r=e.querySelector(".carousel__inner"),i=e.querySelectorAll(".carousel__item").length;e.getAttribute("data-cols");var n=e.getAttribute("data-sm-cols"),s=e.getAttribute("data-md-cols");e.querySelector(".carousel__controls a").classList.add("active"),r.addEventListener("scroll",function(c){clearTimeout(o),o=setTimeout(function(){var a=r.clientWidth,d=r.scrollWidth,v=r.scrollLeft,p=Math.round(v/d*i)+1,y=e.querySelector(".carousel__item:last-child").offsetLeft;Array.from(e.querySelectorAll(".carousel__controls a")).forEach((g,I)=>{g.classList.remove("active")}),e.querySelector(".control-"+p).classList.add("active"),p==1?e.querySelector(".btn-prev").setAttribute("disabled","disabled"):e.querySelector(".btn-prev").removeAttribute("disabled"),r.scrollLeft+a>y?e.querySelector(".btn-next").setAttribute("disabled","disabled"):e.querySelector(".btn-next").removeAttribute("disabled")},100)},!1),e.addEventListener("click",function(c){for(var a=c.target;a&&a!=this;a=a.parentNode)if(a.matches(".carousel__controls a")){c.preventDefault(),Array.from(e.querySelectorAll(".carousel__controls a")).forEach((v,p)=>{v.classList.remove("active")}),a.classList.add("active");var d=document.querySelector(a.getAttribute("href"));r.scroll({top:0,left:d.offsetLeft,behavior:"smooth"});break}},!1),e.addEventListener("click",function(c){for(var a=c.target;a&&a!=this;a=a.parentNode)if(a.matches(".btn-next, .btn-prev")){c.preventDefault();var d=a.classList.contains("btn-prev")?r.scrollLeft-r.clientWidth:r.scrollLeft+r.clientWidth;r.scroll({top:0,left:d,behavior:"smooth"});break}},!1),i==1&&e.classList.add("hide-btns"),n>=i&&e.classList.add("hide-sm-btns"),s>=i&&e.classList.add("hide-md-btns")}function Y(e){e.addEventListener("change",function(o){var r=parseInt(e.querySelector("[data-min] select,[data-min] input").value),i=parseInt(e.querySelector("[data-max] select,[data-max] input").value);Array.from(e.querySelectorAll("[data-min] input")).forEach((n,s)=>{n.setAttribute("max",i)}),Array.from(e.querySelectorAll("[data-max] input")).forEach((n,s)=>{n.setAttribute("min",r)}),Array.from(e.querySelectorAll("[data-min] select option")).forEach((n,s)=>{parseInt(n.getAttribute("value"))>i?n.classList.add("d-none"):n.classList.remove("d-none")}),Array.from(e.querySelectorAll("[data-max] select option")).forEach((n,s)=>{parseInt(n.getAttribute("value"))<r?n.classList.add("d-none"):n.classList.remove("d-none")})},!1)}function G(e){e.addEventListener("change",function(o){if(e.matches("[data-value-if]")){var r=e.getAttribute("data-redirect"),i=e.getAttribute("data-value-if");e.value==i&&(document.location.href=r)}else typeof e.value<"u"&&(document.location.href=e.value)},!1)}function K(e){var o=e.querySelector(".row"),r=o.cloneNode(!0),i=e.querySelector("[data-add]");e.addEventListener("click",function(n){for(var s=n.target;s&&s!=this;s=s.parentNode){if(s.matches("[data-add]")){var c=r.cloneNode(!0);e.insertBefore(c,s),i.matches("[data-maxfiles]")&&Array.from(e.querySelectorAll(":scope > .row")).length>=i.dataset.maxfiles&&i.setAttribute("disabled","disabled");break}if(s.matches("[data-delete]")){var a=s.closest(".row");a.remove(),i.matches("[data-maxfiles]")&&Array.from(e.querySelectorAll(":scope > .row")).length<i.dataset.maxfiles&&i.removeAttribute("disabled");break}}},!1)}function Q(e){Array.from(e.querySelectorAll("[data-input-range]")).forEach((o,r)=>{Y(o)}),Array.from(e.querySelectorAll("[data-redirect]")).forEach((o,r)=>{G(o)}),Array.from(e.querySelectorAll(".multiple-file-uploads")).forEach((o,r)=>{K(o)}),e.addEventListener("change",function(o){for(var r=o.target;r&&r!=this;r=r.parentNode)if(r.matches('[type="file"][data-filesize]')&&r.files&&r.files[0]){var i=r.dataset.filesize;r.files[0].size>i&&(r.value="",alert("File too large"));break}},!1),e.addEventListener("change",function(o){Array.from(e.querySelectorAll("select[data-activeif][data-equals],input[data-activeif][data-equals]")).forEach((r,i)=>{var n=r.closest("[data-group]")?r.closest("[data-group]"):e,s=r.dataset.activeif,c=r.dataset.equals,a=n.querySelector('select[data-id="'.concat(s,'"],input[data-id="').concat(s,'"]'));a.value==c?r.removeAttribute("disabled"):(r.setAttribute("disabled","disabled"),r.value="")}),Array.from(e.querySelectorAll(".form-control__wrapper[data-displayif][data-equals]")).forEach((r,i)=>{var n=r.closest("[data-group]")?r.closest("[data-group]"):e,s=r.dataset.activeif,c=r.dataset.equals,a=n.querySelector('select[data-id="'.concat(s,'"],input[data-id="').concat(s,'"]'));a.value==c?r.classList.remove("d-none"):r.classList.add("d-none")})},!1)}class U{constructor(o){var r=this.createEmbed;document.body.classList.contains("youtubeLoaded")?o.addEventListener("click",function(i){for(var n=i.target;n&&n!=this;n=n.parentNode)if(n.matches("a:not([data-modal-youtube]")){i.preventDefault(),r(o,n);break}},!1):this.loadScripts(o,this.createEmbed)}loadScripts(o,r){return new Promise((i,n)=>{var s=new Image;s.onload=function(){var c=document.createElement("script");c.src="https://www.youtube.com/iframe_api";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(c,a),document.body.classList.add("youtubeLoaded"),i(!0),c.onload=()=>{o.addEventListener("click",function(d){for(var v=d.target;v&&v!=this;v=v.parentNode)if(v.matches("a:not([data-modal-youtube]")){d.preventDefault(),r(o,v);break}},!1)}},s.onerror=function(){n(!1)},s.src="https://youtube.com/favicon.ico"})}createEmbed(o,r){typeof window.player<"u"&&typeof window.player.pauseVideo=="function"&&window.player.pauseVideo();var i=r.getAttribute("data-id"),n=r.getAttribute("id");if(typeof n>"u"||n==null){var s=String.fromCharCode(65+Math.floor(Math.random()*26));n=s+Date.now(),r.setAttribute("id",n)}function c(){window.player=new YT.Player(n,{height:"100%",width:"100%",videoId:i,playerVars:{modestbranding:1,playsinline:1,rel:0,showinfo:0},events:{onReady:a,onStateChange:v}})}c();function a(p){p.target.playVideo()}var d=!1;function v(p){if(p.data==YT.PlayerState.PLAYING&&!d){var y=document.getElementById(n);y.classList.add("player-ready"),d=!0}}}}var J=e=>{var o=e.querySelectorAll(".modal__outer a, .modal__outer button"),r=o[0],i=o[o.length-1],n=e.getAttribute("id"),s=function(){var d=document.querySelector('[href="'+window.location.hash+'"]');d.focus(),window.location.hash="close",history.replaceState("",document.title,window.location.pathname+window.location.search),typeof window.player<"u"&&typeof window.player.pauseVideo=="function"&&window.player.pauseVideo()};e.addEventListener("keydown",function(a){a.key==="Tab"&&a.shiftKey&&document.activeElement==r?(a.preventDefault(),i.focus()):a.key==="Tab"&&!a.shiftKey&&document.activeElement==i&&(a.preventDefault(),r.focus())}),document.addEventListener("keydown",function(a){a.key==="Escape"&&document.querySelector(".modal:target")&&s()}),e.addEventListener("click",function(a){for(var d=a.target;d&&d!=this;d=d.parentNode)if(d.matches('[href="#close"]')){a.preventDefault(),s();break}else if(d.matches(".modal__dock--right")){a.preventDefault(),e.classList.contains("modal--left")||e.classList.add("modal--right"),e.classList.remove("modal--left");break}else if(d.matches(".modal__dock--left")){a.preventDefault(),e.classList.contains("modal--right")||e.classList.add("modal--left"),e.classList.remove("modal--right");break}});function c(){if(location.hash==="#"+n){console.log("Modal is now open");var a=document.querySelector(".modal:target .modal__inner > .youtube-embed:first-child:last-child a");console.log(a),a&&a.click()}}window.onhashchange=c};class X extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});var o=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",r='@import "'.concat(o,'/css/components/header.css";'),i=document.createElement("template");i.innerHTML=`
56
+ <style>
57
+ @import "`.concat(o,`/css/core.min.css";
58
+ `).concat(r,`
59
+ `).concat(this.hasAttribute("css")?'@import "'.concat(this.getAttribute("css"),'";'):"",`
60
+ :host {
61
+ max-width:100%!important;
62
+ padding:0!important;
712
63
  }
713
- // Acts as an overall initialise function to trigger other functions.
714
- function form(formElement) {
715
- // Check for input range groups
716
- Array.from(formElement.querySelectorAll('[data-input-range]')).forEach((arrayElement, index) => {
717
- inputRange(arrayElement);
718
- });
719
- Array.from(formElement.querySelectorAll('[data-redirect]')).forEach((arrayElement, index) => {
720
- inputRedirect(arrayElement);
721
- });
722
- Array.from(formElement.querySelectorAll('.multiple-file-uploads')).forEach((arrayElement, index) => {
723
- multipleFileUploads(arrayElement);
724
- });
725
- // Check the file size of a file when uploaded in case it exceeds the max file size set
726
- formElement.addEventListener('change', function (e) {
727
- for (var target = e.target; target && target != this; target = target.parentNode) {
728
- if (target.matches('[type="file"][data-filesize]') && target.files && target.files[0]) {
729
- var maxAllowedSize = target.dataset.filesize;
730
- if (target.files[0].size > maxAllowedSize) {
731
- target.value = '';
732
- alert('File too large');
733
- }
734
- break;
735
- }
736
- }
737
- }, false);
738
- // When a form is updated we may want to update some of the existing input fields; setting active fields when some data is selected.
739
- formElement.addEventListener('change', function (e) {
740
- // Remove disabled attribute when a pre-selected input field equals a certain value
741
- Array.from(formElement.querySelectorAll('select[data-activeif][data-equals],input[data-activeif][data-equals]')).forEach((arrayElement, index) => {
742
- var group = arrayElement.closest('[data-group]') ? arrayElement.closest('[data-group]') : formElement;
743
- var selector = arrayElement.dataset.activeif;
744
- var value = arrayElement.dataset.equals;
745
- var testElement = group.querySelector("select[data-id=\"".concat(selector, "\"],input[data-id=\"").concat(selector, "\"]"));
746
- if (testElement.value == value) {
747
- arrayElement.removeAttribute('disabled');
748
- } else {
749
- arrayElement.setAttribute('disabled', 'disabled');
750
- arrayElement.value = '';
751
- }
752
- });
753
- // Show this input wrapper when a pre-selected input field equals a certain value
754
- Array.from(formElement.querySelectorAll('.form-control__wrapper[data-displayif][data-equals]')).forEach((arrayElement, index) => {
755
- var group = arrayElement.closest('[data-group]') ? arrayElement.closest('[data-group]') : formElement;
756
- var selector = arrayElement.dataset.activeif;
757
- var value = arrayElement.dataset.equals;
758
- var testElement = group.querySelector("select[data-id=\"".concat(selector, "\"],input[data-id=\"").concat(selector, "\"]"));
759
- if (testElement.value == value) arrayElement.classList.remove('d-none');else arrayElement.classList.add('d-none');
760
- });
761
- }, false);
762
- }
763
-
764
- // @ts-nocheck
765
- /**
766
- * Integrate YouTube videos as a way of hosting videos without the overhead and worry surrounding hosting vides. i.e. file sizes, performance and accessibility.
767
- */
768
- class youtubeVideo {
769
- /** @param {Element} embed dom element */
770
- constructor(embed) {
771
- var createEmbed = this.createEmbed;
772
- // If the scripts is already loaded then lets just create the embed
773
- if (document.body.classList.contains('youtubeLoaded')) {
774
- embed.addEventListener('click', function (e) {
775
- // loop parent nodes from the target to the delegation node
776
- for (var target = e.target; target && target != this; target = target.parentNode) {
777
- if (target.matches('a:not([data-modal-youtube]')) {
778
- e.preventDefault();
779
- createEmbed(embed, target);
780
- break;
781
- }
782
- }
783
- }, false);
784
- } else {
785
- this.loadScripts(embed, this.createEmbed);
786
- }
787
- }
788
- /**
789
- * Load the YouTube scripts before trying to create the embed
790
- * @param {HTMLElement} embed dom element
791
- * @param {Function} createEmbed function to create the embed after script loaded.
792
- */
793
- loadScripts(embed, createEmbed) {
794
- return new Promise((resolve, reject) => {
795
- var image = new Image();
796
- image.onload = function () {
797
- // This code loads the IFrame Player API code asynchronously.
798
- var tag = document.createElement('script');
799
- tag.src = "https://www.youtube.com/iframe_api";
800
- var firstScriptTag = document.getElementsByTagName('script')[0];
801
- firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
802
- document.body.classList.add('youtubeLoaded');
803
- resolve(true);
804
- // script has loaded, you can now use it safely
805
- tag.onload = () => {
806
- embed.addEventListener('click', function (e) {
807
- // loop parent nodes from the target to the delegation node
808
- for (var target = e.target; target && target != this; target = target.parentNode) {
809
- if (target.matches('a:not([data-modal-youtube]')) {
810
- e.preventDefault();
811
- createEmbed(embed, target);
812
- break;
813
- }
814
- }
815
- }, false);
816
- };
817
- };
818
- image.onerror = function () {
819
- reject(false);
820
- };
821
- image.src = "https://youtube.com/favicon.ico";
822
- });
823
- }
824
- /**
825
- * Create the YouTube embed after the user has clicked on it.
826
- * @param {HTMLElement} embed dom element
827
- */
828
- createEmbed(embed, target) {
829
- // If there is more than one video lets make sure there is only one playing at a time.
830
- if (typeof window.player != "undefined" && typeof window.player.pauseVideo == "function") window.player.pauseVideo();
831
- var video_id = target.getAttribute('data-id');
832
- var link_id = target.getAttribute('id');
833
- // create an id to pass t the script if one isn't present
834
- if (typeof link_id == 'undefined' || link_id == null) {
835
- var randLetter = String.fromCharCode(65 + Math.floor(Math.random() * 26));
836
- link_id = randLetter + Date.now();
837
- target.setAttribute('id', link_id);
838
- }
839
- // This function creates an <iframe> (and YouTube player) after the API code downloads.
840
- function onYouTubeIframeAPIReady() {
841
- window.player = new YT.Player(link_id, {
842
- height: '100%',
843
- width: '100%',
844
- videoId: video_id,
845
- playerVars: {
846
- 'modestbranding': 1,
847
- 'playsinline': 1,
848
- 'rel': 0,
849
- 'showinfo': 0
850
- },
851
- events: {
852
- 'onReady': onPlayerReady,
853
- 'onStateChange': onPlayerStateChange
854
- }
855
- });
856
- }
857
- onYouTubeIframeAPIReady();
858
- // The API will call this function when the video player is ready.
859
- function onPlayerReady(event) {
860
- // Play the video straight away
861
- event.target.playVideo();
862
- }
863
- // The API calls this function when the player's state changes.
864
- // The function indicates that when playing a video (state=1)
865
- var done = false;
866
- function onPlayerStateChange(event) {
867
- if (event.data == YT.PlayerState.PLAYING && !done) {
868
- var link = document.getElementById(link_id);
869
- link.classList.add('player-ready');
870
- done = true;
871
- }
872
- }
873
- }
874
- }
875
-
876
- // @ts-nocheck
877
- var modal = element => {
878
- var links = element.querySelectorAll('.modal__outer a, .modal__outer button');
879
- var firstLink = links[0];
880
- var lastLink = links[links.length - 1];
881
- var modalID = element.getAttribute('id');
882
- var closeModal = function closeModal() {
883
- var button = document.querySelector('[href="' + window.location.hash + '"]');
884
- button.focus();
885
- window.location.hash = "close";
886
- history.replaceState("", document.title, window.location.pathname + window.location.search);
887
- // If there is more than one video lets make sure there is only one playing at a time.
888
- if (typeof window.player != "undefined" && typeof window.player.pauseVideo == "function") window.player.pauseVideo();
889
- };
890
- // Trap the tab focus inside
891
- element.addEventListener('keydown', function (e) {
892
- if (e.key === "Tab" && e.shiftKey && document.activeElement == firstLink) {
893
- e.preventDefault();
894
- lastLink.focus();
895
- } else if (e.key === "Tab" && !e.shiftKey && document.activeElement == lastLink) {
896
- e.preventDefault();
897
- firstLink.focus();
898
- }
899
- });
900
- // ESC will close the open modal
901
- document.addEventListener("keydown", function (e) {
902
- if (e.key === "Escape" && document.querySelector('.modal:target')) closeModal();
903
- });
904
- element.addEventListener('click', function (e) {
905
- for (var target = e.target; target && target != this; target = target.parentNode) {
906
- // Close links will close the model by default but we want to remove the hash link also
907
- if (target.matches('[href="#close"]')) {
908
- e.preventDefault();
909
- closeModal();
910
- break;
911
- }
912
- // Dock the modal to the right or left to make the content behind readable
913
- else if (target.matches('.modal__dock--right')) {
914
- e.preventDefault();
915
- if (!element.classList.contains('modal--left')) element.classList.add('modal--right');
916
- element.classList.remove('modal--left');
917
- break;
918
- } else if (target.matches('.modal__dock--left')) {
919
- e.preventDefault();
920
- if (!element.classList.contains('modal--right')) element.classList.add('modal--left');
921
- element.classList.remove('modal--right');
922
- break;
923
- }
924
- }
925
- });
926
- function locationHashChanged() {
927
- if (location.hash === '#' + modalID) {
928
- console.log("Modal is now open");
929
- var videoButton = document.querySelector('.modal:target .modal__inner > .youtube-embed:first-child:last-child a');
930
- console.log(videoButton);
931
- if (videoButton) {
932
- videoButton.click();
933
- }
934
- }
935
- }
936
- window.onhashchange = locationHashChanged;
937
- };
938
-
939
- // @ts-nocheck
940
- // Attach classes to dom elements
941
- document.addEventListener("DOMContentLoaded", function () {
942
- addBodyClasses(document.body);
943
- addGlobalEvents();
944
- checkElements(document.body);
945
- console.log('test.js');
946
- // ANav
947
- Array.from(document.querySelectorAll('.nav')).forEach(arrayElement => {
948
- navbar(arrayElement);
949
- });
950
- // Advanced tables
951
- Array.from(document.querySelectorAll('.table__wrapper')).forEach(arrayElement => {
952
- table(arrayElement);
953
- });
954
- // Accordions
955
- Array.from(document.querySelectorAll('.accordion')).forEach(arrayElement => {
956
- accordion(arrayElement);
957
- });
958
- // Testimonial
959
- Array.from(document.querySelectorAll('.testimonial')).forEach(arrayElement => {
960
- testimonial(arrayElement);
961
- });
962
- // Carousel
963
- Array.from(document.querySelectorAll('.carousel')).forEach(arrayElement => {
964
- carousel(arrayElement);
965
- });
966
- // Form
967
- Array.from(document.querySelectorAll('form')).forEach(arrayElement => {
968
- form(arrayElement);
969
- });
970
- // Modal
971
- Array.from(document.querySelectorAll('.modal')).forEach(arrayElement => {
972
- modal(arrayElement);
973
- });
974
- // YouTube videos
975
- Array.from(document.querySelectorAll('.youtube-embed')).forEach(arrayElement => {
976
- new youtubeVideo(arrayElement);
977
- });
978
- window.addEventListener('hashchange', function () {
979
- var hash = location.hash.replace('#', '');
980
- var label = document.querySelector("label[for=\"".concat(hash, "\"]"));
981
- if (label instanceof HTMLElement) {
982
- label.click();
983
- }
984
- }, false);
985
- });
986
-
987
- }));
64
+ </style>
65
+ <div class="header-banner">
66
+ <div class="container" part="container">
67
+ <slot name="breadcrumb"></slot>
68
+ <div class="header-banner__inner">
69
+ <slot></slot>
70
+ </div>
71
+ </div>
72
+ <picture>
73
+ <!-- Actual image only loaded on desktops -->
74
+ <source srcset="" media="(min-width: 62em)">
75
+ <!-- Placeholder image -->
76
+ <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="" lazy="" />
77
+ </picture>
78
+ </div>
79
+ `),this.shadowRoot.appendChild(i.content.cloneNode(!0))}connectedCallback(){var o=this.shadowRoot.querySelector("picture"),r=this.shadowRoot.querySelector("picture source");this.hasAttribute("image")?r.setAttribute("srcset",this.getAttribute("image")):o.remove()}}function Z(e){var o=e.querySelectorAll("details"),r=e.querySelectorAll("summary");if(o.forEach(n=>{n.classList.add("accordion-item")}),r.forEach(n=>{n.classList.add("accordion-header"),n.classList.add("accordion-button"),n.classList.add("h4")}),!e.classList.contains("accordion--keep-open")){var i=e.querySelectorAll(":scope > details");i.forEach(n=>{n.addEventListener("click",()=>{i.forEach(s=>{s!==n&&s.removeAttribute("open")})})})}}var M=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets";class $ extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});var o=document.createElement("template");o.innerHTML=`
80
+ <style>
81
+ @import "`.concat(M,`/css/core.min.css";
82
+ @import "`).concat(M,`/css/components/accordion.css";
83
+ `).concat(this.hasAttribute("css")?'@import "'.concat(this.getAttribute("css"),'";'):"",`
84
+ </style>
85
+ <div class="accordion">
86
+ <slot></slot>
87
+ </div>
88
+ `),this.shadowRoot.appendChild(o.content.cloneNode(!0))}connectedCallback(){Z(this),this.insertAdjacentHTML("beforebegin",'<link rel="stylesheet" href="'.concat(M,'/css/components/accordion.css">'))}}var W=function(o){var r=o.querySelectorAll(":scope > details");o.querySelectorAll(":scope > details > summary");var i=o.querySelector(":scope > .tabs__links");o.shadowRoot&&o.shadowRoot.querySelector(".tabs__links")&&(i=o.shadowRoot.querySelector(".tabs__links")),i||(i=document.createElement("div"),i.classList.add("tabs__links"),o.prepend(i)),r.forEach((n,s)=>{var c=n.querySelector(":scope > summary");c.classList.add("visually-hidden");var a=document.createElement("button");n.hasAttribute("id")&&(a=document.createElement("a"),a.setAttribute("href","#".concat(n.getAttribute("id")))),n.hasAttribute("open")&&a.setAttribute("aria-pressed",!0),a.innerHTML="".concat(c.innerText),a.classList.add("link"),a.setAttribute("data-index",s),a.setAttribute("tabindex","-1"),i.appendChild(a)})},ee=function(o){var r=o.querySelectorAll(":scope > details"),i=o.querySelectorAll(":scope > details > summary"),n=o.querySelectorAll(":scope > .tabs__links > button, .tabs__links > a");o.shadowRoot&&(n=o.shadowRoot.querySelectorAll(".tabs__links > button, .tabs__links > a")),n.forEach(s=>{s.addEventListener("click",c=>{c.preventDefault(),n.forEach(a=>{var d=a==s;a.setAttribute("aria-pressed",d)}),r.forEach((a,d)=>{var v=s.getAttribute("data-index")==d;v?a.setAttribute("open",v):a.removeAttribute("open")}),s.hasAttribute("href")&&history.pushState(void 0,void 0,s.getAttribute("href"))})}),i.forEach((s,c)=>{s.addEventListener("focus",a=>{n.forEach(d=>{d.classList.remove("focus")}),n[c].classList.add("focus")}),s.addEventListener("click",a=>{a.preventDefault(),n[c].click()})})},te=function(o){var r=o.querySelectorAll(":scope > details"),i=o.querySelectorAll(":scope > .tabs__links > button, .tabs__links > a");o.shadowRoot&&(i=o.shadowRoot.querySelectorAll(".tabs__links > button, .tabs__links > a")),location.hash&&o.querySelector('.tabs__links [href="'.concat(location.hash,'"]'))?(o.querySelector('[href="'.concat(location.hash,'"]')).setAttribute("open",!0),o.querySelector('details[id="'.concat(location.hash.replace("#",""),'"]')).setAttribute("open",!0)):o.querySelector("details[open]")||(r[0].setAttribute("open",!0),i[0].setAttribute("aria-pressed",!0))},ae=function(o){W(o),ee(o),te(o)};class re extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});var o=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",r='@import "'.concat(o,'/css/components/tabs.css";'),i=document.createElement("template");i.innerHTML=`
89
+ <style>
90
+ @import "`.concat(o,`/css/core.min.css";
91
+ `).concat(r,`
92
+
93
+ `).concat(this.hasAttribute("css")?'@import "'.concat(this.getAttribute("css"),'";'):"",`
94
+ </style>
95
+ <div class="tabs">
96
+ <div class="tabs__links"></div>
97
+ <slot></slot>
98
+ </div>
99
+ `),this.shadowRoot.appendChild(i.content.cloneNode(!0))}connectedCallback(){ae(this)}}document.addEventListener("DOMContentLoaded",function(){k(document.body),P(),F(document.body),window.customElements.get("iam-header")||window.customElements.define("iam-header",X),window.customElements.get("iam-accordion")||window.customElements.define("iam-accordion",$),window.customElements.get("iam-tabs")||window.customElements.define("iam-tabs",re),Array.from(document.querySelectorAll(".nav")).forEach(e=>{E(e)}),Array.from(document.querySelectorAll(".table__wrapper")).forEach(e=>{H(e)}),Array.from(document.querySelectorAll(".testimonial")).forEach(e=>{V(e)}),Array.from(document.querySelectorAll(".carousel")).forEach(e=>{z(e)}),Array.from(document.querySelectorAll("form")).forEach(e=>{Q(e)}),Array.from(document.querySelectorAll(".modal")).forEach(e=>{J(e)}),Array.from(document.querySelectorAll(".youtube-embed")).forEach(e=>{new U(e)}),window.addEventListener("hashchange",function(){var e=location.hash.replace("#",""),o=document.querySelector('label[for="'.concat(e,'"]'));o instanceof HTMLElement&&o.click()},!1)})});
988
100
  //# sourceMappingURL=scripts.bundle.js.map