Minor touches.
This commit is contained in:
@@ -14,11 +14,19 @@
|
||||
<div class="alert alert-success">
|
||||
<h6><i class="bi bi-check-circle me-2"></i>Message Decrypted Successfully!</h6>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
|
||||
<label class="form-label text-muted">Decoded Message:</label>
|
||||
<div class="position-relative">
|
||||
<div class="alert-message p-3 rounded bg-dark border border-secondary" id="decodedContent" style="white-space: pre-wrap;">{{ decoded_message }}</div>
|
||||
<button class="btn btn-sm btn-outline-light position-absolute top-0 end-0 m-2" onclick="navigator.clipboard.writeText(document.getElementById('decodedContent').innerText).then(() => this.innerHTML = '<i class=\'bi bi-check\'></i>').catch(() => alert('Failed to copy'))">
|
||||
<i class="bi bi-clipboard"></i> Copy
|
||||
</button>
|
||||
</div>
|
||||
|
||||
i<!--then<div class="mb-4">
|
||||
<label class="form-label text-muted">Decoded Message:</label>
|
||||
<div class="alert-message">{{ decoded_message }}</div>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
<a href="/decode" class="btn btn-outline-light w-100">
|
||||
<i class="bi bi-arrow-repeat me-2"></i>Decode Another Message
|
||||
@@ -83,14 +91,18 @@
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label class="form-label">
|
||||
<i class="bi bi-123 me-1"></i> PIN
|
||||
</label>
|
||||
<input type="password" name="pin" class="form-control" id="pinInput"
|
||||
placeholder="6-9 digits" maxlength="9">
|
||||
|
||||
<label class="form-label"><i class="bi bi-123 me-1"></i> PIN</label>
|
||||
<div class="input-group">
|
||||
<input type="password" name="pin" class="form-control" id="pinInput" placeholder="6-9 digits" maxlength="9">
|
||||
<button class="btn btn-outline-secondary" type="button" id="togglePin">
|
||||
<i class="bi bi-eye"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="form-text">
|
||||
If PIN was used during encoding
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
@@ -197,6 +209,45 @@ function updateDayLabel(dayName) {
|
||||
}
|
||||
}
|
||||
|
||||
// 1. PIN Toggle
|
||||
document.getElementById('togglePin')?.addEventListener('click', function() {
|
||||
const input = document.getElementById('pinInput');
|
||||
const icon = this.querySelector('i');
|
||||
if (input.type === 'password') {
|
||||
input.type = 'text';
|
||||
icon.classList.replace('bi-eye', 'bi-eye-slash');
|
||||
} else {
|
||||
input.type = 'password';
|
||||
icon.classList.replace('bi-eye-slash', 'bi-eye');
|
||||
}
|
||||
});
|
||||
|
||||
// 2. Paste from Clipboard
|
||||
document.addEventListener('paste', function(e) {
|
||||
// Only run if the form exists (we are not on the success page)
|
||||
if (!document.getElementById('decodeForm')) return;
|
||||
|
||||
const items = e.clipboardData.items;
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
if (items[i].type.indexOf("image") !== -1) {
|
||||
const blob = items[i].getAsFile();
|
||||
|
||||
// Priority for Decode: Fill Stego Image first (most common), then Reference
|
||||
const stegoInput = document.querySelector('input[name="stego_image"]');
|
||||
const refInput = document.querySelector('input[name="reference_photo"]');
|
||||
|
||||
const targetInput = (!stegoInput.files.length) ? stegoInput : refInput;
|
||||
|
||||
const container = new DataTransfer();
|
||||
container.items.add(blob);
|
||||
targetInput.files = container.files;
|
||||
|
||||
targetInput.dispatchEvent(new Event('change'));
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Drag & drop with preview
|
||||
document.querySelectorAll('.drop-zone').forEach(zone => {
|
||||
const input = zone.querySelector('input[type="file"]');
|
||||
|
||||
Reference in New Issue
Block a user