Skip to content

Commit d74812d

Browse files
GizmotronnGizmotronn
committed
️🛵📩 ↝ [SSG-190 SSG-191 SSG-193]: Users can now upgrade their telescope FROM the telescope modal
1 parent d06c5bc commit d74812d

File tree

8 files changed

+371
-284
lines changed

8 files changed

+371
-284
lines changed

‎app/api/gameplay/research/upgrades/route.ts‎

Lines changed: 45 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,52 @@
11
import { NextRequest, NextResponse } from 'next/server';
22

3-
export interface ItemUpgrade {
4-
id: number;
5-
name: string;
3+
export interface ResearchLevelInfo {
4+
level: number;
65
description: string;
7-
cost?: number;
8-
icon_url: string;
9-
parentItem?: number | null;
10-
locationType?: string;
11-
gif?: string;
12-
};
6+
}
137

14-
const itemUpgrades: ItemUpgrade[] = [
15-
{ id: 1, name: 'Telescope', description: 'A basic telescope for observing celestial objects.', cost: 100, icon_url: '/assets/Items/Telescope.png', parentItem: null, locationType: 'Orbit' },
16-
{ id: 2, name: 'Advanced Telescope', description: 'An advanced telescope with enhanced capabilities.', cost: 500, icon_url: '/assets/Items/AdvancedTelescope.png', parentItem: 1, locationType: 'Orbit' },
17-
{ id: 3, name: 'Space Probe', description: 'A probe designed for deep space exploration.', cost: 1000, icon_url: '/assets/Items/SpaceProbe.png', parentItem: null, locationType: 'Orbit' },
18-
];
8+
const researchMappings: Record<string, ResearchLevelInfo[]> = {
9+
probecount: [
10+
{ level: 1, description: '1 Probe' },
11+
{ level: 2, description: '2 Probes' },
12+
{ level: 3, description: '3 Probes' },
13+
],
14+
proberange: [
15+
{ level: 1, description: '100 Lightyears' },
16+
{ level: 2, description: '500 Lightyears' },
17+
{ level: 3, description: '1,000 Lightyears' },
18+
{ level: 4, description: '5,000 Lightyears' },
19+
{ level: 5, description: '10,000 Lightyears' },
20+
],
21+
telescopepower: [
22+
{ level: 1, description: 'Basic Magnification' },
23+
{ level: 2, description: 'Medium Magnification' },
24+
{ level: 3, description: 'High Magnification' },
25+
{ level: 4, description: 'Ultra Deep Field' },
26+
],
27+
};
1928

2029
export async function GET(req: NextRequest) {
21-
return NextResponse.json(itemUpgrades);
30+
const { searchParams } = new URL(req.url);
31+
const techType = searchParams.get('techType');
32+
const countStr = searchParams.get('count');
33+
34+
if (!techType || !countStr) {
35+
return NextResponse.json({ error: 'Missing techType or count' }, { status: 400 });
36+
}
37+
38+
const count = parseInt(countStr, 10);
39+
const levels = researchMappings[techType];
40+
41+
if (!levels) {
42+
return NextResponse.json({ error: 'Invalid techType' }, { status: 400 });
43+
}
44+
45+
const matchedLevel = levels.find((l) => l.level === count) || levels[levels.length - 1];
46+
47+
return NextResponse.json({
48+
techType,
49+
count,
50+
description: matchedLevel.description,
51+
});
2252
};

‎app/research/page.tsx‎

Lines changed: 175 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,182 @@
1-
'use client';
1+
"use client";
22

3-
import GameNavbar from "@/components/Layout/Tes";
4-
import TotalPoints from "@/components/Structures/Missions/Stardust/Total";
5-
import { AdvancedTechTreeComponent } from "@/components/Structures/Research/OldTechTree";
3+
import { ArrowRight, Lock, Telescope, Cloud, Leaf } from "lucide-react";
4+
import { useState } from "react";
65
import { Button } from "@/components/ui/button";
7-
import MySettlementsLocations from "@/content/Classifications/UserLocations";
8-
import React, { useEffect, useState } from "react";
6+
import { StatCard } from "@/components/Research/StatCard";
7+
import { TechSection } from "@/components/Research/TechSection";
8+
import { UpgradeItem } from "@/components/Research/UpgradeItem";
9+
import { LockedItem } from "@/components/Research/LockedItem";
10+
import GameNavbar from "@/components/Layout/Tes";
11+
import AstronomyResearch from "@/components/Research/AstronomyItems";
12+
13+
type CapacityKey =
14+
| "probeCount"
15+
| "probeDistance"
16+
| "stationCount"
17+
| "balloonCount"
18+
| "cameraCount"
19+
| "stationSize";
20+
21+
type UserCapacities = Record<CapacityKey, number>;
922

