This directory contains example implementations of custom functions that can be used with the Source Code Annotator.

An AI-powered block explainer that uses OpenAI to generate detailed explanations.

Requirements:

• Set OPENAI_API_KEY environment variable
• Val Town Pro subscription (for OpenAI API access)

Test:

curl -X POST https://your-val-url.web.val.run/examples/ai-explainer.ts \
  -H "Content-Type: application/json" \
  -d '{
    "code": "function hello() {\n  console.log(\"Hello World\");\n}",
    "blockInfo": {"start": 1, "end": 3, "type": "function"}
  }'

A more sophisticated block detector with support for various code constructs.

Test:

curl -X POST https://your-val-url.web.val.run/examples/enhanced-detector.ts \
  -H "Content-Type: application/json" \
  -d '{
    "code": "function hello() {\n  console.log(\"Hello World\");\n}",
    "line": 2,
    "column": 5
  }'

A custom syntax highlighter with complexity indicators and enhanced styling.

Test:

curl -X POST https://your-val-url.web.val.run/examples/custom-highlighter.ts \
  -H "Content-Type: application/json" \
  -d '{
    "code": "function hello() {\n  console.log(\"Hello World\");\n}",
    "language": "javascript"
  }'

https://your-val-url.web.val.run/std/blob?blockExplainer=https://your-val-url.web.val.run/examples/ai-explainer.ts

https://your-val-url.web.val.run/std/blob?blockDetector=https://your-val-url.web.val.run/examples/enhanced-detector.ts

https://your-val-url.web.val.run/std/blob?syntaxHighlighter=https://your-val-url.web.val.run/examples/custom-highlighter.ts

https://your-val-url.web.val.run/std/blob?syntaxHighlighter=https://your-val-url.web.val.run/examples/custom-highlighter.ts&blockDetector=https://your-val-url.web.val.run/examples/enhanced-detector.ts&blockExplainer=https://your-val-url.web.val.run/examples/ai-explainer.ts

To create your own custom functions:

1. Create a new HTTP val
2. Handle POST requests with the expected JSON payload
3. Return the appropriate response format
4. Use the val URL as a query parameter

See the existing examples for implementation patterns and API contracts.