Modals for all 100+ Communities are shipped with the DOM. As modals are JS-only, this behaviour can and should be replaced.
Suggested behaviour:
A modal skeleton is shipped. With JS enabled, this modal is hydrated each time the QR code icon is clicked.
Benefits:
The main benefit is reducing and good practices.
Futhermore, additional information can be included in the modal, such as creation date, staff coverage, etc; see #6. This allows users to better decide what Communities to join.
Move QR code functions from qr_modals.php to utility file
Replace HTML generated for QR code modals with draft of modal skeleton
Use QR code utility functions based on chosen method:
Download QR codes into /output/qr during data fetch, or
Add base64 QR codes as new tab links in Community table
Figure out what modal should show
Then include intended information in table row data attributes
Prapre standard functions to fetch these data attributes from a table row
Same for parsing the base64 QR code, if applicable
Flesh out modal skeleton with these fields
Change displayQRModal to hydrate modal skeleton
Touch-up modal design
**Current behaviour**:
Modals for all 100+ Communities are shipped with the DOM. As modals are JS-only, this behaviour can and should be replaced.
**Suggested behaviour**:
A modal skeleton is shipped. With JS enabled, this modal is hydrated each time the QR code icon is clicked.
**Benefits**:
The main benefit is reducing and good practices.
Futhermore, additional information can be included in the modal, such as creation date, staff coverage, etc; see #6. This allows users to better decide what Communities to join.
**Tasks**:
- Choose method to serve QR codes, see #11
- Move QR code functions from [qr_modals.php](sites/+components/qr_modals.php) to utility file
- Replace HTML generated for QR code modals with draft of modal skeleton
- Use QR code utility functions based on chosen method:
- Download QR codes into `/output/qr` during data fetch, or
- Add base64 QR codes as new tab links in Community table
- Figure out what modal should show
1. Then include intended information in table row data attributes
1. Prapre standard functions to fetch these data attributes from a table row
1. Same for parsing the base64 QR code, if applicable
1. Flesh out modal skeleton with these fields
- Change `displayQRModal` to hydrate modal skeleton
- Touch-up modal design
gravel
changed title from Dynamic modals to Convert modals to dynamic1 year ago
Current behaviour:
Modals for all 100+ Communities are shipped with the DOM. As modals are JS-only, this behaviour can and should be replaced.
Suggested behaviour:
A modal skeleton is shipped. With JS enabled, this modal is hydrated each time the QR code icon is clicked.
Benefits:
The main benefit is reducing and good practices.
Futhermore, additional information can be included in the modal, such as creation date, staff coverage, etc; see #6. This allows users to better decide what Communities to join.
Tasks:
/output/qrduring data fetch, ordisplayQRModalto hydrate modal skeletonDynamic modalsto Convert modals to dynamic 1 year agoI'd also like to make case to switch to
<dialog>for accessiblity reasons.https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog