ps99-api 2.4.0 → 2.6.0

package/example-web/react2/src/index.css

@@ -0,0 +1,257 @@
+/* Import a cute, rounded font */
+@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@300;400;500;600;700&display=swap');
+
+:root {
+    --bg-color: #e0f7fa;
+    --primary-color: #4fc3f7;
+    --secondary-color: #ff8a65;
+    --accent-color: #ffd54f;
+    --text-color: #37474f;
+    --card-bg: #ffffff;
+    --border-radius: 16px;
+    --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    --border-width: 3px;
+    --border-color: #263238;
+}
+
+html,
+body,
+#root {
+    height: 100%;
+    margin: 0;
+    overflow: hidden;
+    /* Prevent body scroll, let apps handle it */
+}
+
+#root {
+    display: flex;
+    flex-direction: column;
+}
+
+body {
+    margin: 0;
+    font-family: 'Fredoka', sans-serif;
+    background-color: var(--bg-color);
+    color: var(--text-color);
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    color: var(--text-color);
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    text-shadow: 2px 2px 0px white;
+}
+
+a {
+    color: var(--primary-color);
+    text-decoration: none;
+    font-weight: bold;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+/* Button Styles */
+.game-button {
+    display: inline-block;
+    padding: 12px 24px;
+    background-color: var(--primary-color);
+    color: white;
+    font-size: 1.2rem;
+    font-weight: bold;
+    border: var(--border-width) solid var(--border-color);
+    border-radius: var(--border-radius);
+    box-shadow: 4px 4px 0px var(--border-color);
+    transition: all 0.1s ease;
+    cursor: pointer;
+    text-transform: uppercase;
+    text-decoration: none !important;
+}
+
+.game-button:hover {
+    transform: translate(-2px, -2px);
+    box-shadow: 6px 6px 0px var(--border-color);
+    background-color: #29b6f6;
+}
+
+.game-button:active {
+    transform: translate(2px, 2px);
+    box-shadow: 0px 0px 0px var(--border-color);
+}
+
+.game-button.secondary {
+    background-color: var(--secondary-color);
+}
+
+.game-button.accent {
+    background-color: var(--accent-color);
+    color: var(--text-color);
+}
+
+/* Grids */
+.item-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
+    gap: 16px;
+    padding: 20px;
+}
+
+.collection-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+    gap: 20px;
+    padding: 20px;
+}
+
+/* Cards */
+.game-card {
+    background: var(--card-bg);
+    border: var(--border-width) solid var(--border-color);
+    border-radius: var(--border-radius);
+    padding: 16px;
+    text-align: center;
+    box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.1);
+    transition: transform 0.2s;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+}
+
+.game-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 6px 6px 0px rgba(0, 0, 0, 0.15);
+}
+
+.game-card img {
+    max-width: 100%;
+    height: auto;
+    border-radius: 8px;
+    margin-bottom: 8px;
+}
+
+/* Tooltips */
+.tooltip-container {
+    position: relative;
+    display: inline-block;
+}
+
+.tooltip-popover {
+    position: absolute;
+    bottom: 120%;
+    left: 50%;
+    transform: translateX(-50%);
+    background-color: rgba(255, 255, 255, 0.95);
+    border: 2px solid var(--border-color);
+    border-radius: 8px;
+    padding: 10px;
+    min-width: 200px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+    z-index: 1000;
+    pointer-events: none;
+    /* Prevent tooltip from blocking interaction */
+    font-size: 0.9rem;
+    line-height: 1.4;
+    text-align: left;
+}
+
+.tooltip-popover h4 {
+    margin: 0 0 5px 0;
+    font-size: 1rem;
+    color: var(--secondary-color);
+}
+
+
+.badge {
+    background: #e0f2f1;
+    color: #00695c;
+    padding: 4px 8px;
+    border-radius: 12px;
+    font-size: 0.8em;
+    font-weight: bold;
+    border: 1px solid #b2dfdb;
+}
+
+/* Animations */
+@keyframes sheen {
+    0% {
+        transform: translateX(-100%) rotate(45deg);
+    }
+
+    20%,
+    100% {
+        transform: translateX(100%) rotate(45deg);
+    }
+}
+
+.sheen-effect {
+    position: relative;
+    overflow: hidden;
+}
+
+.sheen-effect::after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.6), transparent);
+    transform: translateX(-100%);
+    animation: sheen 3s infinite;
+}
+
+@keyframes shine {
+    0% {
+        left: -100%;
+    }
+
+    100% {
+        left: 100%;
+    }
+}
+
+/* Header & Footer */
+.game-header {
+    padding: 1rem;
+    background-color: var(--primary-color);
+    border-bottom: var(--border-width) solid var(--border-color);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+.game-header a {
+    color: white;
+    text-decoration: none;
+    text-shadow: 2px 2px 0px var(--border-color);
+}
+
+.game-header ol {
+    display: flex;
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+.game-header ol li {
+    margin: 0 0.5em;
+}
+
+.game-footer {
+    text-align: center;
+    padding: 1rem;
+    margin-top: 2rem;
+    background-color: var(--card-bg);
+    border-top: var(--border-width) solid var(--border-color);
+}

package/example-web/react2/src/index.tsx

@@ -1,4 +1,5 @@
 import React from "react";
+import "./index.css";
 import { createRoot } from "react-dom/client";
 import App from "./App";
 import * as serviceWorkerRegistration from "./serviceWorkerRegistration";
@@ -8,4 +9,4 @@ const root = createRoot(container!);
 root.render(<App />);
 
 // Register the service worker
-serviceWorkerRegistration.register();
+serviceWorkerRegistration.unregister();

package/example-web/react2/src/utils/gigantix.ts

@@ -0,0 +1,40 @@
+
+export const GIGANTIX_SUFFIXES = [
+    "", "K", "M", "B", "T", "Qa", "Qi", "Sx", "Sp", "Oc", "No", "Dc",
+    "UD", "DD", "TD", "QaD", "QiD", "SxD", "SpD", "OcD", "NnD", "Vi",
+    "UVg", "DVg", "TVg", "QaVg", "QiVg", "SxVg", "SpVg", "OcVg", "NoVg", "Tg",
+    "QaG", "QiG", "SxG", "SpG", "OcG", "NoG", "Ce"
+];
+
+export function formatGigantix(value: number | string, decimals = 2): string {
+    if (!value) return "0";
+
+    let num = typeof value === 'string' ? parseFloat(value) : value;
+
+    if (isNaN(num)) return "0";
+    if (num < 1000) {
+        // Round to decimals (default 2), remove trailing zeros
+        return parseFloat(num.toFixed(decimals)).toString();
+    }
+
+    // Find the tier (power of 1000)
+    // log1000(num) = log10(num) / 3
+    const tier = Math.floor(Math.log10(num) / 3);
+
+    // Ensure we don't exceed our defined suffixes
+    if (tier >= GIGANTIX_SUFFIXES.length) {
+        return num.toExponential(decimals);
+    }
+
+    const suffix = GIGANTIX_SUFFIXES[tier];
+    const scale = Math.pow(10, tier * 3);
+    const scaled = num / scale;
+
+    // Format to desired decimals, removing trailing zeros if needed
+    let formatted = scaled.toFixed(decimals);
+    if (formatted.indexOf('.') !== -1) {
+        formatted = formatted.replace(/\.?0+$/, '');
+    }
+
+    return `${formatted}${suffix}`;
+}

package/example-web/react2/webpack.config.js

@@ -1,59 +1,115 @@
 const path = require("path");
 const CopyWebpackPlugin = require("copy-webpack-plugin");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
+const WorkboxWebpackPlugin = require("workbox-webpack-plugin");
 
-module.exports = {
-  entry: "./src/index.tsx",
-  devtool: "inline-source-map",
-  module: {
-    rules: [
-      {
-        test: /\.tsx?$/,
-        use: ["ts-loader"],
-        exclude: /node_modules/,
-      },
-      {
-        test: /\.css$/i,
-        use: ["style-loader", "css-loader"], // Add style-loader here to properly handle CSS
+module.exports = (env, argv) => {
+  const isProduction = argv.mode === "production";
+
+  return {
+    entry: "./src/index.tsx",
+    devtool: isProduction ? "source-map" : "inline-source-map",
+    module: {
+      rules: [
+        {
+          test: /\.tsx?$/,
+          use: ["ts-loader"],
+          exclude: /node_modules/,
+        },
+        {
+          test: /\.css$/i,
+          use: ["style-loader", "css-loader"], // Add style-loader here to properly handle CSS
+        },
+        {
+          test: /\.(png|svg|jpg|jpeg|gif)$/i,
+          type: "asset/resource",
+        },
+      ],
+    },
+    resolve: {
+      extensions: [".tsx", ".ts", ".js"],
+      alias: {
+        "ps99-api": path.resolve(__dirname, "../../src"),
       },
-    ],
-  },
-  resolve: {
-    extensions: [".tsx", ".ts", ".js"],
-    alias: {
-      "ps99-api": path.resolve(__dirname, "../../src"),
     },
-  },
-  output: {
-    filename: "bundle.js",
-    path: path.resolve(__dirname, "dist"),
-    publicPath: "/node-ps99-api/",
-  },
-  plugins: [
-    new HtmlWebpackPlugin({
-      template: path.join(__dirname, "public", "index.html"),
+    output: {
+      filename: "bundle.js",
+      path: path.resolve(__dirname, "dist"),
       publicPath: "/node-ps99-api/",
-    }),
-    new CopyWebpackPlugin({
-      patterns: [
-        {
-          from: path.resolve(__dirname, "public"),
-          to: path.resolve(__dirname, "dist"),
-          globOptions: {
-            ignore: ["**/index.html"], // Ignore index.html to avoid conflict
+    },
+    plugins: [
+      new HtmlWebpackPlugin({
+        template: path.join(__dirname, "public", "index.html"),
+        publicPath: "/node-ps99-api/",
+      }),
+      new CopyWebpackPlugin({
+        patterns: [
+          {
+            from: path.resolve(__dirname, "public"),
+            to: path.resolve(__dirname, "dist"),
+            globOptions: {
+              ignore: ["**/index.html"], // Ignore index.html to avoid conflict
+            },
           },
+        ],
+      }),
+      // Only generate Service Worker in production to avoid "called multiple times" warning in watch mode
+      ...(isProduction
+        ? [
+          new WorkboxWebpackPlugin.GenerateSW({
+            clientsClaim: true,
+            skipWaiting: true,
+            maximumFileSizeToCacheInBytes: 5 * 1024 * 1024,
+            runtimeCaching: [
+              {
+                urlPattern: ({ url }) => url.pathname.includes("/api/"),
+                handler: "NetworkFirst",
+                options: {
+                  cacheName: "api-cache",
+                  networkTimeoutSeconds: 10,
+                  expiration: {
+                    maxEntries: 50,
+                    maxAgeSeconds: 60 * 60, // 1 hour
+                  },
+                  cacheableResponse: {
+                    statuses: [0, 200],
+                  },
+                },
+              },
+              {
+                urlPattern: ({ request }) => request.destination === "image",
+                handler: "CacheFirst",
+                options: {
+                  cacheName: "images",
+                  expiration: {
+                    maxEntries: 100,
+                    maxAgeSeconds: 30 * 24 * 60 * 60, // 30 Days
+                  },
+                },
+              },
+            ],
+          }),
+        ]
+        : []),
+    ],
+    devServer: {
+      static: {
+        directory: path.join(__dirname, "public"),
+      },
+      compress: true,
+      port: 9000,
+      historyApiFallback: {
+        index: "/node-ps99-api/index.html",
+      },
+      proxy: [
+        {
+          context: ["/api", "/image"],
+          target: "https://biggamesapi.io",
+          secure: false,
+          changeOrigin: true,
+          logLevel: "debug",
         },
       ],
-    }),
-  ],
-  devServer: {
-    static: {
-      directory: path.join(__dirname, "public"),
-    },
-    compress: true,
-    port: 9000,
-    historyApiFallback: {
-      index: "/node-ps99-api/index.html",
     },
-  },
+  };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ps99-api",
-  "version": "2.4.0",
+  "version": "2.6.0",
   "description": "Pet Simulator Public API wrapper written in Typescript.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -23,20 +23,20 @@
   "devDependencies": {
     "@jest/globals": "^29.7.0",
     "@semantic-release/git": "^10.0.1",
-    "@tsconfig/node20": "^20.1.4",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^20.14.10",
+    "@tsconfig/node22": "^22.0.5",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^25.2.3",
     "cz-conventional-changelog": "^3.3.0",
-    "dets": "^0.16.0",
-    "esbuild": "0.21.5",
+    "dets": "^0.17.0",
+    "esbuild": "^0.27.3",
     "jest": "^29.7.0",
-    "prettier": "^3.3.2",
-    "semantic-release": "^24.0.0",
-    "ts-jest": "^29.1.5",
-    "typescript": "^5.5.3"
+    "prettier": "^3.8.1",
+    "semantic-release": "^25.0.3",
+    "ts-jest": "^29.4.6",
+    "typescript": "^5.9.3"
   },
   "dependencies": {
-    "axios": "^1.7.2"
+    "axios": "^1.13.5"
   },
   "repository": {
     "type": "git",