Deploy to GitHub pages

Components/_TileGrid.razor.js

@@ -0,0 +1,56 @@
+export const preloadImage = (imageUrl) => {
+  const img = new Image();
+  img.src = imageUrl;
+};
+
+export const preloadImages = (imageUrls) => {
+  for (let i = 0; i < imageUrls.length; i++) {
+    preloadImage(imageUrls[i]);
+  }
+};
+
+export async function styleGridAndTiles(grid, initialColumnCount) {
+  const minWidth = 50;
+  const maxWidth = 150;
+
+  const adjustGrid = async () => {
+    const viewPortWidth = window.outerWidth - 20;
+    let columnWidth =
+      viewPortWidth / initialColumnCount - (initialColumnCount - 1);
+    let adjustedColumnCount = initialColumnCount;
+
+    while (columnWidth < minWidth || columnWidth > maxWidth) {
+      if (columnWidth < minWidth) {
+        adjustedColumnCount -= 1;
+      } else {
+        break;
+      }
+      columnWidth =
+        viewPortWidth / adjustedColumnCount - (adjustedColumnCount - 1);
+    }
+
+    columnWidth = Math.min(Math.max(columnWidth, minWidth), maxWidth);
+
+    grid.style.gridTemplateColumns = `repeat(${adjustedColumnCount}, 1fr)`;
+    setTileSize(grid, columnWidth);
+  };
+
+  let timeoutId;
+  const throttledResizeListener = () => {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(adjustGrid, 100);
+  };
+
+  const orientationChangeListener = () => {
+    adjustGrid();
+  };
+
+  await adjustGrid();
+  window.addEventListener("resize", throttledResizeListener);
+  window.addEventListener("orientationchange", orientationChangeListener);
+}
+
+const setTileSize = (grid, widthToSet) => {
+  grid.style.setProperty("--tile-size", `${widthToSet / 16}rem`);
+  grid.style.setProperty("--tile-font-size", `${widthToSet / 32}rem`);
+};

_content/Aneejian.Games.ClickMatch/Aneejian.Games.ClickMatch.bundle.scp.css

@@ -0,0 +1,55 @@
+/* _content/Aneejian.Games.ClickMatch/Components/_Splasher.razor.rz.scp.css */
+.splash[b-84c87nvdrm] {
+    position: fixed;
+    align-items: center;
+    justify-content: center;
+    display: flex;
+    pointer-events: none;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    margin: 0 auto;
+}
+
+.splash-background[b-84c87nvdrm] {
+    width: fit-content;
+    height: fit-content;
+    background-color: rgba(0, 0, 0, 0.8);
+    border-radius: 5px;
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    align-items: center;
+    pointer-events: none;
+}
+
+@keyframes fade-in-out-b-84c87nvdrm {
+    0% {
+        opacity: 0;
+    }
+
+    50% {
+        opacity: 0.8;
+    }
+
+    100% {
+        opacity: 0;
+    }
+}
+
+.splash-text[b-84c87nvdrm] {
+    font-size: 3rem;
+    color: #fff;
+    animation: bounce-up-b-84c87nvdrm 0.5s ease-in-out;
+    padding: 3vmin;
+}
+
+@keyframes bounce-up-b-84c87nvdrm {
+    0% {
+        transform: translateY(10px);
+    }
+
+    100% {
+        transform: translateY(0);
+    }
+}

_content/Aneejian.Games.ClickMatch/js/GameDTO.js

@@ -0,0 +1,13 @@
+
+export class GameDTO {
+    constructor(game) {
+        this.id = game.id === 0 || null ? undefined : game.id;
+        this.userId = game.userId;
+        this.level = game.level;
+        this.score = game.score;
+        this.timeTaken = game.timeTaken;
+        this.gameWon = game.gameWon;
+        this.gameLost = game.gameLost;
+        this.gameAbandoned = game.gameAbandoned;
+    }
+}

_content/Aneejian.Games.ClickMatch/js/LevelStatsDTO.js

