# JS Functional Event Map

Tujuan: memudahkan tracking error dari elemen HTML ke fungsi JS setelah refactor.

## Konvensi
- Global object: `window.<Module>UI`
- Struktur minimal: `init()`, `bindEvents()`, fungsi action spesifik
- Kompatibilitas lama: alias global dipertahankan sementara

## Master Question

### `resources/views/js/mstqst.blade.php`
- Object: `MstqstUI`
- Entry point: `MstqstUI.init()`
- Functions:
  - `deleteData(event, name, msg)`
  - `bindPreviewModal()`
- Alias legacy:
  - `window.deleteData(...)`

### `resources/views/js/trnqsd.blade.php`
- Object: `TrnqsdUI`
- Entry point: `TrnqsdUI.init()`
- Functions:
  - `toggleQuestionType()`
  - `questionImageChanged(input)`
  - `removeQuestionImage(event)`
  - `bindDropzone()`
  - `confirmDelete(event, button)`
  - `bindPreviewModal()`
- Alias legacy:
  - `window.confirmDelete(...)`

### `resources/views/trnqsd/partials/modal_add.blade.php`
- Object global: `ExamControls`
  - `triggerOptionImage(btn)`
  - `optionImageChanged(input)`
  - `toggleOptionImageSwitch(el)`
- Object lokal:
  - `QuestionBulkUI` (select all + bulk delete)

### `resources/views/master/mstqst/partials/workspace_detail_card.blade.php`
- Object: `MstqstDetailUI`
- Functions:
  - `getBoxes()`
  - `syncState()`
  - `bindEvents()`

## Assessment Menus

### `trsexm`
- `resources/views/js/trsexm.blade.php`
  - Object: `trsexmListUI`
  - Functions: `initDataTable()`, `resetFilter()`, `bindEvents()`
- `resources/views/assesm/trsexm/_partials/form_scripts.blade.php`
  - Object: `trsexmManageUI`
  - Functions:
    - timer: `startGlobalSessionTimer()`, `applyTimerTimeBounds()`
    - polling: `fetchLiveStatus()`, `syncTimerStatus()`
    - pagination/filter: `renderParticipantPagination()`, `goToParticipantPage()`, `changeParticipantRowsPerPage()`, `filterParticipants()`
    - action: `toggleTimerMode(mode)`, `handleAction(type)`
  - Alias legacy:
    - `window.goToParticipantPage(...)`
    - `window.changeParticipantRowsPerPage(...)`
    - `window.filterParticipants(...)`
    - `window.toggleTimerMode(...)`
    - `window.handleAction(...)`
- `resources/views/assesm/trsexm/_partials/data_table.blade.php`
  - Object: `trsexmListCountdownUI`
  - Functions: `formatDhms()`, `tick()`, `init()`

### `trsuex`
- `resources/views/js/trsuex.blade.php`
  - Object: `trsuexListUI`
  - Functions: `initDataTable()`, `init()`
- `resources/views/assesm/trsuex/_partials/run_scripts.blade.php`
  - Object: `UsrtrsexmUI`
  - Facade untuk fungsi existing: draft/autosave/timer/submit/live status
  - Alias legacy:
    - `window.confirmSubmit()`
    - `window.goToQuestion(num)`
- `resources/views/assesm/trsuex/list.blade.php`
  - Object: `trsuexListCountdownUI`
  - Functions: `formatHms()`, `syncTimerStatus()`, `hardReloadCurrentPage()`, `tick()`, `init()`
- `resources/views/assesm/trsuex/_partials/exam_list_table.blade.php`
  - Object: `trsuexExamTableCountdownUI`
  - Functions: `formatHms()`, `syncTimerStatus()`, `hardReloadCurrentPage()`, `tick()`, `init()`

### `trseva`
- `resources/views/js/trseva.blade.php`
  - Object: `trsevaUI`
  - Functions:
    - modal detail: `openDetailModal(...)`
    - reschedule: `openReschedule(...)`, `submitReschedule()`
    - evaluasi: `confirmEvaluasi()`
    - util: `escHtml()`
    - table: `initDataTables()`
  - Alias legacy:
    - `window.openDetailModal(...)`
    - `window.openReschedule(...)`
    - `window.submitReschedule()`
    - `window.confirmEvaluasi()`
    - `window.escHtml(...)`

### `trskrk`
- `resources/views/js/trskrk.blade.php`
  - Object: `trskrkUI`
  - Functions: `initDataTable()`, `resetFilter()`, `bindEvents()`, `init()`

### `trsqsl`
- `resources/views/assesm/trsqsl/_partials/package_preview_script.blade.php`
  - Object: `trsqslPackageUI`
  - Functions: `updatePreview()`, `initSelect2()`, `bindEvents()`, `init()`
  - Alias legacy:
    - `window.updatePreview()`

## Kandidat Lanjutan (Belum Distandarkan)
- `resources/views/js/trsatd.blade.php` masih dominan function global + jQuery ready.
- `resources/views/master/mstqst/partials/workspace_create_js.blade.php` masih script panjang langsung dalam `DOMContentLoaded` (belum object wrapper).

## Cara Tracking Error
1. Temukan elemen HTML pemicu (`onclick`, `onchange`, selector event).
2. Cari fungsi pada object UI terkait modul.
3. Telusuri fungsi util/network yang dipanggil.
4. Jika error dari alias legacy, pindah ke method object tujuan untuk root-cause.