alee/stegasoo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WebUI Fixes for 3.2

Browse Source
This commit is contained in:
Aaron D. Lee
2026-01-01 03:39:44 -05:00
parent 657cae0ae6
commit 3898031480
2 changed files with 31 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
frontends/web/templates/decode.html
View File

@@ -95,26 +95,17 @@
</div> </div>
</div> </div>
<!-- Hidden field for encoding date (auto-detected from filename) -->
<input type="hidden" name="stego_date" id="stegoDate" value="">
<div class="mb-3"> <div class="mb-3">
<label class="form-label" id="dayPhraseLabel"> <label class="form-label">
<i class="bi bi-chat-quote me-1"></i> Day Phrase <i class="bi bi-chat-quote me-1"></i> Passphrase
</label> </label>
<input type="text" name="day_phrase" class="form-control" <input type="text" name="passphrase" class="form-control"
placeholder="e.g., correct horse battery" required> placeholder="e.g., correct horse battery staple" required>
<div class="form-text"> <div class="form-text">
The phrase for the day the message was encoded The passphrase used during encoding (typically 4 words)
</div> </div>
</div> </div>
<!-- Date detection info -->
<div class="alert alert-info small d-none" id="dateDetectedAlert">
<i class="bi bi-calendar-check me-1"></i>
<span id="dateDetectedText">Date detected from filename</span>
</div>
<hr class="my-4"> <hr class="my-4">
<h6 class="text-muted mb-3"> <h6 class="text-muted mb-3">
@@ -268,28 +259,32 @@
<h6 class="text-muted mb-3"><i class="bi bi-question-circle me-2"></i>Troubleshooting</h6> <h6 class="text-muted mb-3"><i class="bi bi-question-circle me-2"></i>Troubleshooting</h6>
<ul class="list-unstyled text-muted small mb-0"> <ul class="list-unstyled text-muted small mb-0">
<li class="mb-2"> <li class="mb-2">
<i class="bi bi-dot"></i> <i class="bi bi-check-circle-fill text-success me-1"></i>
Make sure you're using the <strong>exact same reference photo</strong> file Use the <strong>exact same reference photo</strong> file (byte-for-byte identical)
</li> </li>
<li class="mb-2"> <li class="mb-2">
<i class="bi bi-dot"></i> <i class="bi bi-check-circle-fill text-success me-1"></i>
Use the phrase for the <strong>day the message was encoded</strong>, not today Enter the <strong>exact passphrase</strong> used during encoding (case-sensitive, spacing matters)
</li> </li>
<li class="mb-2"> <li class="mb-2">
<i class="bi bi-dot"></i> <i class="bi bi-check-circle-fill text-success me-1"></i>
Provide the <strong>same security factors</strong> (PIN and/or RSA key) used during encoding Provide the <strong>same security factors</strong> (PIN and/or RSA key) used during encoding
</li> </li>
<li class="mb-2"> <li class="mb-2">
<i class="bi bi-dot"></i> <i class="bi bi-exclamation-triangle-fill text-warning me-1"></i>
Ensure the stego image hasn't been <strong>resized or recompressed</strong> Ensure the stego image hasn't been <strong>resized, cropped, or recompressed</strong>
</li> </li>
<li class="mb-2"> <li class="mb-2">
<i class="bi bi-dot"></i> <i class="bi bi-exclamation-triangle-fill text-warning me-1"></i>
If using an RSA key, make sure the <strong>password is correct</strong> <strong>Format compatibility:</strong> v3.2.0 cannot decode messages from v3.1.0 (different format)
</li>
<li class="mb-2">
<i class="bi bi-info-circle-fill text-info me-1"></i>
If using an RSA key, verify the <strong>password is correct</strong> (if key is encrypted)
</li> </li>
<li class="mb-0"> <li class="mb-0">
<i class="bi bi-dot"></i> <i class="bi bi-info-circle-fill text-info me-1"></i>
<strong>v3.0:</strong> If auto-detection fails, try specifying <strong>LSB or DCT mode</strong> in Advanced Options If auto-detection fails, try specifying <strong>LSB or DCT mode</strong> in Advanced Options
</li> </li>
</ul> </ul>
</div> </div>
@@ -309,84 +304,22 @@ document.getElementById('decodeForm')?.addEventListener('submit', function() {
btn.disabled = true; btn.disabled = true;
}); });
// Show RSA password field when key is selected (only for .pem files, not QR) // Show RSA password field when key is selected
const rsaKeyInput = document.getElementById('rsaKeyInput'); const rsaKeyInput = document.getElementById('rsaKeyInput');
const rsaKeyQrInput = document.getElementById('rsaKeyQrInput'); const rsaKeyQrInput = document.getElementById('rsaKeyQrInput');
const rsaPasswordGroup = document.getElementById('rsaPasswordGroup'); const rsaPasswordGroup = document.getElementById('rsaPasswordGroup');
if (rsaKeyInput) { function checkRsaKeySelected() {
rsaKeyInput.addEventListener('change', function() { const hasFile = (rsaKeyInput && rsaKeyInput.files.length > 0) ||
// Show password field only for .pem files (rsaKeyQrInput && rsaKeyQrInput.files.length > 0);
rsaPasswordGroup.classList.toggle('d-none', !this.files.length); if (rsaPasswordGroup) {
// Clear QR input if file is selected rsaPasswordGroup.classList.toggle('d-none', !hasFile);
if (rsaKeyQrInput && this.files.length) {
rsaKeyQrInput.value = '';
}
});
}
if (rsaKeyQrInput) {
rsaKeyQrInput.addEventListener('change', function() {
// Hide password field for QR codes (they're unencrypted)
rsaPasswordGroup.classList.add('d-none');
// Clear file input if QR is selected
if (rsaKeyInput && this.files.length) {
rsaKeyInput.value = '';
}
});
}
// Day names for date detection
const dayNames = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
// Detect day AND date from filename - FIXED VERSION
function detectDayFromFilename(filename) {
// Match patterns like _20251227 or _2025-12-27
const compactMatch = filename.match(/_(\d{4})(\d{2})(\d{2})/);
const dashedMatch = filename.match(/_(\d{4})-(\d{2})-(\d{2})/);
const dateMatch = compactMatch || dashedMatch;
if (dateMatch) {
const [, year, month, day] = dateMatch;
const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
const dayName = dayNames[date.getDay()];
// Return ISO format date string for the server
const dateStr = `${year}-${month.padStart(2, '0')}-${day.padStart(2, '0')}`;
console.log('Detected date from filename:', dateStr, 'Day:', dayName);
return {
dayName: dayName,
dateStr: dateStr
};
}
return null;
}
// Update day phrase label AND set hidden date field
function updateDayLabel(dayName, dateStr) {
const label = document.getElementById('dayPhraseLabel');
if (label && dayName) {
label.innerHTML = `<i class="bi bi-chat-quote me-1"></i>Provide <span class="day-of-week-highlight">${dayName}</span>'s Phrase`;
}
// CRITICAL FIX: Set the hidden date field for the server
const dateField = document.getElementById('stegoDate');
if (dateField && dateStr) {
dateField.value = dateStr;
console.log('Set stego_date hidden field to:', dateStr);
}
// Show info alert about detected date
const dateAlert = document.getElementById('dateDetectedAlert');
const dateText = document.getElementById('dateDetectedText');
if (dateAlert && dateText && dateStr) {
dateText.textContent = `Encoding date detected: ${dateStr} (${dayName})`;
dateAlert.classList.remove('d-none');
} }
} }
rsaKeyInput?.addEventListener('change', checkRsaKeySelected);
rsaKeyQrInput?.addEventListener('change', checkRsaKeySelected);
// PIN Toggle // PIN Toggle
document.getElementById('togglePin')?.addEventListener('click', function() { document.getElementById('togglePin')?.addEventListener('click', function() {
const input = document.getElementById('pinInput'); const input = document.getElementById('pinInput');
@@ -461,7 +394,6 @@ document.querySelectorAll('.drop-zone').forEach(zone => {
const input = zone.querySelector('input[type="file"]'); const input = zone.querySelector('input[type="file"]');
const label = zone.querySelector('.drop-zone-label'); const label = zone.querySelector('.drop-zone-label');
const preview = zone.querySelector('.drop-zone-preview'); const preview = zone.querySelector('.drop-zone-preview');
const isStegoZone = zone.id === 'stegoDropZone';
['dragenter', 'dragover'].forEach(evt => { ['dragenter', 'dragover'].forEach(evt => {
zone.addEventListener(evt, e => { zone.addEventListener(evt, e => {
@@ -482,29 +414,12 @@ document.querySelectorAll('.drop-zone').forEach(zone => {
input.files = e.dataTransfer.files; input.files = e.dataTransfer.files;
const file = e.dataTransfer.files[0]; const file = e.dataTransfer.files[0];
showPreview(file); showPreview(file);
// FIXED: Extract both day name AND date string
if (isStegoZone) {
const detected = detectDayFromFilename(file.name);
if (detected) {
updateDayLabel(detected.dayName, detected.dateStr);
}
}
} }
}); });
input.addEventListener('change', function() { input.addEventListener('change', function() {
if (this.files && this.files[0]) { if (this.files && this.files[0]) {
const file = this.files[0]; showPreview(this.files[0]);
showPreview(file);
// FIXED: Extract both day name AND date string
if (isStegoZone) {
const detected = detectDayFromFilename(file.name);
if (detected) {
updateDayLabel(detected.dayName, detected.dateStr);
}
}
} }
}); });

2
pyproject.toml
View File

@@ -4,7 +4,7 @@ build-backend = "hatchling.build"
[project] [project]
name = "stegasoo" name = "stegasoo"
version = "3.0.2" version = "3.2.0"
description = "Secure steganography with hybrid photo + passphrase + PIN authentication" description = "Secure steganography with hybrid photo + passphrase + PIN authentication"
readme = "README.md" readme = "README.md"
license = "MIT" license = "MIT"