fix(conferia): better images, 1week token and attendees scroll (#368)

adrrf · web-flow · commit 89189fba927f · 2025-09-01T17:49:35.000+02:00
* fix(conferia): token of 1 week

* fix(conferia): attendees scroll fix

* fix(conferia): better images
diff --git a/packages/conferia/backend/src/main/java/icpmapp/services/impl/JWTServiceImpl.java b/packages/conferia/backend/src/main/java/icpmapp/services/impl/JWTServiceImpl.java
@@ -21,7 +21,7 @@ public String generateToken(UserDetails userDetails){
         return Jwts.builder()
                 .subject(userDetails.getUsername())
                 .issuedAt(new Date(System.currentTimeMillis()))
-                .expiration(new Date(System.currentTimeMillis() + 1000 * 60 * 30)) //milliseconds * seconds * minutes
+                .expiration(new Date(System.currentTimeMillis() + 604800000)) // milliseconds (= 1 week)
                 .signWith(getSigninKey())
                 .compact();
     }
diff --git a/packages/conferia/backend/src/main/java/icpmapp/services/impl/StorageServiceImpl.java b/packages/conferia/backend/src/main/java/icpmapp/services/impl/StorageServiceImpl.java
@@ -249,18 +249,31 @@ public byte[] convertToWebP(File inputImage) throws IOException {
         // Read the input image
         BufferedImage originalImage = ImageIO.read(inputImage);
 
-        // Calculate the new height to maintain the aspect ratio
-        int targetWidth = 400;
+        // Set higher quality limits - max width 1200px instead of 400px
+        int maxWidth = 1200;
         int originalWidth = originalImage.getWidth();
         int originalHeight = originalImage.getHeight();
-        int targetHeight = (targetWidth * originalHeight) / originalWidth;
-
-        // Resize the image
-        Image resultingImage = originalImage.getScaledInstance(targetWidth, targetHeight, Image.SCALE_SMOOTH);
-        BufferedImage outputImage = new BufferedImage(targetWidth, targetHeight, BufferedImage.TYPE_INT_RGB);
-        Graphics2D g2d = outputImage.createGraphics();
-        g2d.drawImage(resultingImage, 0, 0, null);
-        g2d.dispose();
+        
+        // Only resize if image is larger than max width
+        BufferedImage outputImage;
+        if (originalWidth > maxWidth) {
+            int targetHeight = (maxWidth * originalHeight) / originalWidth;
+            
+            // Use higher quality scaling with Graphics2D
+            outputImage = new BufferedImage(maxWidth, targetHeight, BufferedImage.TYPE_INT_RGB);
+            Graphics2D g2d = outputImage.createGraphics();
+            
+            // Enable high-quality rendering
+            g2d.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BICUBIC);
+            g2d.setRenderingHint(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY);
+            g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
+            
+            g2d.drawImage(originalImage, 0, 0, maxWidth, targetHeight, null);
+            g2d.dispose();
+        } else {
+            // Use original image if it's already small enough
+            outputImage = originalImage;
+        }
 
         // Create a byte array output stream to capture the WebP output
         try (ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
diff --git a/packages/conferia/frontend/src/composables/usePhotoGallery.ts b/packages/conferia/frontend/src/composables/usePhotoGallery.ts
@@ -33,7 +33,7 @@ export const usePhotoGallery = () => {
   };
 
   /**
-   * Process and compress image
+   * Process and compress image with better quality settings
    */
   const processImage = async (imageBlob: Blob, maxSize: number, maxHeight: number, maxWidth: number): Promise<Blob> => {
     return new Promise((resolve, reject) => {
@@ -55,18 +55,23 @@ export const usePhotoGallery = () => {
 
         const ctx = canvas.getContext('2d');
         if (ctx) {
+          // Enable high-quality image rendering
+          ctx.imageSmoothingEnabled = true;
+          ctx.imageSmoothingQuality = 'high';
           ctx.drawImage(img, 0, 0, width, height);
         }
-        let quality = 1; // Start with 100% quality
-        const step = 0.1; // Reduce quality by 10% each step
+
+        let quality = 1; // Start with 95% quality instead of 100%
+        const step = 0.05; // Reduce quality by 5% each step (more gradual)
+        const minQuality = 0.8; // Don't go below 80% quality (was 60%)
 
         const reduceQualityParameter = () => {
           canvas.toBlob((blob) => {
             if (!blob) {
               reject(new Error('Failed to convert canvas to blob'));
               return;
             }
-            if (blob.size <= convertedMaxSize || quality <= 0.6) {
+            if (blob.size <= convertedMaxSize || quality <= minQuality) {
               resolve(blob);
             } else {
               quality -= step;
@@ -162,8 +167,8 @@ export const usePhotoGallery = () => {
         try {
           const stream = await navigator.mediaDevices.getUserMedia({
             video: {
-              width: { ideal: 1280 },
-              height: { ideal: 720 },
+              width: { ideal: 1920, min: 1280 }, // Higher resolution for better quality
+              height: { ideal: 1080, min: 720 },
               facingMode: 'user' // Front camera for profile photos
             }
           });
@@ -180,8 +185,15 @@ export const usePhotoGallery = () => {
           captureButton.onclick = () => {
             canvas.width = video.videoWidth;
             canvas.height = video.videoHeight;
-            context?.drawImage(video, 0, 0);
 
+            // Use high-quality canvas rendering
+            if (context) {
+              context.imageSmoothingEnabled = true;
+              context.imageSmoothingQuality = 'high';
+              context.drawImage(video, 0, 0);
+            }
+
+            // Increased JPEG quality from 0.9 to 0.95 for better camera captures
             canvas.toBlob((blob) => {
               if (blob) {
                 stopCamera();
@@ -190,7 +202,7 @@ export const usePhotoGallery = () => {
                 stopCamera();
                 reject(new Error('Failed to capture photo'));
               }
-            }, 'image/jpeg', 0.9);
+            }, 'image/jpeg', 0.95);
           };
 
           cancelButton.onclick = () => {
@@ -237,7 +249,7 @@ export const usePhotoGallery = () => {
   };
 
   /**
-   * Take photo for gallery (larger size)
+   * Take photo for gallery (higher quality, less compression)
    */
   const takePhotoGallery = async (): Promise<Blob> => {
     try {
@@ -249,14 +261,15 @@ export const usePhotoGallery = () => {
         photoBlob = await takePhotoWithFileInput();
       }
 
-      return await processImage(photoBlob, 1, 2000, 2000);
+      // Increased size limit to 3MB and dimensions to 2400x2400 for better gallery quality
+      return await processImage(photoBlob, 3, 2400, 2400);
     } catch (e) {
       throw new Error(`Failed to take photo: ${e instanceof Error ? e.message : 'Unknown error'}`);
     }
   };
 
   /**
-   * Take photo for profile (smaller, compressed)
+   * Take photo for profile (smaller, but still good quality)
    */
   const takePhotoProfile = async (): Promise<Blob> => {
     try {
@@ -268,7 +281,8 @@ export const usePhotoGallery = () => {
         photoBlob = await takePhotoWithFileInput();
       }
 
-      return await processImage(photoBlob, 0.2, 800, 600);
+      // Increased size limit from 0.2MB to 1MB for better profile photo quality
+      return await processImage(photoBlob, 1, 800, 600);
     } catch (e) {
       throw new Error(`Failed to take profile photo: ${e instanceof Error ? e.message : 'Unknown error'}`);
     }
diff --git a/packages/conferia/frontend/src/views/attendees/TabAttendeeDetail.vue b/packages/conferia/frontend/src/views/attendees/TabAttendeeDetail.vue
@@ -7,7 +7,7 @@
         size="small"
         variant="outlined"
         rounded
-        @click="$router.back()" />
+        @click="goBackToAttendees" />
     </template>
 
     <div class="px-4 py-6 pb-20">
@@ -160,6 +160,20 @@ async function getImage(person: AttendeeDetail) {
   }
 }
 
+/**
+ * Navigate back to attendees list, preserving scroll position
+ */
+function goBackToAttendees(): void {
+  // Use router.back() for better browser navigation experience
+  // The attendees page will handle scroll restoration automatically
+  if (window.history.length > 1) {
+    router.back();
+  } else {
+    // Fallback if no history
+    void router.push('/tabs/attendees');
+  }
+}
+
 /**
  * Navigate to personalized agenda
  */
diff --git a/packages/conferia/frontend/src/views/attendees/TabAttendees.vue b/packages/conferia/frontend/src/views/attendees/TabAttendees.vue

Original file line number	Diff line number	Diff line change
`@@ -21,7 +21,7 @@ public String generateToken(UserDetails userDetails){`
`21`	`21`	`return Jwts.builder()`
`22`	`22`	`.subject(userDetails.getUsername())`
`23`	`23`	`.issuedAt(new Date(System.currentTimeMillis()))`
`24`		`- .expiration(new Date(System.currentTimeMillis() + 1000 * 60 * 30)) //milliseconds * seconds * minutes`
	`24`	`+ .expiration(new Date(System.currentTimeMillis() + 604800000)) // milliseconds (= 1 week)`
`25`	`25`	`.signWith(getSigninKey())`
`26`	`26`	`.compact();`
`27`	`27`	`}`