How salamander2/nomenv works
Inorganic Nomenclature Quizzes is a browser-based quiz for practicing inorganic compound names and formulas. The user workflow is to configure question types, receive generated ionic or covalent questions, submit or request help with answers, and review a scored summary that can be printed as a PDF. The app also provides reference and information panels. The sampled code shows data loading, question generation, answer recording, and summary rendering; some panel details are known only from the source index, so their internal links are limited to documented imports and relationships.
Main entry points: App.vue App shell · MainPanel.vue Quiz coordinator · QuestionPanel.vue Answer interaction · QuestionSummaryPanel.vue Results summary
Components 19
Quiz flow
- App shell
src/App.vue - Quiz coordinator
src/components/MainPanel.vue - Question generation
src/components/MainPanel.vue - Quiz options
src/components/OptionsPanel.vue - Answer interaction
src/components/QuestionPanel.vue
Quiz state and data
- App state
src/stores/appState.ts - Current question
src/stores/question.ts - Question history
src/stores/questionLists.ts - Ion dataset
src/res/ions.dat - Ion lists
src/stores/ionLists.ts - Ion definitions
src/constants.ts
Reference panels
- About panel
src/components/AboutPanel.vue - Periodic table
src/components/PeriodicPanel.vue - Question help
src/components/HelpPanel.vue - Usage help
src/components/UsageHelpPanel.vue - Modal panel
src/components/SimplePanel.vue
Results and output
- Results summary
src/components/QuestionSummaryPanel.vue - PDF generator
src/components/QuestionSummaryPanel.vue
Other components
- Quiz user
Connections 25
- Quiz user → App shell: uses
README.md - App shell → Ion dataset: loads
src/App.vue - App shell → Ion lists: populates
src/App.vue - App shell → App state: marks ready
src/App.vue - App shell → Quiz coordinator: renders
src/App.vue - App shell → About panel: opens
src/App.vue - App shell → Periodic table: toggles
src/App.vue - Quiz coordinator → App state: watches
src/components/MainPanel.vue - Quiz coordinator → Quiz options: renders
src/components/MainPanel.vue - Quiz coordinator → Answer interaction: renders
src/components/MainPanel.vue - Quiz coordinator → Results summary: renders
src/components/MainPanel.vue - Quiz coordinator → Question generation: runs
src/components/MainPanel.vue - Question generation → Ion lists: selects ions
src/components/MainPanel.vue - Question generation → Current question: sets question
src/components/MainPanel.vue - Question generation → Question history: checks duplicates
src/components/MainPanel.vue - Quiz options → App state: sets options
src/components/OptionsPanel.vue - Answer interaction → Current question: reads question
src/components/QuestionPanel.vue - Answer interaction → Question history: records answers
src/components/QuestionPanel.vue - Answer interaction → Question help: opens help
src/components/QuestionPanel.vue - Answer interaction → Modal panel: renders modal
src/components/QuestionPanel.vue - Ion lists → Ion definitions: uses ion type
src/stores/ionLists.ts - Results summary → Question history: reads results
src/components/QuestionSummaryPanel.vue - Results summary → PDF generator: creates PDF
src/components/QuestionSummaryPanel.vue - Question help → Modal panel: uses modal
src/components/HelpPanel.vue - Usage help → Modal panel: uses modal
src/components/UsageHelpPanel.vue