72 lines
2.1 KiB
TypeScript
Executable File
72 lines
2.1 KiB
TypeScript
Executable File
import React, { useState, useEffect } from 'react';
|
||
import { motion } from 'framer-motion';
|
||
|
||
const bootLogs = [
|
||
'ИНИЦИАЛИЗАЦИЯ СИСТЕМЫ...',
|
||
'ЗАГРУЗКА ЯДРА [##########......]',
|
||
'МОНТИРОВАНИЕ ТОМОВ...',
|
||
'ПОДКЛЮЧЕНИЕ К ЗАЩИЩЕННОЙ СЕТИ...',
|
||
'ДОСТУП РАЗРЕШЕН.'
|
||
];
|
||
|
||
interface Props {
|
||
onComplete: () => void;
|
||
}
|
||
|
||
const BootAnimation: React.FC<Props> = ({ onComplete }) => {
|
||
const [logs, setLogs] = useState<string[]>([]);
|
||
|
||
useEffect(() => {
|
||
let delay = 0;
|
||
bootLogs.forEach((log, index) => {
|
||
delay += 200 + Math.random() * 300;
|
||
setTimeout(() => {
|
||
setLogs(prev => [...prev, log]);
|
||
if (index === bootLogs.length - 1) {
|
||
setTimeout(onComplete, 800);
|
||
}
|
||
}, delay);
|
||
});
|
||
}, [onComplete]);
|
||
|
||
return (
|
||
<motion.div
|
||
exit={{ y: "-100%" }}
|
||
transition={{ duration: 0.8, ease: [0.76, 0, 0.24, 1] }}
|
||
className="fixed inset-0 z-[100] flex flex-col justify-between bg-[#0e0e10] p-8 md:p-12 text-[#20e3b2] font-mono text-xs uppercase"
|
||
>
|
||
<div className="flex justify-between w-full border-b border-[#20e3b2]/20 pb-4">
|
||
<span>iiEasy // ЗАГРУЗКА</span>
|
||
<span>V 1.0</span>
|
||
</div>
|
||
|
||
<div className="w-full max-w-lg">
|
||
{logs.map((log, i) => (
|
||
<motion.div
|
||
key={i}
|
||
initial={{ opacity: 0 }}
|
||
animate={{ opacity: 1 }}
|
||
className="mb-1"
|
||
>
|
||
<span className="text-[#666] mr-2">
|
||
{String(i).padStart(2, '0')} ::
|
||
</span>
|
||
{log}
|
||
</motion.div>
|
||
))}
|
||
<motion.div
|
||
animate={{ opacity: [0, 1, 0] }}
|
||
transition={{ repeat: Infinity, duration: 0.2 }}
|
||
className="w-3 h-4 bg-[#20e3b2] mt-2 inline-block"
|
||
/>
|
||
</div>
|
||
|
||
<div className="flex justify-between w-full border-t border-[#20e3b2]/20 pt-4 text-[#666]">
|
||
<span>ПАМЯТЬ: 128TB</span>
|
||
<span>CPU: ОПТИМАЛЬНО</span>
|
||
</div>
|
||
</motion.div>
|
||
);
|
||
};
|
||
|
||
export default BootAnimation; |