LifeRPG_v2.0/modern/plugin-sdk/README.md
TLimoges33 7fe4ae5365
🧙‍♂️ Transform LifeRPG into The Wizard's Grimoire - Production-Ready Application
 Major Features Added:
- Complete magical theming and rebranding from LifeRPG to The Wizard's Grimoire
- Production-grade React frontend with Tailwind CSS v4 and magical aesthetics
- Comprehensive analytics dashboard with Recharts integration (ScryingPortal)
- Push notifications system with PWA service worker support
- Drag & drop functionality using @dnd-kit for habit reordering
- Social features with friends system and leaderboards
- Performance optimization tools and monitoring
- Mobile app enhancement with PWA installation support

🏗️ Technical Infrastructure:
- Advanced service worker with offline support and background sync
- Zustand state management for scalable application state
- Production-ready UI component system with enhanced Button, Card, Input
- Progressive Web App (PWA) with manifest and app installation
- FastAPI backend with comprehensive API endpoints
- Docker containerization and CI/CD pipeline setup

📱 Progressive Web App Features:
- Offline functionality with intelligent caching
- Push notification support for habit reminders
- App installation on mobile and desktop platforms
- Background sync for offline data management
- Performance monitoring and optimization tools

🎨 User Experience:
- Magical wizard/grimoire theming throughout application
- Responsive design optimized for all device sizes
- Drag & drop habit management with smooth animations
- Interactive analytics with multiple chart types
- Social connectivity with friends and competitive features
- Comprehensive notification and performance settings

🔧 Developer Experience:
- Modern development stack with Vite and React
- Comprehensive testing setup and CI/CD pipelines
- Code quality tools with pre-commit hooks
- Docker development environment
- Detailed documentation and implementation guides

This represents a complete transformation from prototype to production-ready application with enterprise-grade features and magical user experience.
2025-08-30 17:32:42 +00:00

221 lines
4.3 KiB
Markdown

# LifeRPG Plugin SDK
This SDK allows you to create plugins for the LifeRPG application using AssemblyScript, which compiles to WebAssembly.
## Getting Started
### Prerequisites
- Node.js 18 or later
- npm or yarn
### Installation
```bash
npm install @liferpg/plugin-sdk
```
### Creating a Simple Plugin
1. Create a new directory for your plugin:
```bash
mkdir my-liferpg-plugin
cd my-liferpg-plugin
```
2. Initialize a new npm project:
```bash
npm init -y
```
3. Install the LifeRPG Plugin SDK:
```bash
npm install @liferpg/plugin-sdk
```
4. Create an `assembly` directory and add your plugin code:
```bash
mkdir assembly
```
5. Create a file `assembly/index.ts` with the following content:
```typescript
import { PluginContext, API } from "@liferpg/plugin-sdk";
// Export the initialize function
export function initialize(context: PluginContext): void {
// Log a message
context.log("My plugin initialized!");
// Register a dashboard widget
context.api.registerDashboardWidget(
"my-widget",
"My Custom Widget",
"<div>Hello from my plugin!</div>"
);
}
```
6. Add a build script to your `package.json`:
```json
{
"scripts": {
"build": "asc assembly/index.ts --target release"
}
}
```
7. Build your plugin:
```bash
npm run build
```
This will create a `.wasm` file in the `build` directory.
## Plugin API Reference
### PluginContext
The `PluginContext` is passed to your plugin's initialize function and provides access to the LifeRPG API.
#### Methods
- `log(message: string): void` - Log a message to the console
### API
The API object provides access to LifeRPG data and functionality.
#### Habits
- `getHabits(): Habit[]` - Get all habits
- `completeHabit(habitId: i32): boolean` - Complete a habit
#### Projects
- `getProjects(): Project[]` - Get all projects
#### UI
- `registerDashboardWidget(id: string, title: string, html: string): boolean` - Register a dashboard widget
- `registerMenuItem(id: string, title: string, path: string): boolean` - Register a menu item
#### Storage
- `getStorage(key: string): string` - Get a value from plugin storage
- `setStorage(key: string, value: string): boolean` - Store a value in plugin storage
## Example Plugins
### Pomodoro Timer
```typescript
import { PluginContext, API } from "@liferpg/plugin-sdk";
export function initialize(context: PluginContext): void {
context.log("Pomodoro plugin initialized");
// Register a dashboard widget with a Pomodoro timer
context.api.registerDashboardWidget(
"pomodoro-timer",
"Pomodoro Timer",
`
<div class="pomodoro-timer">
<div class="timer">25:00</div>
<button class="start-button">Start</button>
<button class="reset-button">Reset</button>
</div>
<script>
// Timer implementation would go here
// This script will run in a sandbox
</script>
`
);
}
```
### GitHub Integration
```typescript
import { PluginContext, API } from "@liferpg/plugin-sdk";
export function initialize(context: PluginContext): void {
context.log("GitHub plugin initialized");
// Register a dashboard widget showing GitHub stats
context.api.registerDashboardWidget(
"github-stats",
"GitHub Activity",
`
<div class="github-stats">
<h3>Recent Commits</h3>
<div class="commits-list">
Loading commits...
</div>
</div>
`
);
// Register a settings page for GitHub authentication
context.api.registerMenuItem(
"github-settings",
"GitHub Integration",
"/settings/github"
);
}
```
## Building and Packaging
To build your plugin for distribution:
```bash
npm run build
```
This will generate a WebAssembly binary that can be uploaded to LifeRPG.
## Plugin Manifest
Each plugin must provide a manifest (automatically generated during build):
```json
{
"id": "com.example.myplugin",
"name": "My Plugin",
"version": "1.0.0",
"author": "Your Name",
"description": "A custom plugin for LifeRPG",
"targetApiVersion": "1.0",
"minAppVersion": "1.0.0",
"permissions": [
"habits:read",
"ui:dashboard"
],
"extensionPoints": [
"dashboard.widget"
],
"entryPoint": "initialize"
}
```
## Security Considerations
Plugins run in a sandboxed WebAssembly environment with the following restrictions:
- Limited memory allocation
- No direct DOM access
- Controlled API access based on permissions
- Storage quotas
## License
MIT