https://bikeindex.org/assets/controllers/register/organization_con…9c114060e923026f905ff4646a86053784b11976.js

1import { Controller } from '@hotwired/stimulus'
2import { collapseField } from 'utils/collapse_utils'
3
4/* global window */
5
6// Connects to data-controller='register--organization'
7//
8// The organization assigned from who the registrant is, which step 2 offers to drop -
9// what it asks for goes with it. The address is register--status-fields' to show or
10// hide, since the status has a say in that one too, so this only leaves it the answer
11// to read. The checkbox is only rendered for an automatic assignment, so without one
12// there is nothing here to toggle.
13export default class extends Controller {
14  static targets = ['checkbox', 'field', 'label', 'statusField']
15
16  connect () {
17    // form-persist restores a drafted checkbox by assignment, firing no event
18    this.boundRestore = () => this.apply(0)
19    window.addEventListener('form-persist:restored', this.boundRestore)
20    this.apply(0)
21  }
22
23  disconnect () {
24    window.removeEventListener('form-persist:restored', this.boundRestore)
25  }
26
27  toggle () {
28    this.apply()
29  }
30
31  apply (duration) {
32    if (!this.hasCheckboxTarget) return
33
34    const registering = this.checkboxTarget.checked
35    this.fieldTargets.forEach((field) => collapseField(field, registering, duration))
36    this.labelTargets.forEach((label) => {
37      label.textContent = JSON.parse(label.dataset.texts)[registering ? 'on' : 'off']
38    })
39    this.statusFieldTargets.forEach((field) => {
40      if (registering) delete field.dataset.organizationOff
41      else field.dataset.organizationOff = 'true'
42    })
43    // Announced rather than applied: register--status-fields reads the flag, and which of
44    // us runs first isn't ours to decide when we're both answering form-persist's restore.
45    // With our duration - dropping it left a restore animating what we applied instantly.
46    this.dispatch('changed', { detail: { duration } })
47  }
48};