Skip to content

commjoen/parsergame

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

73 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Parser Game

An interactive web-based game to learn sentence parsing and grammatical analysis. Challenge yourself to identify verbs, nouns, subjects, predicates, and adjectives in sentences across three languages: English, German, and Dutch.

๐ŸŽฎ Play the Game

Play Parser Game on GitHub Pages

๐ŸŒŸ Features

  • Multi-language Support: Play in English, German, or Dutch
  • 300+ Sentences: Each language has over 300 unique sentences (8-50 words each)
  • 6 Challenge Types:
    • Select all verbs in a sentence
    • Select all nouns in a sentence
    • Select the subject of a sentence
    • Select the predicate of a sentence
    • Select all adjectives in a sentence
    • Select all prepositions in a sentence
  • Mixed Mode: Challenge yourself by rotating through all grammatical elementsโ€”every question asks for a different type
  • Interactive UI: Click on words to select them
  • Real-time Feedback: Immediate visual feedback on correct/incorrect selections
  • Score Tracking: Points awarded for correct identifications
  • Responsive Design: Works on desktop, tablet, and mobile devices

๐Ÿš€ Getting Started

Play Online

Visit https://commjoen.github.io/parsergame/ to play immediately.

Run Locally

  1. Clone this repository:

    git clone https://github.com/commjoen/parsergame.git
    cd parsergame
  2. Open index.html in your web browser

    # On macOS
    open index.html
    
    # On Linux
    xdg-open index.html
    
    # On Windows
    start index.html
  3. Or serve with a local web server:

    # Using Python 3
    python -m http.server 8000
    
    # Using Node.js
    npx serve .

๐Ÿงช Testing

Run the test suite by opening test.html in your browser. The tests verify:

  • Sentence database integrity
  • Translation completeness
  • Game logic functionality
  • Word count validation (8-50 words per sentence)

๐Ÿ“ File Structure

parsergame/
โ”œโ”€โ”€ index.html          # Main game interface
โ”œโ”€โ”€ styles.css          # Game styling and responsive design
โ”œโ”€โ”€ game.js            # Core game logic and interactions
โ”œโ”€โ”€ sentences.js       # Sentence database (250+ per language)
โ”œโ”€โ”€ translations.js    # Multi-language UI translations
โ”œโ”€โ”€ test.html          # Test suite for validation
โ”œโ”€โ”€ README.md          # Project documentation
โ”œโ”€โ”€ LICENSE            # GPL-3.0 license
โ””โ”€โ”€ .gitignore         # Git ignore rules

๐ŸŽฏ How to Play

  1. Select Language: Choose from English, German, or Dutch
  2. Choose Challenge: Pick what grammatical element to identify
  3. Read the Sentence: A sentence will be displayed with clickable words
  4. Make Selections: Click on words you think match the challenge
  5. Check Answer: Click "Check Answer" to see results
  6. Learn from Feedback: Green = correct, Red = incorrect, Orange = missed
  7. Continue: Move to the next question and improve your score

๐Ÿ† Scoring

  • Perfect Answer: 10 points
  • Partial Answer: 1-9 points based on accuracy
  • Wrong Answer: 0 points

๐ŸŒ Languages Supported

User Interface Languages

  • English: Full interface translation
  • German (Deutsch): Complete German interface
  • Dutch (Nederlands): Complete Dutch interface

Sentence Languages

Each language contains 300+ unique sentences covering various topics and grammatical structures.

๐Ÿ› ๏ธ Technical Details

  • Pure HTML/CSS/JavaScript: No frameworks or build tools required
  • Responsive Design: CSS Grid and Flexbox for all screen sizes
  • Accessibility: Semantic HTML and keyboard navigation support
  • Cross-browser Compatible: Works in all modern web browsers
  • Semantic Versioning: Automatic version management and releases

๐Ÿค Contributing

Contributions are welcome! Here are ways to help:

  1. Add More Sentences: Expand the sentence database
  2. Improve Translations: Enhance language support
  3. Fix Bugs: Report and fix issues
  4. Add Features: Suggest and implement new game modes

Development Setup

  1. Fork the repository
  2. Make your changes
  3. Test with test.html
  4. Submit a pull request

Note: The site is automatically deployed to GitHub Pages when changes are merged to the main branch via GitHub Actions.

๐Ÿ“ License

This project is licensed under the GPL-3.0 License - see the LICENSE file for details.

๐Ÿ™ Acknowledgments

  • Sentence examples inspired by common grammatical patterns
  • Multi-language support for educational accessibility
  • Open source educational tools community

Educational Purpose: This game is designed as a learning tool for grammar and sentence structure. It's suitable for students, teachers, and anyone interested in improving their grammatical analysis skills.

Packages

 
 
 

Contributors 5