othman.suseno/vtl-appliance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Major VTL System Upgrade (Auth, Monitoring, CLI, Installer)

Browse Source 
- Web UI:
  - Added secure Authentication system (Login, 2 Roles: Admin/Viewer)
  - Added System Monitoring Dashboard (Health, Services, Power Mgmt)
  - Added User Management Interface (Create, Delete, Enable/Disable)
  - Added Device Mapping view in iSCSI tab (lsscsi output)
- Backend:
  - Implemented secure session management (auth.php)
  - Added power management APIs (restart/shutdown appliance)
  - Added device mapping API
- CLI:
  - Created global 'vtl' management tool
  - Added scripts for reliable startup (vtllibrary fix)
- Installer:
  - Updated install.sh with new dependencies (tgt, sudoers, permissions)
  - Included all new components in build-installer.sh
- Docs:
  - Consolidated documentation into docs/ folder
This commit is contained in:
othman hendy suseno
2025-12-09 18:15:36 +00:00
parent 8a0523a265
commit 01080498af
53 changed files with 13399 additions and 425 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
dist/adastra-vtl-installer/web-ui/api.php vendored
View File

@@ -1,6 +1,9 @@
<?php
header('Content-Type: application/json');
// Include authentication system
require_once 'auth.php';
// Configuration
$CONFIG_DIR = '/etc/mhvtl';
$DEVICE_CONF = $CONFIG_DIR . '/device.conf';
@@ -21,8 +24,75 @@ if (!$input || !isset($input['action'])) {
$action = $input['action'];
// Public actions (no authentication required)
$publicActions = ['login', 'check_session'];
// Check authentication for non-public actions
if (!in_array($action, $publicActions)) {
requireLogin();
}
switch ($action) {
// Authentication actions
case 'login':
$username = $input['username'] ?? '';
$password = $input['password'] ?? '';
if (authenticateUser($username, $password)) {
echo json_encode([
'success' => true,
'user' => getCurrentUser()
]);
} else {
echo json_encode([
'success' => false,
'error' => 'Invalid username or password'
]);
}
break;
case 'logout':
logout();
echo json_encode(['success' => true]);
break;
case 'check_session':
if (isLoggedIn()) {
echo json_encode([
'success' => true,
'logged_in' => true,
'user' => getCurrentUser()
]);
} else {
echo json_encode([
'success' => true,
'logged_in' => false
]);
}
break;
case 'get_users':
getAllUsers();
break;
case 'create_user':
createUser($input);
break;
case 'update_user':
updateUser($input);
break;
case 'delete_user':
deleteUser($input['username'] ?? '');
break;
case 'change_password':
changePassword($input);
break;
case 'save_config':
requireAdmin(); // Only admin can save config
saveConfig($input['config']);
break;
@@ -31,7 +101,7 @@ switch ($action) {
break;
case 'restart_service':
restartService();
requireAdmin(); // Only admin can restart service
break;
case 'list_tapes':
@@ -74,6 +144,22 @@ switch ($action) {
unbindInitiator($input);
break;
case 'device_mapping':
getDeviceMapping();
break;
case 'system_health':
getSystemHealth();
break;
case 'restart_appliance':
restartAppliance();
break;
case 'shutdown_appliance':
shutdownAppliance();
break;
default:
echo json_encode(['success' => false, 'error' => 'Unknown action']);
}
@@ -652,4 +738,201 @@ function bulkDeleteTapes($pattern) {
]);
}
}
// ============================================
// System Health & Management Functions
// ============================================
function getSystemHealth() {
$health = [];
// Check services
$services = ['mhvtl', 'apache2', 'tgt'];
$health['services'] = [];
foreach ($services as $service) {
$output = [];
$returnCode = 0;
exec("systemctl is-active $service 2>&1", $output, $returnCode);
$isActive = ($returnCode === 0 && trim($output[0]) === 'active');
// Get enabled status
$enabledOutput = [];
$enabledCode = 0;
exec("systemctl is-enabled $service 2>&1", $enabledOutput, $enabledCode);
$isEnabled = ($enabledCode === 0 && trim($enabledOutput[0]) === 'enabled');
$health['services'][$service] = [
'running' => $isActive,
'enabled' => $isEnabled,
'status' => $isActive ? 'running' : 'stopped'
];
}
// Check components
$health['components'] = [];
// vtltape processes
$output = [];
exec("pgrep -f 'vtltape' | wc -l", $output);
$vtltapeCount = intval($output[0]);
$health['components']['vtltape'] = [
'running' => $vtltapeCount > 0,
'count' => $vtltapeCount
];
// vtllibrary process
$output = [];
$returnCode = 0;
exec("pgrep -f 'vtllibrary' 2>&1", $output, $returnCode);
$health['components']['vtllibrary'] = [
'running' => $returnCode === 0
];
// Check SCSI devices
$health['devices'] = [];
// Library
$output = [];
exec("lsscsi -g 2>/dev/null | grep mediumx", $output);
$health['devices']['library'] = [
'detected' => count($output) > 0,
'info' => count($output) > 0 ? $output[0] : null
];
// Tape drives
$output = [];
exec("lsscsi -g 2>/dev/null | grep tape", $output);
$health['devices']['drives'] = [
'detected' => count($output) > 0,
'count' => count($output),
'list' => $output
];
// Calculate overall health score
$totalChecks = 0;
$passedChecks = 0;
foreach ($health['services'] as $service) {
$totalChecks++;
if ($service['running']) $passedChecks++;
}
if ($health['components']['vtltape']['running']) $passedChecks++;
$totalChecks++;
if ($health['components']['vtllibrary']['running']) $passedChecks++;
$totalChecks++;
if ($health['devices']['library']['detected']) $passedChecks++;
$totalChecks++;
if ($health['devices']['drives']['detected']) $passedChecks++;
$totalChecks++;
$percentage = $totalChecks > 0 ? round(($passedChecks / $totalChecks) * 100) : 0;
if ($percentage == 100) {
$status = 'healthy';
$message = 'All systems operational';
} elseif ($percentage >= 66) {
$status = 'degraded';
$message = 'Some components need attention';
} else {
$status = 'critical';
$message = 'Multiple components offline';
}
$health['overall'] = [
'status' => $status,
'message' => $message,
'score' => $passedChecks,
'total' => $totalChecks,
'percentage' => $percentage
];
// System info
$output = [];
exec("uptime -p 2>/dev/null || uptime", $output);
$health['system'] = [
'uptime' => isset($output[0]) ? $output[0] : 'Unknown'
];
echo json_encode([
'success' => true,
'health' => $health
]);
}
function restartAppliance() {
// Create a script to restart after a delay
$script = '#!/bin/bash
sleep 2
systemctl reboot
';
$scriptPath = '/tmp/restart-appliance.sh';
file_put_contents($scriptPath, $script);
chmod($scriptPath, 0755);
// Execute in background
exec("sudo $scriptPath > /dev/null 2>&1 &");
echo json_encode([
'success' => true,
'message' => 'System restart initiated. The appliance will reboot in a few seconds.'
]);
}
function shutdownAppliance() {
// Create a script to shutdown after a delay
$script = '#!/bin/bash
sleep 2
systemctl poweroff
';
$scriptPath = '/tmp/shutdown-appliance.sh';
file_put_contents($scriptPath, $script);
chmod($scriptPath, 0755);
// Execute in background
exec("sudo $scriptPath > /dev/null 2>&1 &");
echo json_encode([
'success' => true,
'message' => 'System shutdown initiated. The appliance will power off in a few seconds.'
]);
}
function getDeviceMapping() {
$output = [];
// Get all SCSI devices with generic device names (sg)
exec("lsscsi -g 2>&1", $output);
// Filter for interesting devices (mediumx and tape)
$devices = [];
foreach ($output as $line) {
// Parse the line to make it cleaner if needed, or just return raw lines
// Example line: [3:0:0:0] mediumx ADASTRA HEPHAESTUS-V 0107 - /dev/sg6
if (strpos($line, 'mediumx') !== false || strpos($line, 'tape') !== false) {
$parts = preg_split('/\s+/', $line);
$devices[] = [
'raw' => $line,
'scsi_id' => $parts[0] ?? '',
'type' => $parts[1] ?? '',
'vendor' => $parts[2] ?? '',
'model' => $parts[3] . (isset($parts[4]) && $parts[4] != '-' && !str_starts_with($parts[4], '/dev') ? ' ' . $parts[4] : '') ?? '',
'rev' => '', // specific parsing depends on varying output
'dev_path' => end($parts) // typically the last one is /dev/sgX
];
}
}
echo json_encode([
'success' => true,
'devices' => $devices,
'raw_output' => $output
]);
}
?>

