# JQHTML VSCode Extension Setup

## Overview
The JQHTML VSCode extension is now integrated into the RSpade development environment alongside the RSpade extension. Both extensions are automatically installed and updated through the IDE setup scripts.

## Installation

### Automatic Installation
1. The JQHTML extension is installed as an NPM dependency: `@jqhtml/vscode-extension`
2. When you run VS Code tasks or open the project, the setup script checks for both extensions
3. If either extension is missing or outdated, they are automatically installed (if auto-install is enabled)

### Manual Installation
If auto-install is disabled or fails:
1. Press `Ctrl+Shift+X` in VS Code to open Extensions
2. Click the `...` menu → "Install from VSIX..."
3. For RSpade: Select `app/RSpade/Extension/rspade-framework.vsix`
4. For JQHTML: Select `node_modules/@jqhtml/vscode-extension/jqhtml-vscode-extension-*.vsix`

## Configuration

### Settings
The following settings in `.vscode/settings.json` control extension behavior:
- `rspade.autoCheckExtension` - Whether to check for extension updates (default: true)
- `rspade.autoInstallExtension` - Whether to auto-install/update extensions (default: true)

### Extension Locations
- **RSpade Extension**: `/app/RSpade/Extension/rspade-framework.vsix`
- **JQHTML Extension**: `/node_modules/@jqhtml/vscode-extension/jqhtml-vscode-extension-*.vsix`

## How It Works

### Check Process
1. The setup script (`/.vscode/ide_setup/check_setup.sh`) runs on VS Code startup
2. It checks for both RSpade and JQHTML extensions
3. Compares installed versions with expected versions from:
   - RSpade: `app/RSpade/Extension/package.json`
   - JQHTML: `node_modules/@jqhtml/vscode-extension/package.json`

### Update Process
1. If extensions need updating and auto-install is enabled:
   - Installs RSpade extension from local VSIX
   - Installs JQHTML extension from npm package VSIX
2. Creates marker file `.extensions-updated` to trigger VS Code reload
3. VS Code automatically reloads to activate the updated extensions

## Features Provided by JQHTML Extension

- **Syntax Highlighting**: Full syntax highlighting for `.jqhtml` template files
- **Code Snippets**: Quick snippets for common JQHTML patterns
- **Language Support**: Proper language configuration for JQHTML templates
- **IntelliSense**: Auto-completion for JQHTML tags and attributes

## Updating the JQHTML Extension

To update to a newer version:
```bash
npm update @jqhtml/vscode-extension
```

The next time VS Code starts, it will detect the new version and auto-install it.

## Troubleshooting

### Extension Not Installing
1. Check that the VSIX file exists:
   ```bash
   ls -la node_modules/@jqhtml/vscode-extension/*.vsix
   ```
2. Ensure VS Code CLI is available:
   ```bash
   code --version
   ```
3. Check the setup script output for specific errors

### Version Mismatch
If the extension shows as outdated:
1. Run `npm update @jqhtml/vscode-extension`
2. Restart VS Code to trigger the update check
3. Or manually install from the VSIX file

### Disable Auto-Install
To disable automatic extension installation, add to `.vscode/settings.json`:
```json
{
  "rspade.autoInstallExtension": false
}
```

## Integration with RSpade Extension

Both extensions work together:
- **RSpade Extension**: Provides RSX framework support, PHP formatting, namespace management
- **JQHTML Extension**: Provides JQHTML template support, syntax highlighting, snippets

The setup script handles both extensions in a single update cycle, minimizing VS Code reloads.