Fix: Image Optimize

Dockerfile

@@ -4,8 +4,13 @@ FROM php:8.3-apache
 RUN apt-get update && apt-get install -y \
         libsqlite3-dev \
         libzip-dev \
+        libjpeg-dev \
+        libpng-dev \
+        libwebp-dev \
+        libgif-dev \
         unzip \
-    && docker-php-ext-install pdo_sqlite zip
+    && docker-php-ext-configure gd --with-jpeg --with-webp \
+    && docker-php-ext-install pdo_sqlite zip gd
 
 # Set DocumentRoot
 ENV APACHE_DOCUMENT_ROOT=/var/www/html

api/optimize_image.php

@@ -1,6 +1,9 @@
 <?php
 session_start();
 
+// Set proper content type
+header('Content-Type: application/json');
+
 // Basic authentication check
 if (!isset($_SESSION['user_id'])) {
     http_response_code(403);

include/js/script.js

@@ -340,22 +340,41 @@ function optimizeImage(path) {
         const formData = new FormData();
         formData.append('path', path);
 
+        console.log('Optimizing image:', path);
+
         fetch('api/optimize_image.php', {
             method: 'POST',
             body: formData
         })
-        .then(response => response.json())
-        .then(data => {
-            if (data.success) {
-                alert('Image optimized successfully. The page will now reload.');
-                window.location.reload();
-            } else {
-                alert('An error occurred: ' + data.message);
+        .then(response => {
+            console.log('Response status:', response.status);
+            console.log('Response headers:', response.headers);
+            
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            
+            return response.text(); // First get as text to see raw response
+        })
+        .then(text => {
+            console.log('Raw response:', text);
+            try {
+                const data = JSON.parse(text);
+                if (data.success) {
+                    alert('Image optimized successfully. The page will now reload.');
+                    window.location.reload();
+                } else {
+                    alert('An error occurred: ' + data.message);
+                }
+            } catch (parseError) {
+                console.error('JSON parse error:', parseError);
+                console.error('Response text:', text);
+                alert('Invalid response from server. Check console for details.');
             }
         })
         .catch(error => {
-            console.error('Error:', error);
-            alert('A network error occurred. Please try again.');
+            console.error('Fetch error:', error);
+            alert('A network error occurred: ' + error.message);
         });
     }
 }