312
dist/adastra-vtl-installer/web-ui/auth.php vendored Normal file
View File

@@ -0,0 +1,312 @@
<?php
/**
* Authentication and User Management
* Handles login, sessions, and user roles
*/
session_start();
// Configuration
$USERS_FILE = '/etc/mhvtl/users.json';
$SESSION_TIMEOUT = 3600; // 1 hour
// Initialize users file if it doesn't exist
function initializeUsersFile() {
global $USERS_FILE;
if (!file_exists($USERS_FILE)) {
// Create default admin user
$defaultUsers = [
[
'username' => 'admin',
'password' => password_hash('admin123', PASSWORD_BCRYPT),
'role' => 'admin',
'created' => date('Y-m-d H:i:s'),
'enabled' => true
]
];
file_put_contents($USERS_FILE, json_encode($defaultUsers, JSON_PRETTY_PRINT));
chmod($USERS_FILE, 0600);
}
}
// Load users from file
function loadUsers() {
global $USERS_FILE;
if (!file_exists($USERS_FILE)) {
initializeUsersFile();
}
$content = file_get_contents($USERS_FILE);
return json_decode($content, true) ?: [];
}
// Save users to file
function saveUsers($users) {
global $USERS_FILE;
file_put_contents($USERS_FILE, json_encode($users, JSON_PRETTY_PRINT));
chmod($USERS_FILE, 0600);
}
// Authenticate user
function authenticateUser($username, $password) {
$users = loadUsers();
foreach ($users as $user) {
if ($user['username'] === $username && $user['enabled']) {
if (password_verify($password, $user['password'])) {
// Set session
$_SESSION['user'] = [
'username' => $user['username'],
'role' => $user['role'],
'login_time' => time()
];
return true;
}
}
}
return false;
}
// Check if user is logged in
function isLoggedIn() {
global $SESSION_TIMEOUT;
if (!isset($_SESSION['user'])) {
return false;
}
// Check session timeout
if (time() - $_SESSION['user']['login_time'] > $SESSION_TIMEOUT) {
logout();
return false;
}
// Update last activity time
$_SESSION['user']['login_time'] = time();
return true;
}
// Check if user has admin role
function isAdmin() {
return isLoggedIn() && $_SESSION['user']['role'] === 'admin';
}
// Check if user has viewer role
function isViewer() {
return isLoggedIn() && $_SESSION['user']['role'] === 'viewer';
}
// Get current user
function getCurrentUser() {
return isset($_SESSION['user']) ? $_SESSION['user'] : null;
}
// Logout user
function logout() {
session_destroy();
$_SESSION = [];
}
// Require login
function requireLogin() {
if (!isLoggedIn()) {
http_response_code(401);
echo json_encode(['success' => false, 'error' => 'Unauthorized', 'redirect' => 'login.html']);
exit;
}
}
// Require admin role
function requireAdmin() {
requireLogin();
if (!isAdmin()) {
http_response_code(403);
echo json_encode(['success' => false, 'error' => 'Forbidden: Admin access required']);
exit;
}
}
// Get all users (admin only)
function getAllUsers() {
requireAdmin();
$users = loadUsers();
// Remove password hashes from response
$safeUsers = array_map(function($user) {
unset($user['password']);
return $user;
}, $users);
echo json_encode([
'success' => true,
'users' => array_values($safeUsers)
]);
}
// Create new user (admin only)
function createUser($data) {
requireAdmin();
$username = trim($data['username'] ?? '');
$password = $data['password'] ?? '';
$role = $data['role'] ?? 'viewer';
if (empty($username) || empty($password)) {
echo json_encode(['success' => false, 'error' => 'Username and password are required']);
return;
}
if (!in_array($role, ['admin', 'viewer'])) {
echo json_encode(['success' => false, 'error' => 'Invalid role']);
return;
}
$users = loadUsers();
// Check if username already exists
foreach ($users as $user) {
if ($user['username'] === $username) {
echo json_encode(['success' => false, 'error' => 'Username already exists']);
return;
}
}
// Create new user
$newUser = [
'username' => $username,
'password' => password_hash($password, PASSWORD_BCRYPT),
'role' => $role,
'created' => date('Y-m-d H:i:s'),
'enabled' => true
];
$users[] = $newUser;
saveUsers($users);
echo json_encode(['success' => true, 'message' => 'User created successfully']);
}
// Update user (admin only)
function updateUser($data) {
requireAdmin();
$username = trim($data['username'] ?? '');
$newPassword = $data['password'] ?? null;
$role = $data['role'] ?? null;
$enabled = $data['enabled'] ?? null;
if (empty($username)) {
echo json_encode(['success' => false, 'error' => 'Username is required']);
return;
}
$users = loadUsers();
$found = false;
foreach ($users as &$user) {
if ($user['username'] === $username) {
$found = true;
// Update password if provided
if ($newPassword) {
$user['password'] = password_hash($newPassword, PASSWORD_BCRYPT);
}
// Update role if provided
if ($role && in_array($role, ['admin', 'viewer'])) {
$user['role'] = $role;
}
// Update enabled status if provided
if ($enabled !== null) {
$user['enabled'] = (bool)$enabled;
}
break;
}
}
if (!$found) {
echo json_encode(['success' => false, 'error' => 'User not found']);
return;
}
saveUsers($users);
echo json_encode(['success' => true, 'message' => 'User updated successfully']);
}
// Delete user (admin only)
function deleteUser($username) {
requireAdmin();
if (empty($username)) {
echo json_encode(['success' => false, 'error' => 'Username is required']);
return;
}
// Prevent deleting yourself
if ($_SESSION['user']['username'] === $username) {
echo json_encode(['success' => false, 'error' => 'Cannot delete your own account']);
return;
}
$users = loadUsers();
$newUsers = array_filter($users, function($user) use ($username) {
return $user['username'] !== $username;
});
if (count($newUsers) === count($users)) {
echo json_encode(['success' => false, 'error' => 'User not found']);
return;
}
saveUsers(array_values($newUsers));
echo json_encode(['success' => true, 'message' => 'User deleted successfully']);
}
// Change own password
function changePassword($data) {
requireLogin();
$currentPassword = $data['current_password'] ?? '';
$newPassword = $data['new_password'] ?? '';
if (empty($currentPassword) || empty($newPassword)) {
echo json_encode(['success' => false, 'error' => 'Current and new password are required']);
return;
}
$users = loadUsers();
$currentUsername = $_SESSION['user']['username'];
foreach ($users as &$user) {
if ($user['username'] === $currentUsername) {
// Verify current password
if (!password_verify($currentPassword, $user['password'])) {
echo json_encode(['success' => false, 'error' => 'Current password is incorrect']);
return;
}
// Update password
$user['password'] = password_hash($newPassword, PASSWORD_BCRYPT);
saveUsers($users);
echo json_encode(['success' => true, 'message' => 'Password changed successfully']);
return;
}
}
echo json_encode(['success' => false, 'error' => 'User not found']);
}
// Initialize users file on first load
initializeUsersFile();
?>

