More towards the roadmap
This commit is contained in:
+298
@@ -0,0 +1,298 @@
|
|||||||
|
# PacCrypt Security Features 🔒
|
||||||
|
|
||||||
|
This document outlines the security enhancements added to PacCrypt, including setup instructions and configuration options.
|
||||||
|
|
||||||
|
## 🚀 New Security Features
|
||||||
|
|
||||||
|
### 1. Rate Limiting
|
||||||
|
- **API Endpoints**: Prevents abuse with configurable rate limits
|
||||||
|
- **Default Limits**:
|
||||||
|
- `/api/algorithms`: 100 requests/minute
|
||||||
|
- `/api/encrypt`, `/api/decrypt`: 30 requests/minute
|
||||||
|
- `/api/generate-keypair`: 10 requests/minute
|
||||||
|
- `/api/pacshare`: 10 requests/minute
|
||||||
|
- Global default: 1000 requests/hour
|
||||||
|
|
||||||
|
### 2. Session Timeout
|
||||||
|
- **Admin Sessions**: Automatic timeout after configurable period (default: 30 minutes)
|
||||||
|
- **Security**: Sessions are cleared and require re-authentication
|
||||||
|
- **Logging**: Session timeouts are logged for audit purposes
|
||||||
|
|
||||||
|
### 3. File Virus Scanning
|
||||||
|
- **Integration**: ClamAV antivirus scanning before encryption
|
||||||
|
- **Automatic**: All uploaded files are scanned
|
||||||
|
- **Logging**: Scan results and virus detections are logged
|
||||||
|
- **Graceful Degradation**: If ClamAV is unavailable, scanning is skipped with warning
|
||||||
|
|
||||||
|
### 4. IP Whitelisting
|
||||||
|
- **Admin Access**: Restrict admin panel access to specific IP addresses
|
||||||
|
- **CIDR Support**: Supports both single IPs and CIDR notation (e.g., `192.168.1.0/24`)
|
||||||
|
- **Flexible**: Empty whitelist allows all IPs (default behavior)
|
||||||
|
- **Logging**: Unauthorized access attempts are logged
|
||||||
|
|
||||||
|
### 5. Enhanced Audit Logging
|
||||||
|
- **Encrypted Logs**: All admin actions are encrypted and logged
|
||||||
|
- **Comprehensive**: Login attempts, file operations, security events
|
||||||
|
- **IP Tracking**: Source IP addresses are logged for security monitoring
|
||||||
|
|
||||||
|
## 🛠️ Installation & Setup
|
||||||
|
|
||||||
|
### Prerequisites
|
||||||
|
```bash
|
||||||
|
# Update package lists
|
||||||
|
sudo apt update
|
||||||
|
|
||||||
|
# Install Python dependencies
|
||||||
|
pip install -r application_data/requirements.txt
|
||||||
|
```
|
||||||
|
|
||||||
|
### ClamAV Setup (Required for Virus Scanning)
|
||||||
|
|
||||||
|
#### Ubuntu/Debian:
|
||||||
|
```bash
|
||||||
|
# Install ClamAV
|
||||||
|
sudo apt install clamav clamav-daemon
|
||||||
|
|
||||||
|
# Update virus definitions
|
||||||
|
sudo freshclam
|
||||||
|
|
||||||
|
# Start ClamAV daemon
|
||||||
|
sudo systemctl start clamav-daemon
|
||||||
|
sudo systemctl enable clamav-daemon
|
||||||
|
|
||||||
|
# Verify installation
|
||||||
|
sudo systemctl status clamav-daemon
|
||||||
|
```
|
||||||
|
|
||||||
|
#### CentOS/RHEL:
|
||||||
|
```bash
|
||||||
|
# Install EPEL repository
|
||||||
|
sudo yum install epel-release
|
||||||
|
|
||||||
|
# Install ClamAV
|
||||||
|
sudo yum install clamav clamav-server clamav-update
|
||||||
|
|
||||||
|
# Update virus definitions
|
||||||
|
sudo freshclam
|
||||||
|
|
||||||
|
# Start services
|
||||||
|
sudo systemctl start clamd@scan
|
||||||
|
sudo systemctl enable clamd@scan
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Manual Configuration:
|
||||||
|
If ClamAV fails to start, you may need to configure it manually:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Edit configuration
|
||||||
|
sudo nano /etc/clamav/clamd.conf
|
||||||
|
|
||||||
|
# Remove or comment out the "Example" line
|
||||||
|
# Example
|
||||||
|
|
||||||
|
# Set socket permissions
|
||||||
|
sudo chown clamav:clamav /var/run/clamav/clamd.ctl
|
||||||
|
sudo chmod 666 /var/run/clamav/clamd.ctl
|
||||||
|
|
||||||
|
# Restart daemon
|
||||||
|
sudo systemctl restart clamav-daemon
|
||||||
|
```
|
||||||
|
|
||||||
|
### Testing ClamAV Integration
|
||||||
|
```bash
|
||||||
|
# Test if ClamAV is working
|
||||||
|
clamscan --version
|
||||||
|
|
||||||
|
# Test daemon connection
|
||||||
|
clamdscan --version
|
||||||
|
|
||||||
|
# Test with EICAR test file (harmless test virus)
|
||||||
|
echo 'X5O!P%@AP[4\PZX54(P^)7CC)7}$EICAR-STANDARD-ANTIVIRUS-TEST-FILE!$H+H*' > /tmp/eicar.txt
|
||||||
|
clamscan /tmp/eicar.txt
|
||||||
|
```
|
||||||
|
|
||||||
|
## ⚙️ Configuration
|
||||||
|
|
||||||
|
### Admin Settings Panel
|
||||||
|
Access the admin settings at `/admin-settings` to configure:
|
||||||
|
|
||||||
|
1. **Session Timeout**: Set admin session timeout (minutes)
|
||||||
|
2. **Virus Scanning**: Enable/disable ClamAV scanning
|
||||||
|
3. **IP Whitelist**: Configure allowed admin IP addresses
|
||||||
|
4. **File Limits**: Upload size and retention settings
|
||||||
|
|
||||||
|
### Manual Configuration
|
||||||
|
Edit `application_data/settings.json`:
|
||||||
|
|
||||||
|
```json
|
||||||
|
{
|
||||||
|
"upload_folder": "pacshare",
|
||||||
|
"max_file_age_days": 14,
|
||||||
|
"max_file_size_bytes": 26843545600,
|
||||||
|
"admin_ip_whitelist": [
|
||||||
|
"192.168.1.100",
|
||||||
|
"10.0.0.0/8",
|
||||||
|
"127.0.0.1"
|
||||||
|
],
|
||||||
|
"virus_scanning_enabled": true,
|
||||||
|
"session_timeout_minutes": 30,
|
||||||
|
"rate_limit_per_minute": 60,
|
||||||
|
"rate_limit_per_hour": 1000
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### IP Whitelist Examples
|
||||||
|
```json
|
||||||
|
"admin_ip_whitelist": [
|
||||||
|
"127.0.0.1", // Local access only
|
||||||
|
"192.168.1.100", // Specific IP
|
||||||
|
"192.168.1.0/24", // Local network
|
||||||
|
"10.0.0.0/8", // Private network range
|
||||||
|
"203.0.113.0/24" // Public IP range
|
||||||
|
]
|
||||||
|
```
|
||||||
|
|
||||||
|
## 🔍 Security Monitoring
|
||||||
|
|
||||||
|
### Log Files
|
||||||
|
- **Admin Logs**: `application_data/admin_logs.enc` (encrypted)
|
||||||
|
- **Application Logs**: Check console output for security events
|
||||||
|
|
||||||
|
### Key Events Logged
|
||||||
|
- Admin login/logout attempts
|
||||||
|
- Session timeouts
|
||||||
|
- IP whitelist violations
|
||||||
|
- Virus scan results
|
||||||
|
- File upload/download activities
|
||||||
|
- Rate limit violations
|
||||||
|
|
||||||
|
### Viewing Admin Logs
|
||||||
|
Access encrypted logs via the admin panel at `/admin-logs` or programmatically:
|
||||||
|
|
||||||
|
```python
|
||||||
|
# Example: View recent security events
|
||||||
|
key = load_admin_key()
|
||||||
|
cipher = Fernet(key)
|
||||||
|
with open('application_data/admin_logs.enc', 'rb') as f:
|
||||||
|
for line in f:
|
||||||
|
if line.strip():
|
||||||
|
decrypted = cipher.decrypt(line.strip())
|
||||||
|
print(decrypted.decode())
|
||||||
|
```
|
||||||
|
|
||||||
|
## 🚨 Security Best Practices
|
||||||
|
|
||||||
|
### 1. Regular Updates
|
||||||
|
```bash
|
||||||
|
# Update virus definitions
|
||||||
|
sudo freshclam
|
||||||
|
|
||||||
|
# Update Python dependencies
|
||||||
|
pip install --upgrade -r application_data/requirements.txt
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. Firewall Configuration
|
||||||
|
```bash
|
||||||
|
# UFW example - restrict admin access
|
||||||
|
sudo ufw allow from 192.168.1.0/24 to any port 5000
|
||||||
|
sudo ufw deny 5000
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3. HTTPS Configuration
|
||||||
|
Always use HTTPS in production. Example nginx config:
|
||||||
|
|
||||||
|
```nginx
|
||||||
|
server {
|
||||||
|
listen 443 ssl http2;
|
||||||
|
server_name your-domain.com;
|
||||||
|
|
||||||
|
# Rate limiting
|
||||||
|
limit_req_zone $binary_remote_addr zone=api:10m rate=10r/m;
|
||||||
|
|
||||||
|
location /api/ {
|
||||||
|
limit_req zone=api burst=5 nodelay;
|
||||||
|
proxy_pass http://127.0.0.1:5000;
|
||||||
|
}
|
||||||
|
|
||||||
|
location /admin {
|
||||||
|
# Additional admin restrictions
|
||||||
|
allow 192.168.1.0/24;
|
||||||
|
deny all;
|
||||||
|
proxy_pass http://127.0.0.1:5000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. Regular Security Audits
|
||||||
|
- Review admin logs regularly
|
||||||
|
- Monitor rate limit violations
|
||||||
|
- Check for unauthorized access attempts
|
||||||
|
- Verify virus scan effectiveness
|
||||||
|
|
||||||
|
## 🐛 Troubleshooting
|
||||||
|
|
||||||
|
### ClamAV Issues
|
||||||
|
```bash
|
||||||
|
# Check ClamAV status
|
||||||
|
sudo systemctl status clamav-daemon
|
||||||
|
|
||||||
|
# View ClamAV logs
|
||||||
|
sudo journalctl -u clamav-daemon
|
||||||
|
|
||||||
|
# Test socket connection
|
||||||
|
sudo -u clamav clamdscan --ping
|
||||||
|
|
||||||
|
# Manual socket creation
|
||||||
|
sudo mkdir -p /var/run/clamav
|
||||||
|
sudo chown clamav:clamav /var/run/clamav
|
||||||
|
```
|
||||||
|
|
||||||
|
### Rate Limiting Issues
|
||||||
|
- Check if requests are being properly limited
|
||||||
|
- Verify Flask-Limiter configuration
|
||||||
|
- Monitor application logs for rate limit errors
|
||||||
|
|
||||||
|
### Session Timeout Issues
|
||||||
|
- Verify session configuration in settings
|
||||||
|
- Check if `session.permanent = True` is set
|
||||||
|
- Ensure proper timezone handling
|
||||||
|
|
||||||
|
### IP Whitelist Issues
|
||||||
|
- Verify IP address format (CIDR notation)
|
||||||
|
- Check if client IP is correctly detected
|
||||||
|
- Consider proxy/load balancer IP forwarding
|
||||||
|
|
||||||
|
## 📋 Security Checklist
|
||||||
|
|
||||||
|
- [ ] ClamAV installed and running
|
||||||
|
- [ ] Virus definitions up to date
|
||||||
|
- [ ] Admin IP whitelist configured
|
||||||
|
- [ ] Session timeout configured
|
||||||
|
- [ ] Rate limiting tested
|
||||||
|
- [ ] HTTPS enabled in production
|
||||||
|
- [ ] Firewall rules configured
|
||||||
|
- [ ] Regular log monitoring set up
|
||||||
|
- [ ] Backup procedures for encrypted logs
|
||||||
|
- [ ] Security update schedule established
|
||||||
|
|
||||||
|
## 🔗 Related Documentation
|
||||||
|
|
||||||
|
- [Main README](README.md) - General installation and usage
|
||||||
|
- [API Documentation](API.md) - API endpoint details
|
||||||
|
- [Roadmap](ROADMAP.md) - Future security enhancements
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
**⚠️ Important Security Notes:**
|
||||||
|
|
||||||
|
1. **Default Configuration**: By default, IP whitelisting is disabled (empty list). Configure it for production use.
|
||||||
|
|
||||||
|
2. **ClamAV Dependency**: Virus scanning requires ClamAV. If not installed, scanning is skipped with warnings.
|
||||||
|
|
||||||
|
3. **Rate Limiting**: Default limits are conservative. Adjust based on your usage patterns.
|
||||||
|
|
||||||
|
4. **Log Encryption**: Admin logs are encrypted with the same key as admin credentials. Backup this key securely.
|
||||||
|
|
||||||
|
5. **Session Security**: Sessions use Flask's built-in session management. Consider Redis for distributed deployments.
|
||||||
|
|
||||||
|
For security questions or issues, please refer to the GitHub Issues page.
|
||||||
@@ -13,6 +13,12 @@ import sys
|
|||||||
import psutil
|
import psutil
|
||||||
from flask_cors import CORS
|
from flask_cors import CORS
|
||||||
from io import BytesIO
|
from io import BytesIO
|
||||||
|
import ipaddress
|
||||||
|
from functools import wraps
|
||||||
|
import time
|
||||||
|
from collections import defaultdict
|
||||||
|
from datetime import datetime, timedelta
|
||||||
|
import clamd
|
||||||
|
|
||||||
# ===== Third-Party Imports =====
|
# ===== Third-Party Imports =====
|
||||||
from flask import (
|
from flask import (
|
||||||
@@ -27,6 +33,8 @@ from cryptography.fernet import Fernet
|
|||||||
import pyotp
|
import pyotp
|
||||||
import qrcode
|
import qrcode
|
||||||
from io import BytesIO
|
from io import BytesIO
|
||||||
|
from flask_limiter import Limiter
|
||||||
|
from flask_limiter.util import get_remote_address
|
||||||
|
|
||||||
# ===== PacCrypt Algorithm Imports =====
|
# ===== PacCrypt Algorithm Imports =====
|
||||||
from paccrypt_algos import aes_cbc, aes_gcm, xchacha, rsa_hybrid
|
from paccrypt_algos import aes_cbc, aes_gcm, xchacha, rsa_hybrid
|
||||||
@@ -37,6 +45,16 @@ app = Flask(__name__)
|
|||||||
app.secret_key = os.getenv("FLASK_SECRET", os.urandom(24))
|
app.secret_key = os.getenv("FLASK_SECRET", os.urandom(24))
|
||||||
CORS(app, origins=["https://pdf.unnaturalll.dev"])
|
CORS(app, origins=["https://pdf.unnaturalll.dev"])
|
||||||
|
|
||||||
|
# Initialize rate limiter
|
||||||
|
limiter = Limiter(
|
||||||
|
key_func=get_remote_address,
|
||||||
|
default_limits=["1000 per hour"]
|
||||||
|
)
|
||||||
|
limiter.init_app(app)
|
||||||
|
|
||||||
|
# Session timeout configuration
|
||||||
|
app.permanent_session_lifetime = timedelta(minutes=30) # 30 minute timeout
|
||||||
|
|
||||||
# ===== Constants =====
|
# ===== Constants =====
|
||||||
ADMIN_CRED_FILE = 'application_data/admin_creds.json'
|
ADMIN_CRED_FILE = 'application_data/admin_creds.json'
|
||||||
ADMIN_KEY_FILE = 'application_data/admin_key.key'
|
ADMIN_KEY_FILE = 'application_data/admin_key.key'
|
||||||
@@ -46,7 +64,12 @@ SETTINGS_FILE = 'application_data/settings.json'
|
|||||||
DEFAULT_SETTINGS = {
|
DEFAULT_SETTINGS = {
|
||||||
"upload_folder": "pacshare",
|
"upload_folder": "pacshare",
|
||||||
"max_file_age_days": 14,
|
"max_file_age_days": 14,
|
||||||
"max_file_size_bytes": 25 * 1024 * 1024 * 1024 # 25GB
|
"max_file_size_bytes": 25 * 1024 * 1024 * 1024, # 25GB
|
||||||
|
"admin_ip_whitelist": [], # Empty list means all IPs allowed
|
||||||
|
"virus_scanning_enabled": True,
|
||||||
|
"session_timeout_minutes": 30,
|
||||||
|
"rate_limit_per_minute": 60,
|
||||||
|
"rate_limit_per_hour": 1000
|
||||||
}
|
}
|
||||||
|
|
||||||
# ===== Available Encryption Algorithms =====
|
# ===== Available Encryption Algorithms =====
|
||||||
@@ -228,6 +251,89 @@ def log_admin_event(message: str):
|
|||||||
except Exception as e:
|
except Exception as e:
|
||||||
print("[ERROR] Failed to write admin log:", e)
|
print("[ERROR] Failed to write admin log:", e)
|
||||||
|
|
||||||
|
# ===== Security Functions =====
|
||||||
|
def check_ip_whitelist(ip_address):
|
||||||
|
"""Check if IP address is in admin whitelist."""
|
||||||
|
whitelist = settings.get("admin_ip_whitelist", [])
|
||||||
|
if not whitelist: # Empty list means all IPs allowed
|
||||||
|
return True
|
||||||
|
|
||||||
|
try:
|
||||||
|
client_ip = ipaddress.ip_address(ip_address)
|
||||||
|
for allowed_ip in whitelist:
|
||||||
|
if '/' in allowed_ip: # CIDR notation
|
||||||
|
if client_ip in ipaddress.ip_network(allowed_ip, strict=False):
|
||||||
|
return True
|
||||||
|
else: # Single IP
|
||||||
|
if client_ip == ipaddress.ip_address(allowed_ip):
|
||||||
|
return True
|
||||||
|
return False
|
||||||
|
except ValueError:
|
||||||
|
return False
|
||||||
|
|
||||||
|
def admin_required(f):
|
||||||
|
"""Decorator to require admin authentication and IP whitelist check."""
|
||||||
|
@wraps(f)
|
||||||
|
def decorated_function(*args, **kwargs):
|
||||||
|
# Check session timeout
|
||||||
|
if 'admin_logged_in' not in session:
|
||||||
|
return redirect(url_for('admin_login'))
|
||||||
|
|
||||||
|
# Check if session has expired
|
||||||
|
if 'login_time' in session:
|
||||||
|
login_time = datetime.fromisoformat(session['login_time'])
|
||||||
|
if datetime.now() - login_time > timedelta(minutes=settings.get("session_timeout_minutes", 30)):
|
||||||
|
session.clear()
|
||||||
|
log_admin_event(f"Session expired for IP {request.remote_addr}")
|
||||||
|
return redirect(url_for('admin_login'))
|
||||||
|
|
||||||
|
# Check IP whitelist
|
||||||
|
if not check_ip_whitelist(request.remote_addr):
|
||||||
|
log_admin_event(f"Unauthorized IP access attempt: {request.remote_addr}")
|
||||||
|
return jsonify({"error": "Access denied: IP not whitelisted"}), 403
|
||||||
|
|
||||||
|
return f(*args, **kwargs)
|
||||||
|
return decorated_function
|
||||||
|
|
||||||
|
def scan_file_for_viruses(file_path):
|
||||||
|
"""Scan file for viruses using ClamAV."""
|
||||||
|
if not settings.get("virus_scanning_enabled", True):
|
||||||
|
return True, "Virus scanning disabled"
|
||||||
|
|
||||||
|
try:
|
||||||
|
cd = clamd.ClamdUnixSocket()
|
||||||
|
# Test connection
|
||||||
|
cd.ping()
|
||||||
|
|
||||||
|
# Scan file
|
||||||
|
result = cd.scan(file_path)
|
||||||
|
if result is None:
|
||||||
|
return True, "File is clean"
|
||||||
|
|
||||||
|
# If infected
|
||||||
|
for file, status in result.items():
|
||||||
|
if status[0] == 'FOUND':
|
||||||
|
return False, f"Virus detected: {status[1]}"
|
||||||
|
|
||||||
|
return True, "File is clean"
|
||||||
|
|
||||||
|
except clamd.ConnectionError:
|
||||||
|
# ClamAV daemon not running
|
||||||
|
log_admin_event("ClamAV daemon not available - virus scanning skipped")
|
||||||
|
return True, "ClamAV not available - scan skipped"
|
||||||
|
except Exception as e:
|
||||||
|
log_admin_event(f"Virus scan error: {str(e)}")
|
||||||
|
return True, f"Scan error: {str(e)}"
|
||||||
|
|
||||||
|
def check_session_timeout():
|
||||||
|
"""Check if admin session has timed out."""
|
||||||
|
if 'admin_logged_in' in session and 'login_time' in session:
|
||||||
|
login_time = datetime.fromisoformat(session['login_time'])
|
||||||
|
if datetime.now() - login_time > timedelta(minutes=settings.get("session_timeout_minutes", 30)):
|
||||||
|
session.clear()
|
||||||
|
return True
|
||||||
|
return False
|
||||||
|
|
||||||
# ===== File Management =====
|
# ===== File Management =====
|
||||||
def cleanup_expired_files():
|
def cleanup_expired_files():
|
||||||
"""Remove files older than MAX_FILE_AGE_DAYS."""
|
"""Remove files older than MAX_FILE_AGE_DAYS."""
|
||||||
@@ -284,6 +390,15 @@ def handle_file_upload(request):
|
|||||||
temp_path = os.path.join(UPLOAD_FOLDER, filename)
|
temp_path = os.path.join(UPLOAD_FOLDER, filename)
|
||||||
file.save(temp_path)
|
file.save(temp_path)
|
||||||
|
|
||||||
|
# Virus scan the uploaded file
|
||||||
|
is_clean, scan_message = scan_file_for_viruses(temp_path)
|
||||||
|
if not is_clean:
|
||||||
|
os.remove(temp_path) # Remove infected file
|
||||||
|
log_admin_event(f"Virus detected in upload: {filename} - {scan_message}")
|
||||||
|
return jsonify({"error": f"File rejected: {scan_message}"}), 400
|
||||||
|
|
||||||
|
log_admin_event(f"File uploaded and scanned: {filename} - {scan_message}")
|
||||||
|
|
||||||
try:
|
try:
|
||||||
# Use the selected algorithm for encryption
|
# Use the selected algorithm for encryption
|
||||||
module = algo_config["module"]
|
module = algo_config["module"]
|
||||||
@@ -477,6 +592,7 @@ def handle_file_pickup(request, meta_path, enc_path, file_id):
|
|||||||
|
|
||||||
# ===== 2FA QR Code Routes =====
|
# ===== 2FA QR Code Routes =====
|
||||||
@app.route("/admin-qr")
|
@app.route("/admin-qr")
|
||||||
|
@admin_required
|
||||||
def admin_qr_code():
|
def admin_qr_code():
|
||||||
"""Generate QR code for admin 2FA setup."""
|
"""Generate QR code for admin 2FA setup."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -554,6 +670,7 @@ def generate_qr_code(file_id):
|
|||||||
|
|
||||||
# ===== Admin Routes =====
|
# ===== Admin Routes =====
|
||||||
@app.route("/admin-logs")
|
@app.route("/admin-logs")
|
||||||
|
@admin_required
|
||||||
def admin_logs():
|
def admin_logs():
|
||||||
"""View admin activity logs."""
|
"""View admin activity logs."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -579,11 +696,9 @@ def admin_logs():
|
|||||||
return jsonify(logs=logs)
|
return jsonify(logs=logs)
|
||||||
|
|
||||||
@app.route("/admin-settings", methods=["GET", "POST"])
|
@app.route("/admin-settings", methods=["GET", "POST"])
|
||||||
|
@admin_required
|
||||||
def admin_settings():
|
def admin_settings():
|
||||||
"""Manage application settings."""
|
"""Manage application settings."""
|
||||||
if not session.get("admin_logged_in"):
|
|
||||||
return redirect(url_for("admin_login"))
|
|
||||||
|
|
||||||
current_settings = load_settings()
|
current_settings = load_settings()
|
||||||
|
|
||||||
if request.method == 'POST':
|
if request.method == 'POST':
|
||||||
@@ -597,10 +712,23 @@ def handle_settings_update(request, current_settings):
|
|||||||
max_file_size_gb = float(request.form.get('max_file_size_gb', current_settings.get('max_file_size_bytes', 25 * 1024 * 1024 * 1024) / (1024 * 1024 * 1024)))
|
max_file_size_gb = float(request.form.get('max_file_size_gb', current_settings.get('max_file_size_bytes', 25 * 1024 * 1024 * 1024) / (1024 * 1024 * 1024)))
|
||||||
max_file_size_bytes = int(max_file_size_gb * 1024 * 1024 * 1024)
|
max_file_size_bytes = int(max_file_size_gb * 1024 * 1024 * 1024)
|
||||||
|
|
||||||
|
# Security settings
|
||||||
|
session_timeout_minutes = int(request.form.get('session_timeout_minutes', current_settings.get('session_timeout_minutes', 30)))
|
||||||
|
virus_scanning_enabled = request.form.get('virus_scanning_enabled') == 'on'
|
||||||
|
|
||||||
|
# IP whitelist (one per line)
|
||||||
|
ip_whitelist_text = request.form.get('admin_ip_whitelist', '')
|
||||||
|
admin_ip_whitelist = [ip.strip() for ip in ip_whitelist_text.split('\n') if ip.strip()]
|
||||||
|
|
||||||
updated_settings = {
|
updated_settings = {
|
||||||
"upload_folder": upload_folder,
|
"upload_folder": upload_folder,
|
||||||
"max_file_age_days": max_file_age_days,
|
"max_file_age_days": max_file_age_days,
|
||||||
"max_file_size_bytes": max_file_size_bytes
|
"max_file_size_bytes": max_file_size_bytes,
|
||||||
|
"admin_ip_whitelist": admin_ip_whitelist,
|
||||||
|
"virus_scanning_enabled": virus_scanning_enabled,
|
||||||
|
"session_timeout_minutes": session_timeout_minutes,
|
||||||
|
"rate_limit_per_minute": current_settings.get("rate_limit_per_minute", 60),
|
||||||
|
"rate_limit_per_hour": current_settings.get("rate_limit_per_hour", 1000)
|
||||||
}
|
}
|
||||||
|
|
||||||
with open(SETTINGS_FILE, 'w') as f:
|
with open(SETTINGS_FILE, 'w') as f:
|
||||||
@@ -645,9 +773,17 @@ def admin_login():
|
|||||||
p = request.form.get("password")
|
p = request.form.get("password")
|
||||||
totp_code = request.form.get("totp_code")
|
totp_code = request.form.get("totp_code")
|
||||||
|
|
||||||
|
# Check IP whitelist first
|
||||||
|
if not check_ip_whitelist(request.remote_addr):
|
||||||
|
log_admin_event(f"Login attempt from unauthorized IP: {request.remote_addr}")
|
||||||
|
flash("Access denied: IP not authorized")
|
||||||
|
return render_template("admin_login.html", requires_2fa=get_admin_2fa_status())
|
||||||
|
|
||||||
if check_creds(u, p, totp_code):
|
if check_creds(u, p, totp_code):
|
||||||
session["admin_logged_in"] = True
|
session["admin_logged_in"] = True
|
||||||
log_admin_event("Admin login successful.")
|
session["login_time"] = datetime.now().isoformat()
|
||||||
|
session.permanent = True # Enable session timeout
|
||||||
|
log_admin_event(f"Admin login successful from IP {request.remote_addr}")
|
||||||
return redirect(url_for("admin_page"))
|
return redirect(url_for("admin_page"))
|
||||||
else:
|
else:
|
||||||
log_admin_event("Admin login failed.")
|
log_admin_event("Admin login failed.")
|
||||||
@@ -664,13 +800,9 @@ def admin_logout():
|
|||||||
return redirect(url_for("index"))
|
return redirect(url_for("index"))
|
||||||
|
|
||||||
@app.route("/adminpage")
|
@app.route("/adminpage")
|
||||||
|
@admin_required
|
||||||
def admin_page():
|
def admin_page():
|
||||||
"""Admin dashboard."""
|
"""Admin dashboard."""
|
||||||
if not session.get("admin_logged_in"):
|
|
||||||
if not os.path.exists(ADMIN_CRED_FILE):
|
|
||||||
return redirect(url_for("admin_setup"))
|
|
||||||
return redirect(url_for("admin_login"))
|
|
||||||
|
|
||||||
cleanup_expired_files()
|
cleanup_expired_files()
|
||||||
routes = [rule.rule for rule in app.url_map.iter_rules() if rule.endpoint != 'static']
|
routes = [rule.rule for rule in app.url_map.iter_rules() if rule.endpoint != 'static']
|
||||||
|
|
||||||
@@ -748,6 +880,7 @@ exec "$2" "$3"
|
|||||||
return jsonify({"error": f"Failed to restart server: {str(e)}"}), 500
|
return jsonify({"error": f"Failed to restart server: {str(e)}"}), 500
|
||||||
|
|
||||||
@app.route("/admin-reset", methods=["POST"])
|
@app.route("/admin-reset", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_reset():
|
def admin_reset():
|
||||||
"""Reset admin credentials."""
|
"""Reset admin credentials."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -765,6 +898,7 @@ def admin_reset():
|
|||||||
return redirect(url_for("admin_setup"))
|
return redirect(url_for("admin_setup"))
|
||||||
|
|
||||||
@app.route("/admin-change-password", methods=["POST"])
|
@app.route("/admin-change-password", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_change_password():
|
def admin_change_password():
|
||||||
"""Change admin password."""
|
"""Change admin password."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -800,6 +934,7 @@ def admin_change_password():
|
|||||||
return redirect(url_for("admin_page"))
|
return redirect(url_for("admin_page"))
|
||||||
|
|
||||||
@app.route("/admin-enable-2fa", methods=["POST"])
|
@app.route("/admin-enable-2fa", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_enable_2fa():
|
def admin_enable_2fa():
|
||||||
"""Enable 2FA for admin account."""
|
"""Enable 2FA for admin account."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -831,6 +966,7 @@ def admin_enable_2fa():
|
|||||||
return redirect(url_for("admin_page"))
|
return redirect(url_for("admin_page"))
|
||||||
|
|
||||||
@app.route("/admin-disable-2fa", methods=["POST"])
|
@app.route("/admin-disable-2fa", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_disable_2fa():
|
def admin_disable_2fa():
|
||||||
"""Disable 2FA for admin account."""
|
"""Disable 2FA for admin account."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -874,6 +1010,7 @@ def admin_disable_2fa():
|
|||||||
return redirect(url_for("admin_page"))
|
return redirect(url_for("admin_page"))
|
||||||
|
|
||||||
@app.route("/admin-clear-uploads", methods=["POST"])
|
@app.route("/admin-clear-uploads", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_clear_uploads():
|
def admin_clear_uploads():
|
||||||
"""Clear all uploaded files."""
|
"""Clear all uploaded files."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -892,6 +1029,7 @@ def admin_clear_uploads():
|
|||||||
return redirect(url_for("admin_page"))
|
return redirect(url_for("admin_page"))
|
||||||
|
|
||||||
@app.route("/admin-update-server", methods=["POST"])
|
@app.route("/admin-update-server", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_update_server():
|
def admin_update_server():
|
||||||
"""Update server from GitHub repository."""
|
"""Update server from GitHub repository."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -974,6 +1112,7 @@ def admin_update_server():
|
|||||||
return jsonify({"error": error_msg}), 500
|
return jsonify({"error": error_msg}), 500
|
||||||
|
|
||||||
@app.route("/admin-switch-dev-mode", methods=["POST"])
|
@app.route("/admin-switch-dev-mode", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_switch_dev_mode():
|
def admin_switch_dev_mode():
|
||||||
"""Switch server to development mode."""
|
"""Switch server to development mode."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -995,6 +1134,7 @@ def admin_switch_dev_mode():
|
|||||||
return jsonify({"error": error_msg}), 500
|
return jsonify({"error": error_msg}), 500
|
||||||
|
|
||||||
@app.route("/admin-switch-prod-mode", methods=["POST"])
|
@app.route("/admin-switch-prod-mode", methods=["POST"])
|
||||||
|
@admin_required
|
||||||
def admin_switch_prod_mode():
|
def admin_switch_prod_mode():
|
||||||
"""Switch server to production mode."""
|
"""Switch server to production mode."""
|
||||||
if not session.get("admin_logged_in"):
|
if not session.get("admin_logged_in"):
|
||||||
@@ -1048,6 +1188,7 @@ def robots_txt():
|
|||||||
|
|
||||||
# ===== API Endpoints =====
|
# ===== API Endpoints =====
|
||||||
@app.route("/api/algorithms", methods=["GET"])
|
@app.route("/api/algorithms", methods=["GET"])
|
||||||
|
@limiter.limit("100 per minute")
|
||||||
def api_algorithms():
|
def api_algorithms():
|
||||||
"""Get list of available encryption algorithms."""
|
"""Get list of available encryption algorithms."""
|
||||||
algorithms = {}
|
algorithms = {}
|
||||||
@@ -1062,6 +1203,7 @@ def api_algorithms():
|
|||||||
return jsonify(algorithms=algorithms)
|
return jsonify(algorithms=algorithms)
|
||||||
|
|
||||||
@app.route("/api/generate-keypair", methods=["POST"])
|
@app.route("/api/generate-keypair", methods=["POST"])
|
||||||
|
@limiter.limit("10 per minute")
|
||||||
def api_generate_keypair():
|
def api_generate_keypair():
|
||||||
"""Generate RSA key pair for hybrid algorithms."""
|
"""Generate RSA key pair for hybrid algorithms."""
|
||||||
try:
|
try:
|
||||||
@@ -1085,6 +1227,7 @@ def api_generate_keypair():
|
|||||||
return jsonify({"error": str(e)}), 500
|
return jsonify({"error": str(e)}), 500
|
||||||
|
|
||||||
@app.route("/api/encrypt", methods=["POST"])
|
@app.route("/api/encrypt", methods=["POST"])
|
||||||
|
@limiter.limit("30 per minute")
|
||||||
def api_encrypt():
|
def api_encrypt():
|
||||||
try:
|
try:
|
||||||
# Text encryption
|
# Text encryption
|
||||||
@@ -1164,6 +1307,7 @@ def api_encrypt():
|
|||||||
return jsonify({"error": str(e)}), 500
|
return jsonify({"error": str(e)}), 500
|
||||||
|
|
||||||
@app.route("/api/decrypt", methods=["POST"])
|
@app.route("/api/decrypt", methods=["POST"])
|
||||||
|
@limiter.limit("30 per minute")
|
||||||
def api_decrypt():
|
def api_decrypt():
|
||||||
try:
|
try:
|
||||||
# Text decryption
|
# Text decryption
|
||||||
@@ -1260,6 +1404,7 @@ def api_decrypt():
|
|||||||
return jsonify({"error": str(e)}), 500
|
return jsonify({"error": str(e)}), 500
|
||||||
|
|
||||||
@app.route("/api/pacshare", methods=["POST"])
|
@app.route("/api/pacshare", methods=["POST"])
|
||||||
|
@limiter.limit("10 per minute")
|
||||||
def api_pacshare():
|
def api_pacshare():
|
||||||
try:
|
try:
|
||||||
enc_password = request.form.get("enc_password")
|
enc_password = request.form.get("enc_password")
|
||||||
|
|||||||
@@ -14,4 +14,13 @@ pqcrypto
|
|||||||
# Utility
|
# Utility
|
||||||
psutil
|
psutil
|
||||||
|
|
||||||
|
# Security and rate limiting
|
||||||
|
flask-limiter
|
||||||
|
clamd
|
||||||
|
ipaddress
|
||||||
|
|
||||||
|
# TOTP for 2FA
|
||||||
|
pyotp
|
||||||
|
qrcode
|
||||||
|
|
||||||
# Run pip install -r application_data/requirements.txt
|
# Run pip install -r application_data/requirements.txt
|
||||||
|
|||||||
@@ -5,6 +5,733 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ===== Bulk Operations Styles ===== */
|
||||||
|
.drop-zone {
|
||||||
|
border: 2px dashed #00ff99;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 40px 20px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #001100;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drop-zone:hover,
|
||||||
|
.drop-zone.drag-over {
|
||||||
|
background-color: #002200;
|
||||||
|
border-color: #00ff44;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drop-zone-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drop-zone-icon {
|
||||||
|
font-size: 2em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list {
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: #111;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 15px;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
background-color: #1a1a1a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
flex: 1;
|
||||||
|
gap: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-name {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ff99;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-size {
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions {
|
||||||
|
display: flex;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 15px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-bar {
|
||||||
|
flex: 1;
|
||||||
|
height: 20px;
|
||||||
|
background-color: #333;
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-fill {
|
||||||
|
height: 100%;
|
||||||
|
background-color: #00ff99;
|
||||||
|
border-radius: 10px;
|
||||||
|
transition: width 0.3s ease;
|
||||||
|
width: 0%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-progress-list {
|
||||||
|
max-height: 200px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: #111;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-progress-item {
|
||||||
|
padding: 10px 15px;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-progress-item:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-progress-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 0.9em;
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-progress-status {
|
||||||
|
font-size: 0.8em;
|
||||||
|
padding: 3px 8px;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-processing {
|
||||||
|
background-color: #ffaa00;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-completed {
|
||||||
|
background-color: #00ff99;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-error {
|
||||||
|
background-color: #ff4444;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.results-list {
|
||||||
|
max-height: 400px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: #111;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 15px;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-item:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-info {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-name {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ff99;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-details {
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
.result-actions {
|
||||||
|
display: flex;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* File Preview Styles */
|
||||||
|
.file-preview-container {
|
||||||
|
max-height: 200px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #333;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: #111;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-preview-content {
|
||||||
|
padding: 15px;
|
||||||
|
font-family: monospace;
|
||||||
|
white-space: pre-wrap;
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #ccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image-preview {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 150px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-preview-header {
|
||||||
|
padding: 10px 15px;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
background-color: #1a1a1a;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ff99;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===== Password Settings Modal ===== */
|
||||||
|
.settings-button {
|
||||||
|
background: none;
|
||||||
|
border: 2px solid #00ff99;
|
||||||
|
color: #00ff99;
|
||||||
|
border-radius: 50%;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
font-size: 1.2em;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-button:hover {
|
||||||
|
background-color: #00ff99;
|
||||||
|
color: #000;
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: rgba(0, 0, 0, 0.8);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 1000;
|
||||||
|
backdrop-filter: blur(5px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
background-color: #1a1a1a;
|
||||||
|
border: 2px solid #00ff99;
|
||||||
|
border-radius: 10px;
|
||||||
|
width: 90%;
|
||||||
|
max-width: 600px;
|
||||||
|
max-height: 80vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
box-shadow: 0 10px 30px rgba(0, 255, 153, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-header h3 {
|
||||||
|
margin: 0;
|
||||||
|
color: #00ff99;
|
||||||
|
font-size: 1.1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-button {
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
color: #ff6b6b;
|
||||||
|
font-size: 1.5em;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-button:hover {
|
||||||
|
background-color: #ff6b6b;
|
||||||
|
color: #fff;
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20px;
|
||||||
|
border-top: 1px solid #333;
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-group {
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-group h4 {
|
||||||
|
color: #00ff99;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-size: 1em;
|
||||||
|
border-bottom: 1px solid #333;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-input-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-number-input {
|
||||||
|
width: 70px;
|
||||||
|
padding: 6px 10px;
|
||||||
|
background-color: #333;
|
||||||
|
border: 2px solid #666;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: #00ff99;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-number-input:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: #00ff99;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 153, 0.3);
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-number-input::-webkit-outer-spin-button,
|
||||||
|
.length-number-input::-webkit-inner-spin-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-number-input[type=number] {
|
||||||
|
-moz-appearance: textfield;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-unit {
|
||||||
|
font-size: 0.9em;
|
||||||
|
color: #888;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-slider {
|
||||||
|
width: 100%;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background: #333;
|
||||||
|
outline: none;
|
||||||
|
margin: 10px 0;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-slider::-webkit-slider-thumb {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #00ff99;
|
||||||
|
cursor: pointer;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 153, 0.5);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-slider::-webkit-slider-thumb:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
box-shadow: 0 0 15px rgba(0, 255, 153, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-slider::-moz-range-thumb {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #00ff99;
|
||||||
|
cursor: pointer;
|
||||||
|
border: none;
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 153, 0.5);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-slider::-moz-range-thumb:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
box-shadow: 0 0 15px rgba(0, 255, 153, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.length-labels {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
gap: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
transition: background-color 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-item:hover {
|
||||||
|
background-color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-item input[type="checkbox"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkmark {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border: 2px solid #666;
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-right: 10px;
|
||||||
|
position: relative;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-item input[type="checkbox"]:checked + .checkmark {
|
||||||
|
background-color: #00ff99;
|
||||||
|
border-color: #00ff99;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-item input[type="checkbox"]:checked + .checkmark::after {
|
||||||
|
content: "✓";
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
color: #000;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 0.9em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-input {
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #333;
|
||||||
|
border: 1px solid #666;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: #fff;
|
||||||
|
font-family: monospace;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-input:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: #00ff99;
|
||||||
|
box-shadow: 0 0 5px rgba(0, 255, 153, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-hint {
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.charset-preview {
|
||||||
|
background-color: #333;
|
||||||
|
border: 1px solid #666;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 15px;
|
||||||
|
font-family: monospace;
|
||||||
|
font-size: 0.9em;
|
||||||
|
color: #ccc;
|
||||||
|
max-height: 100px;
|
||||||
|
overflow-y: auto;
|
||||||
|
word-break: break-all;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-button {
|
||||||
|
background-color: #00ff99;
|
||||||
|
color: #000;
|
||||||
|
border: none;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
font-weight: bold;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primary-button:hover {
|
||||||
|
background-color: #00cc77;
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 5px 15px rgba(0, 255, 153, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-button {
|
||||||
|
background: none;
|
||||||
|
color: #ccc;
|
||||||
|
border: 1px solid #666;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-button:hover {
|
||||||
|
background-color: #333;
|
||||||
|
border-color: #999;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Radio Button Styles */
|
||||||
|
.mode-selection {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 15px;
|
||||||
|
border: 2px solid #333;
|
||||||
|
border-radius: 8px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item:hover {
|
||||||
|
border-color: #666;
|
||||||
|
background-color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item input[type="radio"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radiomark {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
border: 2px solid #666;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 15px;
|
||||||
|
position: relative;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item input[type="radio"]:checked + .radiomark {
|
||||||
|
border-color: #00ff99;
|
||||||
|
background-color: #00ff99;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item input[type="radio"]:checked + .radiomark::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-item input[type="radio"]:checked {
|
||||||
|
border-color: #00ff99;
|
||||||
|
background-color: #001100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-content {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-title {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ff99;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radio-description {
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Size Input Styles */
|
||||||
|
.size-input-container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-number-input {
|
||||||
|
width: 80px;
|
||||||
|
padding: 6px 10px;
|
||||||
|
background-color: #333;
|
||||||
|
border: 2px solid #666;
|
||||||
|
border-radius: 5px;
|
||||||
|
color: #00ff99;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-number-input:focus {
|
||||||
|
outline: none;
|
||||||
|
border-color: #00ff99;
|
||||||
|
box-shadow: 0 0 5px rgba(0, 255, 153, 0.3);
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-number-input::-webkit-outer-spin-button,
|
||||||
|
.size-number-input::-webkit-inner-spin-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-number-input[type=number] {
|
||||||
|
-moz-appearance: textfield;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-unit {
|
||||||
|
font-size: 0.9em;
|
||||||
|
color: #888;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Enhanced Checkbox Styles for Descriptions */
|
||||||
|
.checkbox-content {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-title {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #00ff99;
|
||||||
|
margin-bottom: 3px;
|
||||||
|
font-size: 0.95em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-description {
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: #888;
|
||||||
|
line-height: 1.3;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive adjustments */
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.drop-zone {
|
||||||
|
padding: 30px 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item,
|
||||||
|
.result-item {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions,
|
||||||
|
.result-actions {
|
||||||
|
width: 100%;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-container {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: stretch;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
width: 95%;
|
||||||
|
max-height: 90vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.checkbox-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-footer {
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings-button {
|
||||||
|
width: 35px;
|
||||||
|
height: 35px;
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* ===== Body ===== */
|
/* ===== Body ===== */
|
||||||
body {
|
body {
|
||||||
font-family: 'Press Start 2P', monospace;
|
font-family: 'Press Start 2P', monospace;
|
||||||
|
|||||||
@@ -0,0 +1,508 @@
|
|||||||
|
/**
|
||||||
|
* Bulk Operations Module
|
||||||
|
* Handles bulk file encryption/decryption, drag & drop, and file preview
|
||||||
|
*/
|
||||||
|
|
||||||
|
class BulkOperations {
|
||||||
|
constructor() {
|
||||||
|
this.files = [];
|
||||||
|
this.results = [];
|
||||||
|
this.isProcessing = false;
|
||||||
|
this.setupEventListeners();
|
||||||
|
this.populateAlgorithmDropdown();
|
||||||
|
}
|
||||||
|
|
||||||
|
setupEventListeners() {
|
||||||
|
// Drag & Drop Zone
|
||||||
|
const dropZone = document.getElementById('bulk-drop-zone');
|
||||||
|
const fileInput = document.getElementById('bulk-file-input');
|
||||||
|
const fileSelect = document.getElementById('bulk-file-select');
|
||||||
|
|
||||||
|
console.log('Bulk setup - dropZone:', dropZone, 'fileInput:', fileInput, 'fileSelect:', fileSelect);
|
||||||
|
|
||||||
|
if (dropZone && fileInput) {
|
||||||
|
console.log('Setting up bulk drag & drop events');
|
||||||
|
// Drag & Drop Events
|
||||||
|
dropZone.addEventListener('dragover', this.handleDragOver.bind(this));
|
||||||
|
dropZone.addEventListener('dragleave', this.handleDragLeave.bind(this));
|
||||||
|
dropZone.addEventListener('drop', this.handleDrop.bind(this));
|
||||||
|
dropZone.addEventListener('click', () => {
|
||||||
|
console.log('Bulk drop zone clicked, opening file input');
|
||||||
|
fileInput.click();
|
||||||
|
});
|
||||||
|
|
||||||
|
// File Input Events
|
||||||
|
fileInput.addEventListener('change', this.handleFileSelect.bind(this));
|
||||||
|
} else {
|
||||||
|
console.error('Bulk elements not found - dropZone:', dropZone, 'fileInput:', fileInput);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (fileSelect) {
|
||||||
|
console.log('Setting up bulk file select button');
|
||||||
|
fileSelect.addEventListener('click', (e) => {
|
||||||
|
console.log('Bulk file select button clicked');
|
||||||
|
e.stopPropagation();
|
||||||
|
fileInput.click();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.error('Bulk file select button not found');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Control Buttons
|
||||||
|
const processBtn = document.getElementById('bulk-process-btn');
|
||||||
|
const clearBtn = document.getElementById('bulk-clear-btn');
|
||||||
|
const downloadAllBtn = document.getElementById('bulk-download-all');
|
||||||
|
const resetBtn = document.getElementById('bulk-reset');
|
||||||
|
|
||||||
|
if (processBtn) processBtn.addEventListener('click', this.processFiles.bind(this));
|
||||||
|
if (clearBtn) clearBtn.addEventListener('click', this.clearFiles.bind(this));
|
||||||
|
if (downloadAllBtn) downloadAllBtn.addEventListener('click', this.downloadAllResults.bind(this));
|
||||||
|
if (resetBtn) resetBtn.addEventListener('click', this.reset.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDragOver(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('bulk-drop-zone').classList.add('drag-over');
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDragLeave(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('bulk-drop-zone').classList.remove('drag-over');
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDrop(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('bulk-drop-zone').classList.remove('drag-over');
|
||||||
|
|
||||||
|
const files = Array.from(e.dataTransfer.files);
|
||||||
|
this.addFiles(files);
|
||||||
|
}
|
||||||
|
|
||||||
|
handleFileSelect(e) {
|
||||||
|
const files = Array.from(e.target.files);
|
||||||
|
this.addFiles(files);
|
||||||
|
}
|
||||||
|
|
||||||
|
addFiles(newFiles) {
|
||||||
|
// Filter out duplicates
|
||||||
|
newFiles = newFiles.filter(newFile =>
|
||||||
|
!this.files.some(existingFile =>
|
||||||
|
existingFile.name === newFile.name && existingFile.size === newFile.size
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
this.files.push(...newFiles);
|
||||||
|
this.updateFileList();
|
||||||
|
this.showFilePreview();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateFileList() {
|
||||||
|
const fileList = document.getElementById('bulk-file-list');
|
||||||
|
if (!fileList) return;
|
||||||
|
|
||||||
|
fileList.innerHTML = '';
|
||||||
|
|
||||||
|
this.files.forEach((file, index) => {
|
||||||
|
const fileItem = document.createElement('div');
|
||||||
|
fileItem.className = 'file-item';
|
||||||
|
fileItem.innerHTML = `
|
||||||
|
<div class="file-info">
|
||||||
|
<div class="file-name">${file.name}</div>
|
||||||
|
<div class="file-size">${this.formatFileSize(file.size)}</div>
|
||||||
|
</div>
|
||||||
|
<div class="file-actions">
|
||||||
|
<button type="button" onclick="bulkOps.previewFile(${index})" style="padding: 5px 10px; font-size: 0.8em;">Preview</button>
|
||||||
|
<button type="button" onclick="bulkOps.removeFile(${index})" class="danger-button" style="padding: 5px 10px; font-size: 0.8em;">Remove</button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
fileList.appendChild(fileItem);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
showFilePreview() {
|
||||||
|
const previewSection = document.getElementById('bulk-file-preview');
|
||||||
|
if (previewSection) {
|
||||||
|
previewSection.style.display = this.files.length > 0 ? 'block' : 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async previewFile(index) {
|
||||||
|
const file = this.files[index];
|
||||||
|
if (!file) return;
|
||||||
|
|
||||||
|
const previewContainer = document.createElement('div');
|
||||||
|
previewContainer.className = 'file-preview-container';
|
||||||
|
|
||||||
|
const header = document.createElement('div');
|
||||||
|
header.className = 'file-preview-header';
|
||||||
|
header.textContent = `Preview: ${file.name}`;
|
||||||
|
|
||||||
|
const content = document.createElement('div');
|
||||||
|
content.className = 'file-preview-content';
|
||||||
|
|
||||||
|
// Handle different file types
|
||||||
|
if (file.type.startsWith('text/') || this.isTextFile(file.name)) {
|
||||||
|
try {
|
||||||
|
const text = await this.readFileAsText(file);
|
||||||
|
content.textContent = text.length > 2000 ? text.substring(0, 2000) + '...' : text;
|
||||||
|
} catch (error) {
|
||||||
|
content.textContent = 'Error reading file: ' + error.message;
|
||||||
|
}
|
||||||
|
} else if (file.type.startsWith('image/')) {
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.className = 'image-preview';
|
||||||
|
img.src = URL.createObjectURL(file);
|
||||||
|
img.onload = () => URL.revokeObjectURL(img.src);
|
||||||
|
content.appendChild(img);
|
||||||
|
} else {
|
||||||
|
content.innerHTML = `
|
||||||
|
<div style="color: #888;">
|
||||||
|
File Type: ${file.type || 'Unknown'}<br>
|
||||||
|
Size: ${this.formatFileSize(file.size)}<br>
|
||||||
|
Preview not available for this file type.
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
previewContainer.appendChild(header);
|
||||||
|
previewContainer.appendChild(content);
|
||||||
|
|
||||||
|
// Remove existing preview
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add new preview after the file list
|
||||||
|
const fileList = document.getElementById('bulk-file-list');
|
||||||
|
if (fileList) {
|
||||||
|
fileList.parentNode.insertBefore(previewContainer, fileList.nextSibling);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
isTextFile(filename) {
|
||||||
|
const textExtensions = ['.txt', '.md', '.js', '.html', '.css', '.json', '.xml', '.csv', '.log', '.py', '.java', '.c', '.cpp', '.h'];
|
||||||
|
return textExtensions.some(ext => filename.toLowerCase().endsWith(ext));
|
||||||
|
}
|
||||||
|
|
||||||
|
readFileAsText(file) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = e => resolve(e.target.result);
|
||||||
|
reader.onerror = e => reject(new Error('Failed to read file'));
|
||||||
|
reader.readAsText(file);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
removeFile(index) {
|
||||||
|
this.files.splice(index, 1);
|
||||||
|
this.updateFileList();
|
||||||
|
this.showFilePreview();
|
||||||
|
|
||||||
|
// Remove preview if it exists
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
clearFiles() {
|
||||||
|
this.files = [];
|
||||||
|
this.updateFileList();
|
||||||
|
this.showFilePreview();
|
||||||
|
|
||||||
|
// Remove preview if it exists
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear file input
|
||||||
|
const fileInput = document.getElementById('bulk-file-input');
|
||||||
|
if (fileInput) fileInput.value = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
async processFiles() {
|
||||||
|
if (this.files.length === 0) {
|
||||||
|
alert('Please select files to process');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const password = document.getElementById('bulk-password')?.value;
|
||||||
|
if (!password) {
|
||||||
|
alert('Please enter a password');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const algorithm = document.getElementById('bulk-algorithm')?.value;
|
||||||
|
if (!algorithm) {
|
||||||
|
alert('Please select an algorithm');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const isDecrypt = document.getElementById('bulk-operation-toggle')?.checked;
|
||||||
|
|
||||||
|
this.isProcessing = true;
|
||||||
|
this.results = [];
|
||||||
|
|
||||||
|
// Show progress section
|
||||||
|
const progressSection = document.getElementById('bulk-progress-section');
|
||||||
|
if (progressSection) progressSection.style.display = 'block';
|
||||||
|
|
||||||
|
// Initialize progress
|
||||||
|
this.updateOverallProgress(0, this.files.length);
|
||||||
|
this.initializeFileProgress();
|
||||||
|
|
||||||
|
// Process files sequentially to avoid overwhelming the server
|
||||||
|
for (let i = 0; i < this.files.length; i++) {
|
||||||
|
const file = this.files[i];
|
||||||
|
this.updateFileProgress(i, 'processing');
|
||||||
|
|
||||||
|
try {
|
||||||
|
const result = await this.processFile(file, password, algorithm, isDecrypt);
|
||||||
|
this.results.push({ file, result, success: true });
|
||||||
|
this.updateFileProgress(i, 'completed');
|
||||||
|
} catch (error) {
|
||||||
|
this.results.push({ file, error: error.message, success: false });
|
||||||
|
this.updateFileProgress(i, 'error');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateOverallProgress(i + 1, this.files.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.isProcessing = false;
|
||||||
|
this.showResults();
|
||||||
|
}
|
||||||
|
|
||||||
|
async processFile(file, password, algorithm, isDecrypt) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
formData.append('enc_password', password);
|
||||||
|
formData.append('algorithm', algorithm);
|
||||||
|
|
||||||
|
const endpoint = isDecrypt ? '/api/decrypt' : '/api/encrypt';
|
||||||
|
|
||||||
|
const response = await fetch(endpoint, {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
const errorData = await response.json();
|
||||||
|
throw new Error(errorData.error || 'Processing failed');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Return the blob for download
|
||||||
|
return await response.blob();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateOverallProgress(completed, total) {
|
||||||
|
const progressBar = document.getElementById('bulk-overall-bar');
|
||||||
|
const progressText = document.getElementById('bulk-overall-text');
|
||||||
|
|
||||||
|
if (progressBar) {
|
||||||
|
const percentage = total > 0 ? (completed / total) * 100 : 0;
|
||||||
|
progressBar.style.width = `${percentage}%`;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (progressText) {
|
||||||
|
progressText.textContent = `${completed} / ${total} files processed`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
initializeFileProgress() {
|
||||||
|
const progressList = document.getElementById('bulk-file-progress-list');
|
||||||
|
if (!progressList) return;
|
||||||
|
|
||||||
|
progressList.innerHTML = '';
|
||||||
|
|
||||||
|
this.files.forEach((file, index) => {
|
||||||
|
const progressItem = document.createElement('div');
|
||||||
|
progressItem.className = 'file-progress-item';
|
||||||
|
progressItem.innerHTML = `
|
||||||
|
<div class="file-progress-name">${file.name}</div>
|
||||||
|
<div class="file-progress-status" id="progress-status-${index}">Waiting</div>
|
||||||
|
`;
|
||||||
|
progressList.appendChild(progressItem);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateFileProgress(index, status) {
|
||||||
|
const statusElement = document.getElementById(`progress-status-${index}`);
|
||||||
|
if (!statusElement) return;
|
||||||
|
|
||||||
|
statusElement.className = `file-progress-status status-${status}`;
|
||||||
|
|
||||||
|
switch (status) {
|
||||||
|
case 'processing':
|
||||||
|
statusElement.textContent = 'Processing...';
|
||||||
|
break;
|
||||||
|
case 'completed':
|
||||||
|
statusElement.textContent = 'Completed';
|
||||||
|
break;
|
||||||
|
case 'error':
|
||||||
|
statusElement.textContent = 'Error';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
statusElement.textContent = 'Waiting';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
showResults() {
|
||||||
|
const resultsSection = document.getElementById('bulk-results-section');
|
||||||
|
if (!resultsSection) return;
|
||||||
|
|
||||||
|
resultsSection.style.display = 'block';
|
||||||
|
|
||||||
|
const resultsList = document.getElementById('bulk-results-list');
|
||||||
|
if (!resultsList) return;
|
||||||
|
|
||||||
|
resultsList.innerHTML = '';
|
||||||
|
|
||||||
|
this.results.forEach((result, index) => {
|
||||||
|
const resultItem = document.createElement('div');
|
||||||
|
resultItem.className = 'result-item';
|
||||||
|
|
||||||
|
const successCount = this.results.filter(r => r.success).length;
|
||||||
|
const totalCount = this.results.length;
|
||||||
|
|
||||||
|
if (result.success) {
|
||||||
|
resultItem.innerHTML = `
|
||||||
|
<div class="result-info">
|
||||||
|
<div class="result-name">✅ ${result.file.name}</div>
|
||||||
|
<div class="result-details">Successfully processed</div>
|
||||||
|
</div>
|
||||||
|
<div class="result-actions">
|
||||||
|
<button type="button" onclick="bulkOps.downloadResult(${index})" style="padding: 5px 10px; font-size: 0.8em;">Download</button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
resultItem.innerHTML = `
|
||||||
|
<div class="result-info">
|
||||||
|
<div class="result-name">❌ ${result.file.name}</div>
|
||||||
|
<div class="result-details">${result.error}</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
resultsList.appendChild(resultItem);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add summary
|
||||||
|
const summary = document.createElement('div');
|
||||||
|
summary.style.cssText = 'padding: 15px; border-bottom: 1px solid #333; background-color: #1a1a1a; font-weight: bold;';
|
||||||
|
summary.innerHTML = `
|
||||||
|
<div style="color: #00ff99;">Processing Complete</div>
|
||||||
|
<div style="font-size: 0.9em; color: #ccc; margin-top: 5px;">
|
||||||
|
${successCount} successful, ${totalCount - successCount} failed out of ${totalCount} files
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
resultsList.insertBefore(summary, resultsList.firstChild);
|
||||||
|
}
|
||||||
|
|
||||||
|
downloadResult(index) {
|
||||||
|
const result = this.results[index];
|
||||||
|
if (!result.success) return;
|
||||||
|
|
||||||
|
const isDecrypt = document.getElementById('bulk-operation-toggle')?.checked;
|
||||||
|
const algorithm = document.getElementById('bulk-algorithm')?.value;
|
||||||
|
|
||||||
|
let filename;
|
||||||
|
if (isDecrypt) {
|
||||||
|
// For decryption, try to restore original filename
|
||||||
|
filename = result.file.name.replace(/\.(aes_cbc|aes_gcm|xchacha|rsa_hybrid)\.encrypted$/, '');
|
||||||
|
} else {
|
||||||
|
// For encryption, add algorithm extension
|
||||||
|
filename = `${result.file.name}.${algorithm}.encrypted`;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.downloadBlob(result.result, filename);
|
||||||
|
}
|
||||||
|
|
||||||
|
downloadAllResults() {
|
||||||
|
const successfulResults = this.results.filter(r => r.success);
|
||||||
|
|
||||||
|
if (successfulResults.length === 0) {
|
||||||
|
alert('No successful results to download');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
successfulResults.forEach((result, index) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
this.downloadResult(this.results.indexOf(result));
|
||||||
|
}, index * 500); // Stagger downloads
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
downloadBlob(blob, filename) {
|
||||||
|
const url = URL.createObjectURL(blob);
|
||||||
|
const a = document.createElement('a');
|
||||||
|
a.href = url;
|
||||||
|
a.download = filename;
|
||||||
|
document.body.appendChild(a);
|
||||||
|
a.click();
|
||||||
|
document.body.removeChild(a);
|
||||||
|
URL.revokeObjectURL(url);
|
||||||
|
}
|
||||||
|
|
||||||
|
reset() {
|
||||||
|
this.clearFiles();
|
||||||
|
this.results = [];
|
||||||
|
this.isProcessing = false;
|
||||||
|
|
||||||
|
// Hide sections
|
||||||
|
const sections = ['bulk-progress-section', 'bulk-results-section'];
|
||||||
|
sections.forEach(id => {
|
||||||
|
const section = document.getElementById(id);
|
||||||
|
if (section) section.style.display = 'none';
|
||||||
|
});
|
||||||
|
|
||||||
|
// Clear password
|
||||||
|
const passwordField = document.getElementById('bulk-password');
|
||||||
|
if (passwordField) passwordField.value = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
formatFileSize(bytes) {
|
||||||
|
if (bytes === 0) return '0 Bytes';
|
||||||
|
const k = 1024;
|
||||||
|
const sizes = ['Bytes', 'KB', 'MB', 'GB'];
|
||||||
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||||
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
|
||||||
|
}
|
||||||
|
|
||||||
|
async populateAlgorithmDropdown() {
|
||||||
|
try {
|
||||||
|
const response = await fetch('/api/algorithms');
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
if (response.ok && data.algorithms) {
|
||||||
|
const dropdown = document.getElementById('bulk-algorithm');
|
||||||
|
if (dropdown) {
|
||||||
|
dropdown.innerHTML = '';
|
||||||
|
|
||||||
|
for (const [key, algo] of Object.entries(data.algorithms)) {
|
||||||
|
if (algo.supports_file) {
|
||||||
|
const option = document.createElement('option');
|
||||||
|
option.value = key;
|
||||||
|
option.textContent = algo.name;
|
||||||
|
dropdown.appendChild(option);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to load algorithms for bulk operations:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize bulk operations when DOM is loaded
|
||||||
|
let bulkOps;
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
bulkOps = new BulkOperations();
|
||||||
|
// Make bulkOps available globally for onclick handlers
|
||||||
|
window.bulkOps = bulkOps;
|
||||||
|
});
|
||||||
@@ -0,0 +1,333 @@
|
|||||||
|
/**
|
||||||
|
* Crypto Settings Module
|
||||||
|
* Handles the encryption settings modal and mode switching
|
||||||
|
*/
|
||||||
|
|
||||||
|
class CryptoSettings {
|
||||||
|
constructor() {
|
||||||
|
this.currentMode = 'single';
|
||||||
|
this.settings = {
|
||||||
|
processingMode: 'single',
|
||||||
|
enableFilePreview: true,
|
||||||
|
autoDownloadResults: true,
|
||||||
|
sequentialProcessing: true,
|
||||||
|
showDetailedProgress: true,
|
||||||
|
stopOnError: false,
|
||||||
|
maxFileSizeMB: 100
|
||||||
|
};
|
||||||
|
this.setupEventListeners();
|
||||||
|
this.loadSettings();
|
||||||
|
}
|
||||||
|
|
||||||
|
setupEventListeners() {
|
||||||
|
// Modal controls
|
||||||
|
const settingsBtn = document.getElementById("crypto-settings-btn");
|
||||||
|
const modal = document.getElementById("crypto-settings-modal");
|
||||||
|
const closeBtn = document.getElementById("close-crypto-settings");
|
||||||
|
const applyBtn = document.getElementById("apply-crypto-settings");
|
||||||
|
const resetBtn = document.getElementById("reset-crypto-settings");
|
||||||
|
|
||||||
|
if (settingsBtn && modal) {
|
||||||
|
settingsBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "flex";
|
||||||
|
this.updateModalFromSettings();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (closeBtn && modal) {
|
||||||
|
closeBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "none";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close modal when clicking outside
|
||||||
|
if (modal) {
|
||||||
|
modal.addEventListener("click", (e) => {
|
||||||
|
if (e.target === modal) {
|
||||||
|
modal.style.display = "none";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (applyBtn && modal) {
|
||||||
|
applyBtn.addEventListener("click", () => {
|
||||||
|
this.applySettings();
|
||||||
|
modal.style.display = "none";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (resetBtn) {
|
||||||
|
resetBtn.addEventListener("click", () => {
|
||||||
|
this.resetToDefaults();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Processing mode radio buttons
|
||||||
|
const singleModeRadio = document.getElementById("single-file-mode-radio");
|
||||||
|
const bulkModeRadio = document.getElementById("bulk-file-mode-radio");
|
||||||
|
|
||||||
|
if (singleModeRadio) {
|
||||||
|
singleModeRadio.addEventListener("change", () => {
|
||||||
|
if (singleModeRadio.checked) {
|
||||||
|
this.toggleBulkOptions(false);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (bulkModeRadio) {
|
||||||
|
bulkModeRadio.addEventListener("change", () => {
|
||||||
|
if (bulkModeRadio.checked) {
|
||||||
|
this.toggleBulkOptions(true);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// File size input validation
|
||||||
|
const fileSizeInput = document.getElementById("max-file-size-input");
|
||||||
|
if (fileSizeInput) {
|
||||||
|
fileSizeInput.addEventListener("input", () => {
|
||||||
|
let value = parseInt(fileSizeInput.value);
|
||||||
|
if (value < 1) {
|
||||||
|
fileSizeInput.value = 1;
|
||||||
|
} else if (value > 1000) {
|
||||||
|
fileSizeInput.value = 1000;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
toggleBulkOptions(show) {
|
||||||
|
const bulkOptions = document.getElementById("bulk-options");
|
||||||
|
if (bulkOptions) {
|
||||||
|
bulkOptions.style.display = show ? "block" : "none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
updateModalFromSettings() {
|
||||||
|
// Set radio buttons
|
||||||
|
const singleModeRadio = document.getElementById("single-file-mode-radio");
|
||||||
|
const bulkModeRadio = document.getElementById("bulk-file-mode-radio");
|
||||||
|
|
||||||
|
if (this.settings.processingMode === 'single') {
|
||||||
|
if (singleModeRadio) singleModeRadio.checked = true;
|
||||||
|
this.toggleBulkOptions(false);
|
||||||
|
} else {
|
||||||
|
if (bulkModeRadio) bulkModeRadio.checked = true;
|
||||||
|
this.toggleBulkOptions(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set checkboxes
|
||||||
|
const checkboxes = [
|
||||||
|
{ id: "enable-file-preview", setting: "enableFilePreview" },
|
||||||
|
{ id: "auto-download-results", setting: "autoDownloadResults" },
|
||||||
|
{ id: "sequential-processing", setting: "sequentialProcessing" },
|
||||||
|
{ id: "show-detailed-progress", setting: "showDetailedProgress" },
|
||||||
|
{ id: "stop-on-error", setting: "stopOnError" }
|
||||||
|
];
|
||||||
|
|
||||||
|
checkboxes.forEach(checkbox => {
|
||||||
|
const element = document.getElementById(checkbox.id);
|
||||||
|
if (element) {
|
||||||
|
element.checked = this.settings[checkbox.setting];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set file size
|
||||||
|
const fileSizeInput = document.getElementById("max-file-size-input");
|
||||||
|
if (fileSizeInput) {
|
||||||
|
fileSizeInput.value = this.settings.maxFileSizeMB;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
applySettings() {
|
||||||
|
// Get processing mode
|
||||||
|
const singleModeRadio = document.getElementById("single-file-mode-radio");
|
||||||
|
const bulkModeRadio = document.getElementById("bulk-file-mode-radio");
|
||||||
|
|
||||||
|
if (singleModeRadio && singleModeRadio.checked) {
|
||||||
|
this.settings.processingMode = 'single';
|
||||||
|
} else if (bulkModeRadio && bulkModeRadio.checked) {
|
||||||
|
this.settings.processingMode = 'bulk';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get checkbox values
|
||||||
|
const checkboxes = [
|
||||||
|
{ id: "enable-file-preview", setting: "enableFilePreview" },
|
||||||
|
{ id: "auto-download-results", setting: "autoDownloadResults" },
|
||||||
|
{ id: "sequential-processing", setting: "sequentialProcessing" },
|
||||||
|
{ id: "show-detailed-progress", setting: "showDetailedProgress" },
|
||||||
|
{ id: "stop-on-error", setting: "stopOnError" }
|
||||||
|
];
|
||||||
|
|
||||||
|
checkboxes.forEach(checkbox => {
|
||||||
|
const element = document.getElementById(checkbox.id);
|
||||||
|
if (element) {
|
||||||
|
this.settings[checkbox.setting] = element.checked;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Get file size
|
||||||
|
const fileSizeInput = document.getElementById("max-file-size-input");
|
||||||
|
if (fileSizeInput) {
|
||||||
|
this.settings.maxFileSizeMB = parseInt(fileSizeInput.value) || 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Apply the mode change
|
||||||
|
this.switchMode(this.settings.processingMode);
|
||||||
|
|
||||||
|
// Save settings
|
||||||
|
this.saveSettings();
|
||||||
|
|
||||||
|
// Show feedback
|
||||||
|
this.showFeedback("Settings applied successfully!");
|
||||||
|
}
|
||||||
|
|
||||||
|
switchMode(mode) {
|
||||||
|
this.currentMode = mode;
|
||||||
|
|
||||||
|
const singleFileMode = document.getElementById("single-file-mode");
|
||||||
|
const bulkFileMode = document.getElementById("bulk-file-mode");
|
||||||
|
|
||||||
|
if (mode === 'single') {
|
||||||
|
if (singleFileMode) singleFileMode.style.display = "block";
|
||||||
|
if (bulkFileMode) bulkFileMode.style.display = "none";
|
||||||
|
} else {
|
||||||
|
if (singleFileMode) singleFileMode.style.display = "none";
|
||||||
|
if (bulkFileMode) bulkFileMode.style.display = "block";
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update the form submit handler
|
||||||
|
this.updateFormHandler();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateFormHandler() {
|
||||||
|
const cryptoForm = document.getElementById("crypto-form");
|
||||||
|
if (!cryptoForm) return;
|
||||||
|
|
||||||
|
// Remove existing event listeners by cloning the form
|
||||||
|
const newForm = cryptoForm.cloneNode(true);
|
||||||
|
cryptoForm.parentNode.replaceChild(newForm, cryptoForm);
|
||||||
|
|
||||||
|
// Add the appropriate event listener
|
||||||
|
if (this.currentMode === 'single') {
|
||||||
|
newForm.addEventListener("submit", this.handleSingleFileSubmit.bind(this));
|
||||||
|
} else {
|
||||||
|
newForm.addEventListener("submit", this.handleBulkFileSubmit.bind(this));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async handleSingleFileSubmit(event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
const algorithm = document.getElementById("algorithm")?.value;
|
||||||
|
const password = document.getElementById("password")?.value;
|
||||||
|
const fileInput = document.getElementById("file-input");
|
||||||
|
const isDecrypt = document.getElementById("operation-toggle").checked;
|
||||||
|
|
||||||
|
if (!algorithm || !fileInput) return;
|
||||||
|
|
||||||
|
// Use existing single file handling logic
|
||||||
|
if (window.handleSubmit) {
|
||||||
|
window.handleSubmit(event);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async handleBulkFileSubmit(event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
// Use bulk operations functionality
|
||||||
|
if (window.bulkOps && window.bulkOps.processFiles) {
|
||||||
|
await window.bulkOps.processFiles();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
resetToDefaults() {
|
||||||
|
this.settings = {
|
||||||
|
processingMode: 'single',
|
||||||
|
enableFilePreview: true,
|
||||||
|
autoDownloadResults: true,
|
||||||
|
sequentialProcessing: true,
|
||||||
|
showDetailedProgress: true,
|
||||||
|
stopOnError: false,
|
||||||
|
maxFileSizeMB: 100
|
||||||
|
};
|
||||||
|
|
||||||
|
this.updateModalFromSettings();
|
||||||
|
this.showFeedback("Settings reset to defaults!");
|
||||||
|
}
|
||||||
|
|
||||||
|
loadSettings() {
|
||||||
|
try {
|
||||||
|
const saved = localStorage.getItem('paccrypt-crypto-settings');
|
||||||
|
if (saved) {
|
||||||
|
this.settings = { ...this.settings, ...JSON.parse(saved) };
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.warn('Failed to load crypto settings:', error);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Apply the loaded settings
|
||||||
|
this.switchMode(this.settings.processingMode);
|
||||||
|
}
|
||||||
|
|
||||||
|
saveSettings() {
|
||||||
|
try {
|
||||||
|
localStorage.setItem('paccrypt-crypto-settings', JSON.stringify(this.settings));
|
||||||
|
} catch (error) {
|
||||||
|
console.warn('Failed to save crypto settings:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
showFeedback(message) {
|
||||||
|
// Use the existing feedback system or create a temporary one
|
||||||
|
const feedbackDiv = document.createElement('div');
|
||||||
|
feedbackDiv.className = 'copy-feedback';
|
||||||
|
feedbackDiv.textContent = message;
|
||||||
|
feedbackDiv.style.cssText = `
|
||||||
|
position: fixed;
|
||||||
|
top: 20px;
|
||||||
|
right: 20px;
|
||||||
|
background-color: #00ff99;
|
||||||
|
color: #000;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: bold;
|
||||||
|
z-index: 10000;
|
||||||
|
display: block;
|
||||||
|
`;
|
||||||
|
|
||||||
|
document.body.appendChild(feedbackDiv);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
feedbackDiv.style.opacity = '0';
|
||||||
|
feedbackDiv.style.transition = 'opacity 0.3s ease';
|
||||||
|
setTimeout(() => {
|
||||||
|
if (feedbackDiv.parentNode) {
|
||||||
|
feedbackDiv.parentNode.removeChild(feedbackDiv);
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
}, 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Public methods for external access
|
||||||
|
getCurrentMode() {
|
||||||
|
return this.currentMode;
|
||||||
|
}
|
||||||
|
|
||||||
|
getSettings() {
|
||||||
|
return { ...this.settings };
|
||||||
|
}
|
||||||
|
|
||||||
|
isBulkMode() {
|
||||||
|
return this.currentMode === 'bulk';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize crypto settings when DOM is loaded
|
||||||
|
let cryptoSettings;
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
cryptoSettings = new CryptoSettings();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Make cryptoSettings available globally
|
||||||
|
window.cryptoSettings = cryptoSettings;
|
||||||
@@ -0,0 +1,796 @@
|
|||||||
|
/**
|
||||||
|
* Enhanced PacShare Module
|
||||||
|
* Handles bulk uploads and single file uploads seamlessly
|
||||||
|
*/
|
||||||
|
|
||||||
|
class PacShareEnhanced {
|
||||||
|
constructor() {
|
||||||
|
this.selectedFiles = [];
|
||||||
|
this.uploadResults = [];
|
||||||
|
this.settings = {
|
||||||
|
enable2FA: false,
|
||||||
|
autoClearPasswords: true,
|
||||||
|
autoCopyLinks: true,
|
||||||
|
showUploadProgress: true,
|
||||||
|
scrollToResults: true,
|
||||||
|
maxUploadSizeMB: 25,
|
||||||
|
validateFileTypes: false,
|
||||||
|
concurrentUploads: 1,
|
||||||
|
enableFilePreview: true,
|
||||||
|
rememberAlgorithm: true
|
||||||
|
};
|
||||||
|
this.setupEventListeners();
|
||||||
|
this.loadSettings();
|
||||||
|
}
|
||||||
|
|
||||||
|
setupEventListeners() {
|
||||||
|
// Drag & Drop Zone
|
||||||
|
const dropZone = document.getElementById('pacshare-drop-zone');
|
||||||
|
const fileInput = document.getElementById('upload-file');
|
||||||
|
const fileSelect = document.getElementById('pacshare-file-select');
|
||||||
|
|
||||||
|
console.log('PacShare setup - dropZone:', dropZone, 'fileInput:', fileInput, 'fileSelect:', fileSelect);
|
||||||
|
|
||||||
|
if (dropZone && fileInput) {
|
||||||
|
console.log('Setting up PacShare drag & drop events');
|
||||||
|
// Drag & Drop Events
|
||||||
|
dropZone.addEventListener('dragover', this.handleDragOver.bind(this));
|
||||||
|
dropZone.addEventListener('dragleave', this.handleDragLeave.bind(this));
|
||||||
|
dropZone.addEventListener('drop', this.handleDrop.bind(this));
|
||||||
|
dropZone.addEventListener('click', () => {
|
||||||
|
console.log('PacShare drop zone clicked, opening file input');
|
||||||
|
fileInput.click();
|
||||||
|
});
|
||||||
|
|
||||||
|
// File Input Events
|
||||||
|
fileInput.addEventListener('change', this.handleFileSelect.bind(this));
|
||||||
|
} else {
|
||||||
|
console.error('PacShare elements not found - dropZone:', dropZone, 'fileInput:', fileInput);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (fileSelect) {
|
||||||
|
console.log('Setting up PacShare file select button');
|
||||||
|
fileSelect.addEventListener('click', (e) => {
|
||||||
|
console.log('PacShare file select button clicked');
|
||||||
|
e.stopPropagation();
|
||||||
|
fileInput.click();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
console.error('PacShare file select button not found');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear files button
|
||||||
|
const clearBtn = document.getElementById('pacshare-clear-files');
|
||||||
|
if (clearBtn) {
|
||||||
|
clearBtn.addEventListener('click', this.clearFiles.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Enhanced form submission
|
||||||
|
const uploadForm = document.getElementById('upload-form');
|
||||||
|
if (uploadForm) {
|
||||||
|
// Remove existing event listener first
|
||||||
|
uploadForm.replaceWith(uploadForm.cloneNode(true));
|
||||||
|
const newForm = document.getElementById('upload-form');
|
||||||
|
newForm.addEventListener('submit', this.handleEnhancedSubmit.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Settings modal controls
|
||||||
|
this.setupSettingsModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDragOver(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('pacshare-drop-zone').classList.add('drag-over');
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDragLeave(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('pacshare-drop-zone').classList.remove('drag-over');
|
||||||
|
}
|
||||||
|
|
||||||
|
handleDrop(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
document.getElementById('pacshare-drop-zone').classList.remove('drag-over');
|
||||||
|
|
||||||
|
const files = Array.from(e.dataTransfer.files);
|
||||||
|
this.addFiles(files);
|
||||||
|
}
|
||||||
|
|
||||||
|
handleFileSelect(e) {
|
||||||
|
const files = Array.from(e.target.files);
|
||||||
|
this.addFiles(files);
|
||||||
|
}
|
||||||
|
|
||||||
|
addFiles(newFiles) {
|
||||||
|
// Filter out duplicates
|
||||||
|
newFiles = newFiles.filter(newFile =>
|
||||||
|
!this.selectedFiles.some(existingFile =>
|
||||||
|
existingFile.name === newFile.name && existingFile.size === newFile.size
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
this.selectedFiles.push(...newFiles);
|
||||||
|
this.updateFileDisplay();
|
||||||
|
this.updateUI();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateFileDisplay() {
|
||||||
|
const fileListContainer = document.getElementById('pacshare-file-list');
|
||||||
|
const filesContainer = document.getElementById('pacshare-files-container');
|
||||||
|
const uploadBtn = document.getElementById('pacshare-upload-btn');
|
||||||
|
|
||||||
|
if (!filesContainer || !fileListContainer) return;
|
||||||
|
|
||||||
|
if (this.selectedFiles.length === 0) {
|
||||||
|
fileListContainer.style.display = 'none';
|
||||||
|
if (uploadBtn) uploadBtn.textContent = 'Upload and Generate Link';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
fileListContainer.style.display = 'block';
|
||||||
|
filesContainer.innerHTML = '';
|
||||||
|
|
||||||
|
// Update button text based on file count
|
||||||
|
if (uploadBtn) {
|
||||||
|
uploadBtn.textContent = this.selectedFiles.length === 1
|
||||||
|
? 'Upload and Generate Link'
|
||||||
|
: `Upload ${this.selectedFiles.length} Files and Generate Links`;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.selectedFiles.forEach((file, index) => {
|
||||||
|
const fileItem = document.createElement('div');
|
||||||
|
fileItem.className = 'file-item';
|
||||||
|
fileItem.innerHTML = `
|
||||||
|
<div class="file-info">
|
||||||
|
<div class="file-name">${file.name}</div>
|
||||||
|
<div class="file-size">${this.formatFileSize(file.size)}</div>
|
||||||
|
</div>
|
||||||
|
<div class="file-actions">
|
||||||
|
<button type="button" onclick="pacShareEnhanced.previewFile(${index})" style="padding: 5px 10px; font-size: 0.8em;">Preview</button>
|
||||||
|
<button type="button" onclick="pacShareEnhanced.removeFile(${index})" class="danger-button" style="padding: 5px 10px; font-size: 0.8em;">Remove</button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
filesContainer.appendChild(fileItem);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async previewFile(index) {
|
||||||
|
const file = this.selectedFiles[index];
|
||||||
|
if (!file) return;
|
||||||
|
|
||||||
|
const previewContainer = document.createElement('div');
|
||||||
|
previewContainer.className = 'file-preview-container';
|
||||||
|
|
||||||
|
const header = document.createElement('div');
|
||||||
|
header.className = 'file-preview-header';
|
||||||
|
header.textContent = `Preview: ${file.name}`;
|
||||||
|
|
||||||
|
const content = document.createElement('div');
|
||||||
|
content.className = 'file-preview-content';
|
||||||
|
|
||||||
|
// Handle different file types
|
||||||
|
if (file.type.startsWith('text/') || this.isTextFile(file.name)) {
|
||||||
|
try {
|
||||||
|
const text = await this.readFileAsText(file);
|
||||||
|
content.textContent = text.length > 2000 ? text.substring(0, 2000) + '...' : text;
|
||||||
|
} catch (error) {
|
||||||
|
content.textContent = 'Error reading file: ' + error.message;
|
||||||
|
}
|
||||||
|
} else if (file.type.startsWith('image/')) {
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.className = 'image-preview';
|
||||||
|
img.src = URL.createObjectURL(file);
|
||||||
|
img.onload = () => URL.revokeObjectURL(img.src);
|
||||||
|
content.appendChild(img);
|
||||||
|
} else {
|
||||||
|
content.innerHTML = `
|
||||||
|
<div style="color: #888;">
|
||||||
|
File Type: ${file.type || 'Unknown'}<br>
|
||||||
|
Size: ${this.formatFileSize(file.size)}<br>
|
||||||
|
Preview not available for this file type.
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
previewContainer.appendChild(header);
|
||||||
|
previewContainer.appendChild(content);
|
||||||
|
|
||||||
|
// Remove existing preview
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add new preview after the file list
|
||||||
|
const fileList = document.getElementById('pacshare-files-container');
|
||||||
|
if (fileList) {
|
||||||
|
fileList.parentNode.insertBefore(previewContainer, fileList.nextSibling);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
removeFile(index) {
|
||||||
|
this.selectedFiles.splice(index, 1);
|
||||||
|
this.updateFileDisplay();
|
||||||
|
|
||||||
|
// Remove preview if it exists
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
clearFiles() {
|
||||||
|
this.selectedFiles = [];
|
||||||
|
this.updateFileDisplay();
|
||||||
|
|
||||||
|
// Clear file input
|
||||||
|
const fileInput = document.getElementById('upload-file');
|
||||||
|
if (fileInput) fileInput.value = '';
|
||||||
|
|
||||||
|
// Remove preview if it exists
|
||||||
|
const existingPreview = document.querySelector('.file-preview-container');
|
||||||
|
if (existingPreview) {
|
||||||
|
existingPreview.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.hideResults();
|
||||||
|
}
|
||||||
|
|
||||||
|
async handleEnhancedSubmit(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
if (this.selectedFiles.length === 0) {
|
||||||
|
alert('Please select at least one file to upload.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const algorithm = document.getElementById('share-algorithm')?.value;
|
||||||
|
const encPassword = document.querySelector('input[name="enc_password"]')?.value;
|
||||||
|
const pickupPassword = document.querySelector('input[name="pickup_password"]')?.value;
|
||||||
|
const enable2FA = this.settings.enable2FA;
|
||||||
|
|
||||||
|
if (!algorithm || !encPassword || !pickupPassword) {
|
||||||
|
alert('Please fill in all required fields.');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.selectedFiles.length === 1) {
|
||||||
|
// Single file - use existing logic
|
||||||
|
await this.uploadSingleFile(this.selectedFiles[0], algorithm, encPassword, pickupPassword, enable2FA);
|
||||||
|
} else {
|
||||||
|
// Multiple files - use bulk upload
|
||||||
|
await this.uploadMultipleFiles(algorithm, encPassword, pickupPassword, enable2FA);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async uploadSingleFile(file, algorithm, encPassword, pickupPassword, enable2FA) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
formData.append('algorithm', algorithm);
|
||||||
|
formData.append('enc_password', encPassword);
|
||||||
|
formData.append('pickup_password', pickupPassword);
|
||||||
|
if (enable2FA) formData.append('enable_2fa', 'on');
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch('/', {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
if (data.error) {
|
||||||
|
alert(data.error);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (data.success && data.pickup_url) {
|
||||||
|
this.showSingleResult(data);
|
||||||
|
}
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
alert('Error uploading file: ' + error.message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async uploadMultipleFiles(algorithm, encPassword, pickupPassword, enable2FA) {
|
||||||
|
this.uploadResults = [];
|
||||||
|
this.showProgress();
|
||||||
|
|
||||||
|
// Upload files sequentially to avoid overwhelming the server
|
||||||
|
for (let i = 0; i < this.selectedFiles.length; i++) {
|
||||||
|
const file = this.selectedFiles[i];
|
||||||
|
this.updateFileProgress(i, 'uploading');
|
||||||
|
|
||||||
|
try {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', file);
|
||||||
|
formData.append('algorithm', algorithm);
|
||||||
|
formData.append('enc_password', encPassword);
|
||||||
|
formData.append('pickup_password', pickupPassword);
|
||||||
|
if (enable2FA) formData.append('enable_2fa', 'on');
|
||||||
|
|
||||||
|
const response = await fetch('/', {
|
||||||
|
method: 'POST',
|
||||||
|
body: formData
|
||||||
|
});
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
if (data.error) {
|
||||||
|
this.uploadResults.push({ file, error: data.error, success: false });
|
||||||
|
this.updateFileProgress(i, 'error');
|
||||||
|
} else if (data.success && data.pickup_url) {
|
||||||
|
this.uploadResults.push({ file, data, success: true });
|
||||||
|
this.updateFileProgress(i, 'completed');
|
||||||
|
}
|
||||||
|
|
||||||
|
} catch (error) {
|
||||||
|
this.uploadResults.push({ file, error: error.message, success: false });
|
||||||
|
this.updateFileProgress(i, 'error');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateOverallProgress(i + 1, this.selectedFiles.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.showResults();
|
||||||
|
}
|
||||||
|
|
||||||
|
showProgress() {
|
||||||
|
const progressSection = document.getElementById('pacshare-progress');
|
||||||
|
if (progressSection) {
|
||||||
|
progressSection.style.display = 'block';
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateOverallProgress(0, this.selectedFiles.length);
|
||||||
|
this.initializeFileProgress();
|
||||||
|
}
|
||||||
|
|
||||||
|
initializeFileProgress() {
|
||||||
|
const progressContainer = document.getElementById('pacshare-file-progress');
|
||||||
|
if (!progressContainer) return;
|
||||||
|
|
||||||
|
progressContainer.innerHTML = '';
|
||||||
|
|
||||||
|
this.selectedFiles.forEach((file, index) => {
|
||||||
|
const progressItem = document.createElement('div');
|
||||||
|
progressItem.className = 'file-progress-item';
|
||||||
|
progressItem.innerHTML = `
|
||||||
|
<div class="file-progress-name">${file.name}</div>
|
||||||
|
<div class="file-progress-status" id="pacshare-progress-${index}">Waiting</div>
|
||||||
|
`;
|
||||||
|
progressContainer.appendChild(progressItem);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateFileProgress(index, status) {
|
||||||
|
const statusElement = document.getElementById(`pacshare-progress-${index}`);
|
||||||
|
if (!statusElement) return;
|
||||||
|
|
||||||
|
statusElement.className = `file-progress-status status-${status}`;
|
||||||
|
|
||||||
|
switch (status) {
|
||||||
|
case 'uploading':
|
||||||
|
statusElement.textContent = 'Uploading...';
|
||||||
|
break;
|
||||||
|
case 'completed':
|
||||||
|
statusElement.textContent = 'Completed';
|
||||||
|
break;
|
||||||
|
case 'error':
|
||||||
|
statusElement.textContent = 'Error';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
statusElement.textContent = 'Waiting';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
updateOverallProgress(completed, total) {
|
||||||
|
const progressBar = document.getElementById('pacshare-overall-bar');
|
||||||
|
const progressText = document.getElementById('pacshare-overall-text');
|
||||||
|
|
||||||
|
if (progressBar) {
|
||||||
|
const percentage = total > 0 ? (completed / total) * 100 : 0;
|
||||||
|
progressBar.style.width = `${percentage}%`;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (progressText) {
|
||||||
|
progressText.textContent = `${completed} / ${total} files uploaded`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
showSingleResult(data) {
|
||||||
|
// Use existing single result display logic
|
||||||
|
const shareLink = document.getElementById('share-link');
|
||||||
|
const shareLinkContainer = document.getElementById('share-link-container');
|
||||||
|
|
||||||
|
if (shareLink && shareLinkContainer) {
|
||||||
|
shareLink.href = data.pickup_url;
|
||||||
|
shareLink.textContent = data.pickup_url;
|
||||||
|
shareLinkContainer.style.display = 'flex';
|
||||||
|
|
||||||
|
// Handle 2FA if enabled
|
||||||
|
if (data.qr_code_url) {
|
||||||
|
this.showTwoFactorSetup(data.qr_code_url, data.service_name, data.totp_secret);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear form
|
||||||
|
this.clearForm();
|
||||||
|
|
||||||
|
// Scroll to results
|
||||||
|
shareLinkContainer.scrollIntoView({ behavior: 'smooth' });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
showResults() {
|
||||||
|
const resultsSection = document.getElementById('pacshare-results');
|
||||||
|
const resultsList = document.getElementById('pacshare-results-list');
|
||||||
|
|
||||||
|
if (!resultsSection || !resultsList) return;
|
||||||
|
|
||||||
|
resultsSection.style.display = 'block';
|
||||||
|
resultsList.innerHTML = '';
|
||||||
|
|
||||||
|
const successCount = this.uploadResults.filter(r => r.success).length;
|
||||||
|
const totalCount = this.uploadResults.length;
|
||||||
|
|
||||||
|
// Add summary
|
||||||
|
const summary = document.createElement('div');
|
||||||
|
summary.style.cssText = 'padding: 15px; border-bottom: 1px solid #333; background-color: #1a1a1a; font-weight: bold;';
|
||||||
|
summary.innerHTML = `
|
||||||
|
<div style="color: #00ff99;">Upload Complete</div>
|
||||||
|
<div style="font-size: 0.9em; color: #ccc; margin-top: 5px;">
|
||||||
|
${successCount} successful, ${totalCount - successCount} failed out of ${totalCount} files
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
resultsList.appendChild(summary);
|
||||||
|
|
||||||
|
// Add individual results
|
||||||
|
this.uploadResults.forEach((result, index) => {
|
||||||
|
const resultItem = document.createElement('div');
|
||||||
|
resultItem.className = 'result-item';
|
||||||
|
|
||||||
|
if (result.success) {
|
||||||
|
resultItem.innerHTML = `
|
||||||
|
<div class="result-info">
|
||||||
|
<div class="result-name">✅ ${result.file.name}</div>
|
||||||
|
<div class="result-details">
|
||||||
|
<a href="${result.data.pickup_url}" target="_blank" style="color: #00ff99;">${result.data.pickup_url}</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="result-actions">
|
||||||
|
<button type="button" onclick="pacShareEnhanced.copyLink('${result.data.pickup_url}')" style="padding: 5px 10px; font-size: 0.8em;">Copy Link</button>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
resultItem.innerHTML = `
|
||||||
|
<div class="result-info">
|
||||||
|
<div class="result-name">❌ ${result.file.name}</div>
|
||||||
|
<div class="result-details">${result.error}</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
resultsList.appendChild(resultItem);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Clear form and scroll to results
|
||||||
|
this.clearForm();
|
||||||
|
resultsSection.scrollIntoView({ behavior: 'smooth' });
|
||||||
|
}
|
||||||
|
|
||||||
|
copyLink(url) {
|
||||||
|
navigator.clipboard.writeText(url).then(() => {
|
||||||
|
this.showToast('Link copied to clipboard!');
|
||||||
|
}).catch(() => {
|
||||||
|
// Fallback
|
||||||
|
const textArea = document.createElement('textarea');
|
||||||
|
textArea.value = url;
|
||||||
|
document.body.appendChild(textArea);
|
||||||
|
textArea.select();
|
||||||
|
document.execCommand('copy');
|
||||||
|
document.body.removeChild(textArea);
|
||||||
|
this.showToast('Link copied to clipboard!');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
showToast(message) {
|
||||||
|
const toast = document.createElement('div');
|
||||||
|
toast.style.cssText = `
|
||||||
|
position: fixed;
|
||||||
|
top: 20px;
|
||||||
|
right: 20px;
|
||||||
|
background-color: #00ff99;
|
||||||
|
color: #000;
|
||||||
|
padding: 10px 20px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: bold;
|
||||||
|
z-index: 10000;
|
||||||
|
opacity: 1;
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
|
`;
|
||||||
|
toast.textContent = message;
|
||||||
|
|
||||||
|
document.body.appendChild(toast);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
toast.style.opacity = '0';
|
||||||
|
setTimeout(() => {
|
||||||
|
if (toast.parentNode) {
|
||||||
|
toast.parentNode.removeChild(toast);
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
}, 2000);
|
||||||
|
}
|
||||||
|
|
||||||
|
clearForm() {
|
||||||
|
// Clear passwords but keep algorithm
|
||||||
|
const encPassword = document.querySelector('input[name="enc_password"]');
|
||||||
|
const pickupPassword = document.querySelector('input[name="pickup_password"]');
|
||||||
|
const enable2FA = document.getElementById('enable-2fa');
|
||||||
|
|
||||||
|
if (encPassword) encPassword.value = '';
|
||||||
|
if (pickupPassword) pickupPassword.value = '';
|
||||||
|
if (enable2FA) enable2FA.checked = false;
|
||||||
|
|
||||||
|
// Clear selected files
|
||||||
|
this.clearFiles();
|
||||||
|
}
|
||||||
|
|
||||||
|
hideResults() {
|
||||||
|
const sections = ['pacshare-results', 'pacshare-progress', 'share-link-container'];
|
||||||
|
sections.forEach(id => {
|
||||||
|
const section = document.getElementById(id);
|
||||||
|
if (section) section.style.display = 'none';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateUI() {
|
||||||
|
// Hide results when new files are selected
|
||||||
|
this.hideResults();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Utility methods
|
||||||
|
formatFileSize(bytes) {
|
||||||
|
if (bytes === 0) return '0 Bytes';
|
||||||
|
const k = 1024;
|
||||||
|
const sizes = ['Bytes', 'KB', 'MB', 'GB'];
|
||||||
|
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||||
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
|
||||||
|
}
|
||||||
|
|
||||||
|
isTextFile(filename) {
|
||||||
|
const textExtensions = ['.txt', '.md', '.js', '.html', '.css', '.json', '.xml', '.csv', '.log', '.py', '.java', '.c', '.cpp', '.h'];
|
||||||
|
return textExtensions.some(ext => filename.toLowerCase().endsWith(ext));
|
||||||
|
}
|
||||||
|
|
||||||
|
readFileAsText(file) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = e => resolve(e.target.result);
|
||||||
|
reader.onerror = e => reject(new Error('Failed to read file'));
|
||||||
|
reader.readAsText(file);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
showTwoFactorSetup(qrCodeUrl, serviceName, totpSecret) {
|
||||||
|
const container = document.getElementById('tfa-setup-container');
|
||||||
|
const qrImage = document.getElementById('tfa-qr-image');
|
||||||
|
const tfaString = document.getElementById('tfa-string');
|
||||||
|
|
||||||
|
if (container && qrImage && tfaString) {
|
||||||
|
qrImage.src = qrCodeUrl;
|
||||||
|
tfaString.value = totpSecret;
|
||||||
|
container.style.display = 'block';
|
||||||
|
container.scrollIntoView({ behavior: 'smooth' });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Settings Modal Methods
|
||||||
|
setupSettingsModal() {
|
||||||
|
const settingsBtn = document.getElementById("pacshare-settings-btn");
|
||||||
|
const modal = document.getElementById("pacshare-settings-modal");
|
||||||
|
const closeBtn = document.getElementById("close-pacshare-settings");
|
||||||
|
const applyBtn = document.getElementById("apply-pacshare-settings");
|
||||||
|
const resetBtn = document.getElementById("reset-pacshare-settings");
|
||||||
|
|
||||||
|
if (settingsBtn && modal) {
|
||||||
|
settingsBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "flex";
|
||||||
|
this.updateSettingsModal();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (closeBtn && modal) {
|
||||||
|
closeBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "none";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close modal when clicking outside
|
||||||
|
if (modal) {
|
||||||
|
modal.addEventListener("click", (e) => {
|
||||||
|
if (e.target === modal) {
|
||||||
|
modal.style.display = "none";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (applyBtn && modal) {
|
||||||
|
applyBtn.addEventListener("click", () => {
|
||||||
|
this.applySettings();
|
||||||
|
modal.style.display = "none";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (resetBtn) {
|
||||||
|
resetBtn.addEventListener("click", () => {
|
||||||
|
this.resetSettings();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Input validation
|
||||||
|
const uploadSizeInput = document.getElementById("max-upload-size-input");
|
||||||
|
const concurrentInput = document.getElementById("concurrent-uploads-input");
|
||||||
|
|
||||||
|
if (uploadSizeInput) {
|
||||||
|
uploadSizeInput.addEventListener("input", () => {
|
||||||
|
let value = parseInt(uploadSizeInput.value);
|
||||||
|
if (value < 1) uploadSizeInput.value = 1;
|
||||||
|
else if (value > 1000) uploadSizeInput.value = 1000;
|
||||||
|
this.updateSettingsSummary();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (concurrentInput) {
|
||||||
|
concurrentInput.addEventListener("input", () => {
|
||||||
|
let value = parseInt(concurrentInput.value);
|
||||||
|
if (value < 1) concurrentInput.value = 1;
|
||||||
|
else if (value > 10) concurrentInput.value = 10;
|
||||||
|
this.updateSettingsSummary();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update summary when checkboxes change
|
||||||
|
const checkboxIds = [
|
||||||
|
"enable-2fa-setting", "auto-clear-passwords", "auto-copy-links",
|
||||||
|
"show-upload-progress", "scroll-to-results", "validate-file-types",
|
||||||
|
"enable-file-preview", "remember-algorithm"
|
||||||
|
];
|
||||||
|
|
||||||
|
checkboxIds.forEach(id => {
|
||||||
|
const checkbox = document.getElementById(id);
|
||||||
|
if (checkbox) {
|
||||||
|
checkbox.addEventListener("change", () => {
|
||||||
|
this.updateSettingsSummary();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
updateSettingsModal() {
|
||||||
|
// Set checkbox values
|
||||||
|
const checkboxMap = {
|
||||||
|
"enable-2fa-setting": "enable2FA",
|
||||||
|
"auto-clear-passwords": "autoClearPasswords",
|
||||||
|
"auto-copy-links": "autoCopyLinks",
|
||||||
|
"show-upload-progress": "showUploadProgress",
|
||||||
|
"scroll-to-results": "scrollToResults",
|
||||||
|
"validate-file-types": "validateFileTypes",
|
||||||
|
"enable-file-preview": "enableFilePreview",
|
||||||
|
"remember-algorithm": "rememberAlgorithm"
|
||||||
|
};
|
||||||
|
|
||||||
|
Object.entries(checkboxMap).forEach(([id, setting]) => {
|
||||||
|
const checkbox = document.getElementById(id);
|
||||||
|
if (checkbox) {
|
||||||
|
checkbox.checked = this.settings[setting];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set number inputs
|
||||||
|
const uploadSizeInput = document.getElementById("max-upload-size-input");
|
||||||
|
const concurrentInput = document.getElementById("concurrent-uploads-input");
|
||||||
|
|
||||||
|
if (uploadSizeInput) uploadSizeInput.value = this.settings.maxUploadSizeMB;
|
||||||
|
if (concurrentInput) concurrentInput.value = this.settings.concurrentUploads;
|
||||||
|
|
||||||
|
this.updateSettingsSummary();
|
||||||
|
}
|
||||||
|
|
||||||
|
updateSettingsSummary() {
|
||||||
|
const summary = document.getElementById("pacshare-settings-summary");
|
||||||
|
if (!summary) return;
|
||||||
|
|
||||||
|
const enable2FA = document.getElementById("enable-2fa-setting")?.checked || this.settings.enable2FA;
|
||||||
|
const autoClearPasswords = document.getElementById("auto-clear-passwords")?.checked || this.settings.autoClearPasswords;
|
||||||
|
const maxSize = document.getElementById("max-upload-size-input")?.value || this.settings.maxUploadSizeMB;
|
||||||
|
const concurrent = document.getElementById("concurrent-uploads-input")?.value || this.settings.concurrentUploads;
|
||||||
|
|
||||||
|
summary.innerHTML = `
|
||||||
|
• 2FA: ${enable2FA ? 'Enabled' : 'Disabled'}<br>
|
||||||
|
• Auto-clear passwords: ${autoClearPasswords ? 'Yes' : 'No'}<br>
|
||||||
|
• Max file size: ${maxSize} MB<br>
|
||||||
|
• Upload mode: ${concurrent == 1 ? 'Sequential' : `${concurrent} concurrent`}<br>
|
||||||
|
• File preview: ${this.settings.enableFilePreview ? 'Enabled' : 'Disabled'}
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
applySettings() {
|
||||||
|
// Get checkbox values
|
||||||
|
const checkboxMap = {
|
||||||
|
"enable-2fa-setting": "enable2FA",
|
||||||
|
"auto-clear-passwords": "autoClearPasswords",
|
||||||
|
"auto-copy-links": "autoCopyLinks",
|
||||||
|
"show-upload-progress": "showUploadProgress",
|
||||||
|
"scroll-to-results": "scrollToResults",
|
||||||
|
"validate-file-types": "validateFileTypes",
|
||||||
|
"enable-file-preview": "enableFilePreview",
|
||||||
|
"remember-algorithm": "rememberAlgorithm"
|
||||||
|
};
|
||||||
|
|
||||||
|
Object.entries(checkboxMap).forEach(([id, setting]) => {
|
||||||
|
const checkbox = document.getElementById(id);
|
||||||
|
if (checkbox) {
|
||||||
|
this.settings[setting] = checkbox.checked;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Get number inputs
|
||||||
|
const uploadSizeInput = document.getElementById("max-upload-size-input");
|
||||||
|
const concurrentInput = document.getElementById("concurrent-uploads-input");
|
||||||
|
|
||||||
|
if (uploadSizeInput) this.settings.maxUploadSizeMB = parseInt(uploadSizeInput.value) || 25;
|
||||||
|
if (concurrentInput) this.settings.concurrentUploads = parseInt(concurrentInput.value) || 1;
|
||||||
|
|
||||||
|
this.saveSettings();
|
||||||
|
this.showToast("PacShare settings applied successfully!");
|
||||||
|
}
|
||||||
|
|
||||||
|
resetSettings() {
|
||||||
|
this.settings = {
|
||||||
|
enable2FA: false,
|
||||||
|
autoClearPasswords: true,
|
||||||
|
autoCopyLinks: true,
|
||||||
|
showUploadProgress: true,
|
||||||
|
scrollToResults: true,
|
||||||
|
maxUploadSizeMB: 25,
|
||||||
|
validateFileTypes: false,
|
||||||
|
concurrentUploads: 1,
|
||||||
|
enableFilePreview: true,
|
||||||
|
rememberAlgorithm: true
|
||||||
|
};
|
||||||
|
|
||||||
|
this.updateSettingsModal();
|
||||||
|
this.showToast("Settings reset to defaults!");
|
||||||
|
}
|
||||||
|
|
||||||
|
loadSettings() {
|
||||||
|
try {
|
||||||
|
const saved = localStorage.getItem('paccrypt-pacshare-settings');
|
||||||
|
if (saved) {
|
||||||
|
this.settings = { ...this.settings, ...JSON.parse(saved) };
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.warn('Failed to load PacShare settings:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
saveSettings() {
|
||||||
|
try {
|
||||||
|
localStorage.setItem('paccrypt-pacshare-settings', JSON.stringify(this.settings));
|
||||||
|
} catch (error) {
|
||||||
|
console.warn('Failed to save PacShare settings:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initialize enhanced PacShare when DOM is loaded
|
||||||
|
let pacShareEnhanced;
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
pacShareEnhanced = new PacShareEnhanced();
|
||||||
|
// Make available globally for onclick handlers
|
||||||
|
window.pacShareEnhanced = pacShareEnhanced;
|
||||||
|
});
|
||||||
+368
-5
@@ -61,6 +61,9 @@ function setupElementListeners(elements) {
|
|||||||
console.log("Mode:", elements.toggleSwitch.checked ? "Decrypt" : "Encrypt");
|
console.log("Mode:", elements.toggleSwitch.checked ? "Decrypt" : "Encrypt");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Password generator controls
|
||||||
|
setupPasswordGeneratorListeners();
|
||||||
|
|
||||||
// Key pair management listeners
|
// Key pair management listeners
|
||||||
elements.generateKeypairBtn?.addEventListener("click", generateAndDownloadKeyPair);
|
elements.generateKeypairBtn?.addEventListener("click", generateAndDownloadKeyPair);
|
||||||
elements.loadPublicKeyBtn?.addEventListener("click", () => elements.publicKeyFile?.click());
|
elements.loadPublicKeyBtn?.addEventListener("click", () => elements.publicKeyFile?.click());
|
||||||
@@ -218,19 +221,379 @@ function removeFile() {
|
|||||||
toggleInputMode();
|
toggleInputMode();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ===== Advanced Password Generator =====
|
||||||
function generateRandomPassword() {
|
function generateRandomPassword() {
|
||||||
const charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+[]{}|;:,.<>?/~";
|
const settings = getPasswordSettings();
|
||||||
const length = 30;
|
|
||||||
const password = Array.from({ length }, () =>
|
if (!settings.charset || settings.charset.length === 0) {
|
||||||
charset.charAt(Math.floor(Math.random() * charset.length))
|
alert("Please select at least one character type for password generation!");
|
||||||
).join("");
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const password = generatePassword(settings.length, settings.charset);
|
||||||
const passwordField = document.getElementById("generated-password");
|
const passwordField = document.getElementById("generated-password");
|
||||||
|
|
||||||
if (passwordField) {
|
if (passwordField) {
|
||||||
passwordField.value = password;
|
passwordField.value = password;
|
||||||
|
updatePasswordStrength(password);
|
||||||
checkForPacman();
|
checkForPacman();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getPasswordSettings() {
|
||||||
|
const length = parseInt(document.getElementById("password-length-input")?.value || 16);
|
||||||
|
const includeUppercase = document.getElementById("include-uppercase")?.checked;
|
||||||
|
const includeLowercase = document.getElementById("include-lowercase")?.checked;
|
||||||
|
const includeNumbers = document.getElementById("include-numbers")?.checked;
|
||||||
|
const includeSpecial = document.getElementById("include-special")?.checked;
|
||||||
|
const excludeAmbiguous = document.getElementById("exclude-ambiguous")?.checked;
|
||||||
|
const customCharacters = document.getElementById("custom-characters")?.value || "";
|
||||||
|
|
||||||
|
let charset = "";
|
||||||
|
|
||||||
|
// Character sets
|
||||||
|
const sets = {
|
||||||
|
uppercase: "ABCDEFGHIJKLMNOPQRSTUVWXYZ",
|
||||||
|
lowercase: "abcdefghijklmnopqrstuvwxyz",
|
||||||
|
numbers: "0123456789",
|
||||||
|
special: "!@#$%^&*()_+-=[]{}|;:,.<>?/~"
|
||||||
|
};
|
||||||
|
|
||||||
|
// Ambiguous characters to exclude
|
||||||
|
const ambiguous = "0O1lI";
|
||||||
|
|
||||||
|
if (includeUppercase) charset += sets.uppercase;
|
||||||
|
if (includeLowercase) charset += sets.lowercase;
|
||||||
|
if (includeNumbers) charset += sets.numbers;
|
||||||
|
if (includeSpecial) charset += sets.special;
|
||||||
|
|
||||||
|
// Add custom characters
|
||||||
|
if (customCharacters) {
|
||||||
|
charset += customCharacters;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove ambiguous characters if requested
|
||||||
|
if (excludeAmbiguous) {
|
||||||
|
charset = charset.split('').filter(char => !ambiguous.includes(char)).join('');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove duplicates
|
||||||
|
charset = [...new Set(charset)].join('');
|
||||||
|
|
||||||
|
return { length, charset, settings: { includeUppercase, includeLowercase, includeNumbers, includeSpecial } };
|
||||||
|
}
|
||||||
|
|
||||||
|
function generatePassword(length, charset) {
|
||||||
|
// Use crypto.getRandomValues for cryptographically secure random generation
|
||||||
|
const array = new Uint32Array(length);
|
||||||
|
crypto.getRandomValues(array);
|
||||||
|
|
||||||
|
return Array.from(array, (x) => charset[x % charset.length]).join('');
|
||||||
|
}
|
||||||
|
|
||||||
|
function updatePasswordStrength(password) {
|
||||||
|
const score = calculatePasswordStrength(password);
|
||||||
|
const strengthText = document.getElementById("password-strength-text");
|
||||||
|
const strengthFill = document.getElementById("password-strength-fill");
|
||||||
|
const strengthScore = document.getElementById("strength-score");
|
||||||
|
const strengthFeedback = document.getElementById("strength-feedback");
|
||||||
|
|
||||||
|
if (!strengthText || !strengthFill || !strengthScore || !strengthFeedback) return;
|
||||||
|
|
||||||
|
strengthScore.textContent = `Score: ${score.score}/100`;
|
||||||
|
strengthFeedback.textContent = score.feedback;
|
||||||
|
|
||||||
|
// Update strength level and colors
|
||||||
|
let level, color, width;
|
||||||
|
if (score.score < 30) {
|
||||||
|
level = "Very Weak";
|
||||||
|
color = "#ff4444";
|
||||||
|
width = "20%";
|
||||||
|
} else if (score.score < 50) {
|
||||||
|
level = "Weak";
|
||||||
|
color = "#ff8800";
|
||||||
|
width = "40%";
|
||||||
|
} else if (score.score < 70) {
|
||||||
|
level = "Fair";
|
||||||
|
color = "#ffaa00";
|
||||||
|
width = "60%";
|
||||||
|
} else if (score.score < 85) {
|
||||||
|
level = "Strong";
|
||||||
|
color = "#88ff00";
|
||||||
|
width = "80%";
|
||||||
|
} else {
|
||||||
|
level = "Very Strong";
|
||||||
|
color = "#00ff44";
|
||||||
|
width = "100%";
|
||||||
|
}
|
||||||
|
|
||||||
|
strengthText.textContent = level;
|
||||||
|
strengthText.style.color = color;
|
||||||
|
strengthFill.style.backgroundColor = color;
|
||||||
|
strengthFill.style.width = width;
|
||||||
|
}
|
||||||
|
|
||||||
|
function calculatePasswordStrength(password) {
|
||||||
|
if (!password) return { score: 0, feedback: "Enter a password to see strength analysis" };
|
||||||
|
|
||||||
|
let score = 0;
|
||||||
|
const feedback = [];
|
||||||
|
|
||||||
|
// Length scoring
|
||||||
|
if (password.length >= 8) score += 10;
|
||||||
|
if (password.length >= 12) score += 10;
|
||||||
|
if (password.length >= 16) score += 10;
|
||||||
|
if (password.length >= 20) score += 5;
|
||||||
|
|
||||||
|
// Character variety scoring
|
||||||
|
const hasLower = /[a-z]/.test(password);
|
||||||
|
const hasUpper = /[A-Z]/.test(password);
|
||||||
|
const hasNumber = /[0-9]/.test(password);
|
||||||
|
const hasSpecial = /[^a-zA-Z0-9]/.test(password);
|
||||||
|
|
||||||
|
let varieties = 0;
|
||||||
|
if (hasLower) { score += 5; varieties++; }
|
||||||
|
if (hasUpper) { score += 5; varieties++; }
|
||||||
|
if (hasNumber) { score += 5; varieties++; }
|
||||||
|
if (hasSpecial) { score += 10; varieties++; }
|
||||||
|
|
||||||
|
// Bonus for character variety
|
||||||
|
if (varieties >= 3) score += 10;
|
||||||
|
if (varieties === 4) score += 5;
|
||||||
|
|
||||||
|
// Pattern penalties
|
||||||
|
if (/(.)\1{2,}/.test(password)) {
|
||||||
|
score -= 10;
|
||||||
|
feedback.push("Avoid repeating characters");
|
||||||
|
}
|
||||||
|
|
||||||
|
if (/123|abc|qwe|password|admin|test/i.test(password)) {
|
||||||
|
score -= 15;
|
||||||
|
feedback.push("Avoid common patterns or words");
|
||||||
|
}
|
||||||
|
|
||||||
|
// Entropy calculation
|
||||||
|
const uniqueChars = new Set(password).size;
|
||||||
|
const entropy = password.length * Math.log2(uniqueChars);
|
||||||
|
if (entropy > 60) score += 15;
|
||||||
|
else if (entropy > 40) score += 10;
|
||||||
|
else if (entropy > 30) score += 5;
|
||||||
|
|
||||||
|
// Generate specific feedback
|
||||||
|
if (password.length < 8) feedback.push("Use at least 8 characters");
|
||||||
|
if (password.length < 12) feedback.push("12+ characters recommended");
|
||||||
|
if (!hasLower) feedback.push("Add lowercase letters");
|
||||||
|
if (!hasUpper) feedback.push("Add uppercase letters");
|
||||||
|
if (!hasNumber) feedback.push("Add numbers");
|
||||||
|
if (!hasSpecial) feedback.push("Add special characters");
|
||||||
|
|
||||||
|
if (feedback.length === 0) {
|
||||||
|
feedback.push("Excellent password strength!");
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
score: Math.min(100, Math.max(0, score)),
|
||||||
|
feedback: feedback.join(", ")
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function setupPasswordGeneratorListeners() {
|
||||||
|
// Modal controls
|
||||||
|
const settingsBtn = document.getElementById("password-settings-btn");
|
||||||
|
const modal = document.getElementById("password-settings-modal");
|
||||||
|
const closeBtn = document.getElementById("close-password-settings");
|
||||||
|
const applyBtn = document.getElementById("apply-password-settings");
|
||||||
|
const resetBtn = document.getElementById("reset-password-settings");
|
||||||
|
|
||||||
|
if (settingsBtn && modal) {
|
||||||
|
settingsBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "flex";
|
||||||
|
updateCharsetPreview();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (closeBtn && modal) {
|
||||||
|
closeBtn.addEventListener("click", () => {
|
||||||
|
modal.style.display = "none";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Close modal when clicking outside
|
||||||
|
if (modal) {
|
||||||
|
modal.addEventListener("click", (e) => {
|
||||||
|
if (e.target === modal) {
|
||||||
|
modal.style.display = "none";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (applyBtn && modal) {
|
||||||
|
applyBtn.addEventListener("click", () => {
|
||||||
|
generateRandomPassword();
|
||||||
|
modal.style.display = "none";
|
||||||
|
showPasswordFeedback("Settings applied and password regenerated!");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (resetBtn) {
|
||||||
|
resetBtn.addEventListener("click", () => {
|
||||||
|
resetPasswordSettings();
|
||||||
|
updateCharsetPreview();
|
||||||
|
showPasswordFeedback("Settings reset to defaults!");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Length controls (slider and number input)
|
||||||
|
const lengthSlider = document.getElementById("password-length");
|
||||||
|
const lengthInput = document.getElementById("password-length-input");
|
||||||
|
|
||||||
|
if (lengthSlider && lengthInput) {
|
||||||
|
// Sync slider to number input
|
||||||
|
lengthSlider.addEventListener("input", () => {
|
||||||
|
lengthInput.value = lengthSlider.value;
|
||||||
|
updateCharsetPreview();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Sync number input to slider
|
||||||
|
lengthInput.addEventListener("input", () => {
|
||||||
|
let value = parseInt(lengthInput.value);
|
||||||
|
|
||||||
|
// Validate bounds
|
||||||
|
if (value < 8) {
|
||||||
|
value = 8;
|
||||||
|
lengthInput.value = 8;
|
||||||
|
} else if (value > 128) {
|
||||||
|
value = 128;
|
||||||
|
lengthInput.value = 128;
|
||||||
|
}
|
||||||
|
|
||||||
|
lengthSlider.value = value;
|
||||||
|
updateCharsetPreview();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Handle edge cases for number input
|
||||||
|
lengthInput.addEventListener("blur", () => {
|
||||||
|
if (!lengthInput.value || lengthInput.value < 8) {
|
||||||
|
lengthInput.value = 8;
|
||||||
|
lengthSlider.value = 8;
|
||||||
|
updateCharsetPreview();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Allow Enter key to apply changes
|
||||||
|
lengthInput.addEventListener("keypress", (e) => {
|
||||||
|
if (e.key === "Enter") {
|
||||||
|
lengthInput.blur();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Character set checkboxes
|
||||||
|
const checkboxes = [
|
||||||
|
"include-uppercase",
|
||||||
|
"include-lowercase",
|
||||||
|
"include-numbers",
|
||||||
|
"include-special",
|
||||||
|
"exclude-ambiguous"
|
||||||
|
];
|
||||||
|
|
||||||
|
checkboxes.forEach(id => {
|
||||||
|
const checkbox = document.getElementById(id);
|
||||||
|
if (checkbox) {
|
||||||
|
checkbox.addEventListener("change", () => {
|
||||||
|
updateCharsetPreview();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Custom characters input
|
||||||
|
const customCharsInput = document.getElementById("custom-characters");
|
||||||
|
if (customCharsInput) {
|
||||||
|
customCharsInput.addEventListener("input", () => {
|
||||||
|
updateCharsetPreview();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Password visibility toggle
|
||||||
|
const toggleVisibilityBtn = document.getElementById("toggle-password-visibility");
|
||||||
|
const passwordField = document.getElementById("generated-password");
|
||||||
|
|
||||||
|
if (toggleVisibilityBtn && passwordField) {
|
||||||
|
toggleVisibilityBtn.addEventListener("click", () => {
|
||||||
|
if (passwordField.type === "password") {
|
||||||
|
passwordField.type = "text";
|
||||||
|
toggleVisibilityBtn.textContent = "🙈";
|
||||||
|
} else {
|
||||||
|
passwordField.type = "password";
|
||||||
|
toggleVisibilityBtn.textContent = "👁️";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Use password in form button
|
||||||
|
const usePasswordBtn = document.getElementById("use-password-btn");
|
||||||
|
if (usePasswordBtn) {
|
||||||
|
usePasswordBtn.addEventListener("click", () => {
|
||||||
|
const generatedPassword = document.getElementById("generated-password")?.value;
|
||||||
|
const passwordInput = document.getElementById("password");
|
||||||
|
|
||||||
|
if (generatedPassword && passwordInput) {
|
||||||
|
passwordInput.value = generatedPassword;
|
||||||
|
showPasswordFeedback("Password applied to form!");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Monitor password field for manual changes to update strength
|
||||||
|
if (passwordField) {
|
||||||
|
passwordField.addEventListener("input", () => {
|
||||||
|
updatePasswordStrength(passwordField.value);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Generate initial password
|
||||||
|
generateRandomPassword();
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateCharsetPreview() {
|
||||||
|
const settings = getPasswordSettings();
|
||||||
|
const preview = document.getElementById("charset-preview");
|
||||||
|
|
||||||
|
if (preview) {
|
||||||
|
if (settings.charset && settings.charset.length > 0) {
|
||||||
|
preview.textContent = `Characters (${settings.charset.length}): ${settings.charset}`;
|
||||||
|
} else {
|
||||||
|
preview.textContent = "⚠️ No character types selected! Please select at least one character type.";
|
||||||
|
preview.style.color = "#ff6b6b";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetPasswordSettings() {
|
||||||
|
// Reset to default values
|
||||||
|
document.getElementById("password-length").value = 16;
|
||||||
|
document.getElementById("password-length-input").value = 16;
|
||||||
|
document.getElementById("include-uppercase").checked = true;
|
||||||
|
document.getElementById("include-lowercase").checked = true;
|
||||||
|
document.getElementById("include-numbers").checked = true;
|
||||||
|
document.getElementById("include-special").checked = true;
|
||||||
|
document.getElementById("exclude-ambiguous").checked = false;
|
||||||
|
document.getElementById("custom-characters").value = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
function showPasswordFeedback(message) {
|
||||||
|
const feedback = document.getElementById("password-copy-feedback");
|
||||||
|
if (feedback) {
|
||||||
|
const originalText = feedback.textContent;
|
||||||
|
feedback.textContent = message;
|
||||||
|
showFeedback(feedback);
|
||||||
|
// Reset feedback text after showing
|
||||||
|
setTimeout(() => {
|
||||||
|
feedback.textContent = originalText;
|
||||||
|
}, 3000);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function copyToClipboard(elementId, feedbackId) {
|
function copyToClipboard(elementId, feedbackId) {
|
||||||
const el = document.getElementById(elementId);
|
const el = document.getElementById(elementId);
|
||||||
const feedback = document.getElementById(feedbackId);
|
const feedback = document.getElementById(feedbackId);
|
||||||
|
|||||||
+458
-134
@@ -15,6 +15,9 @@
|
|||||||
|
|
||||||
<!-- Scripts -->
|
<!-- Scripts -->
|
||||||
<script type="module" src="{{ url_for('static', filename='js/main.js') }}" defer></script>
|
<script type="module" src="{{ url_for('static', filename='js/main.js') }}" defer></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/bulk-operations.js') }}" defer></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/crypto-settings.js') }}" defer></script>
|
||||||
|
<script src="{{ url_for('static', filename='js/pacshare-enhanced.js') }}" defer></script>
|
||||||
</head>
|
</head>
|
||||||
<body class="dark">
|
<body class="dark">
|
||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
@@ -32,17 +35,343 @@
|
|||||||
<main>
|
<main>
|
||||||
<!-- Password Generator Section -->
|
<!-- Password Generator Section -->
|
||||||
<section id="password-generator-section" class="card form-group">
|
<section id="password-generator-section" class="card form-group">
|
||||||
<h2>Password Generator</h2>
|
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;">
|
||||||
|
<h2 style="margin: 0;">Password Generator</h2>
|
||||||
|
<button type="button" id="password-settings-btn" class="settings-button" title="Password Settings">
|
||||||
|
⚙️
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Generated Password Display -->
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<input type="text" id="generated-password" readonly />
|
<label for="generated-password">Generated Password:</label>
|
||||||
<div class="button-group">
|
<div style="position: relative;">
|
||||||
<button type="button" id="generate-btn">Generate</button>
|
<input type="text" id="generated-password" readonly style="font-family: monospace;" />
|
||||||
|
<button type="button" id="toggle-password-visibility" style="position: absolute; right: 5px; top: 50%; transform: translateY(-50%); background: none; border: none; color: #00ff99; cursor: pointer;">👁️</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Password Strength Meter -->
|
||||||
|
<div id="password-strength-container" style="margin-top: 10px;">
|
||||||
|
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 5px;">
|
||||||
|
<label style="margin: 0;">Password Strength:</label>
|
||||||
|
<span id="password-strength-text" style="font-weight: bold; color: #ff6b6b;">No Password</span>
|
||||||
|
</div>
|
||||||
|
<div id="password-strength-bar" style="width: 100%; height: 10px; background-color: #333; border-radius: 5px; overflow: hidden;">
|
||||||
|
<div id="password-strength-fill" style="height: 100%; width: 0%; background-color: #ff6b6b; transition: all 0.3s ease;"></div>
|
||||||
|
</div>
|
||||||
|
<div id="password-strength-details" style="margin-top: 8px; font-size: 0.9em; color: #ccc;">
|
||||||
|
<div id="strength-score" style="margin-bottom: 3px;">Score: 0/100</div>
|
||||||
|
<div id="strength-feedback"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="button-group" style="margin-top: 15px;">
|
||||||
|
<button type="button" id="generate-btn">Generate Password</button>
|
||||||
<button type="button" id="copy-btn">Copy Password</button>
|
<button type="button" id="copy-btn">Copy Password</button>
|
||||||
|
<button type="button" id="use-password-btn">Use in Form</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="password-copy-feedback" class="copy-feedback">Password copied to clipboard!</div>
|
<div id="password-copy-feedback" class="copy-feedback">Password copied to clipboard!</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Password Settings Modal -->
|
||||||
|
<div id="password-settings-modal" class="modal-overlay" style="display: none;">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h3>Password Generator Settings</h3>
|
||||||
|
<button type="button" id="close-password-settings" class="close-button">✕</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-body">
|
||||||
|
<!-- Password Length -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<div class="length-header">
|
||||||
|
<label for="password-length">Length:</label>
|
||||||
|
<div class="length-input-container">
|
||||||
|
<input type="number" id="password-length-input" min="8" max="128" value="16" class="length-number-input" />
|
||||||
|
<span class="length-unit">characters</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<input type="range" id="password-length" min="8" max="128" value="16" class="length-slider" />
|
||||||
|
<div class="length-labels">
|
||||||
|
<span>8</span>
|
||||||
|
<span>32</span>
|
||||||
|
<span>64</span>
|
||||||
|
<span>128</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Character Set Options -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Character Types</h4>
|
||||||
|
<div class="checkbox-grid">
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="include-uppercase" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Uppercase (A-Z)
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="include-lowercase" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Lowercase (a-z)
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="include-numbers" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Numbers (0-9)
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="include-special" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Special Characters
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Advanced Options -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Advanced Options</h4>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="exclude-ambiguous" />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Exclude ambiguous characters (0, O, l, 1, I)
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Custom Characters -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<label for="custom-characters">Custom Characters</label>
|
||||||
|
<input type="text" id="custom-characters" placeholder="Add custom characters..." class="custom-input" />
|
||||||
|
<div class="setting-hint">Add any additional characters you want to include</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Preview -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Character Set Preview</h4>
|
||||||
|
<div id="charset-preview" class="charset-preview">Loading...</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" id="reset-password-settings" class="secondary-button">Reset to Defaults</button>
|
||||||
|
<button type="button" id="apply-password-settings" class="primary-button">Apply Settings</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Crypto Settings Modal -->
|
||||||
|
<div id="crypto-settings-modal" class="modal-overlay" style="display: none;">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h3>Encryption Settings</h3>
|
||||||
|
<button type="button" id="close-crypto-settings" class="close-button">✕</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-body">
|
||||||
|
<!-- Processing Mode -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Processing Mode</h4>
|
||||||
|
<div class="mode-selection">
|
||||||
|
<label class="radio-item">
|
||||||
|
<input type="radio" name="processing-mode" id="single-file-mode-radio" value="single" checked />
|
||||||
|
<span class="radiomark"></span>
|
||||||
|
<div class="radio-content">
|
||||||
|
<div class="radio-title">Single File</div>
|
||||||
|
<div class="radio-description">Process one file at a time</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
<label class="radio-item">
|
||||||
|
<input type="radio" name="processing-mode" id="bulk-file-mode-radio" value="bulk" />
|
||||||
|
<span class="radiomark"></span>
|
||||||
|
<div class="radio-content">
|
||||||
|
<div class="radio-title">Bulk Processing</div>
|
||||||
|
<div class="radio-description">Process multiple files with drag & drop</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- File Preview Options -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>File Preview</h4>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="enable-file-preview" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Enable file preview before processing
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="auto-download-results" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Automatically download processed files
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Bulk Processing Options -->
|
||||||
|
<div class="setting-group" id="bulk-options" style="display: none;">
|
||||||
|
<h4>Bulk Processing Options</h4>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="sequential-processing" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Process files sequentially (prevents server overload)
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="show-detailed-progress" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Show detailed progress for each file
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="stop-on-error" />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
Stop processing if any file fails
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Performance Settings -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Performance</h4>
|
||||||
|
<div class="setting-item">
|
||||||
|
<label for="max-file-size">Maximum file size (MB):</label>
|
||||||
|
<div class="size-input-container">
|
||||||
|
<input type="number" id="max-file-size-input" min="1" max="1000" value="100" class="size-number-input" />
|
||||||
|
<span class="size-unit">MB</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="setting-hint">Files larger than this will show a warning</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" id="reset-crypto-settings" class="secondary-button">Reset to Defaults</button>
|
||||||
|
<button type="button" id="apply-crypto-settings" class="primary-button">Apply Settings</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- PacShare Settings Modal -->
|
||||||
|
<div id="pacshare-settings-modal" class="modal-overlay" style="display: none;">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h3>PacShare Settings</h3>
|
||||||
|
<button type="button" id="close-pacshare-settings" class="close-button">✕</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-body">
|
||||||
|
<!-- Security Options -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Security</h4>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="enable-2fa-setting" />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Enable 2FA (TOTP)</div>
|
||||||
|
<div class="checkbox-description">Adds extra security with Google Authenticator, Authy, etc.</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="auto-clear-passwords" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Auto-clear passwords after upload</div>
|
||||||
|
<div class="checkbox-description">Automatically clear password fields for security</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Upload Behavior -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Upload Behavior</h4>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="auto-copy-links" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Auto-copy share links</div>
|
||||||
|
<div class="checkbox-description">Automatically copy links to clipboard after upload</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="show-upload-progress" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Show detailed upload progress</div>
|
||||||
|
<div class="checkbox-description">Display progress bars for each file</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="scroll-to-results" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Auto-scroll to results</div>
|
||||||
|
<div class="checkbox-description">Automatically scroll to results after upload</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- File Validation -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>File Validation</h4>
|
||||||
|
<div class="setting-item">
|
||||||
|
<label for="max-upload-size">Maximum file size per upload (MB):</label>
|
||||||
|
<div class="size-input-container">
|
||||||
|
<input type="number" id="max-upload-size-input" min="1" max="1000" value="25" class="size-number-input" />
|
||||||
|
<span class="size-unit">MB</span>
|
||||||
|
</div>
|
||||||
|
<div class="setting-hint">Files larger than this will show a warning</div>
|
||||||
|
</div>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="validate-file-types" />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Validate file types</div>
|
||||||
|
<div class="checkbox-description">Show warnings for potentially unsafe file types</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Advanced Options -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Advanced</h4>
|
||||||
|
<div class="setting-item">
|
||||||
|
<label for="concurrent-uploads">Maximum concurrent uploads:</label>
|
||||||
|
<div class="size-input-container">
|
||||||
|
<input type="number" id="concurrent-uploads-input" min="1" max="10" value="1" class="size-number-input" />
|
||||||
|
<span class="size-unit">files</span>
|
||||||
|
</div>
|
||||||
|
<div class="setting-hint">1 = sequential uploads (recommended), higher = parallel uploads</div>
|
||||||
|
</div>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="enable-file-preview" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Enable file preview</div>
|
||||||
|
<div class="checkbox-description">Allow previewing files before upload</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
<label class="checkbox-item">
|
||||||
|
<input type="checkbox" id="remember-algorithm" checked />
|
||||||
|
<span class="checkmark"></span>
|
||||||
|
<div class="checkbox-content">
|
||||||
|
<div class="checkbox-title">Remember encryption algorithm</div>
|
||||||
|
<div class="checkbox-description">Remember the last selected algorithm</div>
|
||||||
|
</div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Current Settings Summary -->
|
||||||
|
<div class="setting-group">
|
||||||
|
<h4>Current Configuration</h4>
|
||||||
|
<div id="pacshare-settings-summary" class="charset-preview">
|
||||||
|
Loading current settings...
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" id="reset-pacshare-settings" class="secondary-button">Reset to Defaults</button>
|
||||||
|
<button type="button" id="apply-pacshare-settings" class="primary-button">Apply Settings</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Key Management Section -->
|
<!-- Key Management Section -->
|
||||||
<section id="key-pairs-section" class="card form-group">
|
<section id="key-pairs-section" class="card form-group">
|
||||||
<h2>Key Management</h2>
|
<h2>Key Management</h2>
|
||||||
@@ -106,7 +435,12 @@
|
|||||||
|
|
||||||
<!-- Encryption/Decryption Section -->
|
<!-- Encryption/Decryption Section -->
|
||||||
<section id="encoding-section" class="card form-group">
|
<section id="encoding-section" class="card form-group">
|
||||||
<h2>Encrypt & Decrypt</h2>
|
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;">
|
||||||
|
<h2 style="margin: 0;">Encrypt & Decrypt</h2>
|
||||||
|
<button type="button" id="crypto-settings-btn" class="settings-button" title="Encryption Settings">
|
||||||
|
⚙️
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
<form id="crypto-form" class="form-group">
|
<form id="crypto-form" class="form-group">
|
||||||
<!-- Algorithm Selection -->
|
<!-- Algorithm Selection -->
|
||||||
<div class="form-group" id="algorithm-selection">
|
<div class="form-group" id="algorithm-selection">
|
||||||
@@ -159,8 +493,55 @@
|
|||||||
|
|
||||||
<!-- File Input Section -->
|
<!-- File Input Section -->
|
||||||
<div id="file-section" class="form-group">
|
<div id="file-section" class="form-group">
|
||||||
<input type="file" id="file-input" />
|
<!-- Single File Input (default) -->
|
||||||
<button type="button" id="remove-file-btn">Remove File</button>
|
<div id="single-file-mode">
|
||||||
|
<input type="file" id="file-input" />
|
||||||
|
<button type="button" id="remove-file-btn">Remove File</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Bulk File Mode (hidden by default) -->
|
||||||
|
<div id="bulk-file-mode" style="display: none;">
|
||||||
|
<!-- Drag & Drop Zone -->
|
||||||
|
<div id="bulk-drop-zone" class="drop-zone">
|
||||||
|
<div class="drop-zone-content">
|
||||||
|
<div class="drop-zone-icon">📁</div>
|
||||||
|
<p>Drag & drop files here or <button type="button" id="bulk-file-select">select files</button></p>
|
||||||
|
<p style="font-size: 0.9em; color: #888;">Supports multiple files</p>
|
||||||
|
</div>
|
||||||
|
<input type="file" id="bulk-file-input" multiple style="display: none;" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- File Preview Section -->
|
||||||
|
<div id="bulk-file-preview" style="display: none; margin-top: 15px;">
|
||||||
|
<h3>Selected Files</h3>
|
||||||
|
<div id="bulk-file-list" class="file-list"></div>
|
||||||
|
<div class="button-group" style="margin-top: 15px;">
|
||||||
|
<button type="button" id="bulk-clear-btn" class="danger-button">Clear All</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Progress Section -->
|
||||||
|
<div id="bulk-progress-section" style="display: none; margin-top: 15px;">
|
||||||
|
<h3>Processing Progress</h3>
|
||||||
|
<div id="bulk-overall-progress" class="progress-container">
|
||||||
|
<div class="progress-bar">
|
||||||
|
<div id="bulk-overall-bar" class="progress-fill"></div>
|
||||||
|
</div>
|
||||||
|
<span id="bulk-overall-text">0 / 0 files processed</span>
|
||||||
|
</div>
|
||||||
|
<div id="bulk-file-progress-list" class="file-progress-list"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Results Section -->
|
||||||
|
<div id="bulk-results-section" style="display: none; margin-top: 15px;">
|
||||||
|
<h3>Results</h3>
|
||||||
|
<div id="bulk-results-list" class="results-list"></div>
|
||||||
|
<div class="button-group" style="margin-top: 15px;">
|
||||||
|
<button type="button" id="bulk-download-all">Download All Results</button>
|
||||||
|
<button type="button" id="bulk-reset">Start Over</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Action Buttons -->
|
<!-- Action Buttons -->
|
||||||
@@ -180,8 +561,15 @@
|
|||||||
|
|
||||||
<!-- File Sharing Section -->
|
<!-- File Sharing Section -->
|
||||||
<section id="sharing-section" class="card form-group">
|
<section id="sharing-section" class="card form-group">
|
||||||
<h2 style="margin-bottom: unset;">PacShare</h2>
|
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;">
|
||||||
<p style="margin-top: unset;">Securely share encrypted files.</p>
|
<div>
|
||||||
|
<h2 style="margin: 0;">PacShare</h2>
|
||||||
|
<p style="margin: 5px 0 0 0;">Securely share encrypted files.</p>
|
||||||
|
</div>
|
||||||
|
<button type="button" id="pacshare-settings-btn" class="settings-button" title="PacShare Settings">
|
||||||
|
⚙️
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Flash Messages -->
|
<!-- Flash Messages -->
|
||||||
{% with messages = get_flashed_messages() %}
|
{% with messages = get_flashed_messages() %}
|
||||||
@@ -206,6 +594,63 @@
|
|||||||
|
|
||||||
|
|
||||||
<!-- File Upload Form -->
|
<!-- File Upload Form -->
|
||||||
|
<form method="POST" enctype="multipart/form-data" class="form-group" id="upload-form">
|
||||||
|
<!-- Algorithm Selection for PacShare -->
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="share-algorithm">Encryption Algorithm:</label>
|
||||||
|
<select id="share-algorithm" name="algorithm">
|
||||||
|
<!-- Options populated dynamically by JavaScript -->
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Enhanced File Upload Section -->
|
||||||
|
<div class="form-group">
|
||||||
|
<!-- Drag & Drop Zone for PacShare -->
|
||||||
|
<div id="pacshare-drop-zone" class="drop-zone">
|
||||||
|
<div class="drop-zone-content">
|
||||||
|
<div class="drop-zone-icon">📤</div>
|
||||||
|
<p>Drag & drop files here or <button type="button" id="pacshare-file-select">select files</button></p>
|
||||||
|
<p style="font-size: 0.9em; color: #888;">Single file or multiple files supported</p>
|
||||||
|
</div>
|
||||||
|
<input type="file" name="file" id="upload-file" multiple style="display: none;" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Selected Files Display -->
|
||||||
|
<div id="pacshare-file-list" style="display: none; margin-top: 15px;">
|
||||||
|
<h4 style="color: #00ff99; margin-bottom: 10px;">Selected Files</h4>
|
||||||
|
<div id="pacshare-files-container" class="file-list"></div>
|
||||||
|
<div class="button-group" style="margin-top: 10px;">
|
||||||
|
<button type="button" id="pacshare-clear-files" class="danger-button">Clear All</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<input type="password" name="enc_password" placeholder="Encryption/Decryption Password" required />
|
||||||
|
<input type="password" name="pickup_password" placeholder="Pickup Password" required />
|
||||||
|
|
||||||
|
<div class="button-group">
|
||||||
|
<button type="submit" id="pacshare-upload-btn">Upload and Generate Links</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<!-- Results Section -->
|
||||||
|
<div id="pacshare-results" style="display: none; margin-top: 20px;">
|
||||||
|
<h3 style="color: #00ff99;">Upload Results</h3>
|
||||||
|
<div id="pacshare-results-list" class="results-list"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Progress Section -->
|
||||||
|
<div id="pacshare-progress" style="display: none; margin-top: 20px;">
|
||||||
|
<h3>Upload Progress</h3>
|
||||||
|
<div id="pacshare-overall-progress" class="progress-container">
|
||||||
|
<div class="progress-bar">
|
||||||
|
<div id="pacshare-overall-bar" class="progress-fill"></div>
|
||||||
|
</div>
|
||||||
|
<span id="pacshare-overall-text">0 / 0 files uploaded</span>
|
||||||
|
</div>
|
||||||
|
<div id="pacshare-file-progress" class="file-progress-list"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- Share Link Container (initially hidden) -->
|
<!-- Share Link Container (initially hidden) -->
|
||||||
<div class="share-link-container" id="share-link-container" style="display: none;">
|
<div class="share-link-container" id="share-link-container" style="display: none;">
|
||||||
<a id="share-link" href="#" target="_blank"></a>
|
<a id="share-link" href="#" target="_blank"></a>
|
||||||
@@ -220,7 +665,7 @@
|
|||||||
<div style="text-align: center; margin: 15px 0;">
|
<div style="text-align: center; margin: 15px 0;">
|
||||||
<img id="tfa-qr-image" src="" alt="2FA QR Code" style="max-width: 200px; border: 2px solid #00ff99;" />
|
<img id="tfa-qr-image" src="" alt="2FA QR Code" style="max-width: 200px; border: 2px solid #00ff99;" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 2FA String Container -->
|
<!-- 2FA String Container -->
|
||||||
<div style="margin-top: 15px; padding: 10px; border: 1px solid #00ff99; border-radius: 5px; background-color: #001100;">
|
<div style="margin-top: 15px; padding: 10px; border: 1px solid #00ff99; border-radius: 5px; background-color: #001100;">
|
||||||
<p style="color: #00ff99; margin: 5px 0; font-size: 0.9em;"><strong>Or manually enter this string:</strong></p>
|
<p style="color: #00ff99; margin: 5px 0; font-size: 0.9em;"><strong>Or manually enter this string:</strong></p>
|
||||||
@@ -230,135 +675,14 @@
|
|||||||
<div id="tfa-string-feedback" class="copy-feedback">2FA string copied to clipboard!</div>
|
<div id="tfa-string-feedback" class="copy-feedback">2FA string copied to clipboard!</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p style="color: #ff6b6b; font-weight: bold; margin-top: 15px;">⚠️ SAVE THIS QR CODE OR STRING NOW! It will not be shown again for security reasons.</p>
|
<p style="color: #ff6b6b; font-weight: bold; margin-top: 15px;">⚠️ SAVE THIS QR CODE OR STRING NOW! It will not be shown again for security reasons.</p>
|
||||||
<p style="color: #ccc; font-size: 0.9em;">Recommended apps: Google Authenticator, Authy, Microsoft Authenticator</p>
|
<p style="color: #ccc; font-size: 0.9em;">Recommended apps: Google Authenticator, Authy, Microsoft Authenticator</p>
|
||||||
<button type="button" onclick="closeTwoFactorSetup()">I've Saved the 2FA Information</button>
|
<button type="button" onclick="pacShareEnhanced && pacShareEnhanced.closeTwoFactorSetup ? pacShareEnhanced.closeTwoFactorSetup() : (document.getElementById('tfa-setup-container').style.display = 'none')">I've Saved the 2FA Information</button>
|
||||||
</div>
|
</div>
|
||||||
<form method="POST" enctype="multipart/form-data" class="form-group" id="upload-form">
|
|
||||||
<!-- Algorithm Selection for PacShare -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="share-algorithm">Encryption Algorithm:</label>
|
|
||||||
<select id="share-algorithm" name="algorithm">
|
|
||||||
<!-- Options populated dynamically by JavaScript -->
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<input type="file" name="file" id="upload-file" required />
|
|
||||||
<input type="password" name="enc_password" placeholder="Encryption/Decryption Password" required />
|
|
||||||
<input type="password" name="pickup_password" placeholder="Pickup Password" required />
|
|
||||||
|
|
||||||
<!-- 2FA Option -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label>
|
|
||||||
<input type="checkbox" name="enable_2fa" id="enable-2fa" />
|
|
||||||
Enable 2FA (TOTP) - Adds extra security with Google Authenticator, Authy, etc.
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="button-group">
|
|
||||||
<button type="submit">Upload and Generate Link</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
<p style="color: #9c0000;">BOTH PASSWORDS ARE REQUIRED FOR PICKUP</p>
|
<p style="color: #9c0000;">BOTH PASSWORDS ARE REQUIRED FOR PICKUP</p>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
document.getElementById('upload-form').addEventListener('submit', async (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
const formData = new FormData(e.target);
|
|
||||||
|
|
||||||
try {
|
|
||||||
const response = await fetch('/', {
|
|
||||||
method: 'POST',
|
|
||||||
body: formData
|
|
||||||
});
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
if (data.error) {
|
|
||||||
alert(data.error);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (data.success && data.pickup_url) {
|
|
||||||
const shareLink = document.getElementById('share-link');
|
|
||||||
const shareLinkContainer = document.getElementById('share-link-container');
|
|
||||||
|
|
||||||
shareLink.href = data.pickup_url;
|
|
||||||
shareLink.textContent = data.pickup_url;
|
|
||||||
shareLinkContainer.style.display = 'flex';
|
|
||||||
|
|
||||||
// If 2FA is enabled, show the QR code immediately
|
|
||||||
if (data.qr_code_url) {
|
|
||||||
showTwoFactorSetup(data.qr_code_url, data.service_name, data.totp_secret);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Clear form fields
|
|
||||||
document.getElementById('upload-file').value = '';
|
|
||||||
document.getElementsByName('enc_password')[0].value = '';
|
|
||||||
document.getElementsByName('pickup_password')[0].value = '';
|
|
||||||
document.getElementById('enable-2fa').checked = false;
|
|
||||||
|
|
||||||
// Scroll to the share link
|
|
||||||
shareLinkContainer.scrollIntoView({ behavior: 'smooth' });
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
alert('Error uploading file: ' + error.message);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 2FA Setup Functions
|
|
||||||
function showTwoFactorSetup(qrCodeUrl, serviceName, totpSecret) {
|
|
||||||
const container = document.getElementById('tfa-setup-container');
|
|
||||||
const qrImage = document.getElementById('tfa-qr-image');
|
|
||||||
const tfaString = document.getElementById('tfa-string');
|
|
||||||
|
|
||||||
qrImage.src = qrCodeUrl;
|
|
||||||
tfaString.value = totpSecret;
|
|
||||||
container.style.display = 'block';
|
|
||||||
|
|
||||||
// Scroll to the 2FA setup
|
|
||||||
container.scrollIntoView({ behavior: 'smooth' });
|
|
||||||
}
|
|
||||||
|
|
||||||
function closeTwoFactorSetup() {
|
|
||||||
const container = document.getElementById('tfa-setup-container');
|
|
||||||
container.style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Copy share link functionality
|
|
||||||
document.getElementById('copy-share-btn').addEventListener('click', () => {
|
|
||||||
const shareLink = document.getElementById('share-link');
|
|
||||||
const feedback = document.getElementById('shared-link-feedback');
|
|
||||||
|
|
||||||
navigator.clipboard.writeText(shareLink.href).then(() => {
|
|
||||||
feedback.style.display = 'block';
|
|
||||||
feedback.classList.add('show');
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
feedback.classList.remove('show');
|
|
||||||
setTimeout(() => {
|
|
||||||
feedback.style.display = 'none';
|
|
||||||
}, 300);
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Copy 2FA string functionality
|
|
||||||
document.getElementById('copy-tfa-string-btn').addEventListener('click', () => {
|
|
||||||
const tfaString = document.getElementById('tfa-string');
|
|
||||||
const feedback = document.getElementById('tfa-string-feedback');
|
|
||||||
|
|
||||||
navigator.clipboard.writeText(tfaString.value).then(() => {
|
|
||||||
feedback.style.display = 'block';
|
|
||||||
feedback.classList.add('show');
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
feedback.classList.remove('show');
|
|
||||||
setTimeout(() => {
|
|
||||||
feedback.style.display = 'none';
|
|
||||||
}, 300);
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Centralized Key Pairs Management
|
// Centralized Key Pairs Management
|
||||||
let globalKeys = {
|
let globalKeys = {
|
||||||
publicKey: null,
|
publicKey: null,
|
||||||
|
|||||||
Reference in New Issue
Block a user