101 lines
3.5 KiB
TypeScript
101 lines
3.5 KiB
TypeScript
import { PageLayout } from './unifiedLayoutManager';
|
||
|
||
export interface LayoutTemplate {
|
||
name: string;
|
||
layoutJson: string;
|
||
isPredefined?: boolean;
|
||
}
|
||
|
||
const PREDEFINED_TEMPLATES: LayoutTemplate[] = [
|
||
{
|
||
name: "Product Layout (Amazon)",
|
||
isPredefined: true,
|
||
layoutJson: JSON.stringify({
|
||
"id": "template-product",
|
||
"name": "Product Layout",
|
||
"createdAt": 1715694800000,
|
||
"updatedAt": 1715694800000,
|
||
"containers": [
|
||
{
|
||
"id": "product-main",
|
||
"type": "container",
|
||
"columns": 2,
|
||
"gap": 24,
|
||
"widgets": [
|
||
{
|
||
"id": "product-images",
|
||
"widgetId": "photo-grid",
|
||
"props": {}
|
||
},
|
||
{
|
||
"id": "product-details",
|
||
"widgetId": "markdown-text",
|
||
"props": {
|
||
"content": "# Super Widget 3000\n**$99.99**\n\n⭐️⭐️⭐️⭐️⭐️ (420 ratings)\n\n- Feature 1: Amazing\n- Feature 2: Incredible\n- Feature 3: Unbelievable"
|
||
}
|
||
}
|
||
],
|
||
"children": [],
|
||
"order": 0
|
||
},
|
||
{
|
||
"id": "related-prods",
|
||
"type": "container",
|
||
"columns": 1,
|
||
"gap": 16,
|
||
"widgets": [
|
||
{
|
||
"id": "related-title",
|
||
"widgetId": "markdown-text",
|
||
"props": { "content": "### Customers also bought" }
|
||
},
|
||
{
|
||
"id": "related-grid",
|
||
"widgetId": "photo-grid-widget",
|
||
"props": {}
|
||
}
|
||
],
|
||
"children": [],
|
||
"order": 1
|
||
}
|
||
]
|
||
})
|
||
}
|
||
];
|
||
|
||
export class LayoutTemplateManager {
|
||
private static STORAGE_KEY = 'polymech_layout_templates';
|
||
|
||
static getTemplates(): LayoutTemplate[] {
|
||
const stored = localStorage.getItem(this.STORAGE_KEY);
|
||
const custom: LayoutTemplate[] = stored ? JSON.parse(stored) : [];
|
||
return [...PREDEFINED_TEMPLATES, ...custom];
|
||
}
|
||
|
||
static saveTemplate(name: string, layoutJson: string) {
|
||
const templates = this.getCustomTemplates();
|
||
|
||
// Check if exists and update
|
||
const existingIndex = templates.findIndex(t => t.name === name);
|
||
const newTemplate: LayoutTemplate = { name, layoutJson, isPredefined: false };
|
||
|
||
if (existingIndex >= 0) {
|
||
templates[existingIndex] = newTemplate;
|
||
} else {
|
||
templates.push(newTemplate);
|
||
}
|
||
|
||
localStorage.setItem(this.STORAGE_KEY, JSON.stringify(templates));
|
||
}
|
||
|
||
static getCustomTemplates(): LayoutTemplate[] {
|
||
const stored = localStorage.getItem(this.STORAGE_KEY);
|
||
return stored ? JSON.parse(stored) : [];
|
||
}
|
||
|
||
static deleteTemplate(name: string) {
|
||
const templates = this.getCustomTemplates().filter(t => t.name !== name);
|
||
localStorage.setItem(this.STORAGE_KEY, JSON.stringify(templates));
|
||
}
|
||
}
|