@hkdigital/lib-core 0.5.29 → 0.5.31

package/dist/config/generators/imagetools.js

@@ -75,6 +75,9 @@ const DEFAULT_PRESETS = {
  * ) => (Record<string, string | string[]>[])}
  */
 export function generateResponseConfigs(options) {
+
+	// console.log("generateResponseConfigs");
+
 	//
 	// @see https://github.com/JonasKruckenberg/imagetools
 	//      /blob/main/docs/core/src/functions/resolveConfigs.md
@@ -93,6 +96,8 @@ export function generateResponseConfigs(options) {
 			configPairs[key] = value;
 		}
 
+		// console.log('configPairs', configPairs);
+
 		// console.log('entries', entries);
 		// e.g.
 		// entries [
@@ -116,6 +121,10 @@ export function generateResponseConfigs(options) {
 		const faviconSizes = options?.faviconSizes ?? FAVICON_SIZES;
 		const appleTouchSizes = options?.appleTouchSizes ?? APPLE_TOUCH_SIZES;
 
+		delete configPairs.responsive;
+		delete configPairs.favicons;
+		delete configPairs['apple-touch-icons'];
+
 		// Always include the main image(s) and a thumbnail version
 		const thumbnailConfig = {
 			...configPairs,
@@ -188,6 +197,8 @@ export function generateDefaultDirectives(options) {
 	 * @param {URL} url
 	 */
 	return function defaultDirectives(url) {
+
+
 		// Check the directive in the URL to determine which preset to use
 		const params = url.searchParams;
 
@@ -198,6 +209,8 @@ export function generateDefaultDirectives(options) {
 		// @see https://github.com/JonasKruckenberg/
 		//      imagetools/blob/main/docs/directives.md#metadata
 
+		// as=metadata already set in generateResponseConfigs
+
 		if (params.has('responsive')) {
 			params.set('as', 'metadata');
 		}
@@ -237,6 +250,8 @@ export function generateDefaultDirectives(options) {
 			params.set(key, preset[key]);
 		}
 
+		// console.log("generateDefaultDirectives", { href: url.href, params });
+
 		// TODO: process directive 'w''
 		// - generate only allowed widths
 		// - support width presets such as 'hd'

package/dist/config/generators/vite.js

@@ -72,13 +72,13 @@ export async function generateViteConfig(options = {}) {
         imagetools({
           defaultDirectives: generateDefaultDirectives(imagetoolsOptions),
           resolveConfigs: generateResponseConfigs(imagetoolsOptions),
-          cache: {
-            // @note disable caching to test custom transforms
-            enabled: false,
-            // enabled: true,
-            dir: './node_modules/.cache/imagetools',
-            retention: 60 * 60 * 24 * 10 // 10 days
-          },
+          // cache: {
+          //   // @note disable caching to test custom transforms
+          //   enabled: false,
+          //   // enabled: true,
+          //   dir: './node_modules/.cache/imagetools',
+          //   retention: 60 * 60 * 24 * 10 // 10 days
+          // },
           // @see https://www.npmjs.com/package/vite-imagetools?activeTab=readme
           // extendOutputFormats(builtins) {
           //   return {
@@ -89,27 +89,27 @@ export async function generateViteConfig(options = {}) {
           //     })
           //   };
           // },
-          extendTransforms(builtins) {
-            const ensureAlphaTransform = (config, ctx) => {
-              // Check if 'ensureAlpha' directive is in the URL
-              if (!('ensureAlpha' in config)) {
-                return undefined; // This transform doesn't apply
-              }
-
-              // Mark the parameter as used
-              ctx.useParam('ensureAlpha');
-
-              // Return the actual transformation function
-              return (image) => {
-                return image
-                  .ensureAlpha()
-                  .withMetadata({ xmp: '' });
-              };
-            };
-
-            // Return an ARRAY with builtins + your custom transform
-            return [...builtins, ensureAlphaTransform];
-          }
+          //   extendTransforms(builtins) {
+          //     const ensureAlphaTransform = (config, ctx) => {
+          //       // Check if 'ensureAlpha' directive is in the URL
+          //       if (!('ensureAlpha' in config)) {
+          //         return undefined; // This transform doesn't apply
+          //       }
+
+          //       // Mark the parameter as used
+          //       ctx.useParam('ensureAlpha');
+
+          //       // Return the actual transformation function
+          //       return (image) => {
+          //         return image
+          //           .ensureAlpha()
+          //           .withMetadata({ xmp: '' });
+          //       };
+          //     };
+
+          //     // Return an ARRAY with builtins + your custom transform
+          //     return [...builtins, ensureAlphaTransform];
+          //   }
         })
       );
 

package/dist/network/cache/IndexedDbCache.d.ts

@@ -40,7 +40,7 @@ export default class IndexedDbCache {
     SCHEMA_VERSION: number;
     /**
      * Database connection promise
-     * @type {Promise<IDBDatabase>}
+     * @type {Promise<IDBDatabase>|null}
      * @private
      */
     private dbPromise;

package/dist/network/cache/IndexedDbCache.js

@@ -91,7 +91,7 @@ export default class IndexedDbCache {
 
     /**
      * Database connection promise
-     * @type {Promise<IDBDatabase>}
+     * @type {Promise<IDBDatabase>|null}
      * @private
      */
     this.dbPromise = null;

package/dist/ui/components/game-box/GameBox.svelte

@@ -53,6 +53,7 @@
    *   snippetPortrait?: GameBoxSnippet,
    *   snippetRequireFullscreen?: GameBoxSnippet,
    *   snippetInstallOnHomeScreen?: GameBoxSnippet,
+   *   debug?: boolean,
    *   [attr: string]: any
    * }}
    */
@@ -84,7 +85,9 @@
     snippetLandscape,
     snippetPortrait,
     snippetRequireFullscreen,
-    snippetInstallOnHomeScreen
+    snippetInstallOnHomeScreen,
+
+    debug = false
   } = $props();
 
   // > Game dimensions and state
@@ -149,9 +152,15 @@
     isLandscape = !isPortraitMedia;
   });
 
-  // $inspect('isLandscape', isLandscape);
-  // $inspect('windowWidth/Height', windowWidth, windowHeight);
-  // $inspect('iosWindowWidth/Height', iosWindowWidth, iosWindowHeight);
+  // Use $effect for conditional debugging instead of $inspect
+  $effect(() => {
+    if (debug) {
+      console.log('[GameBox] isLandscape:', isLandscape);
+      console.log('[GameBox] windowWidth/Height:', windowWidth, windowHeight);
+      console.log('[GameBox] iosWindowWidth/Height:',
+        iosWindowWidth, iosWindowHeight);
+    }
+  });
 
   // Update game dimensions based on window size and orientation
   $effect(() => {
@@ -163,12 +172,15 @@
     const availWidth = width - marginLeft - marginRight;
     const availHeight = height - marginTop - marginBottom;
 
-    // console.debug('GameBox margins:', {
-    //   marginLeft,
-    //   marginRight,
-    //   marginTop,
-    //   marginBottom
-    // });
+    if( debug )
+    {
+      console.debug('GameBox margins:', {
+        marginLeft,
+        marginRight,
+        marginTop,
+        marginBottom
+      });
+    }
 
     if (availWidth > availHeight) {
       gameWidthOnLandscape = getGameWidthOnLandscape({
@@ -231,13 +243,17 @@
         iosWindowWidth = window.innerWidth;
         iosWindowHeight = window.innerHeight;
       }
-      // console.debug('updateIosWidthHeight', {
-      //   angle,
-      //   'window.innerWidth': window.innerWidth,
-      //   'window.innerHeight': window.innerHeight,
-      //   iosWindowWidth,
-      //   iosWindowHeight
-      // });
+
+      if( debug )
+      {
+        console.debug('updateIosWidthHeight', {
+          angle,
+          'window.innerWidth': window.innerWidth,
+          'window.innerHeight': window.innerHeight,
+          iosWindowWidth,
+          iosWindowHeight
+        });
+      }
     }
   }
 
@@ -271,21 +287,24 @@
     // App visibility detection for iOS debugging
     const handleVisibilityChange = () => {
       if (document.visibilityState === 'visible') {
-        // console.log('App became visible:', {
-        //   'window.innerWidth': window.innerWidth,
-        //   'window.innerHeight': window.innerHeight,
-        //   'screen.width': screen.width,
-        //   'screen.height': screen.height,
-        //   'screen.orientation.angle': screen.orientation.angle,
-        //   'screen.orientation.type': screen.orientation.type,
-        //   'matchMedia portrait':
-        //     window.matchMedia('(orientation: portrait)').matches,
-        //   'isLandscape': isLandscape,
-        //   'gameWidth': gameWidth,
-        //   'gameHeight': gameHeight,
-        //   'iosWindowWidth': iosWindowWidth,
-        //   'iosWindowHeight': iosWindowHeight
-        // });
+
+        if( debug ) {
+          console.log('App became visible:', {
+            'window.innerWidth': window.innerWidth,
+            'window.innerHeight': window.innerHeight,
+            'screen.width': screen.width,
+            'screen.height': screen.height,
+            'screen.orientation.angle': screen.orientation.angle,
+            'screen.orientation.type': screen.orientation.type,
+            'matchMedia portrait':
+              window.matchMedia('(orientation: portrait)').matches,
+            'isLandscape': isLandscape,
+            'gameWidth': gameWidth,
+            'gameHeight': gameHeight,
+            'iosWindowWidth': iosWindowWidth,
+            'iosWindowHeight': iosWindowHeight
+          });
+        }
 
         // Force iOS dimension update when app becomes visible
         if (isPwa && isAppleMobile) {

package/dist/ui/components/game-box/GameBox.svelte.d.ts

@@ -45,6 +45,7 @@ type GameBox = {
         snippetPortrait?: Snippet<[SnippetParams]> | undefined;
         snippetRequireFullscreen?: Snippet<[SnippetParams]> | undefined;
         snippetInstallOnHomeScreen?: Snippet<[SnippetParams]> | undefined;
+        debug?: boolean | undefined;
     }>): void;
 };
 declare const GameBox: import("svelte").Component<{
@@ -91,4 +92,5 @@ declare const GameBox: import("svelte").Component<{
     snippetPortrait?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
     snippetRequireFullscreen?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
     snippetInstallOnHomeScreen?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
+    debug?: boolean;
 }, {}, "">;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@hkdigital/lib-core",
-	"version": "0.5.29",
+	"version": "0.5.31",
 	"author": {
 		"name": "HKdigital",
 		"url": "https://hkdigital.nl"
@@ -38,7 +38,7 @@
 		"check:run": "svelte-check --tsconfig ./jsconfig.json",
 		"check:watch-run": "svelte-check --tsconfig ./jsconfig.json --watch",
 		"git:push": "git push",
-		"imagetools:clean": "rm -rf node_modules/.cache/imagetools",
+		"cache:clear": "rm -rf node_modules/.cache/imagetools",
 		"lint:prettier": "prettier --check .",
 		"lint:eslint": "eslint .",
 		"test:unit": "vitest",