@@ -0,0 +1,13 @@
+
+export class LevelStatsDTO {
+    constructor(levelData) {
+        this.userId = levelData.userId;
+        this.level = levelData.level;
+        this.highScore = levelData.highScore;
+        this.timesPlayed = levelData.timesPlayed;
+        this.timesWon = levelData.timesWon;
+        this.timesLost = levelData.timesLost;
+        this.usersBestGame = levelData.usersBestGame;
+        this.levelsBestGame = levelData.levelsBestGame;
+    }
+}

_content/Aneejian.Games.ClickMatch/js/UserDTO.js

@@ -0,0 +1,9 @@
+export class UserDTO {
+	constructor(user) {
+		this.id = user.id === 0 || null ? undefined : user.id;
+		this.userName = user.userName;
+		this.name = user.name;
+		this.password = user.password;
+		this.avatar = user.avatar;
+	}
+}

_content/Aneejian.Games.ClickMatch/js/indexedDb.js

@@ -0,0 +1,143 @@
+import { UserDTO } from "./UserDTO.js";
+import { GameDTO } from "./GameDTO.js";
+import { LevelStatsDTO } from "./LevelStatsDTO.js";
+
+export class IndexedDb {
+    constructor() {
+        this.db = new Dexie('Aneejian.Games.ClickMatch');
+        this.setupDatabase();
+    }
+
+    setupDatabase() {
+        this.db.version(1).stores({
+            users: "++id, &userName",
+            games: "++id, userId, level, score, timeTaken, gameWon, gameLost, gameAbandoned"
+        });
+        this.db.users.mapToClass(UserDTO);
+        this.db.games.mapToClass(GameDTO);
+    }
+
+    async addNewUser(user) {
+        return await this.db.users.add(new UserDTO(user));
+    }
+
+    async addUserGame(game) {
+        return await this.db.games.add(new GameDTO(game));
+    }
+
+    async updateUserGame(game) {
+        return await this.db.games.update(game.id, new GameDTO(game));
+    }
+
+    async getUsers() {
+        return await this.db.users.toArray();
+    }
+
+    async getUserById(id) {
+        return await this.db.users.get(id);
+    }
+
+    async getUserByUserName(userName) {
+        return await this.db.users.get({ userName: userName });
+    }
+
+    async userExists(userName) {
+        return !! await this.getUserByUserName(userName);
+    }
+
+    async deleteUser(userId) {
+        const user = await this.getUserById(userId);
+        await this.db.games.where('userId').equals(user.id).delete();
+        return await this.db.users.delete(user.id)
+    }
+
+    async getUserMaxGameLevel(userId) {
+        const userGames = await this.getUserGames(userId);
+        if (userGames.length === 0)
+            return 0;
+        const levelsWon = new Set(userGames.filter(game => game.gameWon).map(game => game.level));
+        if (levelsWon.size === 0)
+            return 0;
+        const maxLevel = Math.max(...levelsWon);
+        if (maxLevel === levelsWon.size)
+            return maxLevel;
+        const missingLevel = levelsWon.size > 0 ? levelsWon.find((level) => !levelsWon.has(level + 1)) : 0;
+        return missingLevel - 1 || Math.max(...levelsWon);
+    }
+
+    async getUserGames(userId) {
+        return await this.db.games.where('userId').equals(userId).toArray();
+    }
+
+    async getUserGamesOfLevel(userId, level) {
+        return await this.db.games.where('userId').equals(userId).and(game => game.level === level).sortBy('level');
+    }
+
+    async getBestGame(level) {
+        const games = await this.db.games.where('level').equals(level).reverse().sortBy('score');
+        console.log(games);
+        return games.length > 0 ? games[0] : None;
+    }
+
+    async getUserStats(userId, level = 0) {
+        let userGames = [];
+
+        if (level === 0)
+            userGames = await this.getUserGames(userId);
+        else
+            userGames = await this.getUserGamesOfLevel(userId, level);
+
+        // Create an empty object to store stats per level
+        const levelStats = {};
+
+        // Iterate through each game and update stats per level
+        for (const game of userGames) {
+            const level = game.level;
+            // Initialize stats for the level if it doesn't exist
+            if (!levelStats[level]) {
+                levelStats[level] = {
+                    highScore: 0,
+                    timesPlayed: 0,
+                    timesWon: 0,
+                    timesLost: 0,
+                };
+            }
+
+            // Update level stats for this game
+            levelStats[level].highScore = Math.max(levelStats[level].highScore, game.score);
+            levelStats[level].timesPlayed++;
+            levelStats[level].timesWon += game.gameWon ? 1 : 0;
+            levelStats[level].timesLost += game.gameLost ? 1 : 0;
+        }
+
+
+
+        // Convert level stats object to an array of LevelDTO objects
+        const levelData = Object.entries(levelStats).map(([level, stats]) => {
+            return new LevelStatsDTO({
+                userId: userId,
+                level: parseInt(level), // Ensure level is number
+                highScore: stats.highScore,
+                timesPlayed: stats.timesPlayed,
+                timesWon: stats.timesWon,
+                timesLost: stats.timesLost,
+                usersBestGame: userGames.find(game => game.level === parseInt(level) && game.score === stats.highScore),
+            });
+        });
+
+
+        for (let i = 0; i < levelData.length; i++) {
+            levelData[i].levelsBestGame = await this.getBestGame(levelData[i].level)
+        }
+
+        return levelData;
+    }
+
+    // Other database operations can be added here, such as update, delete, etc.
+}
+
+
+
+export function createIndexedDb() {
+    return new IndexedDb();
+}

