# Build process example
hugo-templates/scripts/build.sh \
  --template educational \
  --content ./mod_linux_base/content \
  --theme compose \
  --components quiz-engine \
  --output ./dist

{
  "name": "linux-base",
  "version": "1.2.0",
  "type": "educational",
  "build": {
    "template": "educational",
    "theme": "compose",
    "components": ["quiz-engine", "progress-tracker"]
  },
  "site": {
    "title": "Linux Basics Course",
    "description": "Complete beginner guide to Linux",
    "baseURL": "https://linux-base.infotecha.ru"
  },
  "content": {
    "source": "./content",
    "destination": "linux-base"
  }
}

class QuizEngine {
  constructor(config) {
    this.questions = config.questions;
    this.currentQuestion = 0;
    this.score = 0;
    this.answers = [];
  }

  async loadQuiz(quizId) {
    // Load quiz configuration from JSON
    const response = await fetch(`/quizzes/${quizId}.json`);
    const config = await response.json();
    return new Quiz(config);
  }

  renderQuestion(questionIndex) {
    const question = this.questions[questionIndex];
    // Render question with appropriate UI
  }

  submitAnswer(answer) {
    // Process answer and update score
    this.answers[this.currentQuestion] = answer;
    this.calculateScore();
    this.nextQuestion();
  }
}

<!-- Quiz embedded in course content -->
<div id="quiz-container" data-quiz-id="linux-basics-01"></div>
<script>
  document.addEventListener('DOMContentLoaded', function() {
    const quiz = new QuizEngine({
      container: '#quiz-container',
      quizId: 'linux-basics-01',
      onComplete: function(results) {
        console.log('Quiz completed:', results);
      }
    });
    quiz.initialize();
  });
</script>

# .github/workflows/module-updated.yml
name: Module Content Updated

on:
  repository_dispatch:
    types: [module-updated]

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout hugo-templates
        uses: actions/checkout@v4
        with:
          repository: info-tech-io/hugo-templates
          token: ${{ secrets.PAT_TOKEN }}

      - name: Get module configuration
        run: |
          MODULE_REPO="${{ github.event.client_payload.repository }}"
          curl -H "Authorization: token ${{ secrets.PAT_TOKEN }}" \
               "https://api.github.com/repos/${MODULE_REPO}/contents/module.json" \
               | jq -r .content | base64 -d > module.json

      - name: Build site
        run: |
          npm install
          chmod +x scripts/build.sh
          scripts/build.sh --config module.json

      - name: Deploy to production
        run: |
          scripts/deploy.sh --target production --config module.json

<VirtualHost *:443>
    ServerName infotecha.ru
    ServerAlias *.infotecha.ru
    DocumentRoot /var/www/infotecha.ru

    # Dynamic subdomain routing
    RewriteEngine On
    RewriteCond %{HTTP_HOST} ^([^.]+)\.infotecha\.ru$
    RewriteRule ^(.*)$ /%1/$1 [L]

    # Security headers
    Header always set Strict-Transport-Security "max-age=31536000; includeSubDomains"
    Header always set X-Frame-Options "SAMEORIGIN"
    Header always set X-Content-Type-Options "nosniff"

    # SSL configuration
    SSLEngine on
    SSLCertificateFile /etc/letsencrypt/live/infotecha.ru/fullchain.pem
    SSLCertificateKeyFile /etc/letsencrypt/live/infotecha.ru/privkey.pem
</VirtualHost>

# Apache Bench results for concurrent users
ab -n 1000 -c 100 https://linux-base.infotecha.ru/

Requests per second:    847.23 [#/sec]
Time per request:       118.036 [ms] (mean)
Time per request:       1.180 [ms] (mean, across all concurrent requests)
Transfer rate:          2051.34 [Kbytes/sec] received

# 1. Create new repository from template
gh repo create info-tech-io/mod_python_basics --template info-tech-io/mod_template

# 2. Configure module.json
cat > module.json << EOF
{
  "name": "python-basics",
  "type": "educational",
  "build": {
    "template": "educational",
    "theme": "compose",
    "components": ["quiz-engine"]
  }
}
EOF

# 3. Add content and push
git add .
git commit -m "feat: initialize Python basics course"
git push origin main

# Deployment happens automatically in 2-3 minutes

#!/bin/bash
# scripts/build.sh - Main build script

set -euo pipefail

CONFIG_FILE=""
OUTPUT_DIR="./dist"
DEPLOY_TARGET=""

while [[ $# -gt 0 ]]; do
  case $1 in
    --config)
      CONFIG_FILE="$2"
      shift 2
      ;;
    --output)
      OUTPUT_DIR="$2"
      shift 2
      ;;
    --deploy)
      DEPLOY_TARGET="$2"
      shift 2
      ;;
    *)
      echo "Unknown option $1"
      exit 1
      ;;
  esac
