Basic quility of like improvements.
This commit is contained in:
Aaron D. Lee
@@ -4,6 +4,7 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% block title %}Stegasoo{% endblock %}</title>
|
||||
<link rel="icon" type="image/svg+xml" href="{{ url_for('static', filename='favicon.svg') }}">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<style>
|
||||
@@ -121,7 +122,7 @@
|
||||
<nav class="navbar navbar-expand-lg navbar-dark">
|
||||
<div class="container">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/">
|
||||
<i class="bi bi-shield-lock-fill me-2"></i>
|
||||
<img src="{{ url_for('static', filename='logo.svg') }}" alt="Stegasoo" height="36" class="me-2">
|
||||
<span class="fw-bold">Stegasoo</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
@@ -168,7 +169,7 @@
|
||||
<footer class="py-4 mt-5">
|
||||
<div class="container text-center text-muted">
|
||||
<small>
|
||||
<i class="bi bi-shield-check me-1"></i>
|
||||
<img src="{{ url_for('static', filename='favicon.svg') }}" alt="" height="16" class="me-1" style="vertical-align: text-bottom;">
|
||||
Stegasoo v3.1 — Hybrid Photo + Day-Phrase + PIN Steganography
|
||||
</small>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}Decode Message - Stegasoo{% endblock %}
|
||||
{% block title %}Decode Message - StegoCrypt{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
|
||||
@@ -51,7 +51,7 @@
|
||||
<input type="text" name="day_phrase" class="form-control"
|
||||
placeholder="e.g., correct horse battery" required>
|
||||
<div class="form-text">
|
||||
Your 3-word phrase for today (from your phrase card)
|
||||
Your phrase for <strong>today</strong> (based on your local timezone)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -68,7 +68,7 @@
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-lg w-100" id="encodeBtn">
|
||||
<i class="bi bi-lock me-2"></i>Encode & Download
|
||||
<i class="bi bi-lock me-2"></i>Encode Message
|
||||
</button>
|
||||
</form>
|
||||
|
||||
@@ -106,25 +106,8 @@
|
||||
<script>
|
||||
document.getElementById('encodeForm').addEventListener('submit', function(e) {
|
||||
const btn = document.getElementById('encodeBtn');
|
||||
|
||||
btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Encoding...';
|
||||
btn.disabled = true;
|
||||
|
||||
// Argon2 key derivation can take a few seconds
|
||||
// Reset button after encoding completes (file downloads don't navigate)
|
||||
setTimeout(function() {
|
||||
btn.innerHTML = '<i class="bi bi-check-circle me-2"></i>Done! Encode Another?';
|
||||
btn.disabled = false;
|
||||
btn.classList.remove('btn-primary');
|
||||
btn.classList.add('btn-success');
|
||||
|
||||
// Reset to original state after a moment
|
||||
setTimeout(function() {
|
||||
btn.innerHTML = '<i class="bi bi-lock me-2"></i>Encode & Download';
|
||||
btn.classList.remove('btn-success');
|
||||
btn.classList.add('btn-primary');
|
||||
}, 2000);
|
||||
}, 4000); // 4 seconds for Argon2 + embedding
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
142
templates/encode_result.html
Normal file
142
templates/encode_result.html
Normal file
@@ -0,0 +1,142 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}Message Encoded - Stegasoo{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h5 class="mb-0"><i class="bi bi-check-circle-fill me-2"></i>Message Encoded Successfully!</h5>
|
||||
</div>
|
||||
<div class="card-body text-center">
|
||||
<div class="mb-4">
|
||||
<i class="bi bi-file-earmark-image text-success" style="font-size: 4rem;"></i>
|
||||
<h5 class="mt-3">{{ filename }}</h5>
|
||||
<p class="text-muted">Your secret message is hidden in this image</p>
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-3 mb-4">
|
||||
<a href="{{ url_for('encode_download', file_id=file_id) }}"
|
||||
class="btn btn-primary btn-lg" id="downloadBtn">
|
||||
<i class="bi bi-download me-2"></i>Download Image
|
||||
</a>
|
||||
|
||||
<button type="button" class="btn btn-outline-light btn-lg" id="shareBtn">
|
||||
<i class="bi bi-share me-2"></i>Share Image
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Fallback share options (shown if Web Share API unavailable) -->
|
||||
<div id="shareFallback" class="d-none">
|
||||
<p class="text-muted mb-3">Share via:</p>
|
||||
<div class="d-flex justify-content-center gap-2 flex-wrap">
|
||||
<a href="#" id="shareEmail" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-envelope me-1"></i>Email
|
||||
</a>
|
||||
<a href="#" id="shareTelegram" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-telegram me-1"></i>Telegram
|
||||
</a>
|
||||
<a href="#" id="shareWhatsapp" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-whatsapp me-1"></i>WhatsApp
|
||||
</a>
|
||||
<button type="button" id="copyLink" class="btn btn-outline-secondary">
|
||||
<i class="bi bi-link-45deg me-1"></i>Copy Link
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="my-4">
|
||||
|
||||
<div class="alert alert-warning small text-start">
|
||||
<i class="bi bi-clock me-1"></i>
|
||||
<strong>File expires in 5 minutes.</strong>
|
||||
Download or share now. The file will be securely deleted after expiry.
|
||||
</div>
|
||||
|
||||
<a href="{{ url_for('encode') }}" class="btn btn-outline-light">
|
||||
<i class="bi bi-plus-circle me-2"></i>Encode Another Message
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
<script>
|
||||
const fileId = "{{ file_id }}";
|
||||
const filename = "{{ filename }}";
|
||||
const fileUrl = "{{ url_for('encode_file', file_id=file_id, _external=True) }}";
|
||||
const downloadUrl = "{{ url_for('encode_download', file_id=file_id, _external=True) }}";
|
||||
|
||||
const shareBtn = document.getElementById('shareBtn');
|
||||
const shareFallback = document.getElementById('shareFallback');
|
||||
|
||||
// Check if Web Share API with files is supported
|
||||
async function canShareFiles() {
|
||||
if (!navigator.canShare) return false;
|
||||
|
||||
// Create a test file to check
|
||||
const testFile = new File(['test'], 'test.png', { type: 'image/png' });
|
||||
return navigator.canShare({ files: [testFile] });
|
||||
}
|
||||
|
||||
shareBtn.addEventListener('click', async function() {
|
||||
const canShare = await canShareFiles();
|
||||
|
||||
if (canShare) {
|
||||
try {
|
||||
// Fetch the image as a blob
|
||||
const response = await fetch(fileUrl);
|
||||
const blob = await response.blob();
|
||||
const file = new File([blob], filename, { type: 'image/png' });
|
||||
|
||||
await navigator.share({
|
||||
files: [file],
|
||||
title: 'Shared Image',
|
||||
});
|
||||
|
||||
// Cleanup after successful share
|
||||
fetch("{{ url_for('encode_cleanup', file_id=file_id) }}", { method: 'POST' });
|
||||
|
||||
} catch (err) {
|
||||
if (err.name !== 'AbortError') {
|
||||
console.error('Share failed:', err);
|
||||
shareFallback.classList.remove('d-none');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// Show fallback options
|
||||
shareFallback.classList.remove('d-none');
|
||||
}
|
||||
});
|
||||
|
||||
// Fallback share links
|
||||
document.getElementById('shareEmail').href =
|
||||
`mailto:?subject=Shared Image&body=Check out this image: ${downloadUrl}`;
|
||||
|
||||
document.getElementById('shareTelegram').href =
|
||||
`https://t.me/share/url?url=${encodeURIComponent(downloadUrl)}`;
|
||||
|
||||
document.getElementById('shareWhatsapp').href =
|
||||
`https://wa.me/?text=${encodeURIComponent('Check this out: ' + downloadUrl)}`;
|
||||
|
||||
document.getElementById('copyLink').addEventListener('click', function() {
|
||||
navigator.clipboard.writeText(downloadUrl).then(() => {
|
||||
this.innerHTML = '<i class="bi bi-check me-1"></i>Copied!';
|
||||
setTimeout(() => {
|
||||
this.innerHTML = '<i class="bi bi-link-45deg me-1"></i>Copy Link';
|
||||
}, 2000);
|
||||
});
|
||||
});
|
||||
|
||||
// Cleanup after download
|
||||
document.getElementById('downloadBtn').addEventListener('click', function() {
|
||||
// Give time for download to start, then cleanup
|
||||
setTimeout(() => {
|
||||
fetch("{{ url_for('encode_cleanup', file_id=file_id) }}", { method: 'POST' });
|
||||
}, 3000);
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
@@ -1,6 +1,6 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}Generate Phrase Card - Stegasoo{% endblock %}
|
||||
{% block title %}Generate Phrase Card - StegoCrypt{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row justify-content-center">
|
||||
@@ -85,15 +85,15 @@
|
||||
<table class="table table-dark table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 120px;">Day</th>
|
||||
<th style="width: 140px;">Day</th>
|
||||
<th>Phrase</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for day in days %}
|
||||
<tr>
|
||||
<td>
|
||||
<i class="bi bi-calendar-day me-2"></i>{{ day }}
|
||||
<td class="text-nowrap">
|
||||
<i class="bi bi-calendar3 me-2"></i>{{ day }}
|
||||
</td>
|
||||
<td>
|
||||
<span class="phrase-display">{{ phrases[day] }}</span>
|
||||
|
||||
@@ -4,8 +4,8 @@
|
||||
|
||||
{% block content %}
|
||||
<div class="text-center mb-5">
|
||||
<i class="bi bi-shield-lock-fill hero-icon"></i>
|
||||
<h1 class="display-4 fw-bold mt-3">Stegasoo</h1>
|
||||
<img src="{{ url_for('static', filename='logo.svg') }}" alt="Stegasoo" height="120" class="mb-3">
|
||||
<h1 class="display-4 fw-bold">Stegasoo</h1>
|
||||
<p class="lead text-muted">Hide encrypted messages in plain sight using advanced steganography</p>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user