_content/Aneejian.Games.ClickMatch/js/sessionStorage.js

@@ -0,0 +1,15 @@
+export function get(key) {
+    return window.sessionStorage.getItem(key);
+}
+
+export function set(key, value) {
+    window.sessionStorage.setItem(key, value);
+}
+
+export function clear() {
+    window.sessionStorage.clear();
+}
+
+export function remove(key) {
+    window.sessionStorage.removeItem(key);
+}

_framework/blazor.boot.json

@@ -0,0 +1,79 @@
+{
+  "mainAssemblyName": "Aneejian.Games.ClickMatch.Client",
+  "resources": {
+    "hash": "sha256-bNDPzeJUhgw46AQEh0E0TmbqUOmkoV6VdCbWTFMTqSc=",
+    "jsModuleNative": {
+      "dotnet.native.8.0.2.jgt5nhn140.js": "sha256-gPMK16QWoJSTxorlZJqcVtbBRTniIQWlLsJN2O4cJHg="
+    },
+    "jsModuleRuntime": {
+      "dotnet.runtime.8.0.2.8djt6nqnbz.js": "sha256-54KSaoOArNfygQbV+r4B5y3ys53v2tnvFIyZcZiUmi0="
+    },
+    "wasmNative": {
+      "dotnet.native.wasm": "sha256-C2P+OTYZAJlmqo6rc4heqwvIVVsXIF8MAxC6WRe96Eg="
+    },
+    "icu": {
+      "icudt_CJK.dat": "sha256-SZLtQnRc0JkwqHab0VUVP7T3uBPSeYzxzDnpxPpUnHk=",
+      "icudt_EFIGS.dat": "sha256-8fItetYY8kQ0ww6oxwTLiT3oXlBwHKumbeP2pRF4yTc=",
+      "icudt_no_CJK.dat": "sha256-L7sV7NEYP37/Qr2FPCePo5cJqRgTXRwGHuwF5Q+0Nfs="
+    },
+    "assembly": {
+      "Aneejian.Games.ClickMatch.Client.wasm": "sha256-m4IpH27pI5v2Q32pCtecpCzDHZD4rv3qeBlSOPa88u4=",
+      "Aneejian.Games.ClickMatch.wasm": "sha256-4VWpOSkioJ3m8ewDYJcKGi19pT3M52L6GsWMcY1xIxQ=",
+      "BCrypt.Net-Next.wasm": "sha256-vn1+CLDQA7cXT++8crd9GTBHootDpHMDJ06/FyiImpA=",
+      "Microsoft.AspNetCore.Components.Forms.wasm": "sha256-9xnMEqL0XIXPmhTLEKm05oufWH72pA/eK9U/yH/pBt0=",
+      "Microsoft.AspNetCore.Components.wasm": "sha256-icPhWN7stbd6nVHyOiVK0xideBgciQgWUxr4pequ7Ls=",
+      "Microsoft.AspNetCore.Components.Web.wasm": "sha256-nLx7h8Li9cHn5zopqQSUp6jvax44SQ3OBH5rLwFavv8=",
+      "Microsoft.AspNetCore.Components.WebAssembly.wasm": "sha256-EtWd1Z0vU75colVh70o3LhIbjwshafkS2vwhM932GOg=",
+      "Microsoft.CSharp.wasm": "sha256-x1CrEGLHfCZksblNsd2Rz5zCkqiEXndIl0ByHyKuboA=",
+      "Microsoft.Extensions.Configuration.Abstractions.wasm": "sha256-87sn2TYqgdZ95sXmavjKEzoEfMgHnYQ9LOvnMX+aZcI=",
+      "Microsoft.Extensions.Configuration.Json.wasm": "sha256-Sxmy2ZS134URxbHEvdbS6NcQ3zXS7UWx/5ZPpwiW7FA=",
+      "Microsoft.Extensions.Configuration.wasm": "sha256-jYqHUZ07UYWc8POk7xhas6xQYH7t1qoTcylqoDqncJk=",
+      "Microsoft.Extensions.DependencyInjection.Abstractions.wasm": "sha256-5gA3nW4fgom2QB/oSK4sF6M5lniTbLo561mWc33Hz/c=",
+      "Microsoft.Extensions.DependencyInjection.wasm": "sha256-gg8xZqJsBBrrNEyUGzYqhL3sqkuZ4AHAvdTdL9nZ0S0=",
+      "Microsoft.Extensions.Logging.Abstractions.wasm": "sha256-4odabBiIdQXAcEBoa26HsRtxZeol8tC86Vxz81AaMp4=",
+      "Microsoft.Extensions.Logging.wasm": "sha256-8BH+kQfjYuZWxprOICXJ4+tU0OdJOYDKN7G0S3zYYHI=",
+      "Microsoft.Extensions.Options.wasm": "sha256-ZHvIWXkkTrzGbudN1AyZwLslwmezUpc8DFx6R4/Pcj4=",
+      "Microsoft.Extensions.Primitives.wasm": "sha256-Ms2HR5Gpug/0uRAzdk4SUNT76Ml3CjFv9Jo+dUIMGac=",
+      "Microsoft.JSInterop.wasm": "sha256-FjqKSd0mkruroD/Li9alg5A69/htQMorEaJAKv7J0AU=",
+      "Microsoft.JSInterop.WebAssembly.wasm": "sha256-aCgxiIU+arbpOkgLngl1hBQLocrFL2/t1zUJV8HXOzI=",
+      "System.Collections.Concurrent.wasm": "sha256-MA+v6/ZcBd4xl91eG/bfsMEjNiLyxpmQvrgQeXxtzio=",
+      "System.Collections.NonGeneric.wasm": "sha256-XOhq/3Jk+y5dnsWDEK0wHrpxzxjSPfceEIyFJNdXxHA=",
+      "System.Collections.Specialized.wasm": "sha256-N4qhRnkPkfUa7FcIGhHsLeYMXLvjP5/TzkitIROUntQ=",
+      "System.Collections.wasm": "sha256-V5Wxsjn6A4x56F+pR0f3O7qtCuhfcMCXlkSokT/M5wQ=",
+      "System.ComponentModel.Annotations.wasm": "sha256-vhgmOW+FzIBONqVfXfkHMoCYcM8g3fWD0rZ8IeEr7q8=",
+      "System.ComponentModel.Primitives.wasm": "sha256-6r3DYtnDCDsgKQ7shoKepTyBwbjgcFKEPiNPseAA97Y=",
+      "System.ComponentModel.TypeConverter.wasm": "sha256-0liST9MNiO1bvC4xjGz1TZ7UipLVlQt23Netwl7hVxI=",
+      "System.ComponentModel.wasm": "sha256-gZUEJwZdMeSgAS7vSLCmEkF+J8C6jjkltAvzFozZsmc=",
+      "System.Console.wasm": "sha256-/SR4DzR+tIObZre85cO99pymOoo/zBMXM7zyPihRZG8=",
+      "System.Diagnostics.DiagnosticSource.wasm": "sha256-7mjqPQGrXbMHZrvcmvkrX7OCQeTq+aQ3FxUow3fB3kE=",
+      "System.Linq.Expressions.wasm": "sha256-k33+90vNMsHyjaxGMCU9eoC7MCsFbTwru8WHeqKG+G0=",
+      "System.Linq.wasm": "sha256-9rJuAbB86fcmz9UwoQK2F1TBlg37v0C7n4vmQBsa6sQ=",
+      "System.Memory.wasm": "sha256-KHXqWWSni0vno5n4cQKaVSCHSW/T8Wp2ngyI0SIjnVs=",
+      "System.Net.Http.wasm": "sha256-KsxuTY4F9ZIodvQb8wQdokvh3EKq69Km7y9/KrxDoWo=",
+      "System.Net.Primitives.wasm": "sha256-vrxcafwRdBO97DDgX/hMZoKmutr7B8vL8NSYBIeBIvE=",
+      "System.Net.Requests.wasm": "sha256-ntgj8ewHwDberYUGyv3YPbMq0xKdCy3CziTek5+mXlo=",
+      "System.ObjectModel.wasm": "sha256-6bgC233dXmYCLaKT5MbmGwdfOxQxUxxOwA+3l/KB2Yw=",
+      "System.Private.CoreLib.wasm": "sha256-AuZ1fPA2vAquTOtLUd4FM/076wXmZPG1U3qO+50SdjM=",
+      "System.Private.Uri.wasm": "sha256-6EgwnNrmCneKsUYXnr/FOv1l/tOvIU3hz2V/5nM1F/I=",
+      "System.Runtime.InteropServices.JavaScript.wasm": "sha256-2fNHxcvnXYStlUf+e1IokgsFZFUyJVv1w3Tf2NEhDBQ=",
+      "System.Runtime.Serialization.Primitives.wasm": "sha256-XlUDXtLi4YeIqizDT48xGocBzreAzTBALjZC1rcZzUY=",
+      "System.Runtime.wasm": "sha256-sfdssEJ1sOQmGUqjY10LdnJB7n6r+lmQwb1tel9X3ek=",
+      "System.Security.Cryptography.Algorithms.wasm": "sha256-gGmdPOK4Th2U0L5/CDWJebuQpMZvfbOWB5WxhSUtHYE=",
+      "System.Security.Cryptography.Primitives.wasm": "sha256-oiQW2CJx41E0c4Tcu976nlw017ztHfwjtLEipXhknoQ=",
+      "System.Security.Cryptography.wasm": "sha256-MLOsUftl1gOGFvVDYJ/qreP5UxM0U8ZJYFxSZPTo2J4=",
+      "System.Text.Encoding.Extensions.wasm": "sha256-KnebkhFDXmLXJ8qV3OcgD7vO7U+FFuPu8bh5MB1/yq8=",
+      "System.Text.Encodings.Web.wasm": "sha256-NnePSWCgIId8nOPCgziTKhDyG6uCBs+3W6fazrWLoUA=",
+      "System.Text.Json.wasm": "sha256-4rCJaZ+eP+pit/rvIAuQxoTgzldcVrK/QPiKymCmrsU=",
+      "System.Text.RegularExpressions.wasm": "sha256-sV25GoDATTew/2pUBVyGlBBPz3P06NLMjhmCXDk6qhY=",
+      "System.Threading.wasm": "sha256-4TmhC4Lm0NRFX9yCf3kXn0aHg8XyCL+hM29B5fk4ixU=",
+      "System.wasm": "sha256-n7POuPtNGmUEzGtZKZtOEEpj+CuOoQ/qVWMgWhN7NXU="
+    }
+  },
+  "cacheBootResources": true,
+  "debugLevel": 0,
+  "linkerEnabled": true,
+  "globalizationMode": "sharded",
+  "extensions": {
+    "blazor": {}
+  }
+}