admin/changemaker.lite
1
0
Fork 0
Code Issues Packages Projects Releases 35 Wiki Activity

new system for address confrimation

Browse Source
This commit is contained in:
admin
2025-07-16 18:25:50 -06:00
parent 34f71c05c2
commit 330101418c
5 changed files with 166 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
map/app/public/css/style.css
View File

@@ -177,6 +177,28 @@ body {
background-color: #c0392b;
}
/* Disabled button styles */
.btn:disabled {
opacity: 0.6;
cursor: not-allowed;
background-color: #6c757d;
}
.btn:disabled:hover {
background-color: #6c757d;
transform: none;
}
.btn-primary:disabled {
background-color: #6c757d;
border-color: #6c757d;
}
.btn-primary:disabled:hover {
background-color: #6c757d;
border-color: #6c757d;
}
/* Crosshair for location selection */
.crosshair {
position: absolute;

10
map/app/public/index.html
View File

@@ -171,8 +171,8 @@
<label for="edit-location-address">Address</label>
<div style="display: flex; gap: 10px;">
<input type="text" id="edit-location-address" name="Address" style="flex: 1;">
<button type="button" class="btn btn-secondary btn-sm" id="lookup-address-edit-btn">
📍 Lookup Address
<button type="button" class="btn btn-secondary btn-sm" id="confirm-address-edit-btn">
📍 Confirm Address
</button>
</div>
</div>
@@ -282,8 +282,8 @@
<div style="display: flex; gap: 10px;">
<input type="text" id="location-address" name="Address"
placeholder="Enter address" style="flex: 1;">
<button type="button" class="btn btn-secondary btn-sm" id="lookup-address-add-btn">
📍 Lookup Address
<button type="button" class="btn btn-secondary btn-sm" id="confirm-address-add-btn">
📍 Confirm Address
</button>
</div>
</div>
@@ -336,7 +336,7 @@
<button type="button" class="btn btn-secondary" id="cancel-modal-btn">
Cancel
</button>
<button type="submit" class="btn btn-primary">
<button type="submit" class="btn btn-primary" id="save-location-btn" disabled>
Save Location
</button>
</div>

23
map/app/public/js/location-manager.js
View File

@@ -2,6 +2,7 @@
import { map } from './map-manager.js';
import { showStatus, updateLocationCount, escapeHtml } from './utils.js';
import { currentUser } from './auth.js';
import { resetAddressConfirmation } from './ui-controls.js';
export let markers = [];
export let currentEditingLocation = null;
@@ -144,6 +145,14 @@ function createPopupContent(location) {
export async function handleAddLocation(e) {
e.preventDefault();
// Check if address is confirmed
const { getAddressConfirmationState } = await import('./ui-controls.js');
const { isAddressConfirmed } = getAddressConfirmationState();
if (!isAddressConfirmed) {
showStatus('Please confirm the address before saving the location', 'warning');
return;
}
const formData = new FormData(e.target);
const data = {};
@@ -202,6 +211,9 @@ export function openEditForm(location) {
return;
}
// Reset address confirmation state
resetAddressConfirmation('edit');
// Store the ID in a data attribute for later use
document.getElementById('edit-location-id').value = locationId;
document.getElementById('edit-location-id').setAttribute('data-location-id', locationId);
@@ -235,6 +247,14 @@ export async function handleEditLocation(e) {
if (!currentEditingLocation) return;
// Check if address is confirmed
const { getAddressConfirmationState } = await import('./ui-controls.js');
const { isEditAddressConfirmed } = getAddressConfirmationState();
if (!isEditAddressConfirmed) {
showStatus('Please confirm the address before saving changes', 'warning');
return;
}
// Get the stored location ID
const locationIdElement = document.getElementById('edit-location-id');
const locationId = locationIdElement.getAttribute('data-location-id') || locationIdElement.value;
@@ -345,6 +365,9 @@ export function openAddModal(lat, lng) {
const lngInput = document.getElementById('location-lng');
const geoInput = document.getElementById('geo-location');
// Reset address confirmation state
resetAddressConfirmation('add');
// Set coordinates
latInput.value = lat.toFixed(8);
lngInput.value = lng.toFixed(8);

128
map/app/public/js/ui-controls.js
View File

@@ -5,6 +5,16 @@ import { loadLocations, handleAddLocation, handleEditLocation, handleDeleteLocat
export let userLocationMarker = null;
export let isAddingLocation = false;
export let isAddressConfirmed = false;
export let isEditAddressConfirmed = false;
// Export function to get current confirmation states
export function getAddressConfirmationState() {
return {
isAddressConfirmed,
isEditAddressConfirmed
};
}
// Add logout function
async function logout() {
@@ -192,19 +202,21 @@ export function toggleFullscreen() {
}
}
export async function lookupAddress(mode) {
let latInput, lngInput, addressInput;
export async function confirmAddress(mode) {
let latInput, lngInput, addressInput, saveButton;
if (mode === 'add') {
latInput = document.getElementById('location-lat');
lngInput = document.getElementById('location-lng');
addressInput = document.getElementById('location-address');
saveButton = document.getElementById('save-location-btn');
} else if (mode === 'edit') {
latInput = document.getElementById('edit-location-lat');
lngInput = document.getElementById('edit-location-lng');
addressInput = document.getElementById('edit-location-address');
saveButton = document.getElementById('save-edit-location-btn'); // We'll need to add this ID to edit form
} else {
console.error('Invalid lookup mode:', mode);
console.error('Invalid confirm mode:', mode);
return;
}
@@ -221,12 +233,37 @@ export async function lookupAddress(mode) {
return;
}
// Show loading state
// Get the confirm button
const button = mode === 'add' ?
document.getElementById('lookup-address-add-btn') :
document.getElementById('lookup-address-edit-btn');
document.getElementById('confirm-address-add-btn') :
document.getElementById('confirm-address-edit-btn');
const originalText = button ? button.textContent : '';
// Check if already confirmed
const currentlyConfirmed = mode === 'add' ? isAddressConfirmed : isEditAddressConfirmed;
// If already confirmed, just enable save
if (currentlyConfirmed) {
if (mode === 'add') {
isAddressConfirmed = false;
} else {
isEditAddressConfirmed = false;
}
// Reset button and disable save
if (button) {
button.textContent = '📍 Confirm Address';
button.classList.remove('btn-success');
button.classList.add('btn-secondary');
}
if (saveButton) {
saveButton.disabled = true;
}
showStatus('Please confirm address again to enable saving', 'info');
return;
}
if (button) {
button.disabled = true;
button.textContent = 'Looking up...';
@@ -248,7 +285,27 @@ export async function lookupAddress(mode) {
const address = data.data.formattedAddress || data.data.fullAddress;
if (address) {
addressInput.value = address;
showStatus('Address found!', 'success');
// Mark as confirmed
if (mode === 'add') {
isAddressConfirmed = true;
} else {
isEditAddressConfirmed = true;
}
// Update button to show confirmed state
if (button) {
button.textContent = '✅ Address Confirmed';
button.classList.remove('btn-secondary');
button.classList.add('btn-success');
}
// Enable save button
if (saveButton) {
saveButton.disabled = false;
}
showStatus('Address confirmed! You can now save the location.', 'success');
} else {
showStatus('No address found for these coordinates', 'warning');
}
@@ -260,14 +317,47 @@ export async function lookupAddress(mode) {
console.error('Address lookup error:', error);
showStatus(`Address lookup failed: ${error.message}`, 'error');
} finally {
// Restore button state
if (button) {
// Restore button state if not confirmed
const finallyConfirmed = mode === 'add' ? isAddressConfirmed : isEditAddressConfirmed;
if (button && !finallyConfirmed) {
button.disabled = false;
button.textContent = originalText;
}
}
}
export function resetAddressConfirmation(mode) {
if (mode === 'add') {
isAddressConfirmed = false;
const button = document.getElementById('confirm-address-add-btn');
const saveButton = document.getElementById('save-location-btn');
if (button) {
button.textContent = '📍 Confirm Address';
button.classList.remove('btn-success');
button.classList.add('btn-secondary');
button.disabled = false;
}
if (saveButton) {
saveButton.disabled = true;
}
} else if (mode === 'edit') {
isEditAddressConfirmed = false;
const button = document.getElementById('confirm-address-edit-btn');
const saveButton = document.getElementById('save-edit-location-btn');
if (button) {
button.textContent = '📍 Confirm Address';
button.classList.remove('btn-success');
button.classList.add('btn-secondary');
button.disabled = false;
}
if (saveButton) {
saveButton.disabled = true;
}
}
}
export function setupGeoLocationSync() {
// For add form
const addLatInput = document.getElementById('location-lat');
@@ -282,6 +372,8 @@ export function setupGeoLocationSync() {
if (lat && lng) {
addGeoInput.value = `${lat};${lng}`;
}
// Reset address confirmation when coordinates change
resetAddressConfirmation('add');
});
});
@@ -291,6 +383,8 @@ export function setupGeoLocationSync() {
addLatInput.value = coords.lat;
addLngInput.value = coords.lng;
}
// Reset address confirmation when geo-location changes
resetAddressConfirmation('add');
});
}
@@ -307,6 +401,8 @@ export function setupGeoLocationSync() {
if (lat && lng) {
editGeoInput.value = `${lat};${lng}`;
}
// Reset address confirmation when coordinates change
resetAddressConfirmation('edit');
});
});
@@ -316,6 +412,8 @@ export function setupGeoLocationSync() {
editLatInput.value = coords.lat;
editLngInput.value = coords.lng;
}
// Reset address confirmation when geo-location changes
resetAddressConfirmation('edit');
});
}
}
@@ -376,13 +474,13 @@ export function setupEventListeners() {
// Delete button
document.getElementById('delete-location-btn')?.addEventListener('click', handleDeleteLocation);
// Address lookup buttons
document.getElementById('lookup-address-add-btn')?.addEventListener('click', () => {
lookupAddress('add');
// Address confirm buttons
document.getElementById('confirm-address-add-btn')?.addEventListener('click', () => {
confirmAddress('add');
});
document.getElementById('lookup-address-edit-btn')?.addEventListener('click', () => {
lookupAddress('edit');
document.getElementById('confirm-address-edit-btn')?.addEventListener('click', () => {
confirmAddress('edit');
});
// Auto address lookup event listener
@@ -391,7 +489,7 @@ export function setupEventListeners() {
if (mode === 'add') {
// Add a small delay to ensure the form is fully rendered
setTimeout(() => {
lookupAddress('add');
confirmAddress('add');
}, 200);
}
});