Skip to content

Commit 9acca53

Browse files
committed
feat: add Antora and AsciiDoc preview scripts
1 parent 3845239 commit 9acca53

File tree

7 files changed

+619
-96
lines changed

7 files changed

+619
-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: 289 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,289 @@
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+
44+
- **Asciidoctor Gem**: Install via `gem install asciidoctor`.
45+
- **Boost.Build (b2)**: Ensure `b2` is installed and available in your system's `PATH`. You can verify this by running `which b2` or `b2 --version`.
46+
- **Boost.Build Configuration (`user-config.jam`)**: This is a critical step. You must tell Boost.Build where to find your `asciidoctor` executable.
47+
1. Find the full path to `asciidoctor` by running:
48+
```sh
49+
which asciidoctor
50+
```
51+
The output will be a path like `/usr/local/bin/asciidoctor`.
52+
53+
2. Create or edit the file `user-config.jam` in your home directory (`$HOME/user-config.jam` on Linux/macOS).
54+
55+
3. Add the following line to the file, using the path from step 1:
56+
```jam
57+
# Tell Boost.Build where to find the asciidoctor executable
58+
using asciidoctor : /usr/local/bin/asciidoctor ;
59+
```
60+
61+
### Preview with Antora Requirements
62+
- **Node.js** – For Antora CLI
63+
- **Antora CLI** – Install via `npm install -g @antora/cli @antora/site-generator`
64+
65+
## Quick Start
66+
67+
### Preview with AsciiDoc
68+
69+
1. **Install Prerequisites**:
70+
```bash
71+
# Check Ruby installation
72+
ruby -v
73+
74+
# Install required gems
75+
gem install asciidoctor listen
76+
77+
# Verify Boost.Build availability
78+
which b2
79+
```
80+
81+
2. **Prepare Content**:
82+
- Place AsciiDoc files in the `doc/` directory
83+
- Default test file: `doc/specimen.adoc`
84+
85+
3. **Start Preview**:
86+
```bash
87+
# From project root
88+
ruby boostlook_asciidoc_preview.rb
89+
```
90+
91+
4. **Development Workflow**:
92+
- Edit `boostlook.css` or AsciiDoc files in `doc/`
93+
- Script automatically detects changes and rebuilds
94+
- Browser opens automatically with rendered content
95+
- Refresh browser to see changes
96+
97+
### Preview with Antora
98+
99+
1. **Install Prerequisites**:
100+
```bash
101+
# Install Antora CLI
102+
npm install -g @antora/cli @antora/site-generator
103+
104+
# Install Ruby gem for file watching
105+
gem install listen
106+
```
107+
108+
2. **Start Preview** (with automatic setup):
109+
```bash
110+
# Force rebuild and start watching
111+
ruby boostlook_antora_preview.rb --rebuild
112+
```
113+
114+
3. **Development Workflow**:
115+
- Edit `boostlook.css` → Triggers automatic rebuild
116+
- Edit `boostlook.rb` → Triggers automatic rebuild
117+
- View changes in browser (auto-opened)
118+
- Repeat until styling is perfect
119+
120+
## File Structure
121+
122+
### Preview with AsciiDoc Structure
123+
```
124+
boostlook/
125+
├── boostlook.css # Your main CSS file
126+
├── boostlook.rb # Antora extension (Ruby)
127+
├── boostlook_asciidoc_preview.rb # AsciiDoc preview script
128+
└── doc/
129+
├── specimen.adoc # Test AsciiDoc file
130+
└── ... # Other AsciiDoc files
131+
```
132+
133+
### Preview with Antora Structure
134+
```
135+
boostlook/
136+
├── boostlook.css # Your main CSS file
137+
├── boostlook.rb # Antora extension (Ruby)
138+
├── boostlook_antora_preview.rb # Antora preview script
139+
└── doc/
140+
└── antora_specimen/
141+
├── playbook.yml # Antora configuration
142+
└── build/ # Generated site (git-ignored)
143+
└── site/
144+
├── index.html # Entry point
145+
└── _/css/
146+
└── boostlook.css # Your CSS (auto-copied)
147+
```
148+
149+
## What You're Testing Against
150+
151+
### Preview with AsciiDoc
152+
- **Content**: Your custom AsciiDoc files
153+
- **Structure**: Simple document structure
154+
- **Elements**: Basic typography, code blocks, tables
155+
- **Speed**: Very fast iteration cycles
156+
157+
### Preview with Antora
158+
- **Content**: Official Boost.URL documentation from GitHub
159+
- **Structure**: Actual Antora-generated documentation
160+
- **Elements**: Real typography, code blocks, tables, navigation, etc.
161+
- **Complexity**: Multi-level navigation, cross-references, production patterns
162+
163+
## Configuration
164+
165+
### AsciiDoc Preview Configuration
166+
The AsciiDoc preview uses your existing Boost.Build configuration. Ensure your `build.jam` or similar build files are properly configured for BoostLook integration.
167+
168+
### Antora Preview Configuration (`doc/antora_specimen/playbook.yml`)
169+
```yaml
170+
site:
171+
title: Boostlook Antora Specimen
172+
url: /
173+
start_page: url::index.adoc
174+
175+
content:
176+
sources:
177+
- url: https://github.com/boostorg/url.git
178+
branches: develop
179+
start_path: doc
180+
181+
ui:
182+
bundle:
183+
url: https://github.com/boostorg/website-v2-docs/releases/download/ui-master/ui-bundle.zip
184+
snapshot: true
185+
186+
output:
187+
dir: ./build/site
188+
```
189+
190+
**Key Points:**
191+
- **No git submodules** - Content fetched automatically
192+
- **Remote UI bundle** - Official Boost documentation UI
193+
- **Your CSS overrides** - Applied automatically after build
194+
195+
## Preview Script Features
196+
197+
### AsciiDoc Preview Features
198+
- **File Watching**: Monitors `doc/` directory and root CSS files
199+
- **Automatic Building**: Uses Boost.Build (b2) for rendering
200+
- **Browser Integration**: Opens rendered HTML automatically
201+
- **Cross-platform**: Works on macOS, Linux, Windows
202+
203+
### Antora Preview Features
204+
- **Automatic CSS Override**: Copies your current `boostlook.css` over outdated UI bundle version
205+
- **Smart Rebuilding**: CSS changes trigger full rebuild (processed by Ruby extension)
206+
- **Content Fetching**: Automatically downloads latest Boost.URL documentation
207+
- **File Hash Checking**: Avoids unnecessary rebuilds
208+
209+
## Manual Testing Commands
210+
211+
### Preview with AsciiDoc (Manual)
212+
```bash
213+
# Build once without watching
214+
b2 doc/specimen.html
215+
216+
# Serve locally (if needed)
217+
python -m http.server 8000
218+
```
219+
220+
### Preview with Antora (Manual)
221+
```bash
222+
# Build once without watching
223+
cd doc/antora_specimen
224+
npx antora --fetch playbook.yml
225+
226+
# Copy your current CSS
227+
cp ../../boostlook.css build/site/_/css/boostlook.css
228+
229+
# Serve locally
230+
npx http-server build/site -p 8080
231+
```
232+
233+
## Troubleshooting
234+
235+
### Preview with AsciiDoc Issues
236+
237+
**Error: `error: no generators were found for type 'HTML'`**
238+
239+
- **Cause**: This is the most common issue. It means Boost.Build (`b2`) cannot find the `asciidoctor` executable.
240+
- **Solution**: You must configure your `$HOME/user-config.jam` file. Please follow the instructions in the **"Boost.Build Configuration (`user-config.jam`)"** section under Prerequisites.
241+
242+
**Error: `command not found: b2`**
243+
244+
- **Cause**: The Boost.Build `b2` executable is not in your system's `PATH`.
245+
- **Solution**: Install Boost.Build and ensure its location is added to your `PATH`. Verify with `which b2`.
246+
247+
**Script must be run from the project root**
248+
249+
- **Cause**: The script expects to be run from the main `boostlook/` directory.
250+
- **Solution**: Make sure you are in the project's root directory before running `ruby boostlook_asciidoc_preview.rb`.
251+
252+
**Warnings like `www-browser: not found` or `xdg-open: ... not found`**
253+
254+
- **Cause**: These warnings may appear on some Linux systems if the script cannot find a default command-line web browser.
255+
- **Solution**: These are usually harmless and can be ignored if a graphical browser still opens. To resolve them, you can install a common utility like `xdg-utils` (`sudo apt-get install xdg-utils` on Debian/Ubuntu).
256+
257+
### Preview with Antora Issues
258+
259+
**Build Fails:**
260+
```bash
261+
# Check Antora installation
262+
npx antora --version
263+
264+
# Check if playbook is valid
265+
cd doc/antora_specimen
266+
npx antora playbook.yml --dry-run
267+
```
268+
269+
**CSS Not Updating:**
270+
```bash
271+
# Force complete rebuild
272+
ruby boostlook_antora_preview.rb --rebuild
273+
274+
# Manually verify CSS copy
275+
ls -la doc/antora_specimen/build/site/_/css/boostlook.css
276+
```
277+
278+
**Preview Script Issues:**
279+
```bash
280+
# Check if listen gem is installed
281+
gem list | grep listen
282+
283+
# Install if missing
284+
gem install listen
285+
```
286+
287+
**Node.js/Antora Issues:**
288+
- Ensure Node.js is installed: `node --version`
289+
- Install/reinstall Antora: `

0 commit comments

Comments
 (0)