Skip to content

Bardic v0.10.0: Browser Bundler Updates

Choose a tag to compare

@katelouie katelouie released this 13 Mar 20:09
· 6 commits to main since this release

The browser template is now a complete authoring target: asset pipeline, transitions, sidebar, modals, a clean JavaScript API, and a bardic init --template browser that scaffolds the whole thing.

Also some small miscellaneous fixes.


New Features

bardic init --template browser

New project template for browser-deployed games. Scaffolds everything you need:

my-game/
├── example.bard
├── custom.css        # CSS variables, pixel art class, your overrides
├── custom.js         # Working Bardic API examples, ready to edit
├── assets/           # Images, fonts, audio — auto-detected by bundler
├── game_logic/       # Your Python modules
└── linter/           # Project-specific lint checks

custom.js ships with working examples of the Bardic API so you're not starting from a blank page.


Browser Template Upgrade

The bardic bundle browser template has been comprehensively rebuilt. What you get out of the box:

Asset Pipeline

The bundler now auto-detects and copies assets/, custom.css, and custom.js from your story directory. New --assets-dir flag for non-standard asset locations. No more manually copying files after every bundle.

Image Support

![A worn tarot card](assets/card_back.png)

Renders as <img> in browser. Terminal player shows [Image: A worn tarot card]. CSS variable --image-rendering (defaults to pixelated in custom.css for pixel art games). Per-image override with the .pixel class.

Passage Transitions

Fade out/in between passages (200ms). First load renders without transition — no flash on arrival.

Sidebar Panel

Collapsible 280px sidebar with hamburger toggle. Two ways to activate:

@render sidebar(content)       # From story code
Bardic.sidebar(html)           // From custom.js

On mobile (under 600px): fixed overlay instead of push layout. Respects player toggle — doesn't re-open on navigation after manually closing.

Render Directive System

renderPassage() now extracts and dispatches render_directives and input_directives from engine output. Built-in renderers for image, html, text_block, sidebar, and modal. Custom _serialize function handles stdlib objects crossing the Pyodide bridge. Unregistered directives show name + JSON data in dev mode — useful when wiring up new directive types.

Modal System

Bardic.openModal(html)    // Open with any HTML content
Bardic.closeModal()       // Dismiss

Escape key and backdrop click to dismiss. ARIA attributes included. Use for book views, inventory overlays, card details, anything that needs a focused overlay without leaving the passage.

Bardic JavaScript API

Clean namespace replacing scattered window.* globals. Everything you need to extend and integrate:

// Register a custom render directive
Bardic.directive('card_flip', (data) => { /* render logic */ })

// Push content to the sidebar
Bardic.sidebar('<h2>Session Notes</h2>...')

// Register background cycling
Bardic.backgrounds({ "Tavern": "assets/tavern.jpg" })

// Lifecycle hooks
Bardic.on('passageRender', (passageName) => { /* track analytics, update UI */ })
Bardic.on('beforeChoice', (choiceText) => { /* animate, log */ })
Bardic.on('start', () => { /* init your systems */ })

Typo detection warns on unknown event names with suggestions — Bardic.on('passagerender') tells you it probably meant passageRender.


Browser Customization Docs

docs/browser-customization.md — full Bardic JS API reference, CSS variable table, and a complete pixel-art RPG example showing the whole system working together. Linked from the main README.


Bug Fixes

Quest and QuestJournal not exported from bardic.stdlib: added in 0.7.1 with full tests and documentation, but missing from __all__. from bardic.stdlib import QuestJournal now works as documented.

f-string bug in executor error message: NameError handler displayed literal {list(exec_context.keys())} instead of actual variable names. Error messages now show the real context.

Dead _loop_context allocation in renderer: unused dict was being created on every loop iteration. Removed.

HookManager.restore() now mutates in place: clear() + update() instead of reference replacement, consistent with every other restore path in the codebase.


Upgrade Notes

pip install --upgrade bardic

No story file changes needed for existing projects.

To start a new browser game:

bardic init my-game --template browser
cd my-game
# write your story
bardic bundle example.bard

Full customization guide: docs/browser-customization.md