ospab
7e1c87e70b
- Tauri 2.0 based graphical installer - Access Key parsing with AES-256-GCM encryption - Windows Service installation via sc.exe - WinTUN driver extraction from embedded resources - System requirements checking (admin, AES-NI, OS version) - Modern dark UI with step-by-step wizard flow - Country/region selection for SNI mimicry
191 lines
8.1 KiB
HTML
191 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Ospab Network - Setup Wizard</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<div class="wizard-container">
|
|
<!-- Header -->
|
|
<header class="wizard-header">
|
|
<div class="logo">
|
|
<svg width="32" height="32" viewBox="0 0 32 32" fill="none">
|
|
<circle cx="16" cy="16" r="14" stroke="#6366f1" stroke-width="2"/>
|
|
<path d="M10 16l4 4 8-8" stroke="#6366f1" stroke-width="2" stroke-linecap="round"/>
|
|
</svg>
|
|
<span>Ospab Network</span>
|
|
</div>
|
|
<div class="step-indicator" id="stepIndicator">
|
|
<span class="step active">1</span>
|
|
<span class="step">2</span>
|
|
<span class="step">3</span>
|
|
<span class="step">4</span>
|
|
<span class="step">5</span>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- Step 1: Welcome -->
|
|
<section class="step-content active" id="step1">
|
|
<div class="step-icon">
|
|
<svg width="64" height="64" viewBox="0 0 64 64" fill="none">
|
|
<circle cx="32" cy="32" r="28" stroke="#6366f1" stroke-width="3"/>
|
|
<path d="M20 32l8 8 16-16" stroke="#6366f1" stroke-width="3" stroke-linecap="round"/>
|
|
</svg>
|
|
</div>
|
|
<h1>Welcome to Ospab Network</h1>
|
|
<p class="description">
|
|
This wizard will guide you through the installation of the OSTP Client,
|
|
providing secure and stealth VPN connectivity.
|
|
</p>
|
|
<div class="features">
|
|
<div class="feature">
|
|
<span class="feature-icon">🔒</span>
|
|
<span>Military-grade encryption</span>
|
|
</div>
|
|
<div class="feature">
|
|
<span class="feature-icon">👁️</span>
|
|
<span>Stealth protocol (DPI bypass)</span>
|
|
</div>
|
|
<div class="feature">
|
|
<span class="feature-icon">⚡</span>
|
|
<span>High-speed connections</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Step 2: System Check -->
|
|
<section class="step-content" id="step2">
|
|
<h1>System Requirements</h1>
|
|
<p class="description">Checking your system compatibility...</p>
|
|
|
|
<div class="check-list" id="checkList">
|
|
<div class="check-item" id="checkAdmin">
|
|
<span class="check-icon pending">⏳</span>
|
|
<span class="check-label">Administrator privileges</span>
|
|
<span class="check-status"></span>
|
|
</div>
|
|
<div class="check-item" id="checkAesNi">
|
|
<span class="check-icon pending">⏳</span>
|
|
<span class="check-label">AES-NI CPU support</span>
|
|
<span class="check-status"></span>
|
|
</div>
|
|
<div class="check-item" id="checkWintun">
|
|
<span class="check-icon pending">⏳</span>
|
|
<span class="check-label">WinTUN driver</span>
|
|
<span class="check-status"></span>
|
|
</div>
|
|
<div class="check-item" id="checkOs">
|
|
<span class="check-icon pending">⏳</span>
|
|
<span class="check-label">Operating system</span>
|
|
<span class="check-status"></span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Step 3: Configuration -->
|
|
<section class="step-content" id="step3">
|
|
<h1>Configuration</h1>
|
|
<p class="description">Enter your access credentials and preferences.</p>
|
|
|
|
<div class="form-group">
|
|
<label for="accessKey">Access Key</label>
|
|
<input type="text" id="accessKey" placeholder="ospab://..." autocomplete="off">
|
|
<span class="input-hint">Paste the access key provided by your administrator</span>
|
|
<span class="input-error" id="accessKeyError"></span>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="country">Region</label>
|
|
<select id="country">
|
|
<option value="">Loading...</option>
|
|
</select>
|
|
<span class="input-hint">Select the region for optimal server mimicry</span>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="installPath">Installation Path</label>
|
|
<div class="path-input">
|
|
<input type="text" id="installPath" readonly>
|
|
<button type="button" class="btn-browse" id="btnBrowse">Browse</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Step 4: Installation Progress -->
|
|
<section class="step-content" id="step4">
|
|
<h1>Installing</h1>
|
|
<p class="description" id="installStatus">Preparing installation...</p>
|
|
|
|
<div class="progress-container">
|
|
<div class="progress-bar">
|
|
<div class="progress-fill" id="progressFill" style="width: 0%"></div>
|
|
</div>
|
|
<span class="progress-text" id="progressText">0%</span>
|
|
</div>
|
|
|
|
<div class="install-steps" id="installSteps">
|
|
<div class="install-step" data-step="1">
|
|
<span class="step-status">⏳</span>
|
|
<span>Extracting WinTUN driver</span>
|
|
</div>
|
|
<div class="install-step" data-step="2">
|
|
<span class="step-status">⏳</span>
|
|
<span>Validating access key</span>
|
|
</div>
|
|
<div class="install-step" data-step="3">
|
|
<span class="step-status">⏳</span>
|
|
<span>Writing configuration</span>
|
|
</div>
|
|
<div class="install-step" data-step="4">
|
|
<span class="step-status">⏳</span>
|
|
<span>Installing Windows Service</span>
|
|
</div>
|
|
<div class="install-step" data-step="5">
|
|
<span class="step-status">⏳</span>
|
|
<span>Configuring startup</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Step 5: Finish -->
|
|
<section class="step-content" id="step5">
|
|
<div class="step-icon success">
|
|
<svg width="64" height="64" viewBox="0 0 64 64" fill="none">
|
|
<circle cx="32" cy="32" r="28" stroke="#10b981" stroke-width="3"/>
|
|
<path d="M20 32l8 8 16-16" stroke="#10b981" stroke-width="3" stroke-linecap="round"/>
|
|
</svg>
|
|
</div>
|
|
<h1>Installation Complete!</h1>
|
|
<p class="description">
|
|
OSTP Client has been successfully installed on your system.
|
|
</p>
|
|
|
|
<div class="finish-options">
|
|
<label class="checkbox-container">
|
|
<input type="checkbox" id="optConnectNow" checked>
|
|
<span class="checkmark"></span>
|
|
<span>Connect now</span>
|
|
</label>
|
|
<label class="checkbox-container">
|
|
<input type="checkbox" id="optLaunchStartup" checked>
|
|
<span class="checkmark"></span>
|
|
<span>Launch on system startup</span>
|
|
</label>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer / Navigation -->
|
|
<footer class="wizard-footer">
|
|
<button class="btn btn-secondary" id="btnBack" disabled>Back</button>
|
|
<div class="spacer"></div>
|
|
<button class="btn btn-secondary" id="btnCancel">Cancel</button>
|
|
<button class="btn btn-primary" id="btnNext">Next</button>
|
|
</footer>
|
|
</div>
|
|
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|