diff --git a/packages/website/public/assets/images/tools/blitz-analysis.webp b/packages/website/public/assets/images/tools/blitz-analysis.webp
deleted file mode 100644
index 227a2b1f5..000000000
Binary files a/packages/website/public/assets/images/tools/blitz-analysis.webp and /dev/null differ
diff --git a/packages/website/public/assets/images/tools/blitz-insider.webp b/packages/website/public/assets/images/tools/blitz-insider.webp
deleted file mode 100644
index c90de3bbf..000000000
Binary files a/packages/website/public/assets/images/tools/blitz-insider.webp and /dev/null differ
diff --git a/packages/website/public/assets/images/tools/mixer.webp b/packages/website/public/assets/images/tools/mixer.webp
new file mode 100644
index 000000000..61f9c9596
Binary files /dev/null and b/packages/website/public/assets/images/tools/mixer.webp differ
diff --git a/packages/website/src/components/MixerScene/components/MixerFallback.tsx b/packages/website/src/components/MixerScene/components/MixerFallback.tsx
new file mode 100644
index 000000000..707e37c6b
--- /dev/null
+++ b/packages/website/src/components/MixerScene/components/MixerFallback.tsx
@@ -0,0 +1,13 @@
+import { Progress } from "@radix-ui/themes";
+import { Html } from "@react-three/drei";
+import { useStableProgress } from "../../../hooks/useStableProgress";
+
+export function MixerFallback() {
+ const progress = useStableProgress();
+
+ return (
+
+
+
+ );
+}
diff --git a/packages/website/src/components/MixerScene/index.tsx b/packages/website/src/components/MixerScene/index.tsx
index dbfca417d..80d0fe0da 100644
--- a/packages/website/src/components/MixerScene/index.tsx
+++ b/packages/website/src/components/MixerScene/index.tsx
@@ -2,22 +2,31 @@ import { OrbitControls } from "@react-three/drei";
import { Canvas } from "@react-three/fiber";
import { Suspense } from "react";
import { Lighting } from "../Tankopedia/HeroSection/components/TankSandbox/components/Lighting";
+import { SceneProps } from "../Tankopedia/HeroSection/components/TankSandbox/components/SceneProps";
+import { MixerFallback } from "./components/MixerFallback";
import { Model } from "./components/Model";
export function MixerScene() {
return (
diff --git a/packages/website/src/components/Navbar.astro b/packages/website/src/components/Navbar.astro
index 7180e3b95..becb4cb59 100644
--- a/packages/website/src/components/Navbar.astro
+++ b/packages/website/src/components/Navbar.astro
@@ -17,8 +17,8 @@ export interface Props {
}
const { integrated = false } = Astro.props;
-const toolsFiltered = Object.entries(tools).filter(
- ([, tool]) => !tool.href && !tool.disabled
+const toolsFiltered = Object.values(tools).filter(
+ (tool) => !tool.href && !tool.disabled
);
const { locale } = Astro.params;
const branchName = resolveBranchName(locale);
@@ -78,11 +78,7 @@ const strings = getStrings(locale);
});
-{
- !integrated && (
-
- )
-}
+
{
- toolsFiltered.map(([id, tool]) => {
+ toolsFiltered.map((tool) => {
const selected = Astro.url.pathname.includes(`/${tool.id}`);
const toolStrings =
strings.website.tools[
- (tool.strings ?? id) as keyof typeof strings.website.tools
+ (tool.strings ??
+ tool.id) as keyof typeof strings.website.tools
];
return (
@@ -203,10 +200,10 @@ const strings = getStrings(locale);
display={{ initial: "flex", sm: "none" }}
>
{
- toolsFiltered.map(([id, tool]) => {
+ toolsFiltered.map(( tool) => {
const toolStrings =
strings.website.tools[
- (tool.strings ?? id) as keyof typeof strings.website.tools
+ (tool.strings ?? tool.id) as keyof typeof strings.website.tools
];
return (
diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/components/Tracker.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/components/Tracker.tsx
index d60379abb..2b6d7071d 100644
--- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/components/Tracker.tsx
+++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/components/Tracker.tsx
@@ -1,13 +1,12 @@
-import { Box, Progress } from '@radix-ui/themes';
-import { useProgress } from '@react-three/drei';
+import { Box, Progress } from "@radix-ui/themes";
+import { useStableProgress } from "../../../../../../../hooks/useStableProgress";
interface Props {
fontSize?: string;
}
export function Tracker({ fontSize }: Props) {
- const { loaded, total } = useProgress();
- const progress = total === 0 ? 0 : (loaded / total) * 100;
+ const progress = useStableProgress();
return (
);
}
diff --git a/packages/website/src/constants/tools.ts b/packages/website/src/constants/tools.ts
index 643e9a5ac..6188a1b19 100644
--- a/packages/website/src/constants/tools.ts
+++ b/packages/website/src/constants/tools.ts
@@ -10,7 +10,7 @@ export interface Tool {
href?: string;
}
-export const tools = {
+export const tools: Record = {
tanks: {
id: "tanks",
strings: "tankopedia",
@@ -41,8 +41,7 @@ export const tools = {
},
mixer: {
id: "mixer",
- disabled: true,
- button: "red",
+ button: "gray",
},
gallery: {
id: "gallery",
@@ -76,4 +75,4 @@ export const tools = {
href: "https://discord.gg/nDt7AjGJQH",
button: "plum",
},
-} satisfies Record;
+};
diff --git a/packages/website/src/hooks/useStableProgress.ts b/packages/website/src/hooks/useStableProgress.ts
new file mode 100644
index 000000000..332ded1d0
--- /dev/null
+++ b/packages/website/src/hooks/useStableProgress.ts
@@ -0,0 +1,14 @@
+import { useProgress } from "@react-three/drei";
+import { useRef } from "react";
+
+export function useStableProgress() {
+ const { loaded, total } = useProgress();
+ const progress = useRef(0);
+
+ progress.current = Math.max(
+ progress.current,
+ total === 0 ? 0 : (loaded / total) * 100
+ );
+
+ return progress.current;
+}
diff --git a/packages/website/src/pages/[...locale]/mixer/_index.tsx b/packages/website/src/pages/[...locale]/mixer/_index.tsx
index 8b8d5a50e..36966b01d 100644
--- a/packages/website/src/pages/[...locale]/mixer/_index.tsx
+++ b/packages/website/src/pages/[...locale]/mixer/_index.tsx
@@ -1,7 +1,7 @@
import { Box } from "@radix-ui/themes";
import { useRef } from "react";
import { MixerScene } from "../../../components/MixerScene";
-import { PageWrapper } from "../../../components/PageWrapper";
+import { awaitableModelDefinitions } from "../../../core/awaitables/modelDefinitions";
import { awaitableTankDefinitions } from "../../../core/awaitables/tankDefinitions";
import {
LocaleProvider,
@@ -10,7 +10,14 @@ import {
import { Mixer } from "../../../stores/mixer";
const tankDefinitions = await awaitableTankDefinitions;
-const tanks = Object.values(tankDefinitions.tanks);
+const modelDefinitions = await awaitableModelDefinitions;
+const tanks = Object.values(tankDefinitions.tanks).filter((tank) => {
+ const tankModel = modelDefinitions.models[tank.id];
+ const turret = tank.turrets.at(-1)!;
+ const turretModel = tankModel.turrets[turret.id];
+
+ return tank.tier >= 10 && !turretModel.yaw;
+});
export function Page({ locale }: LocaleAcceptorProps) {
const hull = useRef(tanks[Math.floor(Math.random() * tanks.length)]);
@@ -51,12 +58,10 @@ export function Page({ locale }: LocaleAcceptorProps) {
function Content() {
return (
-
-
-
-
-
+
+
+
-
+
);
}
diff --git a/packages/website/src/pages/[...locale]/mixer/index.astro b/packages/website/src/pages/[...locale]/mixer/index.astro
index ec26fd5f3..340362892 100644
--- a/packages/website/src/pages/[...locale]/mixer/index.astro
+++ b/packages/website/src/pages/[...locale]/mixer/index.astro
@@ -1,15 +1,15 @@
---
-import { PageWrapper } from '../../../components/PageWrapper';
-import BaseLayout from '../../../layouts/BaseLayout.astro';
-import { Page } from './_index';
+import { PageWrapper } from "../../../components/PageWrapper";
+import BaseLayout from "../../../layouts/BaseLayout.astro";
+import { Page } from "./_index";
-export { getStaticPaths } from '../index.astro';
+export { getStaticPaths } from "../index.astro";
const { locale } = Astro.params;
---
-
-
+
+