done

if [[ -z "$CONFIG_FILE" ]]; then
  echo "Error: --config is required"
  exit 1
fi

# Validate configuration
echo "Validating configuration..."
node scripts/validate.js "$CONFIG_FILE"

# Read configuration
MODULE_NAME=$(jq -r '.name' "$CONFIG_FILE")
TEMPLATE=$(jq -r '.build.template' "$CONFIG_FILE")
THEME=$(jq -r '.build.theme' "$CONFIG_FILE")
COMPONENTS=$(jq -r '.build.components[]' "$CONFIG_FILE")

echo "Building $MODULE_NAME with template $TEMPLATE..."

# Setup build environment
BUILD_DIR="./tmp/$MODULE_NAME"
rm -rf "$BUILD_DIR"
mkdir -p "$BUILD_DIR"

# Copy template
cp -r "templates/$TEMPLATE/"* "$BUILD_DIR/"

# Apply theme
if [[ "$THEME" != "null" ]]; then
  cp -r "themes/$THEME/"* "$BUILD_DIR/themes/$THEME/"
fi

# Add components
for component in $COMPONENTS; do
  echo "Adding component: $component"
  cp -r "components/$component/"* "$BUILD_DIR/"
done

# Build with Hugo
cd "$BUILD_DIR"
hugo --minify --destination "$OUTPUT_DIR"

echo "Build complete: $OUTPUT_DIR"

# Deploy if requested
if [[ -n "$DEPLOY_TARGET" ]]; then
  ../scripts/deploy.sh --target "$DEPLOY_TARGET" --source "$OUTPUT_DIR"
fi

// quiz-engine/src/QuizEngine.js
export class QuizEngine {
  constructor(options = {}) {
    this.container = document.querySelector(options.container);
    this.quizId = options.quizId;
    this.onComplete = options.onComplete || (() => {});
    this.onProgress = options.onProgress || (() => {});

    this.questions = [];
    this.currentIndex = 0;
    this.answers = [];
    this.score = 0;
    this.startTime = null;
  }

  async initialize() {
    try {
      const response = await fetch(`/quizzes/${this.quizId}.json`);
      if (!response.ok) {
        throw new Error(`Failed to load quiz: ${response.status}`);
      }

      const config = await response.json();
      this.questions = config.questions;
      this.startTime = Date.now();

      this.render();
    } catch (error) {
      console.error('Quiz initialization failed:', error);
      this.renderError('Failed to load quiz. Please try again.');
    }
  }

  render() {
    if (this.currentIndex >= this.questions.length) {
      this.renderResults();
      return;
    }

    const question = this.questions[this.currentIndex];
    const html = `
      <div class="quiz-question">
        <div class="quiz-progress">
          Question ${this.currentIndex + 1} of ${this.questions.length}
          <div class="progress-bar">
            <div class="progress-fill" style="width: ${(this.currentIndex / this.questions.length) * 100}%"></div>
          </div>
        </div>

        <h3>${question.question}</h3>

        <div class="quiz-options">
          ${question.options.map((option, index) => `
            <label class="quiz-option">
              <input type="radio" name="answer" value="${index}">
              <span>${option}</span>
            </label>
          `).join('')}
        </div>

        <div class="quiz-actions">
          <button class="quiz-submit" disabled>Submit Answer</button>
        </div>

        <div class="quiz-explanation" style="display: none;">
          <h4>Explanation:</h4>
          <p>${question.explanation}</p>
          <button class="quiz-next">Next Question</button>
        </div>
      </div>
    `;

    this.container.innerHTML = html;
    this.attachEventListeners();
  }

