rintyuu/MikuMikuBeam
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #14 from rainwashed/main

Browse source 
Added volume slider because audio is loud and should be configurable
This commit is contained in:
Sammwy 2025-01-21 17:00:01 -03:00 • committed by GitHub
commit cb9c67eb58
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 41 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
data/uas.txt
View file

@ -7,4 +7,4 @@ Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like
Mozilla/5.0 (Windows NT 10.0; WOW64; rv:114.0) Gecko/20100101 Firefox/114.0 Mozilla/5.0 (Windows NT 10.0; WOW64; rv:114.0) Gecko/20100101 Firefox/114.0
Mozilla/5.0 (Linux; Android 11; SM-G991B) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.77 Mobile Safari/537.36 Mozilla/5.0 (Linux; Android 11; SM-G991B) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.77 Mobile Safari/537.36
Mozilla/5.0 (Linux; U; Android 11; en-US; SM-G960F Build/RP1A.200720.012) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/91.0.4472.77 Mobile Safari/537.36 Mozilla/5.0 (Linux; U; Android 11; en-US; SM-G960F Build/RP1A.200720.012) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/91.0.4472.77 Mobile Safari/537.36
Mozilla/5.0 (iPad; CPU OS 15_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.3 Mobile/15E148 Safari/604.1 Mozilla/5.0 (iPad; CPU OS 15_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.3 Mobile/15E148 Safari/604.1

65
src/App.tsx
View file

@ -22,6 +22,7 @@ function App() {
const [lastUpdatedPPS, setLastUpdatedPPS] = useState(Date.now()); const [lastUpdatedPPS, setLastUpdatedPPS] = useState(Date.now());
const [lastTotalPackets, setLastTotalPackets] = useState(0); const [lastTotalPackets, setLastTotalPackets] = useState(0);
const [currentTask, setCurrentTask] = useState<NodeJS.Timeout | null>(null); const [currentTask, setCurrentTask] = useState<NodeJS.Timeout | null>(null);
const [audioVol, setAudioVol] = useState(100);
const audioRef = useRef<HTMLAudioElement>(null); const audioRef = useRef<HTMLAudioElement>(null);
useEffect(() => { useEffect(() => {
@ -90,6 +91,14 @@ function App() {
}; };
}, []); }, []);
useEffect(() => {
if (audioRef.current) {
audioRef.current.volume = audioVol / 100;
}
}, [audioVol])
const addLog = (message: string) => { const addLog = (message: string) => {
setLogs((prev) => [message, ...prev].slice(0, 12)); setLogs((prev) => [message, ...prev].slice(0, 12));
}; };
@ -111,6 +120,7 @@ function App() {
// Play audio // Play audio
if (audioRef.current) { if (audioRef.current) {
audioRef.current.currentTime = isQuick ? 9.5 : 0; audioRef.current.currentTime = isQuick ? 9.5 : 0;
audioRef.current.volume = audioVol / 100;
audioRef.current.play(); audioRef.current.play();
} }
@ -146,7 +156,7 @@ function App() {
<div className="max-w-2xl mx-auto space-y-8"> <div className="max-w-2xl mx-auto space-y-8">
<div className="text-center"> <div className="text-center">
<h1 className="text-4xl font-bold text-pink-500 mb-2"> <h1 className="mb-2 text-4xl font-bold text-pink-500">
Miku Miku Beam Miku Miku Beam
</h1> </h1>
<p className="text-gray-600"> <p className="text-gray-600">
@ -155,10 +165,10 @@ function App() {
</p> </p>
</div> </div>
<div className="bg-white rounded-lg shadow-xl p-6 relative overflow-hidden"> <div className="relative p-6 overflow-hidden bg-white rounded-lg shadow-xl">
{/* Miku GIF */} {/* Miku GIF */}
<div <div
className="flex justify-center mb-6 h-48 w-full" className="flex justify-center w-full h-48 mb-6"
style={{ style={{
backgroundImage: "url('/miku.gif')", backgroundImage: "url('/miku.gif')",
backgroundRepeat: "no-repeat", backgroundRepeat: "no-repeat",
@ -175,10 +185,10 @@ function App() {
value={target} value={target}
onChange={(e) => setTarget(e.target.value)} onChange={(e) => setTarget(e.target.value)}
placeholder="Enter target URL or IP" placeholder="Enter target URL or IP"
className="px-4 py-2 rounded-lg border border-pink-200 focus:border-pink-500 focus:ring-2 focus:ring-pink-200 outline-none" className="px-4 py-2 border border-pink-200 rounded-lg outline-none focus:border-pink-500 focus:ring-2 focus:ring-pink-200"
disabled={isAttacking} disabled={isAttacking}
/> />
<div className="flex gap-2 items-center"> <div className="flex items-center gap-2">
<button <button
onClick={() => (isAttacking ? stopAttack() : startAttack())} onClick={() => (isAttacking ? stopAttack() : startAttack())}
className={` className={`
@ -215,13 +225,13 @@ function App() {
<div className="grid grid-cols-4 gap-4"> <div className="grid grid-cols-4 gap-4">
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-1"> <label className="block mb-1 text-sm font-medium text-gray-700">
Attack Method Attack Method
</label> </label>
<select <select
value={attackMethod} value={attackMethod}
onChange={(e) => setAttackMethod(e.target.value)} onChange={(e) => setAttackMethod(e.target.value)}
className="w-full px-4 py-2 rounded-lg border border-pink-200 focus:border-pink-500 focus:ring-2 focus:ring-pink-200 outline-none" className="w-full px-4 py-2 border border-pink-200 rounded-lg outline-none focus:border-pink-500 focus:ring-2 focus:ring-pink-200"
disabled={isAttacking} disabled={isAttacking}
> >
<option value="http_flood">HTTP/Flood</option> <option value="http_flood">HTTP/Flood</option>
@ -231,42 +241,42 @@ function App() {
</select> </select>
</div> </div>
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-1"> <label className="block mb-1 text-sm font-medium text-gray-700">
Packet Size (kb) Packet Size (kb)
</label> </label>
<input <input
type="number" type="number"
value={packetSize} value={packetSize}
onChange={(e) => setPacketSize(Number(e.target.value))} onChange={(e) => setPacketSize(Number(e.target.value))}
className="w-full px-4 py-2 rounded-lg border border-pink-200 focus:border-pink-500 focus:ring-2 focus:ring-pink-200 outline-none" className="w-full px-4 py-2 border border-pink-200 rounded-lg outline-none focus:border-pink-500 focus:ring-2 focus:ring-pink-200"
disabled={isAttacking} disabled={isAttacking}
min="1" min="1"
max="1500" max="1500"
/> />
</div> </div>
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-1"> <label className="block mb-1 text-sm font-medium text-gray-700">
Duration (seconds) Duration (seconds)
</label> </label>
<input <input
type="number" type="number"
value={duration} value={duration}
onChange={(e) => setDuration(Number(e.target.value))} onChange={(e) => setDuration(Number(e.target.value))}
className="w-full px-4 py-2 rounded-lg border border-pink-200 focus:border-pink-500 focus:ring-2 focus:ring-pink-200 outline-none" className="w-full px-4 py-2 border border-pink-200 rounded-lg outline-none focus:border-pink-500 focus:ring-2 focus:ring-pink-200"
disabled={isAttacking} disabled={isAttacking}
min="1" min="1"
max="300" max="300"
/> />
</div> </div>
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-1"> <label className="block mb-1 text-sm font-medium text-gray-700">
Packet Delay (ms) Packet Delay (ms)
</label> </label>
<input <input
type="number" type="number"
value={packetDelay} value={packetDelay}
onChange={(e) => setPacketDelay(Number(e.target.value))} onChange={(e) => setPacketDelay(Number(e.target.value))}
className="w-full px-4 py-2 rounded-lg border border-pink-200 focus:border-pink-500 focus:ring-2 focus:ring-pink-200 outline-none" className="w-full px-4 py-2 border border-pink-200 rounded-lg outline-none focus:border-pink-500 focus:ring-2 focus:ring-pink-200"
disabled={isAttacking} disabled={isAttacking}
min="1" min="1"
max="1000" max="1000"
@ -277,8 +287,8 @@ function App() {
{/* Stats Widgets */} {/* Stats Widgets */}
<div className="grid grid-cols-3 gap-4 mb-6"> <div className="grid grid-cols-3 gap-4 mb-6">
<div className="bg-gradient-to-br from-pink-500/10 to-blue-500/10 p-4 rounded-lg"> <div className="p-4 rounded-lg bg-gradient-to-br from-pink-500/10 to-blue-500/10">
<div className="flex items-center gap-2 text-pink-600 mb-2"> <div className="flex items-center gap-2 mb-2 text-pink-600">
<Zap className="w-4 h-4" /> <Zap className="w-4 h-4" />
<span className="font-semibold">Packets/sec</span> <span className="font-semibold">Packets/sec</span>
</div> </div>
@ -286,8 +296,8 @@ function App() {
{stats.pps.toLocaleString()} {stats.pps.toLocaleString()}
</div> </div>
</div> </div>
<div className="bg-gradient-to-br from-pink-500/10 to-blue-500/10 p-4 rounded-lg"> <div className="p-4 rounded-lg bg-gradient-to-br from-pink-500/10 to-blue-500/10">
<div className="flex items-center gap-2 text-pink-600 mb-2"> <div className="flex items-center gap-2 mb-2 text-pink-600">
<Bot className="w-4 h-4" /> <Bot className="w-4 h-4" />
<span className="font-semibold">Active Bots</span> <span className="font-semibold">Active Bots</span>
</div> </div>
@ -295,8 +305,8 @@ function App() {
{stats.bots.toLocaleString()} {stats.bots.toLocaleString()}
</div> </div>
</div> </div>
<div className="bg-gradient-to-br from-pink-500/10 to-blue-500/10 p-4 rounded-lg"> <div className="p-4 rounded-lg bg-gradient-to-br from-pink-500/10 to-blue-500/10">
<div className="flex items-center gap-2 text-pink-600 mb-2"> <div className="flex items-center gap-2 mb-2 text-pink-600">
<Wifi className="w-4 h-4" /> <Wifi className="w-4 h-4" />
<span className="font-semibold">Total Packets</span> <span className="font-semibold">Total Packets</span>
</div> </div>
@ -307,15 +317,15 @@ function App() {
</div> </div>
{/* Progress Bar */} {/* Progress Bar */}
<div className="bg-gray-200 rounded-full h-4 mb-6 overflow-hidden"> <div className="h-4 mb-6 overflow-hidden bg-gray-200 rounded-full">
<div <div
className="h-full bg-gradient-to-r from-pink-500 to-blue-500 transition-all duration-500" className="h-full transition-all duration-500 bg-gradient-to-r from-pink-500 to-blue-500"
style={{ width: `${progress}%` }} style={{ width: `${progress}%` }}
/> />
</div> </div>
{/* Logs Section */} {/* Logs Section */}
<div className="bg-gray-900 rounded-lg p-4 font-mono text-sm"> <div className="p-4 font-mono text-sm bg-gray-900 rounded-lg">
<div className="text-green-400"> <div className="text-green-400">
{logs.map((log, index) => ( {logs.map((log, index) => (
<div key={index} className="py-1"> <div key={index} className="py-1">
@ -323,7 +333,7 @@ function App() {
</div> </div>
))} ))}
{logs.length === 0 && ( {logs.length === 0 && (
<div className="text-gray-500 italic"> <div className="italic text-gray-500">
{">"} Waiting for Miku's power... {">"} Waiting for Miku's power...
</div> </div>
)} )}
@ -334,14 +344,15 @@ function App() {
{isAttacking && ( {isAttacking && (
<div className="absolute inset-0 pointer-events-none"> <div className="absolute inset-0 pointer-events-none">
<div className="absolute inset-0 bg-gradient-to-r from-pink-500/10 to-blue-500/10 animate-pulse" /> <div className="absolute inset-0 bg-gradient-to-r from-pink-500/10 to-blue-500/10 animate-pulse" />
<div className="absolute top-0 left-1/2 -translate-x-1/2"> <div className="absolute top-0 -translate-x-1/2 left-1/2">
<div className="w-2 h-2 bg-pink-500 rounded-full animate-bounce" /> <div className="w-2 h-2 bg-pink-500 rounded-full animate-bounce" />
</div> </div>
</div> </div>
)} )}
</div> </div>
<div className="text-center text-sm text-gray-500"> <div className="flex flex-col items-center">
<span className="text-sm text-center text-gray-500">
🎵 v1.0 made by{" "} 🎵 v1.0 made by{" "}
<a <a
href="https://github.com/sammwyy/mikumikubeam" href="https://github.com/sammwyy/mikumikubeam"
@ -351,6 +362,10 @@ function App() {
@Sammwy @Sammwy
</a>{" "} </a>{" "}
🎵 🎵
</span>
<span>
<input type="range" min="0" max="100" step="5" draggable="false" value={audioVol} onChange={(e) => setAudioVol(parseInt(e.target?.value))} />
</span>
</div> </div>
</div> </div>
</div> </div>