geoproject-app/public/site/plugins/web2print/index.php
isUnknown 0f46618066
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 16s
feat: add custom CSS save system with dual-editor interface
Implement complete custom CSS management system:
- Separate base CSS (readonly) and custom CSS (editable)
- Save custom CSS to Kirby backend per narrative
- Visual save button with state indicators (dirty/saving/success/error)
- CSRF-protected API endpoint for CSS operations
- Dual-editor StylesheetViewer (base + custom with edit mode toggle)
- Auto-format custom CSS with Prettier on edit mode exit

Backend changes:
- Add web2print Kirby plugin with POST/GET routes
- Add customCss field to narrative blueprint
- Add CSRF token meta tag in header
- Include customCss and modified timestamps in JSON template
- Install code-editor plugin for Kirby panel

Frontend changes:
- Refactor stylesheet store with baseCss/customCss refs
- Make content a computed property (baseCss + customCss)
- Add helper methods: replaceBlock, replaceInCustomCss, setCustomCss
- Update all components to use new store API
- Create SaveButton component with FAB design
- Redesign StylesheetViewer with collapsable sections
- Initialize store from narrative data on app mount

File changes:
- Rename stylesheet.css → stylesheet.print.css
- Update all references to new filename

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-01-09 13:39:25 +01:00

116 lines
3.9 KiB
PHP

<?php
/**
* Web2Print Plugin
*
* Routes for web-to-print functionality including custom CSS management
*/
use Kirby\Cms\Response;
Kirby::plugin('geoproject/web2print', [
'routes' => [
// POST: Save custom CSS
[
'pattern' => 'narratives/(:all)/css',
'method' => 'POST',
'action' => function ($pagePath) {
// Check authentication
if (!kirby()->user()) {
return Response::json([
'status' => 'error',
'message' => 'Authentication required'
], 401);
}
// Verify CSRF token from header
$csrfToken = kirby()->request()->header('X-CSRF');
if (!csrf($csrfToken)) {
return Response::json([
'status' => 'error',
'message' => 'Invalid CSRF token'
], 403);
}
// Get page
$page = page($pagePath);
if (!$page || $page->intendedTemplate()->name() !== 'narrative') {
return Response::json([
'status' => 'error',
'message' => 'Narrative not found'
], 404);
}
// Get POST data
$data = kirby()->request()->data();
$customCss = $data['customCss'] ?? null;
if ($customCss === null) {
return Response::json([
'status' => 'error',
'message' => 'No CSS content provided'
], 400);
}
try {
// Update page with new custom CSS
$page->update([
'customCss' => $customCss
]);
// Reload page to get updated modification time
$page = page($pagePath);
// Return success with updated modified timestamp
return Response::json([
'status' => 'success',
'data' => [
'modified' => $page->modified(),
'modifiedFormatted' => $page->modified('d/m/Y H:i')
]
]);
} catch (Exception $e) {
return Response::json([
'status' => 'error',
'message' => 'Failed to save CSS: ' . $e->getMessage()
], 500);
}
}
],
// GET: Load custom CSS and last modified time
[
'pattern' => 'narratives/(:all)/css',
'method' => 'GET',
'action' => function ($pagePath) {
// Check authentication
if (!kirby()->user()) {
return Response::json([
'status' => 'error',
'message' => 'Authentication required'
], 401);
}
// Get page
$page = page($pagePath);
if (!$page || $page->intendedTemplate()->name() !== 'narrative') {
return Response::json([
'status' => 'error',
'message' => 'Narrative not found'
], 404);
}
// Return custom CSS content and modified timestamp
return Response::json([
'status' => 'success',
'data' => [
'customCss' => $page->customCss()->value() ?? '',
'modified' => $page->modified(),
'modifiedFormatted' => $page->modified('d/m/Y H:i')
]
]);
}
]
]
]);