WP OpenStation

A WordPress plugin that reimagines /wp-admin as a desktop operating system. Admin screens open as draggable, resizable, minimizable windows on a desktop, with a left-edge dock built from the admin menu. Purely opt-in per user — the classic admin stays untouched for everyone else, and deactivating the plugin restores vanilla Core exactly.

Zero Core patches. Every feature is wired through public WordPress hooks.

• Demo
• Current State
• Still ahead
• Repository layout
• Bundled extensions
• How to run it

• Requirements
• For plugin authors
• License

Current State

• Station Home

• Per-user opt-in

• Desktop shell

• Window system — iframe + native

• Dock

• Virtual desktops (“Spaces”)

• Arrange & snap

• Wallpaper registry

• Widgets

• Desktop icons

• AI Assistant + slash commands

• Palette registry

• Cross-frame drag bridge

• Toast notifications

• OpenStation Preferences

• Session persistence

• Mobile — the phone layer

• postMessage bridge

• UI component library

• i18n

• Component registration API

• Public hook API

Still ahead

• Mobile, the next pass — the phone layer ships (docs/mobile.md: home-screen grid, full-screen apps, app switcher, edge-swipe back, bottom tab bar, wp.os.mode); still ahead are pull-to-refresh and a pass on real devices.
• Tablet hybrid — split view, slide-over, horizontal dock, on the wp.os.mode primitive that already reports 'tablet'.
• Cross-window drag & drop (the North Star) — extend the current drag bridge to Media → Gutenberg block insertion, with pluggable mime-type negotiation.
• Polish — color-scheme-aware variables across all shell surfaces, View Transitions API animations, full a11y audit (ARIA, focus traps, keyboard nav).
• …and a whole lot more hooks, filters, and actions — every new surface lands with its own extension points, so this list keeps growing.

Repository layout

.
├── desktop-mode.php       # bootstrap: header, constants, require_once of includes/
├── includes/              # PHP subsystems
│   ├── helpers.php              admin-bar.php       ajax.php
│   ├── assets.php               render.php          portal.php
│   ├── session.php              default-window.php  components.php
│   ├── os-settings.php          extended-options.php
│   ├── accents.php              wallpapers.php      toast-types.php
│   ├── media-query.php
│   └── ai-copilot/              # AI assistant (OpenAI client, analysis, search, jobs)
├── apps/                  # App Framework apps: <name>.os.php (window, state, actions,
│                          #   data) + optional <name>.os.ts (client view) + <name>.css;
│                          #   Code Blue lives here — see docs/app-framework.md
├── assets/                # hand-authored CSS + JS build output
│   ├── css/  desktop.css, windows.css, dock.css, chromeless.css, variables.css
│   │          variables.css carries the OpenStation palette — every design
│   │          token the shell and the <os-*> kit read, declared once
│   ├── fonts/    Geist + Geist Mono (variable, SIL OFL 1.1)
│   ├── wallpapers/  the four brand desks: galaxy (default), space,
│   │          holomesh, pulsemesh
│   ├── desktop-themes/legacy/
│   │          the built-in "Desktop Mode (Legacy)" theme — a frozen snapshot of
│   │          every token at its pre-brand value; never regenerated.
│   │          Zip it with npm run package:legacy-theme
│   └── js/   Vite bundles (gitignored; regenerate with npm run build) — only
│             admin-bar.js and media-library-enhanced.js are hand-written and tracked
├── src/                   # TypeScript source — compiled by Vite
│   ├── desktop.ts / dock.ts / hooks.ts / commands.ts / palette-registry.ts
│   ├── ai-assistant/ + drag-bridge.ts / toast.ts / desktop-icons.ts
│   ├── native-windows.ts / built-in-commands.ts / public-api.ts / types.ts
│   ├── window/          # Window class — DOM, pointer, tabs, iframe bridge
│   ├── window-manager/  # stack, desktops, arrange, snap, overview
│   ├── wallpapers/      # registry, layer, surfaces, server sync, vendor loader
│   ├── widgets/         # registry, layer, frame, picker, storage
│   ├── settings/        # OpenStation Preferences panel sections
│   ├── ui/              # <os-*> web components
│   ├── modules/         # vendor-script lazy-loader
│   └── plugins/         # built-in demos (animated-logo-wallpaper)
├── docs/                  # developer-facing docs (source of truth for plugin authors)
├── extensions/            # bundled sibling plugins (see "Bundled extensions" below)
├── tests/                 # PHPUnit + Vitest
├── languages/             # .po / .mo (es shipped)
├── bin/                   # package-zip helpers
├── package.json           # devDeps (vite, typescript, vitest)
├── vite.config.js         # Vite lib-mode: src/desktop.ts → assets/js/desktop[.min].js (IIFE)
├── vitest.config.ts
└── tsconfig.json

Bundled extensions

The extensions/ directory hosts sibling plugins that build on OpenStation's public APIs. Each one is a standalone WordPress plugin (Requires Plugins: desktop-mode) installed from its own zip — run ./bin/package-extensions.sh to build one .zip per extension under dist/; see docs/RELEASE.md for the full packaging steps. (extensions/base/ is a shared base library for extension authors, not an installable plugin.)

