frayerjj-frontend 0.1.32 → 0.1.34

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 (2) hide show
  1. package/package.json +1 -1
  2. package/src/init.js +68 -63
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "frayerjj-frontend",
3
- "version": "0.1.32",
3
+ "version": "0.1.34",
4
4
  "description": "My base frontend for various projects",
5
5
  "main": "src/index.js",
6
6
  "type": "module",
package/src/init.js CHANGED
@@ -1,78 +1,83 @@
1
1
  import { message } from './message';
2
2
  import { modal } from './modal';
3
3
  import { validate } from './validate';
4
+ import { loading } from './loading';
4
5
 
5
6
  export const init = () => {
7
+
8
+ loading.init();
6
9
 
7
- message.verbose('Page Loaded, Initializing');
8
- validate.init();
9
- modal.ajax.init();
10
-
11
- // Updates the id in the form action inside a modal. Used for delete confirm and edit modals.
12
- document.querySelectorAll('.modal-uuid-update').forEach(el => {
13
- message.verbose('Enabling Modal UUID Update');
14
- el.addEventListener('click', ev => {
15
- message.verbose('Updating Modal UUID');
16
- ev.preventDefault();
17
- let uuid = el.getAttribute('inst-uuid'),
18
- modalSelector = el.getAttribute('data-bs-target'),
19
- form = document.querySelector(`${modalSelector} form`);
20
- if (uuid.match(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i) && form) {
21
- let action = form.getAttribute('action');
22
- if (action.match(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i))
23
- action = action.replace(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i, uuid);
24
- form.setAttribute('action', action);
25
- }
26
- else {
27
- message.warn('Unable to update modal UUID.');
28
- modal.close();
29
- modal.alert('Error', 'Unable to initialize form.');
30
- }
10
+ window.addEventListener('load', () => {
11
+ message.verbose('Page Loaded, Initializing');
12
+ validate.init();
13
+ modal.ajax.init();
14
+
15
+ // Updates the id in the form action inside a modal. Used for delete confirm and edit modals.
16
+ document.querySelectorAll('.modal-uuid-update').forEach(el => {
17
+ message.verbose('Enabling Modal UUID Update');
18
+ el.addEventListener('click', ev => {
19
+ message.verbose('Updating Modal UUID');
20
+ ev.preventDefault();
21
+ let uuid = el.getAttribute('inst-uuid'),
22
+ modalSelector = el.getAttribute('data-bs-target'),
23
+ form = document.querySelector(`${modalSelector} form`);
24
+ if (uuid.match(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i) && form) {
25
+ let action = form.getAttribute('action');
26
+ if (action.match(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i))
27
+ action = action.replace(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/i, uuid);
28
+ form.setAttribute('action', action);
29
+ }
30
+ else {
31
+ message.warn('Unable to update modal UUID.');
32
+ modal.close();
33
+ modal.alert('Error', 'Unable to initialize form.');
34
+ }
35
+ });
31
36
  });
32
- });
33
37
 
34
- // Automatically submits on change. Used in Page Nav Selects.
35
- document.querySelectorAll('.change-submit').forEach(el => {
36
- message.verbose('Enabling Change Submit');
37
- el.addEventListener('change', () => {
38
- message.verbose('Change Submit Triggered');
39
- el.closest('form').submit();
38
+ // Automatically submits on change. Used in Page Nav Selects.
39
+ document.querySelectorAll('.change-submit').forEach(el => {
40
+ message.verbose('Enabling Change Submit');
41
+ el.addEventListener('change', () => {
42
+ message.verbose('Change Submit Triggered');
43
+ el.closest('form').submit();
44
+ });
40
45
  });
41
- });
42
46
 
43
- // Confirm/Delete Modals
44
- document.querySelectorAll('.confirm-link').forEach(el => {
45
- message.verbose('Enabling Confirm Link');
46
- el.addEventListener('click', ev => {
47
- message.verbose('Confirm Link Triggered');
48
- ev.preventDefault();
49
- modal.confirm(
50
- el.getAttribute('confirm-msg') || 'Are you sure?',
51
- () => {
52
- location.href = el.getAttribute('href');
53
- },
54
- () => {},
55
- el.getAttribute('confirm-title') || 'Confirm',
56
- el.getAttribute('confirm-yes') || 'Yes',
57
- el.getAttribute('confirm-no') || 'No');
47
+ // Confirm/Delete Modals
48
+ document.querySelectorAll('.confirm-link').forEach(el => {
49
+ message.verbose('Enabling Confirm Link');
50
+ el.addEventListener('click', ev => {
51
+ message.verbose('Confirm Link Triggered');
52
+ ev.preventDefault();
53
+ modal.confirm(
54
+ el.getAttribute('confirm-msg') || 'Are you sure?',
55
+ () => {
56
+ location.href = el.getAttribute('href');
57
+ },
58
+ () => {},
59
+ el.getAttribute('confirm-title') || 'Confirm',
60
+ el.getAttribute('confirm-yes') || 'Yes',
61
+ el.getAttribute('confirm-no') || 'No');
62
+ });
58
63
  });
59
- });
60
64
 
61
- // Scroll to top button
62
- let toTop = document.getElementById('toTopBtn');
63
- toTop.style.visibility = "hidden";
64
- toTop.addEventListener('click', () => {
65
- message.verbose('Scrolling to Top');
66
- scrollTo(0, 0);
67
- });
68
- window.addEventListener('scroll', () => {
69
- if (scrollY > 1500) {
70
- message.verbose('Scrolling to Top Button Visible');
71
- toTop.style.visibility = "visible";
72
- } else {
73
- message.verbose('Scrolling to Top Button Hidden');
74
- toTop.style.visibility = "hidden";
75
- }
65
+ // Scroll to top button
66
+ let toTop = document.getElementById('toTopBtn');
67
+ toTop.style.visibility = "hidden";
68
+ toTop.addEventListener('click', () => {
69
+ message.verbose('Scrolling to Top');
70
+ scrollTo(0, 0);
71
+ });
72
+ window.addEventListener('scroll', () => {
73
+ if (scrollY > 1500) {
74
+ message.verbose('Scrolling to Top Button Visible');
75
+ toTop.style.visibility = "visible";
76
+ } else {
77
+ message.verbose('Scrolling to Top Button Hidden');
78
+ toTop.style.visibility = "hidden";
79
+ }
80
+ });
76
81
  });
77
82
 
78
83
  }