mirror of
https://github.com/kochetkov-ma/claude-brewcode.git
synced 2026-09-14 20:16:41 +08:00
v3.4.26: trial skill + gitignore d2c-output
- Add glm-design-to-code-trial standalone skill for npx skills distribution - Add brewpage-reference.png test asset - Gitignore d2c-output/ (generated artifacts)
This commit is contained in:
kochetkov-ma
@@ -6,13 +6,13 @@
|
||||
},
|
||||
"metadata": {
|
||||
"description": "Claude Code plugin suite: brewcode for infinite task execution and brewdoc for documentation tools",
|
||||
"version": "3.4.25"
|
||||
"version": "3.4.26"
|
||||
},
|
||||
"plugins": [
|
||||
{
|
||||
"name": "brewcode",
|
||||
"description": "Brewcode - full-featured development platform for Claude Code: infinite focus tasks, prompt optimization, skill/agent creation, quorum reviews, rules management",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"category": "productivity",
|
||||
"keywords": [
|
||||
"brewcode",
|
||||
@@ -46,7 +46,7 @@
|
||||
{
|
||||
"name": "brewdoc",
|
||||
"description": "Brewdoc - Claude Code documentation tools: auto-sync for skills/agents/rules, my-claude installation docs, memory optimization, md-to-pdf conversion",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"category": "productivity",
|
||||
"keywords": [
|
||||
"brewdoc",
|
||||
@@ -74,7 +74,7 @@
|
||||
{
|
||||
"name": "brewtools",
|
||||
"description": "Brewtools - universal utilities for Claude Code: text optimization, humanization, secrets scanning",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"category": "productivity",
|
||||
"keywords": [
|
||||
"brewtools",
|
||||
|
||||
@@ -21,3 +21,4 @@ logs/
|
||||
# Data exports and test artifacts
|
||||
data/
|
||||
*.fullpage.png
|
||||
d2c-output/
|
||||
|
||||
@@ -2,6 +2,15 @@
|
||||
|
||||
---
|
||||
|
||||
## v3.4.26 (2026-04-04)
|
||||
|
||||
### brewcode
|
||||
#### Added
|
||||
- **glm-design-to-code-trial:** Standalone trial skill for `npx skills` distribution (README.md + SKILL.md)
|
||||
- **gitignore:** `d2c-output/` excluded from repo (generated test artifact)
|
||||
|
||||
---
|
||||
|
||||
## v3.4.25 (2026-04-04)
|
||||
|
||||
### brewcode
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "brewcode",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"description": "Brewcode - full-featured development platform for Claude Code: infinite focus tasks, prompt optimization, skill/agent creation, quorum reviews, rules management",
|
||||
"author": {
|
||||
"name": "Maksim Kochetkov",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "claude-plugin-brewcode",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"description": "Infinite task execution with automatic handoff for Claude Code",
|
||||
"keywords": [
|
||||
"claude-code",
|
||||
@@ -36,6 +36,6 @@
|
||||
},
|
||||
"claude-plugin": {
|
||||
"name": "brewcode",
|
||||
"version": "3.4.25"
|
||||
"version": "3.4.26"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "brewdoc",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"description": "Brewdoc - Claude Code documentation tools: auto-sync for skills/agents/rules, my-claude installation docs, memory optimization",
|
||||
"author": {
|
||||
"name": "Maksim Kochetkov",
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 167 KiB |
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "brewtools",
|
||||
"version": "3.4.25",
|
||||
"version": "3.4.26",
|
||||
"description": "Brewtools - universal utilities for Claude Code: text optimization, humanization, secrets scanning",
|
||||
"author": {
|
||||
"name": "Maksim Kochetkov",
|
||||
|
||||
@@ -0,0 +1,90 @@
|
||||
# GLM Design to Code (Trial)
|
||||
|
||||
Convert design screenshots or text descriptions to HTML/CSS using GLM vision models (Z.ai). Free tier available — no paid API required.
|
||||
|
||||
## Quick Start
|
||||
|
||||
1. Install:
|
||||
```bash
|
||||
npx skills add kochetkov-ma/claude-brewcode
|
||||
```
|
||||
|
||||
2. Use via slash command:
|
||||
```
|
||||
/glm-design-to-code-trial screenshot.png
|
||||
/glm-design-to-code-trial "Dark landing page with hero section"
|
||||
```
|
||||
|
||||
Or via natural language prompt:
|
||||
```
|
||||
Convert this mockup to HTML
|
||||
Design to code screenshot.png
|
||||
```
|
||||
|
||||
Claude sends your input to the GLM vision model, extracts the generated code files, and saves them to `./d2c-output/`.
|
||||
|
||||
## Why Use This
|
||||
|
||||
- **Free tier** — Z.ai GLM models have a generous free tier, no credit card needed
|
||||
- **Vision model** — GLM-5V understands screenshots, mockups, wireframes
|
||||
- **Instant HTML** — get working HTML/CSS files in seconds
|
||||
- **No dependencies** — everything runs inline, no external scripts needed
|
||||
|
||||
## What It Does
|
||||
|
||||
1. **Checks API key** — looks in `.env` or asks you for a Z.ai key
|
||||
2. **Detects input** — image file or text description
|
||||
3. **Builds request** — constructs the API payload with embedded system prompt
|
||||
4. **Calls Z.ai** — sends to GLM-5V-Turbo vision model
|
||||
5. **Extracts files** — parses response into separate HTML/CSS/JS files
|
||||
6. **Reports results** — shows stats and file list
|
||||
|
||||
## Examples
|
||||
|
||||
<details>
|
||||
<summary>Screenshot to HTML</summary>
|
||||
|
||||
```
|
||||
/glm-design-to-code-trial dashboard-mockup.png
|
||||
```
|
||||
|
||||
Encodes the image, sends to GLM-5V, extracts `index.html` + `styles.css` to `./d2c-output/`.
|
||||
|
||||
</details>
|
||||
|
||||
<details>
|
||||
<summary>Text description to HTML</summary>
|
||||
|
||||
```
|
||||
/glm-design-to-code-trial "Modern portfolio site with dark theme, hero section with animated gradient, project cards grid, and contact form"
|
||||
```
|
||||
|
||||
Generates a complete HTML/CSS site from the text description.
|
||||
|
||||
</details>
|
||||
|
||||
## Trial vs Full Version
|
||||
|
||||
| Feature | Trial | Full (brewcode plugin) |
|
||||
|---------|-------|------------------------|
|
||||
| Input types | Image, Text | Image, Text, HTML, URL |
|
||||
| Output frameworks | HTML/CSS only | HTML, React, Flutter, Custom |
|
||||
| Modes | CREATE | CREATE, REVIEW, FIX |
|
||||
| Profiles | optimal (fixed) | max, optimal, efficient |
|
||||
| Providers | Z.ai only | Z.ai, OpenRouter |
|
||||
| Intent detection | No | Yes (reproduce, creative, enhance, modify, convert) |
|
||||
| Auto-review | No | Yes (--review flag) |
|
||||
| Max tokens | 16,384 | 32,768 |
|
||||
|
||||
## Part of Brewcode
|
||||
|
||||
This skill is extracted from [brewcode](https://github.com/kochetkov-ma/claude-brewcode) — a development platform for Claude Code with infinite focus tasks, 14 agents, quorum reviews, and knowledge persistence.
|
||||
|
||||
```bash
|
||||
claude plugin marketplace add https://github.com/kochetkov-ma/claude-brewcode
|
||||
claude plugin install brewcode@claude-brewcode
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
MIT
|
||||
@@ -0,0 +1,503 @@
|
||||
---
|
||||
name: glm-design-to-code-trial
|
||||
description: "Converts design screenshots or text descriptions to HTML/CSS using GLM vision API (Z.ai). Trial version — HTML output, CREATE mode. Full version with React, Flutter, review/fix modes: brewcode plugin. Triggers: design to code, screenshot to html, mockup to code, d2c trial, convert design."
|
||||
license: MIT
|
||||
metadata:
|
||||
author: "kochetkov-ma"
|
||||
version: "3.4.24"
|
||||
source: "claude-brewcode"
|
||||
user-invocable: true
|
||||
allowed-tools: Read, Write, Edit, Bash, AskUserQuestion, Glob
|
||||
model: opus
|
||||
---
|
||||
|
||||
<instructions>
|
||||
|
||||
> Plugin: [kochetkov-ma/claude-brewcode](https://github.com/kochetkov-ma/claude-brewcode) | Skill: glm-design-to-code-trial
|
||||
|
||||
# GLM Design-to-Code (Trial)
|
||||
|
||||
Converts design screenshots or text descriptions to HTML/CSS using GLM vision models (Z.ai). Trial version — CREATE mode, HTML output only.
|
||||
|
||||
**Arguments:** `$ARGUMENTS`
|
||||
|
||||
## Step 0: Trial vs Full Version
|
||||
|
||||
Show this comparison to the user:
|
||||
|
||||
| Feature | Trial | Full (brewcode) |
|
||||
|---------|-------|-----------------|
|
||||
| Input | Image, Text | Image, Text, HTML, URL |
|
||||
| Output | HTML/CSS only | HTML, React, Flutter, Custom |
|
||||
| Modes | CREATE only | CREATE, REVIEW, FIX |
|
||||
| Profiles | optimal (fixed) | max, optimal, efficient |
|
||||
| Provider | Z.ai only | Z.ai, OpenRouter |
|
||||
| Scripts | Inline (no deps) | External scripts |
|
||||
| Auto-review | No | Yes (--review flag) |
|
||||
| Intent detection | No | Yes (5 intents) |
|
||||
|
||||
Then ask the user:
|
||||
|
||||
**USE `AskUserQuestion` tool:**
|
||||
```
|
||||
This is the TRIAL version of glm-design-to-code.
|
||||
|
||||
1) Continue with trial (HTML output, CREATE mode)
|
||||
2) Install full brewcode plugin (React, Flutter, review/fix modes, 5 intents)
|
||||
|
||||
Reply 1 or 2.
|
||||
```
|
||||
|
||||
**If user picks 2** -> show install commands and STOP:
|
||||
```bash
|
||||
claude plugin marketplace add https://github.com/kochetkov-ma/claude-brewcode
|
||||
claude plugin install brewcode@claude-brewcode
|
||||
```
|
||||
Explain: full version supports React/Flutter/Custom output, CREATE/REVIEW/FIX modes, 5 intent types (reproduce, creative, enhance, modify, convert), OpenRouter provider, profile selection, and auto-review. Then **STOP** — do not proceed further.
|
||||
|
||||
**If user picks 1** -> proceed to Step 1.
|
||||
|
||||
## Step 1: API Key Setup
|
||||
|
||||
Check for `ZAI_API_KEY` in `.env` file first, then environment.
|
||||
|
||||
**EXECUTE** using Bash tool:
|
||||
```bash
|
||||
ZAI_API_KEY=""
|
||||
if [ -f .env ]; then
|
||||
ZAI_API_KEY=$(grep -E '^ZAI_API_KEY=' .env 2>/dev/null | head -1 | cut -d'=' -f2- | tr -d '"' | tr -d "'")
|
||||
fi
|
||||
[ -z "$ZAI_API_KEY" ] && ZAI_API_KEY="${ZAI_API_KEY:-}"
|
||||
if [ -n "$ZAI_API_KEY" ]; then
|
||||
echo "KEY_FOUND:${ZAI_API_KEY: -4}"
|
||||
else
|
||||
echo "KEY_MISSING"
|
||||
fi
|
||||
```
|
||||
|
||||
**If KEY_MISSING** -> **USE `AskUserQuestion` tool:**
|
||||
```
|
||||
Z.ai API key not found.
|
||||
|
||||
Get a free key at https://open.z.ai (GLM models, free tier available).
|
||||
Paste your API key:
|
||||
```
|
||||
|
||||
Store the key in `ZAI_API_KEY` variable for subsequent steps.
|
||||
|
||||
Then validate with a lightweight curl:
|
||||
|
||||
**EXECUTE** using Bash tool:
|
||||
```bash
|
||||
HTTP_CODE=$(curl -s -o /dev/null -w "%{http_code}" "https://api.z.ai/api/paas/v4/models" \
|
||||
-H "Authorization: Bearer $ZAI_API_KEY" --max-time 10)
|
||||
if [ "$HTTP_CODE" = "200" ]; then
|
||||
echo "KEY_VALID"
|
||||
else
|
||||
echo "KEY_INVALID:$HTTP_CODE"
|
||||
fi
|
||||
```
|
||||
|
||||
> **STOP if KEY_INVALID** — show error message with HTTP code and advise user to check the key at https://open.z.ai.
|
||||
|
||||
Save to `.env` and ensure `.gitignore` covers it:
|
||||
|
||||
**EXECUTE** using Bash tool:
|
||||
```bash
|
||||
if [ -f .env ]; then
|
||||
if grep -q '^ZAI_API_KEY=' .env; then
|
||||
sed -i.bak "s|^ZAI_API_KEY=.*|ZAI_API_KEY=$ZAI_API_KEY|" .env && rm -f .env.bak
|
||||
else
|
||||
echo "ZAI_API_KEY=$ZAI_API_KEY" >> .env
|
||||
fi
|
||||
else
|
||||
echo "ZAI_API_KEY=$ZAI_API_KEY" > .env
|
||||
fi
|
||||
grep -qxF '.env' .gitignore 2>/dev/null || echo '.env' >> .gitignore
|
||||
echo "Key saved (****${ZAI_API_KEY: -4})"
|
||||
```
|
||||
|
||||
## Step 2: Detect Input
|
||||
|
||||
Parse `$ARGUMENTS` to find input:
|
||||
|
||||
| Pattern | Type |
|
||||
|---------|------|
|
||||
| Ends with `.png`, `.jpg`, `.jpeg`, `.webp`, `.gif` | Image file |
|
||||
| Everything else non-empty | Text description |
|
||||
| Empty / no input | Ask user |
|
||||
|
||||
For image files — validate existence with `file --mime-type`.
|
||||
|
||||
**If no input found** -> **USE `AskUserQuestion` tool:**
|
||||
```
|
||||
No input detected. Provide either:
|
||||
- Path to a design screenshot (PNG, JPG, WebP, GIF)
|
||||
- Text description of the desired design
|
||||
|
||||
Your input:
|
||||
```
|
||||
|
||||
Store the detected input type (`IMAGE` or `TEXT`) and value for the next step.
|
||||
|
||||
## Step 3: Build Request Payload
|
||||
|
||||
### For IMAGE input
|
||||
|
||||
**EXECUTE** using Bash tool (replace `IMAGE_PATH_VALUE` with the actual resolved image path, and inject `ZAI_API_KEY` value):
|
||||
```bash
|
||||
set -e
|
||||
IMAGE_PATH="IMAGE_PATH_VALUE"
|
||||
|
||||
command -v jq >/dev/null 2>&1 || { echo "jq is required. Install: brew install jq"; exit 1; }
|
||||
command -v base64 >/dev/null 2>&1 || { echo "base64 is required"; exit 1; }
|
||||
|
||||
case "$IMAGE_PATH" in
|
||||
*.png) MIME="image/png" ;;
|
||||
*.jpg|*.jpeg) MIME="image/jpeg" ;;
|
||||
*.webp) MIME="image/webp" ;;
|
||||
*.gif) MIME="image/gif" ;;
|
||||
*) echo "Unsupported image format"; exit 1 ;;
|
||||
esac
|
||||
|
||||
B64=$(base64 < "$IMAGE_PATH" | tr -d '\n')
|
||||
DATA_URI="data:${MIME};base64,${B64}"
|
||||
|
||||
TMPURI=$(mktemp)
|
||||
TMPUSER=$(mktemp)
|
||||
TMPSYS=$(mktemp)
|
||||
trap "rm -f '$TMPURI' '$TMPUSER' '$TMPSYS'" EXIT
|
||||
|
||||
printf '%s' "$DATA_URI" > "$TMPURI"
|
||||
printf '%s' "Convert this design screenshot to working HTML/CSS code files." > "$TMPUSER"
|
||||
cat > "$TMPSYS" <<'SYSPROMPT'
|
||||
You are a skilled frontend developer. Follow the task instruction and produce clean, accurate code.
|
||||
|
||||
## Output format
|
||||
|
||||
Wrap every file in markers. Output markers and file content only — no text before, between, or after.
|
||||
|
||||
===FILE: path/to/file.ext===
|
||||
content
|
||||
===END_FILE===
|
||||
|
||||
Wrong (adds backticks): ```html\n===FILE: index.html===
|
||||
Correct: ===FILE: index.html===
|
||||
|
||||
## Requirements
|
||||
|
||||
- Match design: correct colors, proportions, typography, layout structure
|
||||
- CSS custom properties for colors
|
||||
- Semantic HTML5, entry point: index.html
|
||||
- CSS in separate .css file(s) — inline styles excluded
|
||||
- JS in separate .js file(s) if needed
|
||||
- CDN dependencies excluded unless specified in project context
|
||||
- All text content from screenshot preserved verbatim
|
||||
- Layout structure and proportions matched (sidebar, header, content areas)
|
||||
|
||||
Output starts with ===FILE: and ends with ===END_FILE===. Nothing else.
|
||||
SYSPROMPT
|
||||
|
||||
jq -n \
|
||||
--rawfile system "$TMPSYS" \
|
||||
--rawfile user_text "$TMPUSER" \
|
||||
--rawfile data_uri "$TMPURI" \
|
||||
'{
|
||||
model: "glm-5v-turbo",
|
||||
temperature: 0.2,
|
||||
top_p: 0.85,
|
||||
max_tokens: 16384,
|
||||
messages: [
|
||||
{ role: "system", content: ($system | rtrimstr("\n")) },
|
||||
{ role: "user", content: [
|
||||
{ type: "text", text: ($user_text | rtrimstr("\n")) },
|
||||
{ type: "image_url", image_url: { url: ($data_uri | rtrimstr("\n")) } }
|
||||
]}
|
||||
]
|
||||
}' > /tmp/d2c-trial-payload.json
|
||||
|
||||
echo "Payload: /tmp/d2c-trial-payload.json ($(wc -c < /tmp/d2c-trial-payload.json | tr -d ' ') bytes)"
|
||||
```
|
||||
|
||||
### For TEXT input
|
||||
|
||||
**EXECUTE** using Bash tool (replace `USER_TEXT_VALUE` with the actual text description):
|
||||
```bash
|
||||
set -e
|
||||
USER_TEXT="USER_TEXT_VALUE"
|
||||
|
||||
command -v jq >/dev/null 2>&1 || { echo "jq is required. Install: brew install jq"; exit 1; }
|
||||
|
||||
TMPUSER=$(mktemp)
|
||||
TMPSYS=$(mktemp)
|
||||
trap "rm -f '$TMPUSER' '$TMPSYS'" EXIT
|
||||
|
||||
printf '%s' "Create working frontend code files based on this description:
|
||||
|
||||
$USER_TEXT" > "$TMPUSER"
|
||||
cat > "$TMPSYS" <<'SYSPROMPT'
|
||||
You are a skilled frontend developer. Follow the task instruction and produce clean, accurate code.
|
||||
|
||||
## Output format
|
||||
|
||||
Wrap every file in markers. Output markers and file content only — no text before, between, or after.
|
||||
|
||||
===FILE: path/to/file.ext===
|
||||
content
|
||||
===END_FILE===
|
||||
|
||||
Wrong (adds backticks): ```html\n===FILE: index.html===
|
||||
Correct: ===FILE: index.html===
|
||||
|
||||
## Requirements
|
||||
|
||||
- Match design: correct colors, proportions, typography, layout structure
|
||||
- CSS custom properties for colors
|
||||
- Semantic HTML5, entry point: index.html
|
||||
- CSS in separate .css file(s) — inline styles excluded
|
||||
- JS in separate .js file(s) if needed
|
||||
- CDN dependencies excluded unless specified in project context
|
||||
- All text content from screenshot preserved verbatim
|
||||
- Layout structure and proportions matched (sidebar, header, content areas)
|
||||
|
||||
Output starts with ===FILE: and ends with ===END_FILE===. Nothing else.
|
||||
SYSPROMPT
|
||||
|
||||
jq -n \
|
||||
--rawfile system "$TMPSYS" \
|
||||
--rawfile user_text "$TMPUSER" \
|
||||
'{
|
||||
model: "glm-5v-turbo",
|
||||
temperature: 0.2,
|
||||
top_p: 0.85,
|
||||
max_tokens: 16384,
|
||||
messages: [
|
||||
{ role: "system", content: ($system | rtrimstr("\n")) },
|
||||
{ role: "user", content: ($user_text | rtrimstr("\n")) }
|
||||
]
|
||||
}' > /tmp/d2c-trial-payload.json
|
||||
|
||||
echo "Payload: /tmp/d2c-trial-payload.json ($(wc -c < /tmp/d2c-trial-payload.json | tr -d ' ') bytes)"
|
||||
```
|
||||
|
||||
## Step 4: Send to Z.ai API
|
||||
|
||||
**EXECUTE** using Bash tool (replace `ZAI_API_KEY_VALUE` with the actual key):
|
||||
```bash
|
||||
set -e
|
||||
ZAI_API_KEY="ZAI_API_KEY_VALUE"
|
||||
|
||||
RESPONSE=$(curl -s -w "\n%{http_code}" \
|
||||
--max-time 300 \
|
||||
"https://api.z.ai/api/paas/v4/chat/completions" \
|
||||
-H "Authorization: Bearer $ZAI_API_KEY" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d @/tmp/d2c-trial-payload.json)
|
||||
|
||||
HTTP_CODE=$(echo "$RESPONSE" | tail -1)
|
||||
BODY=$(echo "$RESPONSE" | sed '$d')
|
||||
|
||||
if [ "$HTTP_CODE" != "200" ]; then
|
||||
echo "API error (HTTP $HTTP_CODE): $BODY"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
echo "$BODY" > /tmp/d2c-trial-response.json
|
||||
|
||||
FINISH=$(jq -r '.choices[0].finish_reason // "unknown"' /tmp/d2c-trial-response.json)
|
||||
TOKENS_IN=$(jq -r '.usage.prompt_tokens // "?"' /tmp/d2c-trial-response.json)
|
||||
TOKENS_OUT=$(jq -r '.usage.completion_tokens // "?"' /tmp/d2c-trial-response.json)
|
||||
|
||||
echo "Response saved: /tmp/d2c-trial-response.json"
|
||||
echo " finish_reason: $FINISH | tokens: $TOKENS_IN in / $TOKENS_OUT out"
|
||||
|
||||
if [ "$FINISH" = "length" ]; then
|
||||
echo "WARNING: Response truncated (hit max_tokens)"
|
||||
fi
|
||||
```
|
||||
|
||||
> **STOP if API error** — show the HTTP code and response body to the user.
|
||||
|
||||
## Step 5: Extract Files
|
||||
|
||||
**EXECUTE** using Bash tool (replace `OUTPUT_DIR_VALUE` with `./d2c-output` or user-specified directory):
|
||||
```bash
|
||||
set -e
|
||||
OUTPUT_DIR="${1:-./d2c-output}"
|
||||
|
||||
CONTENT=$(jq -r '.choices[0].message.content // empty' /tmp/d2c-trial-response.json)
|
||||
|
||||
if [ -z "$CONTENT" ]; then
|
||||
echo "No content in response"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
mkdir -p "$OUTPUT_DIR"
|
||||
|
||||
if printf '%s\n' "$CONTENT" | grep -q '===FILE:'; then
|
||||
TMPFILE=$(mktemp)
|
||||
trap "rm -f '$TMPFILE'" EXIT
|
||||
jq -r '.choices[0].message.content' /tmp/d2c-trial-response.json > "$TMPFILE"
|
||||
|
||||
awk -v outdir="$OUTPUT_DIR" '
|
||||
/^===FILE: / {
|
||||
fname = $0
|
||||
sub(/^===FILE: */, "", fname)
|
||||
sub(/ *===.*$/, "", fname)
|
||||
sub(/=+$/, "", fname)
|
||||
gsub(/[^a-zA-Z0-9._\/\-]/, "", fname)
|
||||
gsub(/^\/+/, "", fname)
|
||||
if (fname ~ /\.\./) { next }
|
||||
if (fname == "") { next }
|
||||
current_file = outdir "/" fname
|
||||
writing = 1
|
||||
next
|
||||
}
|
||||
/^===END_FILE===/ {
|
||||
if (writing && current_file != "") {
|
||||
close(current_file)
|
||||
file_count++
|
||||
print " " fname " (" lines " lines)" > "/dev/stderr"
|
||||
lines = 0
|
||||
}
|
||||
writing = 0
|
||||
next
|
||||
}
|
||||
writing {
|
||||
if (lines == 0) {
|
||||
dir = current_file
|
||||
sub(/\/[^\/]*$/, "", dir)
|
||||
gsub(/\x27/,"\x27\\\x27\x27", dir)
|
||||
cmd = "mkdir -p \x27" dir "\x27"
|
||||
system(cmd)
|
||||
close(cmd)
|
||||
printf "" > current_file
|
||||
close(current_file)
|
||||
}
|
||||
print >> current_file
|
||||
lines++
|
||||
}
|
||||
END {
|
||||
if (writing && current_file != "") {
|
||||
close(current_file)
|
||||
print "WARNING: Truncated file (no ===END_FILE===): " fname > "/dev/stderr"
|
||||
}
|
||||
print "Extracted " file_count+0 " file(s)" > "/dev/stderr"
|
||||
}
|
||||
' "$TMPFILE"
|
||||
else
|
||||
echo "No ===FILE: markers found. Trying code block extraction..." >&2
|
||||
|
||||
printf '%s\n' "$CONTENT" | awk -v outdir="$OUTPUT_DIR" '
|
||||
BEGIN {
|
||||
map["html"] = "index.html"
|
||||
map["htm"] = "index.html"
|
||||
map["css"] = "styles.css"
|
||||
map["js"] = "script.js"
|
||||
map["javascript"] = "script.js"
|
||||
map[""] = "index.html"
|
||||
}
|
||||
/^```[a-zA-Z]/ {
|
||||
lang = $0
|
||||
sub(/^```/, "", lang)
|
||||
sub(/[^a-zA-Z0-9].*/, "", lang)
|
||||
lang = tolower(lang)
|
||||
in_block = 1
|
||||
content = ""
|
||||
next
|
||||
}
|
||||
/^```$/ && in_block {
|
||||
in_block = 0
|
||||
if (content != "") {
|
||||
base = map[lang]
|
||||
if (base == "") base = "file." lang
|
||||
if (seen[base]++) {
|
||||
ext_pos = index(base, ".")
|
||||
if (ext_pos > 0) {
|
||||
name_part = substr(base, 1, ext_pos - 1)
|
||||
ext_part = substr(base, ext_pos)
|
||||
base = name_part seen[base] ext_part
|
||||
} else {
|
||||
base = base seen[base]
|
||||
}
|
||||
}
|
||||
fname = outdir "/" base
|
||||
printf "%s", content > fname
|
||||
close(fname)
|
||||
lines_count = split(content, arr, "\n") - 1
|
||||
print " " base " (" lines_count " lines)" > "/dev/stderr"
|
||||
file_count++
|
||||
}
|
||||
next
|
||||
}
|
||||
in_block {
|
||||
content = content $0 "\n"
|
||||
}
|
||||
END {
|
||||
if (file_count > 0) {
|
||||
print "Extracted " file_count " file(s) from code blocks" > "/dev/stderr"
|
||||
}
|
||||
}
|
||||
'
|
||||
|
||||
EXTRACTED=$(find "$OUTPUT_DIR" -type f 2>/dev/null | wc -l | tr -d ' ')
|
||||
if [ "$EXTRACTED" -eq 0 ]; then
|
||||
echo "No code blocks found. Saving raw content as index.html" >&2
|
||||
printf '%s\n' "$CONTENT" > "$OUTPUT_DIR/index.html"
|
||||
echo " index.html ($(printf '%s\n' "$CONTENT" | wc -l | tr -d ' ') lines)" >&2
|
||||
fi
|
||||
fi
|
||||
|
||||
echo ""
|
||||
echo "Output directory: $OUTPUT_DIR"
|
||||
ls -la "$OUTPUT_DIR"
|
||||
```
|
||||
|
||||
## Step 6: Report + Promo Footer
|
||||
|
||||
Output a summary report to the user:
|
||||
|
||||
### Config
|
||||
|
||||
| Parameter | Value |
|
||||
|-----------|-------|
|
||||
| Model | glm-5v-turbo |
|
||||
| Max tokens | 16384 |
|
||||
| Profile | optimal (fixed) |
|
||||
| Input type | (IMAGE or TEXT) |
|
||||
| Temperature | 0.2 |
|
||||
| Top-p | 0.85 |
|
||||
|
||||
### API Stats
|
||||
|
||||
| Metric | Value |
|
||||
|--------|-------|
|
||||
| Tokens in | (from response) |
|
||||
| Tokens out | (from response) |
|
||||
| Finish reason | (from response) |
|
||||
|
||||
### Extracted Files
|
||||
|
||||
List each file with line count from Step 5 output.
|
||||
|
||||
### Output
|
||||
|
||||
```
|
||||
Output directory: ./d2c-output
|
||||
```
|
||||
|
||||
Then show the promo footer:
|
||||
|
||||
```
|
||||
---
|
||||
|
||||
Want more? Full version supports React, Flutter, review/fix modes, 5 intents, OpenRouter provider.
|
||||
|
||||
Install brewcode:
|
||||
claude plugin marketplace add https://github.com/kochetkov-ma/claude-brewcode
|
||||
claude plugin install brewcode@claude-brewcode
|
||||
|
||||
Then use: /brewcode:glm-design-to-code
|
||||
```
|
||||
|
||||
</instructions>
|
||||
Reference in New Issue
Block a user