162
dist/adastra-vtl-installer/web-ui/index.html vendored
View File

@@ -1,11 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>mhvtl Configuration Manager - Adastra VTL</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav class="navbar">
<div class="container">
@@ -14,17 +16,62 @@
<span class="subtitle">Virtual Tape Library Configuration</span>
</div>
<div class="nav-links">
<a href="#system" class="nav-link">System</a>
<a href="#library" class="nav-link active">Library</a>
<a href="#drives" class="nav-link">Drives</a>
<a href="#tapes" class="nav-link">Tapes</a>
<a href="#manage-tapes" class="nav-link">Manage Tapes</a>
<a href="#iscsi" class="nav-link">iSCSI</a>
<a href="#users" class="nav-link" id="users-tab">Users</a>
<a href="#export" class="nav-link">Export</a>
</div>
</div>
</nav>
<main class="container">
<section id="system" class="section">
<div class="section-header">
<h2>🖥️ System Monitoring & Management</h2>
<p>Monitor system health and manage appliance power</p>
</div>
<div class="card">
<div class="card-header">
<h3>💚 System Health Dashboard</h3>
<button class="btn btn-primary" onclick="refreshSystemHealth()">
<span>🔄</span> Refresh
</button>
</div>
<div class="card-body">
<div id="health-loading" style="display: none; text-align: center; padding: 2rem;">
<strong>⏳</strong> Loading system health...
</div>
<div id="health-dashboard">
<!-- Health dashboard will be populated here -->
</div>
</div>
</div>
<div class="card" style="margin-top: 1rem;">
<div class="card-header">
<h3>⚡ Power Management</h3>
</div>
<div class="card-body">
<p><strong>⚠️ Warning:</strong> These actions will affect the entire appliance.</p>
<div style="margin-top: 1rem;">
<button class="btn btn-warning" onclick="restartAppliance()" style="margin-right: 1rem;">
<span>🔄</span> Restart Appliance
</button>
<button class="btn btn-danger" onclick="shutdownAppliance()">
<span>⏻</span> Shutdown Appliance
</button>
</div>
<div id="power-result" class="alert" style="display: none; margin-top: 1rem;"></div>
</div>
</div>
</section>
<section id="library" class="section active">
<div class="section-header">
<h2>📚 Library Configuration</h2>
@@ -148,7 +195,8 @@
</div>
</div>
<div class="alert alert-info">
<strong>ℹ️ Info:</strong> Generate mktape commands for creating virtual tapes. Run these commands on the server after installation.
<strong>ℹ️ Info:</strong> Generate mktape commands for creating virtual tapes. Run these
commands on the server after installation.
</div>
</div>
</div>
@@ -228,13 +276,14 @@
</div>
<div id="tape-list-error" class="alert alert-danger" style="display: none;"></div>
<div id="tape-list-empty" class="alert alert-info" style="display: none;">
<strong>ℹ️</strong> No tape files found. Create tapes using the commands from the "Tapes" section.
<strong>ℹ️</strong> No tape files found. Create tapes using the commands from the "Tapes"
section.
</div>
<div id="tape-list-container" style="display: none;">
<div style="margin-bottom: 1rem;">
<input type="text" id="tape-search" placeholder="🔍 Search tapes..."
style="width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px;"
onkeyup="filterTapes()">
style="width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px;"
onkeyup="filterTapes()">
</div>
<table class="tape-table" id="tape-table">
<thead>
@@ -280,6 +329,24 @@
</div>
<div class="card">
<div class="card-header">
<h3>💾 Device Mapping</h3>
<button class="btn btn-primary" onclick="loadDeviceMapping()">
<span>🔄</span> Refresh
</button>
</div>
<div class="card-body">
<p>Current SCSI devices available for iSCSI export:</p>
<div id="device-mapping-loading" style="display: none; text-align: center; padding: 2rem;">
<strong>⏳</strong> Loading device mapping...
</div>
<div id="device-mapping">
<!-- Device mapping will be populated here -->
</div>
</div>
</div>
<div class="card" style="margin-top: 1rem;">
<div class="card-header">
<h3>🎯 iSCSI Targets</h3>
<button class="btn btn-primary" onclick="loadTargets()">
@@ -388,6 +455,90 @@
</div>
</section>
<section id="users" class="section">
<div class="section-header">
<h2>👥 User Management</h2>
<p>Manage user accounts and permissions (Admin Only)</p>
</div>
<div class="card">
<div class="card-header">
<h3>📋 User List</h3>
<button class="btn btn-primary" onclick="loadUsers()">
<span>🔄</span> Refresh
</button>
</div>
<div class="card-body">
<div id="users-loading" style="display: none; text-align: center; padding: 2rem;">
<strong>⏳</strong> Loading users...
</div>
<div id="users-list">
<!-- Users will be populated here -->
</div>
</div>
</div>
<div class="card" style="margin-top: 1rem;">
<div class="card-header">
<h3>➕ Create New User</h3>
</div>
<div class="card-body">
<div class="form-grid">
<div class="form-group">
<label for="new-username">Username</label>
<input type="text" id="new-username" placeholder="Enter username" required>
</div>
<div class="form-group">
<label for="new-password">Password</label>
<input type="password" id="new-password" placeholder="Enter password" required>
</div>
<div class="form-group">
<label for="new-role">Role</label>
<select id="new-role">
<option value="viewer">Viewer (Read-Only)</option>
<option value="admin">Admin (Full Access)</option>
</select>
</div>
</div>
<div style="margin-top: 1rem;">
<button class="btn btn-success" onclick="createNewUser()">
<span>➕</span> Create User
</button>
</div>
<div id="create-user-result" class="alert" style="display: none; margin-top: 1rem;"></div>
</div>
</div>
<div class="card" style="margin-top: 1rem;">
<div class="card-header">
<h3>🔑 Change Password</h3>
</div>
<div class="card-body">
<p>Change your own password</p>
<div class="form-grid">
<div class="form-group">
<label for="current-password">Current Password</label>
<input type="password" id="current-password" required>
</div>
<div class="form-group">
<label for="new-user-password">New Password</label>
<input type="password" id="new-user-password" required>
</div>
<div class="form-group">
<label for="confirm-password">Confirm New Password</label>
<input type="password" id="confirm-password" required>
</div>
</div>
<div style="margin-top: 1rem;">
<button class="btn btn-warning" onclick="changeUserPassword()">
<span>🔑</span> Change Password
</button>
</div>
<div id="change-password-result" class="alert" style="display: none; margin-top: 1rem;"></div>
</div>
</div>
</section>
<section id="export" class="section">
<div class="section-header">
<h2>📤 Export Configuration</h2>
@@ -455,4 +606,5 @@
<script src="script.js"></script>
</body>
</html>
</html>

