feat(images): default frontend assets to image service

app/game-frontend/src/utils/generalIcon.ts

@@ -1,5 +1,12 @@
-export const DEFAULT_GENERAL_ICON_URL = '/image/icons/default.jpg';
-export const DEFAULT_GATEWAY_USER_ICON_BASE_URL = '/gateway/api/user-icons';
+import {
+    configuredSharedIconPublicUrl,
+    configuredUserIconPublicUrl,
+    DEFAULT_USER_ICON_PUBLIC_URL,
+    externalizeLegacyImageUrl,
+} from './imageAssets.ts';
+
+export const DEFAULT_GENERAL_ICON_URL = `${configuredSharedIconPublicUrl()}/default.jpg`;
+export const DEFAULT_GATEWAY_USER_ICON_BASE_URL = DEFAULT_USER_ICON_PUBLIC_URL;
 
 export type GeneralIconSource = {
     picture?: string | null;
@@ -23,16 +30,16 @@ const encodeLegacyIconPath = (value: string): string =>
         })
         .join('/');
 
-const configuredUserIconBaseUrl = (): string =>
-    import.meta.env?.VITE_GATEWAY_USER_ICON_BASE_URL?.trim() || DEFAULT_GATEWAY_USER_ICON_BASE_URL;
-
 export const resolveGeneralIconUrl = (
     source: GeneralIconSource,
-    { legacyBaseUrl = '/image/icons', userIconBaseUrl = configuredUserIconBaseUrl() }: GeneralIconOptions = {}
+    {
+        legacyBaseUrl = configuredSharedIconPublicUrl(),
+        userIconBaseUrl = configuredUserIconPublicUrl(),
+    }: GeneralIconOptions = {}
 ): string => {
     const picture = source.picture?.trim() || 'default.jpg';
     const baseUrl = source.imageServer ? userIconBaseUrl : legacyBaseUrl;
-    const encodedPicture = source.imageServer ? encodeURIComponent(picture) : encodeLegacyIconPath(picture);
+    const encodedPicture = encodeLegacyIconPath(picture);
     return `${trimTrailingSlashes(baseUrl)}/${encodedPicture}`;
 };
 
@@ -43,7 +50,7 @@ export const resolveGeneralIconBackgroundImage = (source: GeneralIconSource, opt
 
 export const resolveMessageGeneralIconUrl = (
     icon: string | null | undefined,
-    userIconBaseUrl = configuredUserIconBaseUrl()
+    userIconBaseUrl = configuredUserIconPublicUrl()
 ): string => {
     const normalized = icon?.trim();
     if (!normalized) {
@@ -55,6 +62,9 @@ export const resolveMessageGeneralIconUrl = (
         return resolveGeneralIconUrl({ picture: userIconMatch[1], imageServer: 1 }, { userIconBaseUrl });
     }
 
+    if (normalized.startsWith('/image/')) {
+        return externalizeLegacyImageUrl(normalized);
+    }
     if (normalized.startsWith('/') || /^https?:\/\//iu.test(normalized)) {
         return normalized;
     }

app/game-frontend/src/utils/imageAssets.ts

@@ -0,0 +1,49 @@
+export const DEFAULT_IMAGE_PUBLIC_URL = 'https://sam-image.hided.net';
+export const DEFAULT_SHARED_ICON_PUBLIC_URL = `${DEFAULT_IMAGE_PUBLIC_URL}/icons`;
+export const DEFAULT_USER_ICON_PUBLIC_URL = DEFAULT_SHARED_ICON_PUBLIC_URL;
+
+const trimTrailingSlashes = (value: string): string => value.replace(/\/+$/u, '');
+
+const configuredValue = (value: string | undefined, fallback: string): string => {
+    const normalized = value?.trim();
+    return trimTrailingSlashes(normalized || fallback);
+};
+
+export const configuredImagePublicUrl = (): string =>
+    configuredValue(import.meta.env?.VITE_IMAGE_PUBLIC_URL, DEFAULT_IMAGE_PUBLIC_URL);
+
+export const configuredSharedIconPublicUrl = (): string =>
+    `${configuredImagePublicUrl()}/icons`;
+
+export const configuredUserIconPublicUrl = (): string =>
+    configuredValue(
+        import.meta.env?.VITE_GATEWAY_USER_ICON_BASE_URL,
+        `${configuredImagePublicUrl()}/icons`
+    );
+
+export const configuredGameAssetUrl = (): string => {
+    const explicit = import.meta.env?.VITE_GAME_ASSET_URL?.trim();
+    if (!explicit) {
+        return `${configuredImagePublicUrl()}/game`;
+    }
+    const normalized = trimTrailingSlashes(explicit);
+    return normalized.endsWith('/image') ? `${normalized}/game` : normalized;
+};
+
+export const externalizeLegacyImageUrl = (value: string): string => {
+    if (value.startsWith('/image/general/')) {
+        return `${configuredSharedIconPublicUrl()}/${value.slice('/image/general/'.length)}`;
+    }
+    if (value.startsWith('/image/')) {
+        return `${configuredImagePublicUrl()}/${value.slice('/image/'.length)}`;
+    }
+    return value;
+};
+
+export const installImageAssetCssVariables = (): void => {
+    const root = document.documentElement.style;
+    const gameAssetUrl = configuredGameAssetUrl();
+    root.setProperty('--sammo-texture-walnut', `url(${JSON.stringify(`${gameAssetUrl}/back_walnut.jpg`)})`);
+    root.setProperty('--sammo-texture-green', `url(${JSON.stringify(`${gameAssetUrl}/back_green.jpg`)})`);
+    root.setProperty('--sammo-texture-blue', `url(${JSON.stringify(`${gameAssetUrl}/back_blue.jpg`)})`);
+};