  attachEventListeners() {
    const radioButtons = this.container.querySelectorAll('input[type="radio"]');
    const submitButton = this.container.querySelector('.quiz-submit');
    const nextButton = this.container.querySelector('.quiz-next');

    radioButtons.forEach(radio => {
      radio.addEventListener('change', () => {
        submitButton.disabled = false;
      });
    });

    submitButton.addEventListener('click', () => {
      this.submitAnswer();
    });

    if (nextButton) {
      nextButton.addEventListener('click', () => {
        this.nextQuestion();
      });
    }
  }

  submitAnswer() {
    const selectedOption = this.container.querySelector('input[name="answer"]:checked');
    if (!selectedOption) return;

    const answerIndex = parseInt(selectedOption.value);
    const question = this.questions[this.currentIndex];
    const isCorrect = answerIndex === question.correct;

    this.answers[this.currentIndex] = {
      question: this.currentIndex,
      answer: answerIndex,
      correct: isCorrect,
      points: isCorrect ? (question.points || 1) : 0
    };

    if (isCorrect) {
      this.score += question.points || 1;
    }

    // Show explanation
    const explanation = this.container.querySelector('.quiz-explanation');
    explanation.style.display = 'block';

    // Disable submit button
    this.container.querySelector('.quiz-submit').disabled = true;

    // Style correct/incorrect
    const options = this.container.querySelectorAll('.quiz-option');
    options.forEach((option, index) => {
      if (index === question.correct) {
        option.classList.add('correct');
      } else if (index === answerIndex && !isCorrect) {
        option.classList.add('incorrect');
      }
    });

    this.onProgress({
      currentQuestion: this.currentIndex + 1,
      totalQuestions: this.questions.length,
      score: this.score,
      answers: this.answers
    });
  }

  nextQuestion() {
    this.currentIndex++;
    this.render();
  }

  renderResults() {
    const totalPoints = this.questions.reduce((sum, q) => sum + (q.points || 1), 0);
    const percentage = Math.round((this.score / totalPoints) * 100);
    const timeSpent = Math.round((Date.now() - this.startTime) / 1000);

    const html = `
      <div class="quiz-results">
        <h3>Quiz Complete!</h3>

        <div class="score-summary">
          <div class="score-circle">
            <span class="score-percentage">${percentage}%</span>
          </div>

          <div class="score-details">
            <p>Score: ${this.score} / ${totalPoints}</p>
            <p>Time: ${Math.floor(timeSpent / 60)}:${(timeSpent % 60).toString().padStart(2, '0')}</p>
            <p>Correct: ${this.answers.filter(a => a.correct).length} / ${this.questions.length}</p>
          </div>
        </div>

        <div class="quiz-actions">
          <button class="quiz-retry">Retry Quiz</button>
          <button class="quiz-review">Review Answers</button>
        </div>
      </div>
    `;

    this.container.innerHTML = html;

    this.container.querySelector('.quiz-retry').addEventListener('click', () => {
      this.restart();
    });

    this.container.querySelector('.quiz-review').addEventListener('click', () => {
      this.showReview();
    });

    this.onComplete({
      score: this.score,
      totalPoints: totalPoints,
      percentage: percentage,
      timeSpent: timeSpent,
      answers: this.answers
    });
  }

  restart() {
    this.currentIndex = 0;
    this.answers = [];
    this.score = 0;
    this.startTime = Date.now();
    this.render();
  }

  showReview() {
    // Implementation for reviewing answers
    console.log('Review functionality to be implemented');
  }

  renderError(message) {
    this.container.innerHTML = `
      <div class="quiz-error">
        <h3>Error</h3>
        <p>${message}</p>
        <button onclick="location.reload()">Retry</button>
      </div>
    `;
  }
}

// Auto-initialize quizzes on page load
document.addEventListener('DOMContentLoaded', () => {
  const quizContainers = document.querySelectorAll('[data-quiz-id]');

  quizContainers.forEach(container => {
    const quizId = container.dataset.quizId;
    const quiz = new QuizEngine({
      container: container,
      quizId: quizId,
      onComplete: (results) => {
        console.log('Quiz completed:', results);
        // Send analytics data
        if (typeof gtag !== 'undefined') {
          gtag('event', 'quiz_completed', {
            quiz_id: quizId,
            score: results.percentage,
            time_spent: results.timeSpent
          });
        }
      }
    });

    quiz.initialize();
  });
});