276
dist/adastra-vtl-installer/web-ui/login.html vendored Normal file
View File

@@ -0,0 +1,276 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login - Adastra VTL</title>
<link rel="stylesheet" href="style.css">
<style>
body {
display: flex;
align-items: center;
justify-content: center;
min-height: 100vh;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.login-container {
background: white;
border-radius: 12px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
padding: 3rem;
width: 100%;
max-width: 400px;
}
.login-header {
text-align: center;
margin-bottom: 2rem;
}
.login-header h1 {
margin: 0 0 0.5rem 0;
color: #333;
font-size: 2rem;
}
.login-header p {
margin: 0;
color: #666;
font-size: 0.9rem;
}
.login-form {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
.form-group {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.form-group label {
font-weight: 600;
color: #333;
font-size: 0.9rem;
}
.form-group input {
padding: 0.75rem 1rem;
border: 2px solid #e0e0e0;
border-radius: 8px;
font-size: 1rem;
transition: all 0.3s ease;
}
.form-group input:focus {
outline: none;
border-color: #667eea;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
.btn-login {
padding: 0.875rem 1.5rem;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border: none;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-login:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3);
}
.btn-login:active {
transform: translateY(0);
}
.btn-login:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
}
.alert {
padding: 1rem;
border-radius: 8px;
margin-bottom: 1rem;
display: none;
}
.alert-danger {
background: #fee;
border: 1px solid #fcc;
color: #c33;
}
.alert-info {
background: #e7f3ff;
border: 1px solid #b3d9ff;
color: #004085;
}
.default-credentials {
margin-top: 2rem;
padding: 1rem;
background: #f8f9fa;
border-radius: 8px;
font-size: 0.85rem;
color: #666;
}
.default-credentials strong {
color: #333;
}
.loading-spinner {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-top-color: white;
border-radius: 50%;
animation: spin 0.6s linear infinite;
margin-right: 0.5rem;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
</style>
</head>
<body>
<div class="login-container">
<div class="login-header">
<h1>🎞️ Adastra VTL</h1>
<p>Virtual Tape Library Management</p>
</div>
<div id="login-alert" class="alert"></div>
<form class="login-form" onsubmit="handleLogin(event)">
<div class="form-group">
<label for="username">Username</label>
<input type="text" id="username" name="username" required autofocus>
</div>
<div class="form-group">
<label for="password">Password</label>
<input type="password" id="password" name="password" required>
</div>
<button type="submit" class="btn-login" id="login-btn">
Sign In
</button>
</form>
<div class="default-credentials">
<strong>🔑 Default Credentials:</strong><br>
Username: <code>admin</code><br>
Password: <code>admin123</code><br>
<small>Please change the default password after first login.</small>
</div>
</div>
<script>
async function handleLogin(event) {
event.preventDefault();
const username = document.getElementById('username').value;
const password = document.getElementById('password').value;
const loginBtn = document.getElementById('login-btn');
const alertDiv = document.getElementById('login-alert');
// Disable button and show loading
loginBtn.disabled = true;
loginBtn.innerHTML = '<span class="loading-spinner"></span> Signing in...';
alertDiv.style.display = 'none';
try {
const response = await fetch('api.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
action: 'login',
username: username,
password: password
})
});
const data = await response.json();
if (data.success) {
// Show success message
alertDiv.className = 'alert alert-info';
alertDiv.style.display = 'block';
alertDiv.innerHTML = '<strong>✅ Success!</strong> Redirecting...';
// Redirect to main page
setTimeout(() => {
window.location.href = 'index.html';
}, 500);
} else {
// Show error message
alertDiv.className = 'alert alert-danger';
alertDiv.style.display = 'block';
alertDiv.innerHTML = '<strong>❌ Error:</strong> ' + (data.error || 'Login failed');
// Re-enable button
loginBtn.disabled = false;
loginBtn.innerHTML = 'Sign In';
// Clear password field
document.getElementById('password').value = '';
document.getElementById('password').focus();
}
} catch (error) {
alertDiv.className = 'alert alert-danger';
alertDiv.style.display = 'block';
alertDiv.innerHTML = '<strong>❌ Error:</strong> ' + error.message;
loginBtn.disabled = false;
loginBtn.innerHTML = 'Sign In';
}
}
// Check if already logged in
window.addEventListener('DOMContentLoaded', async () => {
try {
const response = await fetch('api.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
action: 'check_session'
})
});
const data = await response.json();
if (data.success && data.logged_in) {
// Already logged in, redirect to main page
window.location.href = 'index.html';
}
} catch (error) {
console.error('Session check failed:', error);
}
});
</script>
</body>
</html>

1439
dist/adastra-vtl-installer/web-ui/script.js vendored
View File

File diff suppressed because it is too large Load Diff