1 files changed, 77 insertions, 0 deletions
diff --git a/js/pixel-art/pixel/app.js b/js/pixel-art/pixel/app.js
index d2eddee..8a7aceb 100644
--- a/js/pixel-art/pixel/app.js
+++ b/js/pixel-art/pixel/app.js
@@ -54,6 +54,8 @@ document.getElementById('panLeftBtn').addEventListener('click', () => handlePanB
 document.getElementById('panRightBtn').addEventListener('click', () => handlePanButton('right'));
 document.getElementById('centerViewBtn').addEventListener('click', resetView);
 document.getElementById('newCanvasBtn').addEventListener('click', addNewCanvas);
+document.getElementById('saveProjectBtn').addEventListener('click', saveProject);
+document.getElementById('loadProjectBtn').addEventListener('click', loadProject);
 
 
 resizeCanvas();
@@ -466,4 +468,79 @@ function resetView() {
         drawGrid();
         saveToLocalStorage();
     }
+}
+
+function saveProject() {
+    const now = new Date();
+    const formattedDate = now.toISOString().slice(0, 16).replace('T', '-').replace(':', '-');
+    
+    const projectName = prompt("Enter a name for your project", formattedDate);
+    if (!projectName) return; // User cancelled
+    
+    // First save to localStorage to ensure all current state is saved
+    saveToLocalStorage();
+    
+    // Get the data from localStorage and add our special header
+    const projectData = JSON.parse(localStorage.getItem('pixelArtConfig'));
+    const exportData = {
+        __projectHeader: "pppppp_v1",  // Add special header
+        timestamp: new Date().toISOString(),
+        data: projectData
+    };
+    
+    // Create and trigger download
+    const blob = new Blob([JSON.stringify(exportData, null, 2)], { type: 'application/json' });
+    const link = document.createElement('a');
+    link.href = URL.createObjectURL(blob);
+    link.download = `${projectName}.json`;
+    link.click();
+    URL.revokeObjectURL(link.href);
+}
+
+function loadProject() {
+    // AAAAH! Data loss!
+    const confirmLoad = confirm("Loading a project will replace your current work. Are you sure you want to proceed?");
+    if (!confirmLoad) return;
+    
+    // Create file input
+    const fileInput = document.createElement('input');
+    fileInput.type = 'file';
+    fileInput.accept = '.json';
+    
+    fileInput.addEventListener('change', function(e) {
+        const file = e.target.files[0];
+        if (!file) return;
+        
+        const reader = new FileReader();
+        reader.onload = function(e) {
+            try {
+                const importedData = JSON.parse(e.target.result);
+                
+                // Check for our super special header
+                if (!importedData.__projectHeader || 
+                    importedData.__projectHeader !== "pppppp_v1") {
+                    throw new Error('This file is not a valid Pixel Art Project file');
+                }
+                
+                const projectData = importedData.data;
+                
+                // Validate the data has expected properties
+                if (!projectData.gridWidth || !projectData.gridHeight || !projectData.canvases) {
+                    throw new Error('Invalid project file format');
+                }
+                
+                // Save to localStorage
+                localStorage.setItem('pixelArtConfig', JSON.stringify(projectData));
+                
+                // Reload the page to apply changes
+                window.location.reload();
+                
+            } catch (error) {
+                alert('Error loading project file: ' + error.message);
+            }
+        };
+        reader.readAsText(file);
+    });
+    
+    fileInput.click();
 }
\ No newline at end of file