Skip to content

Commit 694c6d3

Browse files
committed
feat: add Antora and AsciiDoc preview scripts
1 parent 3845239 commit 694c6d3

File tree

7 files changed

+599
-96
lines changed

7 files changed

+599
-96
lines changed

.gitignore

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,16 @@
11
doc/html
22
.DS_Store
3+
4+
# Antora build artifacts
5+
doc/antora_specimen/build/
6+
doc/antora_specimen/node_modules/
7+
**/build/site/
8+
9+
# Node.js and npm artifacts
10+
node_modules/
11+
npm-debug.log*
12+
yarn-debug.log*
13+
yarn-error.log*
14+
15+
# Antora cache
16+
.cache/

DEVELOPMENT.md

Lines changed: 269 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,269 @@
1+
# BoostLook Development Guide
2+
3+
This guide explains how to develop and test BoostLook styling using two complementary preview workflows: simple AsciiDoc testing and production-like Antora testing.
4+
5+
## Overview
6+
7+
BoostLook provides two preview workflows for developing and testing CSS changes:
8+
9+
- **Preview with AsciiDoc**: Fast iteration with simple AsciiDoc files for quick CSS testing
10+
- **Preview with Antora**: Comprehensive testing using real Boost documentation content via Antora Specimen
11+
12+
Both workflows provide automatic file watching, rebuilding, and browser preview to streamline your development process.
13+
14+
## Preview Workflows
15+
16+
### Preview with AsciiDoc
17+
18+
**Use Case**: Rapid CSS iteration and basic styling verification
19+
**Script**: `boostlook_asciidoc_preview.rb`
20+
**Content**: Your local AsciiDoc files (e.g., `doc/specimen.adoc`)
21+
**Build System**: Boost.Build (b2)
22+
**Speed**: Fast, immediate feedback
23+
24+
This workflow monitors AsciiDoc, HTML, and CSS files for changes, automatically rebuilding via Boost.Build and opening the rendered HTML in your browser.
25+
26+
### Preview with Antora
27+
28+
**Use Case**: Realistic testing with actual Boost documentation structure and content
29+
**Script**: `boostlook_antora_preview.rb`
30+
**Content**: Real Boost.URL documentation fetched from GitHub
31+
**Build System**: Antora site generator
32+
**Speed**: More comprehensive, production-like environment
33+
34+
This workflow uses **Antora Specimen** - a testing setup that fetches official Boost.URL documentation and applies your local BoostLook styling, providing a realistic testing environment with actual production content.
35+
36+
## Prerequisites
37+
38+
### Common Requirements
39+
- **Ruby** (>= 2.7 recommended)
40+
- **Listen Gem** – Install via `gem install listen`
41+
42+
### Preview with AsciiDoc Requirements
43+
- **Asciidoctor** – Install via `gem install asciidoctor`
44+
- **Boost.Build (b2)** – Required for builds. Ensure it's installed and available in your PATH.
45+
46+
### Preview with Antora Requirements
47+
- **Node.js** – For Antora CLI
48+
- **Antora CLI** – Install via `npm install -g @antora/cli @antora/site-generator`
49+
50+
## Quick Start
51+
52+
### Preview with AsciiDoc
53+
54+
1. **Install Prerequisites**:
55+
```bash
56+
# Check Ruby installation
57+
ruby -v
58+
59+
# Install required gems
60+
gem install asciidoctor listen
61+
62+
# Verify Boost.Build availability
63+
which b2
64+
```
65+
66+
2. **Prepare Content**:
67+
- Place AsciiDoc files in the `doc/` directory
68+
- Default test file: `doc/specimen.adoc`
69+
70+
3. **Start Preview**:
71+
```bash
72+
# From project root
73+
ruby boostlook_asciidoc_preview.rb
74+
```
75+
76+
4. **Development Workflow**:
77+
- Edit `boostlook.css` or AsciiDoc files in `doc/`
78+
- Script automatically detects changes and rebuilds
79+
- Browser opens automatically with rendered content
80+
- Refresh browser to see changes
81+
82+
### Preview with Antora
83+
84+
1. **Install Prerequisites**:
85+
```bash
86+
# Install Antora CLI
87+
npm install -g @antora/cli @antora/site-generator
88+
89+
# Install Ruby gem for file watching
90+
gem install listen
91+
```
92+
93+
2. **Start Preview** (with automatic setup):
94+
```bash
95+
# Force rebuild and start watching
96+
ruby boostlook_antora_preview.rb --rebuild
97+
```
98+
99+
3. **Development Workflow**:
100+
- Edit `boostlook.css` → Triggers automatic rebuild
101+
- Edit `boostlook.rb` → Triggers automatic rebuild
102+
- View changes in browser (auto-opened)
103+
- Repeat until styling is perfect
104+
105+
## File Structure
106+
107+
### Preview with AsciiDoc Structure
108+
```
109+
boostlook/
110+
├── boostlook.css # Your main CSS file
111+
├── boostlook.rb # Antora extension (Ruby)
112+
├── boostlook_asciidoc_preview.rb # AsciiDoc preview script
113+
└── doc/
114+
├── specimen.adoc # Test AsciiDoc file
115+
└── ... # Other AsciiDoc files
116+
```
117+
118+
### Preview with Antora Structure
119+
```
120+
boostlook/
121+
├── boostlook.css # Your main CSS file
122+
├── boostlook.rb # Antora extension (Ruby)
123+
├── boostlook_antora_preview.rb # Antora preview script
124+
└── doc/
125+
└── antora_specimen/
126+
├── playbook.yml # Antora configuration
127+
└── build/ # Generated site (git-ignored)
128+
└── site/
129+
├── index.html # Entry point
130+
└── _/css/
131+
└── boostlook.css # Your CSS (auto-copied)
132+
```
133+
134+
## What You're Testing Against
135+
136+
### Preview with AsciiDoc
137+
- **Content**: Your custom AsciiDoc files
138+
- **Structure**: Simple document structure
139+
- **Elements**: Basic typography, code blocks, tables
140+
- **Speed**: Very fast iteration cycles
141+
142+
### Preview with Antora
143+
- **Content**: Official Boost.URL documentation from GitHub
144+
- **Structure**: Actual Antora-generated documentation
145+
- **Elements**: Real typography, code blocks, tables, navigation, etc.
146+
- **Complexity**: Multi-level navigation, cross-references, production patterns
147+
148+
## Configuration
149+
150+
### AsciiDoc Preview Configuration
151+
The AsciiDoc preview uses your existing Boost.Build configuration. Ensure your `build.jam` or similar build files are properly configured for BoostLook integration.
152+
153+
### Antora Preview Configuration (`doc/antora_specimen/playbook.yml`)
154+
```yaml
155+
site:
156+
title: Boostlook Antora Specimen
157+
url: /
158+
start_page: url::index.adoc
159+
160+
content:
161+
sources:
162+
- url: https://github.com/boostorg/url.git
163+
branches: develop
164+
start_path: doc
165+
166+
ui:
167+
bundle:
168+
url: https://github.com/boostorg/website-v2-docs/releases/download/ui-master/ui-bundle.zip
169+
snapshot: true
170+
171+
output:
172+
dir: ./build/site
173+
```
174+
175+
**Key Points:**
176+
- **No git submodules** - Content fetched automatically
177+
- **Remote UI bundle** - Official Boost documentation UI
178+
- **Your CSS overrides** - Applied automatically after build
179+
180+
## Preview Script Features
181+
182+
### AsciiDoc Preview Features
183+
- **File Watching**: Monitors `doc/` directory and root CSS files
184+
- **Automatic Building**: Uses Boost.Build (b2) for rendering
185+
- **Browser Integration**: Opens rendered HTML automatically
186+
- **Cross-platform**: Works on macOS, Linux, Windows
187+
188+
### Antora Preview Features
189+
- **Automatic CSS Override**: Copies your current `boostlook.css` over outdated UI bundle version
190+
- **Smart Rebuilding**: CSS changes trigger full rebuild (processed by Ruby extension)
191+
- **Content Fetching**: Automatically downloads latest Boost.URL documentation
192+
- **File Hash Checking**: Avoids unnecessary rebuilds
193+
194+
## Manual Testing Commands
195+
196+
### Preview with AsciiDoc (Manual)
197+
```bash
198+
# Build once without watching
199+
b2 doc/specimen.html
200+
201+
# Serve locally (if needed)
202+
python -m http.server 8000
203+
```
204+
205+
### Preview with Antora (Manual)
206+
```bash
207+
# Build once without watching
208+
cd doc/antora_specimen
209+
npx antora --fetch playbook.yml
210+
211+
# Copy your current CSS
212+
cp ../../boostlook.css build/site/_/css/boostlook.css
213+
214+
# Serve locally
215+
npx http-server build/site -p 8080
216+
```
217+
218+
## Troubleshooting
219+
220+
### Preview with AsciiDoc Issues
221+
222+
**Script Not Running:**
223+
- Ensure Ruby, Asciidoctor, and Listen gem are installed
224+
- Verify Boost.Build (b2) is available: `which b2`
225+
- Check for error messages in terminal
226+
227+
**Changes Not Reflecting:**
228+
- Ensure files are in monitored directories (`doc/` and root)
229+
- Manually refresh browser
230+
- Check build output for errors
231+
232+
**Boost.Build (b2) Not Found:**
233+
- Install Boost.Build following [official instructions](https://boostorg.github.io/build/)
234+
- Ensure b2 is in your system PATH
235+
- Verify with: `b2 --version`
236+
237+
### Preview with Antora Issues
238+
239+
**Build Fails:**
240+
```bash
241+
# Check Antora installation
242+
npx antora --version
243+
244+
# Check if playbook is valid
245+
cd doc/antora_specimen
246+
npx antora playbook.yml --dry-run
247+
```
248+
249+
**CSS Not Updating:**
250+
```bash
251+
# Force complete rebuild
252+
ruby boostlook_antora_preview.rb --rebuild
253+
254+
# Manually verify CSS copy
255+
ls -la doc/antora_specimen/build/site/_/css/boostlook.css
256+
```
257+
258+
**Preview Script Issues:**
259+
```bash
260+
# Check if listen gem is installed
261+
gem list | grep listen
262+
263+
# Install if missing
264+
gem install listen
265+
```
266+
267+
**Node.js/Antora Issues:**
268+
- Ensure Node.js is installed: `node --version`
269+
- Install/reinstall Antora: `

0 commit comments

Comments
 (0)