diff --git a/resources/js/app.js b/resources/js/app.js
index ae2655c..486a9e2 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -42,6 +42,35 @@ window.offlineProgressUpdate = function(phaseId, progress, comment, location) {
     window.queueOfflineAction('progress_update', payload);
 };
 
+// Function to capture and store image for offline upload
+window.captureAndStoreImage = async (file, phaseId, description = '') => {
+    try {
+        // Convert file to base64
+        const base64 = await new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = () => resolve(reader.result.split(',')[1]); // Get just the base64 part
+            reader.onerror = reject;
+            reader.readAsDataURL(file);
+        });
+        
+        const payload = {
+            file: base64,
+            path: `media/${new Date().getTime()}_${file.name}`, // Simple path, could be improved
+            model_type: 'App\\Models\\Phase',
+            model_id: phaseId,
+            name: file.name,
+            description: description,
+            mime_type: file.type
+        };
+        
+        window.queueOfflineAction('media_upload', payload);
+        return true;
+    } catch (error) {
+        console.error('Error capturing image:', error);
+        return false;
+    }
+};
+
 // Sync pending actions when online
 window.addEventListener('online', () => {
     // Trigger a sync attempt
@@ -49,9 +78,6 @@ window.addEventListener('online', () => {
         .then(res => res.json())
         .then(data => {
             console.log('Synced:', data);
-            // Optionally, clear the local pending list if the sync was successful
-            // But note: the backend will mark them as synced, so we rely on the service worker to clean up?
-            // We'll leave it to the service worker to handle the state.
         })
         .catch(err => {
             console.error('Error triggering sync:', err);