1023
export default function TechTreeResearchPage() {
11-
return (
12-
<div className="relative w-full py-10 bg-black text-white">
13-
<GameNavbar />
14-
Available: <TotalPoints />
15-
<h2 className="text-lg text-white">Available upgrades</h2>
16-
<h3 className="text-md text-white">Astronomy</h3>
17-
<Button
18-
variant='ghost'
19-
>
20-
Probecount ++
21-
</Button>
22-
<h3 className="text-md text-white">Meteorology</h3>
23-
<Button
24-
variant='ghost'
25-
>
26-
Probecount ++
27-
</Button>
28-
<h3 className="text-md text-white">Biology</h3>
29-
<Button
30-
variant='ghost'
31-
>
32-
Cameracount++
33-
</Button>
34-
<Button
35-
variant='ghost'
36-
>
37-
Station Count - select [show available/ready]
38-
</Button>
39-
<h2 className="text-lg text-white">[temporarily] Unavailable upgrades</h2>
40-
<h3 className="text-md text-white">Astronomy</h3>
41-
<Button
42-
variant='ghost'
24+
const [availablePoints, setAvailablePoints] = useState(10);
25+
const [userCapacities, setUserCapacities] = useState<UserCapacities>({
26+
probeCount: 1,
27+
probeDistance: 1,
28+
stationCount: 0,
29+
balloonCount: 0,
30+
cameraCount: 1,
31+
stationSize: 0,
32+
});
33+
34+
const getUpgradeCost = (currentLevel: number): number => {
35+
return (currentLevel + 1) * 2;
36+
};
37+
38+
const handleUpgrade = (capacity: CapacityKey, currentLevel: number) => {
39+
const cost = getUpgradeCost(currentLevel);
40+
if (availablePoints >= cost) {
41+
setAvailablePoints((prev) => prev - cost);
42+
setUserCapacities((prev) => ({
43+
...prev,
44+
[capacity]: prev[capacity] + 1,
45+
}));
46+
}
47+
};
48+
49+
return (
50+
<div className="min-h-screen bg-[#0a1929] flex flex-col">
51+
<div className="fixed top-0 left-0 right-0 z-50">
52+
<GameNavbar />
53+
</div>
54+
55+
<div className="flex-1 pt-20 text-[#c5d5e6] font-mono">
56+
<header className="bg-[#0a1929] border-b border-[#1e3a5f] py-12 p-4">
57+
<div className="container mx-auto flex justify-between items-center">
58+
<h1 className="text-2xl font-bold text-[#4cc9f0] tracking-wider">RESEARCH LAB</h1>
59+
<div className="flex items-center gap-4">
60+
<div className="flex items-center gap-2 bg-[#0f2942] px-4 py-2 rounded border border-[#1e3a5f]">
61+
<span className="text-[#4cc9f0]">STARDUST:</span>
62+
<span className="font-bold text-[#f72585] text-xl">{availablePoints}</span>
63+
</div>
64+
</div>
65+
</div>
66+
</header>
67+
68+
<main className="container mx-auto p-4">
69+
{/* <div className="grid grid-cols-3 gap-4 mb-8">
70+
<StatCard title="PROBE COUNT" value={userCapacities.probeCount} max={3} color="#4361ee" />
71+
<StatCard title="PROBE DISTANCE" value={userCapacities.probeDistance * 1000} color="#4cc9f0" />
72+
<StatCard title="CAMERA COUNT" value={userCapacities.cameraCount} max={3} color="#3a0ca3" />
73+
</div> */}
74+
75+
<div className="relative">
76+
{/* <div className="absolute inset-0 z-0">
77+
<div className="absolute left-[50%] top-[120px] w-[2px] h-[100px] bg-[#1e3a5f]"></div>
78+
<div className="absolute left-[50%] top-[340px] w-[2px] h-[100px] bg-[#1e3a5f]"></div>
79+
</div> */}
80+
81+
<AstronomyResearch />
82+
83+
<TechSection
84+
title="METEOROLOGY"
85+
icon={<Cloud />}
86+
color="#4cc9f0"
87+
glowColor="rgba(76, 201, 240, 0.5)"
4388
>
44-
Probedistance ++
45-
</Button>
46-
<h3 className="text-md text-white">Meteorology</h3>
47-
<MySettlementsLocations /> - Show weather balloons on Settlements
48-
<h3 className="text-md text-white">Biology</h3>
49-
<Button
50-
variant='ghost'
89+
<div className="space-y-6">
90+
<div>
91+
<h3 className="text-lg font-semibold text-[#4cc9f0] mb-4 border-b border-[#1e3a5f] pb-2">
92+
AVAILABLE UPGRADES
93+
</h3>
94+
<UpgradeItem
95+
title="Balloon Count ++"
96+
description="Add weather balloons to monitor atmospheric conditions"
97+
current={userCapacities.balloonCount}
98+
max={3}
99+
cost={getUpgradeCost(userCapacities.balloonCount)}
100+
onUpgrade={() => handleUpgrade("balloonCount", userCapacities.balloonCount)}
101+
disabled={
102+
userCapacities.balloonCount >= 3 ||
103+
availablePoints < getUpgradeCost(userCapacities.balloonCount)
104+
}
105+
color="#4cc9f0"
106+
/>
107+
</div>
108+
109+
<div>
110+
<h3 className="text-lg font-semibold text-[#8badc9] mb-4 border-b border-[#1e3a5f] pb-2">
111+
UNAVAILABLE UPGRADES
112+
</h3>
113+
<LockedItem
114+
title="Weather Balloons on Settlements"
115+
description="Deploy weather monitoring on your settlements"
116+
/>
117+
</div>
118+
</div>
119+
</TechSection>
120+
121+
<TechSection
122+
title="BIOLOGY"
123+
icon={<Leaf />}
124+
color="#7209b7"
125+
glowColor="rgba(114, 9, 183, 0.5)"
51126
>
52-
Heat/Motion Sensors ++
53-
</Button>
54-
{/* <AdvancedTechTreeComponent /> */}
55-
</div>
56-
);
127+
<div className="space-y-6">
128+
<div>
129+
<h3 className="text-lg font-semibold text-[#4cc9f0] mb-4 border-b border-[#1e3a5f] pb-2">
130+
AVAILABLE UPGRADES
131+
</h3>
132+
<div className="space-y-4">
133+
<UpgradeItem
134+
title="Camera Count ++"
135+
description="Increase observation capabilities"
136+
current={userCapacities.cameraCount}
137+
max={3}
138+
cost={getUpgradeCost(userCapacities.cameraCount)}
139+
onUpgrade={() => handleUpgrade("cameraCount", userCapacities.cameraCount)}
140+
disabled={
141+
userCapacities.cameraCount >= 3 ||
142+
availablePoints < getUpgradeCost(userCapacities.cameraCount)
143+
}
144+
color="#7209b7"
145+
/>
146+
147+
<div className="bg-[#0a1929] border border-[#1e3a5f] p-4 rounded-md">
148+
<div className="flex items-center justify-between">
149+
<div>
150+
<p className="font-medium text-white">Station Count</p>
151+
<p className="text-[#8badc9] mt-1 text-sm">
152+
View available biodome stations
153+
</p>
154+
</div>
155+
<Button
156+
className="bg-[#7209b7] hover:bg-opacity-90 text-white border-[#1e3a5f]"
157+
style={{ boxShadow: "0 0 10px rgba(114, 9, 183, 0.3)" }}
158+
>
159+
SHOW AVAILABLE
160+
</Button>
161+
</div>
162+
</div>
163+
</div>
164+
</div>
165+
166+
<div>
167+
<h3 className="text-lg font-semibold text-[#8badc9] mb-4 border-b border-[#1e3a5f] pb-2">
168+
UNAVAILABLE UPGRADES
169+
</h3>
170+
<LockedItem
171+
title="Station Size ++"
172+
description="Expand the size of your research stations"
173+
/>
174+
</div>
175+
</div>
176+
</TechSection>
177+
</div>
178+
</main>
179+
</div>
180+
</div>
181+
);
57182
};

0 commit comments

Comments
 (0)