feat: optimize image handling by reducing canvas size and improving localStorage management

src/views/ShootingView.vue

@@ -81,9 +81,9 @@ const captureSinglePhoto = () => {
     cropY = (videoHeight - cropHeight) / 2
   }
 
-  // ตั้งค่าขนาด canvas เป็น 3:4 (720x960)
-  const finalWidth = 720
-  const finalHeight = 960
+  // ตั้งค่าขนาด canvas เป็น 3:4 (360x480) - ลดขนาดเพื่อป้องกัน localStorage quota exceeded
+  const finalWidth = 360
+  const finalHeight = 480
 
   canvas.width = finalWidth
   canvas.height = finalHeight
@@ -95,8 +95,8 @@ const captureSinglePhoto = () => {
     0, 0, finalWidth, finalHeight // ตำแหน่งและขนาดใน canvas
   )
 
-  // แปลงเป็น base64
-  const photoDataUrl = canvas.toDataURL('image/jpeg', 0.9)
+  // แปลงเป็น base64 ด้วย quality 0.7 เพื่อลดขนาด
+  const photoDataUrl = canvas.toDataURL('image/jpeg', 0.7)
   photos.value.push(photoDataUrl)
   currentPhotoIndex.value++
 
@@ -145,10 +145,30 @@ const startAutoCapture = () => {
 }
 
 const proceedToNext = () => {
-  // เก็บรูปภาพไว้ใน localStorage
-  localStorage.setItem('photobooth-photos', JSON.stringify(photos.value))
-  stopCamera()
-  router.push('/printstep')
+  try {
+    // เคลียร์ cached images ที่เก่าออกก่อนเพื่อให้มีพื้นที่
+    const keysToRemove = []
+    for (let i = 0; i < localStorage.length; i++) {
+      const key = localStorage.key(i)
+      if (key && key.startsWith('photobooth-1x4-') || key.startsWith('photobooth-2x2-')) {
+        keysToRemove.push(key)
+      }
+    }
+    keysToRemove.forEach(key => localStorage.removeItem(key))
+
+    // เก็บรูปภาพไว้ใน localStorage
+    localStorage.setItem('photobooth-photos', JSON.stringify(photos.value))
+    stopCamera()
+    router.push('/printstep')
+  } catch (error) {
+    if (error instanceof DOMException && error.name === 'QuotaExceededError') {
+      alert('รูปภาพมีขนาดใหญ่เกินไป กรุณาลองใหม่อีกครั้งหรือใช้รูปภาพขนาดเล็กลง')
+      console.error('localStorage quota exceeded:', error)
+    } else {
+      console.error('Error saving photos:', error)
+      alert('เกิดข้อผิดพลาดในการบันทึกภาพ')
+    }
+  }
 }
 
 const goBack = () => {