• Code Editor (desktop-mode-code-editor) — a Monaco-backed Code editor native window for browsing and editing files inside wp-content. Editing requires the edit_plugins capability and is disabled entirely when DISALLOW_FILE_EDIT is set.
• Cron Manager (desktop-mode-cron-manager) — a Cron Jobs native window for browsing, editing, deleting, and running WP-Cron events. Gated by manage_options.
• Popup Siege (desktop-mode-popup-siege) — a 90-second Breakout-style archive rescue game with OpenStation leaderboards, play-time tracking, and score-to-beat challenges. The deterministic game runtime is lazy-loaded on first play.
• SOL Inbound Monologue (desktop-mode-feed-buddy) — an AIM-era RSS/Atom reader with a movable buddy-list widget, a native conversation-style reader window, per-user subscriptions and unread state, safe server-side feed discovery, and optional synthesized chimes.
• phpMyAdmin (desktop-mode-phpmyadmin) — embeds a bundled phpMyAdmin install as a native window. Local environments only: the window registers solely when wp_get_environment_type() is 'local', because the bundled phpMyAdmin runs with auth_type=config and reuses the WordPress DB credentials — any visitor who finds the URL gets full DB access. The manage_options check only hides the shortcut from lower-privilege users; it does not gate the underlying URL.

How to run it

Quick install

Just want to try it? Grab the pre-built zip and upload it to any WordPress — Studio by WordPress.com, wp-env, or a hosted site. No Node, no build step.

1. Download openstation.zip from the latest release (or pick a specific version from the releases page).
2. In WP Admin: Plugins → Add New → Upload Plugin, choose the zip, and activate.
3. Click the desktop icon in the admin bar's top-right corner. The admin reloads inside the desktop shell. Click the same icon again to return to classic admin.

Development setup

For hacking on the plugin: clone the repo, run the build in watch mode, and load it into a local WordPress via symlink so every save is one browser refresh away.

1. Install dependencies

npm install

2. Build the TypeScript bundle

The plugin uses Vite in library mode. esbuild handles transpile and minify, so builds finish in ~70 ms per bundle.

Full build — runs the PixiJS vendor-copy step plus every build:* target defined in package.json (one Vite bundle each; the scripts block in package.json and the entry map in vite.config.js are the authoritative target list):

npm run build

Writes one assets/js/.js / .min.js pair per target, including:

• assets/js/desktop.js / .min.js — main shell bundle (loaded based on SCRIPT_DEBUG).
• assets/js/iframe-bridge.js / .min.js — opt-in bridge that gives any same-origin iframe access to wp.os.iframe.*.
• assets/js/posts-window.js / .min.js — Native Posts window (the replacement for the edit.php iframe; opt-in per user via OpenStation Preferences → Features).

npm run dev

Leave it running in a separate terminal; refresh the browser after each save. Set define( 'SCRIPT_DEBUG', true ) in wp-config.php so WordPress picks up the unminified bundle during development.

3. Load into a local WordPress

You need a running WordPress to load the plugin into. Pick whichever is easier.

##### Studio, wp-env, or a hosted WP

Run npm run package to build a zip from HEAD (with correct 0644 / 0755 permissions), then follow the Quick install steps 2–3 to upload and activate it. Re-package and re-upload after each change.

If you changed source, run npm run build before npm run package — the Vite output is gitignored, and bin/package.sh splices the built files into the zip from your working tree.

npm run package:legacy-theme builds dist/desktop-mode-legacy-theme.zip — the built-in Legacy desktop theme as an installable theme ZIP. The plugin registers Legacy from code either way; the zip is for handing it to someone else or forking it into a theme of your own.

##### Clone wordpress-develop and symlink

Gives you the full dev loop: npm run dev rebuilds on save, a browser refresh picks it up.

# clone Core's Docker-based dev host alongside this repo
git clone https://github.com/WordPress/wordpress-develop.git
cd wordpress-develop
npm install
symlink this plugin into the WP plugins directory
ln -s "$(pwd)/../alcazaba-plugin" src/wp-content/plugins/desktop-mode
boot + install WordPress
npm run env:start      # nginx + PHP + MySQL in Docker
npm run env:install    # installs WordPress

Site: http://localhost:8889 Admin: http://localhost:8889/wp-admin/ Credentials: admin / password

Stop the environment with npm run env:stop (from the wordpress-develop directory). Activate the plugin per Quick install steps 2–3.

Requirements

• WordPress 6.0+
• PHP 7.4+

For plugin authors

This plugin is built to be extended. Every significant behavior is hookable — drop an icon on the desktop, add a dock item, gate OpenStation by role, react to window events, or register a native window, all from your own plugin with zero patches here.

See docs/ — the developer documentation index.

Quick links:

• Getting Started — the five-minute tour for plugin authors.
• Architecture — how the pieces fit together.
• Hooks Reference — every action and filter we fire, with signatures and examples.
• JavaScript Reference — CustomEvents, window.wp.os API, and the iframe postMessage bridge.
• Examples — copy-paste recipes.

License

GPLv2 or later. See LICENSE.